feat: add random message selection and theme toggle

script.js picks a random entry from MESSAGES on load and on each "Check
again" click, and persists the chosen colour scheme in localStorage.
messages.js holds the MESSAGES array as a placeholder template to be
filled in with content.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Emma Thorpe
2026-06-11 15:59:39 +01:00
parent 59b8d969df
commit 3b5c304002
2 changed files with 77 additions and 0 deletions
+59
View File
@@ -0,0 +1,59 @@
/* Why is the DLR shut today?
* Picks a random message on load and on demand, and handles the
* colour-scheme toggle. Messages live in messages.js (MESSAGES). */
(function () {
"use strict";
const FALLBACK = "Add some reasons in messages.js";
const messageEl = document.getElementById("message");
const refreshButton = document.getElementById("refresh");
const themeButtons = document.querySelectorAll("[data-set-theme]");
const THEME_KEY = "dlr-theme";
function pickMessage() {
if (!Array.isArray(MESSAGES) || MESSAGES.length === 0) {
return FALLBACK;
}
const index = Math.floor(Math.random() * MESSAGES.length);
return MESSAGES[index];
}
function showMessage() {
messageEl.textContent = pickMessage();
}
function applyTheme(theme) {
document.body.setAttribute("data-theme", theme);
themeButtons.forEach(function (button) {
const isActive = button.dataset.setTheme === theme;
button.setAttribute("aria-pressed", String(isActive));
});
try {
localStorage.setItem(THEME_KEY, theme);
} catch (err) {
/* localStorage unavailable; theme simply won't persist. */
}
}
function initTheme() {
let saved = null;
try {
saved = localStorage.getItem(THEME_KEY);
} catch (err) {
/* ignore */
}
applyTheme(saved === "original" ? "original" : "modern");
}
themeButtons.forEach(function (button) {
button.addEventListener("click", function () {
applyTheme(button.dataset.setTheme);
});
});
refreshButton.addEventListener("click", showMessage);
initTheme();
showMessage();
})();