Feat/why is the dlr shut #1
+18
@@ -0,0 +1,18 @@
|
||||
/* Messages for "Why is the DLR shut today?"
|
||||
*
|
||||
* Fill this array with your own reasons. One string per entry.
|
||||
* On every page load (and every "Check again" click) one entry is
|
||||
* picked at random and shown in the centre of the screen.
|
||||
*
|
||||
* Keep them short — roughly a sentence — so they fit the large display
|
||||
* text. HTML is NOT rendered; entries are inserted as plain text.
|
||||
*
|
||||
* Replace the placeholders below with your own content.
|
||||
*/
|
||||
|
||||
const MESSAGES = [
|
||||
"PLACEHOLDER: write your first reason here",
|
||||
"PLACEHOLDER: write another reason here",
|
||||
// Add as many entries as you like, one per line:
|
||||
// "Your reason here",
|
||||
];
|
||||
@@ -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();
|
||||
})();
|
||||
Reference in New Issue
Block a user