Modal markup must come before script tag — fix silent click handler
This commit is contained in:
parent
be6012c1ea
commit
093605be2e
2 changed files with 18 additions and 13 deletions
|
|
@ -250,15 +250,20 @@ form.addEventListener("submit", (e) => { e.preventDefault(); recalc(); });
|
||||||
|
|
||||||
|
|
||||||
// ─── Battery timeline modal ────────────────────────────────────────────
|
// ─── Battery timeline modal ────────────────────────────────────────────
|
||||||
const modal = document.getElementById("timeline-modal");
|
function mustFind(id) {
|
||||||
const tlTitle = document.getElementById("tl-title");
|
const el = document.getElementById(id);
|
||||||
const tlDate = document.getElementById("tl-date");
|
if (!el) console.error(`[pluginbattery] missing element #${id} — modal will not work`);
|
||||||
const tlDays = document.getElementById("tl-days");
|
return el;
|
||||||
const tlOnBox = document.getElementById("tl-battery-on");
|
}
|
||||||
const tlPrev = document.getElementById("tl-prev");
|
const modal = mustFind("timeline-modal");
|
||||||
const tlNext = document.getElementById("tl-next");
|
const tlTitle = mustFind("tl-title");
|
||||||
const tlStatus = document.getElementById("tl-status");
|
const tlDate = mustFind("tl-date");
|
||||||
const tlSummary = document.getElementById("tl-summary");
|
const tlDays = mustFind("tl-days");
|
||||||
|
const tlOnBox = mustFind("tl-battery-on");
|
||||||
|
const tlPrev = mustFind("tl-prev");
|
||||||
|
const tlNext = mustFind("tl-next");
|
||||||
|
const tlStatus = mustFind("tl-status");
|
||||||
|
const tlSummary = mustFind("tl-summary");
|
||||||
|
|
||||||
let activeBattery = null; // the row clicked
|
let activeBattery = null; // the row clicked
|
||||||
let tlData = null; // last fetched timeline payload
|
let tlData = null; // last fetched timeline payload
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>Honest battery payback — vs thuisbatterijgids.nl</title>
|
<title>Honest battery payback — vs thuisbatterijgids.nl</title>
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uplot@1.6.31/dist/uPlot.min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uplot@1.6.31/dist/uPlot.min.css">
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}?v=17">
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}?v=18">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
@ -156,9 +156,6 @@
|
||||||
</p>
|
</p>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/uplot@1.6.31/dist/uPlot.iife.min.js"></script>
|
|
||||||
<script src="{{ url_for('static', filename='app.js') }}?v=17"></script>
|
|
||||||
|
|
||||||
<div id="timeline-modal" class="modal" hidden>
|
<div id="timeline-modal" class="modal" hidden>
|
||||||
<div class="modal-backdrop" data-close="modal"></div>
|
<div class="modal-backdrop" data-close="modal"></div>
|
||||||
<div class="modal-card">
|
<div class="modal-card">
|
||||||
|
|
@ -195,5 +192,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/uplot@1.6.31/dist/uPlot.iife.min.js"></script>
|
||||||
|
<script src="{{ url_for('static', filename='app.js') }}?v=18"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue