Add a Changelog button at the bottom of the page

Opens a dialog listing the loaded build's full changelog, grouped by
date. Fetched cache-first through the service worker, so the list always
matches the running version; the update banner still covers what a
waiting build adds.
This commit is contained in:
Alexander Heldt
2026-07-12 17:36:44 +00:00
parent c8dceb14d4
commit 68964b55e4
4 changed files with 95 additions and 0 deletions
+45
View File
@@ -1916,6 +1916,51 @@
settingsDialog.close();
});
// ---------- changelog dialog ----------
// Shows the *loaded* build's full changelog: the plain URL is served
// cache-first by the controlling service worker, so the list always matches
// the version actually running (the update banner handles what's newer).
const changelogDialog = document.getElementById("changelog-dialog");
const changelogList = document.getElementById("changelog-list");
const changelogEmpty = document.getElementById("changelog-empty");
function formatChangelogDate(iso) {
const [y, m, d] = (iso || "").split("-").map(Number);
if (!y || !m || !d) return iso || "";
return new Date(y, m - 1, d).toLocaleDateString(undefined, {
year: "numeric", month: "short", day: "numeric",
});
}
document.getElementById("changelog-btn").addEventListener("click", async () => {
let entries = [];
try {
const res = await fetch("changelog.json");
if (res.ok) {
const body = await res.json();
if (Array.isArray(body)) entries = body.filter(e => e && e.text);
}
} catch { /* fall through to empty state */ }
changelogList.innerHTML = "";
changelogEmpty.hidden = entries.length > 0;
let lastDate = null;
for (const e of entries) {
if (e.date !== lastDate) {
lastDate = e.date;
const dt = document.createElement("li");
dt.className = "changelog-date";
dt.textContent = formatChangelogDate(e.date);
changelogList.appendChild(dt);
}
const li = document.createElement("li");
li.className = "changelog-entry";
li.textContent = e.text;
changelogList.appendChild(li);
}
changelogDialog.showModal();
});
// ---------- exercise dialog (add / edit a training exercise) ----------
const exerciseDialog = document.getElementById("exercise-dialog");
const exerciseForm = document.getElementById("exercise-form");