From 720d752748b793a2f5cf3cc14cb75ad86e8919c0 Mon Sep 17 00:00:00 2001 From: sillylaird Date: Tue, 3 Feb 2026 21:27:57 -0500 Subject: First commit --- assets/js/includes.js | 32 +++ assets/js/pages/404.js | 5 + assets/js/pages/50x.js | 5 + assets/js/pages/guestbook_jp.js | 91 ++++++++ assets/js/pages/guestbook_zh.js | 91 ++++++++ assets/js/pages/hitcounter.js | 16 ++ assets/js/pages/hitcounter_jp.js | 16 ++ assets/js/pages/hitcounter_zh.js | 16 ++ assets/js/pages/mstartpage-index.js | 118 ++++++++++ assets/js/pages/test.js | 10 + assets/js/pages/test_jp.js | 10 + assets/js/pages/test_zh.js | 10 + assets/js/site.js | 415 ++++++++++++++++++++++++++++++++++++ 13 files changed, 835 insertions(+) create mode 100644 assets/js/includes.js create mode 100644 assets/js/pages/404.js create mode 100644 assets/js/pages/50x.js create mode 100644 assets/js/pages/guestbook_jp.js create mode 100644 assets/js/pages/guestbook_zh.js create mode 100644 assets/js/pages/hitcounter.js create mode 100644 assets/js/pages/hitcounter_jp.js create mode 100644 assets/js/pages/hitcounter_zh.js create mode 100644 assets/js/pages/mstartpage-index.js create mode 100644 assets/js/pages/test.js create mode 100644 assets/js/pages/test_jp.js create mode 100644 assets/js/pages/test_zh.js create mode 100644 assets/js/site.js (limited to 'assets/js') diff --git a/assets/js/includes.js b/assets/js/includes.js new file mode 100644 index 0000000..4af99f4 --- /dev/null +++ b/assets/js/includes.js @@ -0,0 +1,32 @@ +(async function () { + async function loadInto(selector, url) { + const mount = document.querySelector(selector); + if (!mount) return; + + try { + const res = await fetch(url); + if (!res.ok) throw new Error("HTTP " + res.status); + const html = await res.text(); + mount.innerHTML = html; + } catch (e) { + // Fail open: if includes fail, keep page usable. + // Intentionally no console noise. + } + } + + // Pages opt-in by including:
+ // and/or
+ await Promise.all([ + loadInto('[data-include="header"]', "/partials/header.html"), + loadInto('[data-include="footer"]', "/partials/footer.html"), + ]); + + // If a page uses includes, it likely removed the built-in header/footer. + // Re-run site.js behaviors after injection. + if (document.querySelector('[data-include="header"], [data-include="footer"]')) { + const s = document.createElement("script"); + s.src = "/assets/js/site.js"; + s.defer = true; + document.head.appendChild(s); + } +})(); diff --git a/assets/js/pages/404.js b/assets/js/pages/404.js new file mode 100644 index 0000000..a97a5b1 --- /dev/null +++ b/assets/js/pages/404.js @@ -0,0 +1,5 @@ +(function(){ + var el = document.getElementById('y'); + if (!el) return; + el.textContent = String(new Date().getFullYear()); + })(); diff --git a/assets/js/pages/50x.js b/assets/js/pages/50x.js new file mode 100644 index 0000000..a97a5b1 --- /dev/null +++ b/assets/js/pages/50x.js @@ -0,0 +1,5 @@ +(function(){ + var el = document.getElementById('y'); + if (!el) return; + el.textContent = String(new Date().getFullYear()); + })(); diff --git a/assets/js/pages/guestbook_jp.js b/assets/js/pages/guestbook_jp.js new file mode 100644 index 0000000..5f3a055 --- /dev/null +++ b/assets/js/pages/guestbook_jp.js @@ -0,0 +1,91 @@ +document.addEventListener("DOMContentLoaded", function () { + const form = document.getElementById("guestbook-form"); + const entriesContainer = document.getElementById("guestbook-entries"); + const captchaCanvas = document.getElementById("captcha-canvas"); + const refreshCaptchaButton = document.getElementById("refresh-captcha"); + const captchaInput = document.getElementById("captcha-input"); + const GUESTBOOK_KEY = "guestbookEntries"; + + let currentCaptcha = ""; + + function generateCaptcha() { + const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; + let captcha = ""; + for (let i = 0; i < 6; i++) captcha += chars.charAt(Math.floor(Math.random() * chars.length)); + return captcha; + } + + function drawCaptcha(captcha) { + const ctx = captchaCanvas.getContext("2d"); + ctx.clearRect(0, 0, captchaCanvas.width, captchaCanvas.height); + ctx.font = "22px Arial"; + ctx.fillStyle = "#000"; + ctx.fillText(captcha, 10, 32); + } + + function refreshCaptcha() { + currentCaptcha = generateCaptcha(); + drawCaptcha(currentCaptcha); + } + + function formatMessage(message) { + return message + .split("\n") + .map((line) => { + if (line.startsWith(">")) return `${line}`; + return line; + }) + .join("
"); + } + + function loadEntries() { + const entries = JSON.parse(localStorage.getItem(GUESTBOOK_KEY)) || []; + entriesContainer.innerHTML = ""; + + entries + .slice() + .reverse() + .forEach((entry) => { + const entryElement = document.createElement("div"); + entryElement.className = "entry"; + + const nameElement = document.createElement("h4"); + if (entry.name === "Anonymous") nameElement.className = "anonymous"; + nameElement.textContent = entry.name; + entryElement.appendChild(nameElement); + + const messageElement = document.createElement("p"); + messageElement.innerHTML = formatMessage(entry.message); + entryElement.appendChild(messageElement); + + entriesContainer.appendChild(entryElement); + }); + } + + form.addEventListener("submit", function (event) { + event.preventDefault(); + + let name = document.getElementById("name").value.trim(); + if (!name) name = "Anonymous"; + + const message = document.getElementById("message").value.trim(); + const captchaValue = captchaInput.value.trim(); + + if (name && message && captchaValue === currentCaptcha) { + const entries = JSON.parse(localStorage.getItem(GUESTBOOK_KEY)) || []; + entries.push({ name, message }); + localStorage.setItem(GUESTBOOK_KEY, JSON.stringify(entries)); + + form.reset(); + document.getElementById("name").value = "Anonymous"; + loadEntries(); + refreshCaptcha(); + } else { + alert("CAPTCHA is incorrect. Please try again."); + } + }); + + refreshCaptcha(); + refreshCaptchaButton.addEventListener("click", refreshCaptcha); + loadEntries(); + }); diff --git a/assets/js/pages/guestbook_zh.js b/assets/js/pages/guestbook_zh.js new file mode 100644 index 0000000..5f3a055 --- /dev/null +++ b/assets/js/pages/guestbook_zh.js @@ -0,0 +1,91 @@ +document.addEventListener("DOMContentLoaded", function () { + const form = document.getElementById("guestbook-form"); + const entriesContainer = document.getElementById("guestbook-entries"); + const captchaCanvas = document.getElementById("captcha-canvas"); + const refreshCaptchaButton = document.getElementById("refresh-captcha"); + const captchaInput = document.getElementById("captcha-input"); + const GUESTBOOK_KEY = "guestbookEntries"; + + let currentCaptcha = ""; + + function generateCaptcha() { + const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; + let captcha = ""; + for (let i = 0; i < 6; i++) captcha += chars.charAt(Math.floor(Math.random() * chars.length)); + return captcha; + } + + function drawCaptcha(captcha) { + const ctx = captchaCanvas.getContext("2d"); + ctx.clearRect(0, 0, captchaCanvas.width, captchaCanvas.height); + ctx.font = "22px Arial"; + ctx.fillStyle = "#000"; + ctx.fillText(captcha, 10, 32); + } + + function refreshCaptcha() { + currentCaptcha = generateCaptcha(); + drawCaptcha(currentCaptcha); + } + + function formatMessage(message) { + return message + .split("\n") + .map((line) => { + if (line.startsWith(">")) return `${line}`; + return line; + }) + .join("
"); + } + + function loadEntries() { + const entries = JSON.parse(localStorage.getItem(GUESTBOOK_KEY)) || []; + entriesContainer.innerHTML = ""; + + entries + .slice() + .reverse() + .forEach((entry) => { + const entryElement = document.createElement("div"); + entryElement.className = "entry"; + + const nameElement = document.createElement("h4"); + if (entry.name === "Anonymous") nameElement.className = "anonymous"; + nameElement.textContent = entry.name; + entryElement.appendChild(nameElement); + + const messageElement = document.createElement("p"); + messageElement.innerHTML = formatMessage(entry.message); + entryElement.appendChild(messageElement); + + entriesContainer.appendChild(entryElement); + }); + } + + form.addEventListener("submit", function (event) { + event.preventDefault(); + + let name = document.getElementById("name").value.trim(); + if (!name) name = "Anonymous"; + + const message = document.getElementById("message").value.trim(); + const captchaValue = captchaInput.value.trim(); + + if (name && message && captchaValue === currentCaptcha) { + const entries = JSON.parse(localStorage.getItem(GUESTBOOK_KEY)) || []; + entries.push({ name, message }); + localStorage.setItem(GUESTBOOK_KEY, JSON.stringify(entries)); + + form.reset(); + document.getElementById("name").value = "Anonymous"; + loadEntries(); + refreshCaptcha(); + } else { + alert("CAPTCHA is incorrect. Please try again."); + } + }); + + refreshCaptcha(); + refreshCaptchaButton.addEventListener("click", refreshCaptcha); + loadEntries(); + }); diff --git a/assets/js/pages/hitcounter.js b/assets/js/pages/hitcounter.js new file mode 100644 index 0000000..9c3f888 --- /dev/null +++ b/assets/js/pages/hitcounter.js @@ -0,0 +1,16 @@ +function countUniqueVisitors() { + const VISITOR_KEY = "uniqueVisitorCount"; + let visitorCount = localStorage.getItem(VISITOR_KEY); + if (!visitorCount) visitorCount = 0; + + const hasVisited = sessionStorage.getItem("hasVisited"); + if (!hasVisited) { + visitorCount++; + localStorage.setItem(VISITOR_KEY, visitorCount); + sessionStorage.setItem("hasVisited", "true"); + } + + document.getElementById("visitor-counter").innerText = visitorCount; + } + + countUniqueVisitors(); diff --git a/assets/js/pages/hitcounter_jp.js b/assets/js/pages/hitcounter_jp.js new file mode 100644 index 0000000..9c3f888 --- /dev/null +++ b/assets/js/pages/hitcounter_jp.js @@ -0,0 +1,16 @@ +function countUniqueVisitors() { + const VISITOR_KEY = "uniqueVisitorCount"; + let visitorCount = localStorage.getItem(VISITOR_KEY); + if (!visitorCount) visitorCount = 0; + + const hasVisited = sessionStorage.getItem("hasVisited"); + if (!hasVisited) { + visitorCount++; + localStorage.setItem(VISITOR_KEY, visitorCount); + sessionStorage.setItem("hasVisited", "true"); + } + + document.getElementById("visitor-counter").innerText = visitorCount; + } + + countUniqueVisitors(); diff --git a/assets/js/pages/hitcounter_zh.js b/assets/js/pages/hitcounter_zh.js new file mode 100644 index 0000000..9c3f888 --- /dev/null +++ b/assets/js/pages/hitcounter_zh.js @@ -0,0 +1,16 @@ +function countUniqueVisitors() { + const VISITOR_KEY = "uniqueVisitorCount"; + let visitorCount = localStorage.getItem(VISITOR_KEY); + if (!visitorCount) visitorCount = 0; + + const hasVisited = sessionStorage.getItem("hasVisited"); + if (!hasVisited) { + visitorCount++; + localStorage.setItem(VISITOR_KEY, visitorCount); + sessionStorage.setItem("hasVisited", "true"); + } + + document.getElementById("visitor-counter").innerText = visitorCount; + } + + countUniqueVisitors(); diff --git a/assets/js/pages/mstartpage-index.js b/assets/js/pages/mstartpage-index.js new file mode 100644 index 0000000..db518ab --- /dev/null +++ b/assets/js/pages/mstartpage-index.js @@ -0,0 +1,118 @@ +// Date and time functionality + function updateDateRealtime() { + const dateElement = document.getElementById("realtime-date"); + const clockElement = document.getElementById("realtime-clock"); + + const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; + const months = ["January", "February", "March", "April", "May", "June", + "July", "August", "September", "October", "November", "December"]; + + const now = new Date(); + + // Date parts + const dayName = days[now.getDay()]; + const month = months[now.getMonth()]; + const dayNumber = now.getDate(); + const year = now.getFullYear(); + + const ordinal = (dayNumber > 3 && dayNumber < 21) ? 'th' : + (dayNumber % 10 === 1) ? 'st' : + (dayNumber % 10 === 2) ? 'nd' : + (dayNumber % 10 === 3) ? 'rd' : 'th'; + + dateElement.textContent = `${dayName}, ${month} ${dayNumber}${ordinal}, ${year}.`; + + // Clock parts (12-hour format) + let hours = now.getHours(); + const minutes = now.getMinutes(); + const seconds = now.getSeconds(); + + const period = hours >= 12 ? 'PM' : 'AM'; + hours = hours % 12 || 12; + + const formattedHours = hours.toString().padStart(2, "0"); + const formattedMinutes = minutes.toString().padStart(2, "0"); + const formattedSeconds = seconds.toString().padStart(2, "0"); + + clockElement.textContent = `${formattedHours}:${formattedMinutes}:${formattedSeconds} ${period}`; + } + + updateDateRealtime(); + setInterval(updateDateRealtime, 1000); + + // Menu toggle functionality + document.getElementById('menu-toggle').addEventListener('click', function() { + const menu = document.getElementById('main-menu'); + menu.classList.toggle('show'); + }); + + // Collapsible sections + const collapsibles = document.getElementsByClassName("collapsible"); + + for (let i = 0; i < collapsibles.length; i++) { + collapsibles[i].addEventListener("click", function() { + this.classList.toggle("active"); + const content = this.nextElementSibling; + if (content.style.display === "block") { + content.style.display = "none"; + } else { + content.style.display = "block"; + } + }); + } + + // XXX Verification functionality + const xxxToggle = document.getElementById('xxx-toggle'); + const xxxModal = document.getElementById('xxx-modal'); + const xxxConfirm = document.getElementById('xxx-confirm'); + const xxxDeny = document.getElementById('xxx-deny'); + const xxxList = document.getElementById('xxx-list'); + + // Check if already verified + let isVerified = localStorage.getItem('xxx-verified') === 'true'; + let isContentVisible = localStorage.getItem('xxx-visible') === 'true'; + + // Initialize based on stored state + if (isVerified && isContentVisible) { + xxxToggle.textContent = 'Hide XXX Content'; + xxxList.style.display = 'block'; + } else if (isVerified && !isContentVisible) { + xxxToggle.textContent = 'Show XXX Content'; + xxxList.style.display = 'none'; + } + + xxxToggle.addEventListener('click', function() { + if (isVerified) { + // Toggle visibility if already verified + if (xxxList.style.display === 'block') { + // Hide the content + xxxList.style.display = 'none'; + xxxToggle.textContent = 'Show XXX Content'; + localStorage.setItem('xxx-visible', 'false'); + } else { + // Show the content + xxxList.style.display = 'block'; + xxxToggle.textContent = 'Hide XXX Content'; + localStorage.setItem('xxx-visible', 'true'); + } + } else { + // Show verification modal if not verified + xxxModal.style.display = 'flex'; + } + }); + + xxxConfirm.addEventListener('click', function() { + // Set verification status + isVerified = true; + localStorage.setItem('xxx-verified', 'true'); + localStorage.setItem('xxx-visible', 'true'); + + // Hide modal and show content + xxxModal.style.display = 'none'; + xxxList.style.display = 'block'; + xxxToggle.textContent = 'Hide XXX Content'; + }); + + xxxDeny.addEventListener('click', function() { + xxxModal.style.display = 'none'; + }); diff --git a/assets/js/pages/test.js b/assets/js/pages/test.js new file mode 100644 index 0000000..ee1c831 --- /dev/null +++ b/assets/js/pages/test.js @@ -0,0 +1,10 @@ +document.getElementById("lastmod").textContent = document.lastModified; + +document.getElementById("menu-toggle").addEventListener("click", function() { + const sidebar = document.getElementById("mobile-sidebar"); + sidebar.classList.toggle("visible"); + if (sidebar.classList.contains("visible")) { + sidebar.scrollTop = 0; + window.scrollTo(0, 0); + } + }); diff --git a/assets/js/pages/test_jp.js b/assets/js/pages/test_jp.js new file mode 100644 index 0000000..ee1c831 --- /dev/null +++ b/assets/js/pages/test_jp.js @@ -0,0 +1,10 @@ +document.getElementById("lastmod").textContent = document.lastModified; + +document.getElementById("menu-toggle").addEventListener("click", function() { + const sidebar = document.getElementById("mobile-sidebar"); + sidebar.classList.toggle("visible"); + if (sidebar.classList.contains("visible")) { + sidebar.scrollTop = 0; + window.scrollTo(0, 0); + } + }); diff --git a/assets/js/pages/test_zh.js b/assets/js/pages/test_zh.js new file mode 100644 index 0000000..ee1c831 --- /dev/null +++ b/assets/js/pages/test_zh.js @@ -0,0 +1,10 @@ +document.getElementById("lastmod").textContent = document.lastModified; + +document.getElementById("menu-toggle").addEventListener("click", function() { + const sidebar = document.getElementById("mobile-sidebar"); + sidebar.classList.toggle("visible"); + if (sidebar.classList.contains("visible")) { + sidebar.scrollTop = 0; + window.scrollTo(0, 0); + } + }); diff --git a/assets/js/site.js b/assets/js/site.js new file mode 100644 index 0000000..39891b7 --- /dev/null +++ b/assets/js/site.js @@ -0,0 +1,415 @@ +(function () { + function byId(id) { + return document.getElementById(id); + } + + const menuBtn = byId("menu-toggle"); + const nav = byId("site-nav"); + + const langToggle = byId("lang-toggle"); + const langMenu = byId("lang-options"); + const currentLang = byId("current-lang"); + + let openDropdown = null; + + function closeMenu() { + if (!menuBtn || !nav) return; + menuBtn.classList.remove("active"); + menuBtn.setAttribute("aria-expanded", "false"); + nav.hidden = true; + if (openDropdown === "menu") openDropdown = null; + } + + function closeLang() { + if (!langToggle || !langMenu) return; + langToggle.setAttribute("aria-expanded", "false"); + langMenu.hidden = true; + if (openDropdown === "lang") openDropdown = null; + } + + function toggleMenu(e) { + if (!menuBtn || !nav) return; + e.stopPropagation(); + + if (openDropdown === "lang") closeLang(); + + const open = menuBtn.getAttribute("aria-expanded") === "true"; + if (open) { + closeMenu(); + return; + } + + menuBtn.classList.add("active"); + menuBtn.setAttribute("aria-expanded", "true"); + nav.hidden = false; + openDropdown = "menu"; + } + + function toggleLang(e) { + if (!langToggle || !langMenu) return; + e.stopPropagation(); + + if (openDropdown === "menu") closeMenu(); + + const open = langToggle.getAttribute("aria-expanded") === "true"; + if (open) { + closeLang(); + return; + } + + langToggle.setAttribute("aria-expanded", "true"); + langMenu.hidden = false; + openDropdown = "lang"; + } + + if (nav) nav.hidden = true; + if (langMenu) langMenu.hidden = true; + + if (menuBtn && nav) { + menuBtn.addEventListener("click", toggleMenu); + nav.addEventListener("click", (e) => e.stopPropagation()); + } + + if (langToggle && langMenu) { + langToggle.addEventListener("click", toggleLang); + langMenu.addEventListener("click", (e) => e.stopPropagation()); + } + + if ((menuBtn && nav) || (langToggle && langMenu)) { + document.addEventListener("click", function (e) { + if ( + menuBtn && nav && + (menuBtn.contains(e.target) || nav.contains(e.target)) + ) { + return; + } + if ( + langToggle && langMenu && + (langToggle.contains(e.target) || langMenu.contains(e.target)) + ) { + return; + } + closeMenu(); + closeLang(); + }); + + document.addEventListener("keydown", function (e) { + if (e.key === "Escape") { + closeMenu(); + closeLang(); + } + }); + } + + if (currentLang) { + const docLang = (document.documentElement.lang || "en").toLowerCase(); + currentLang.textContent = docLang === "zh" ? "ZH" : docLang === "ja" ? "JA" : "EN"; + } + + if (langMenu) { + langMenu.querySelectorAll("a[data-lang]").forEach((a) => { + a.addEventListener("click", function () { + localStorage.setItem("preferredLang", this.getAttribute("data-lang") || "en"); + }); + }); + } + + // Language menu hrefs: convert current page to *_zh.html / *_jp.html. + // Needs to work for both: + // - directory URLs: /foo/ (serve /foo/index.html) + // - file URLs: /foo/page.html + function updateLangMenuHrefs() { + const links = document.querySelectorAll("a[data-lang-href][data-lang]"); + if (!links.length) return; + + let path = window.location.pathname || "/"; + if (!path.startsWith("/")) path = "/" + path; + + const isDir = path.endsWith("/"); + const file = isDir ? "index.html" : (path.split("/").pop() || "index.html"); + const base = isDir ? path : path.slice(0, -file.length); + + const baseName = file.replace(/_(zh|jp)\.html$/i, ".html"); + const map = { + en: baseName, + zh: baseName.replace(/(_(zh|jp))?\.html$/i, "_zh.html"), + ja: baseName.replace(/(_(zh|jp))?\.html$/i, "_jp.html"), + }; + + links.forEach((a) => { + const lang = (a.getAttribute("data-lang") || "en").toLowerCase(); + const targetFile = map[lang] || map.en; + a.href = base + targetFile; + }); + } + + function updateAriaCurrent() { + const path = window.location.pathname || "/"; + const normalized = path.startsWith("/") ? path : "/" + path; + const isDir = normalized.endsWith("/"); + const file = isDir ? "index.html" : (normalized.split("/").pop() || "index.html"); + const base = isDir ? normalized : normalized.slice(0, -file.length); + const indexPath = base + "index.html"; + const dirPath = base || "/"; + const candidates = new Set([normalized, indexPath, dirPath, dirPath.replace(/\/$/, "")]); + + document.querySelectorAll("#site-nav a[href]").forEach((a) => { + const href = a.getAttribute("href") || ""; + const hrefUrl = new URL(href, window.location.origin); + if (hrefUrl.origin !== window.location.origin) { + a.removeAttribute("aria-current"); + return; + } + const hrefPath = hrefUrl.pathname; + if (candidates.has(hrefPath)) { + a.setAttribute("aria-current", "page"); + } else { + a.removeAttribute("aria-current"); + } + }); + + const docLang = (document.documentElement.lang || "en").toLowerCase(); + document.querySelectorAll("#lang-options a[data-lang]").forEach((a) => { + const lang = (a.getAttribute("data-lang") || "en").toLowerCase(); + if (lang === docLang) { + a.setAttribute("aria-current", "page"); + } else { + a.removeAttribute("aria-current"); + } + }); + } + + // Run once now... + updateLangMenuHrefs(); + updateAriaCurrent(); + // ...and again after layout/injection settles. + setTimeout(updateLangMenuHrefs, 0); + setTimeout(updateAriaCurrent, 0); + + // Home page blog list (optional) + const blogList = byId("blog-list"); + if (blogList) { + const blogHost = "https://blog.sillylaird.ca"; + const ctrl = new AbortController(); + const timeout = setTimeout(() => ctrl.abort(), 3500); + + fetch(blogHost + "/api/posts.php", { signal: ctrl.signal }) + .then((r) => r.json()) + .then((posts) => { + blogList.textContent = ""; + + const top = document.createElement("div"); + + const strong = document.createElement("strong"); + strong.textContent = "Posts"; + top.appendChild(strong); + + top.appendChild(document.createTextNode(" (")); + const allLink = document.createElement("a"); + allLink.href = blogHost; + allLink.textContent = "all"; + top.appendChild(allLink); + top.appendChild(document.createTextNode(")")); + + blogList.appendChild(top); + + const list = document.createElement("ol"); + (posts || []).forEach((post) => { + const li = document.createElement("li"); + + const a = document.createElement("a"); + a.href = blogHost + "/" + String(post.path || "").replace(/^\/+/, ""); + a.textContent = String(post.title || "Untitled"); + + const date = document.createElement("div"); + date.className = "muted"; + + const y = String(post.year || ""); + const m = String(post.month || "").padStart(2, "0"); + const d = String(post.day || "").padStart(2, "0"); + const iso = y && m && d ? `${y}-${m}-${d}` : ""; + + const time = document.createElement("time"); + if (iso) time.setAttribute("datetime", iso); + time.textContent = iso || ""; + + li.appendChild(a); + li.appendChild(document.createElement("br")); + date.appendChild(time); + li.appendChild(date); + + list.appendChild(li); + }); + + blogList.appendChild(list); + + if (!list.children.length) { + const empty = document.createElement("div"); + empty.className = "muted"; + empty.textContent = "No posts yet."; + blogList.appendChild(empty); + } + }) + .catch((err) => { + blogList.textContent = err && err.name === "AbortError" + ? "Blog list timed out." + : "Cannot load posts right now."; + }) + .finally(() => clearTimeout(timeout)); + } + + const changelogList = byId("changelog-list"); + if (changelogList) { + const changelogPage = "/changelog/"; + const ctrl = new AbortController(); + const timeout = setTimeout(() => ctrl.abort(), 3500); + + fetch(changelogPage, { signal: ctrl.signal }) + .then((r) => r.text()) + .then((html) => { + changelogList.textContent = ""; + const doc = new DOMParser().parseFromString(html, "text/html"); + const entries = Array.from(doc.querySelectorAll(".changelog-entry")); + + const top = document.createElement("div"); + + const strong = document.createElement("strong"); + strong.textContent = "Entries"; + top.appendChild(strong); + + top.appendChild(document.createTextNode(" (")); + const allLink = document.createElement("a"); + allLink.href = "/changelog/"; + allLink.textContent = "all"; + top.appendChild(allLink); + top.appendChild(document.createTextNode(")")); + + changelogList.appendChild(top); + + const list = document.createElement("ol"); + entries.forEach((entry) => { + const li = document.createElement("li"); + + const titleText = (entry.querySelector("strong, b")?.textContent || "").trim(); + const timeEl = entry.querySelector("time"); + const dateText = (timeEl?.textContent || "").trim(); + const dateIso = (timeEl?.getAttribute("datetime") || "").trim(); + const bodyEl = entry.querySelector(".text"); + const bodyText = (bodyEl?.textContent || "").trim(); + + const title = document.createElement("strong"); + if (titleText) { + title.textContent = titleText; + li.appendChild(title); + + if (dateText) { + const date = document.createElement("div"); + date.className = "muted"; + const time = document.createElement("time"); + if (dateIso) time.setAttribute("datetime", dateIso); + time.textContent = dateText; + date.appendChild(time); + li.appendChild(date); + } + } else if (dateText) { + title.textContent = dateText; + li.appendChild(title); + } + + if (bodyText) { + const body = document.createElement("div"); + body.className = "changelog-body"; + body.textContent = bodyText; + li.appendChild(body); + } + + list.appendChild(li); + }); + + changelogList.appendChild(list); + + if (!list.children.length) { + const empty = document.createElement("div"); + empty.className = "muted"; + empty.textContent = "No updates yet."; + changelogList.appendChild(empty); + } + }) + .catch((err) => { + changelogList.textContent = err && err.name === "AbortError" + ? "Changelog list timed out." + : "Cannot load changelog right now."; + }) + .finally(() => clearTimeout(timeout)); + } + + const resetBtn = byId("guestbook-reset"); + if (resetBtn) { + resetBtn.addEventListener("click", () => { + const frame = byId("guestbook-form-iframe"); + if (!frame) return; + setIframeLoading(frame); + const src = frame.getAttribute("src") || frame.src; + if (src) { + // Reset by reloading the iframe URL (works cross-origin too). + frame.setAttribute("src", src); + return; + } + if (frame.contentWindow) frame.contentWindow.location.reload(); + }); + } + + function setIframeLoading(frame) { + if (!frame) return; + const clip = frame.closest(".iframe-clip"); + if (!clip) return; + clip.classList.add("is-loading"); + const onLoad = () => { + clip.classList.remove("is-loading"); + }; + frame.addEventListener("load", onLoad, { once: true }); + } + + function resetIframe(frame) { + if (!frame) return; + const src = frame.getAttribute("src") || frame.src; + if (src) { + frame.setAttribute("src", src); + return; + } + if (frame.contentWindow) frame.contentWindow.location.reload(); + } + + document.querySelectorAll("button[data-reset-iframe]").forEach((btn) => { + btn.addEventListener("click", () => { + const key = btn.getAttribute("data-reset-iframe"); + if (!key) return; + const scope = btn.closest(".iframe-clip") || btn.parentElement || document; + const frame = scope.querySelector(`iframe[data-iframe=\"${key}\"]`) || document.querySelector(`iframe[data-iframe=\"${key}\"]`); + setIframeLoading(frame); + resetIframe(frame); + }); + }); + + // Footer year: local time only. + (function () { + const el = byId("copyright-year"); + if (!el) return; + + el.textContent = String(new Date().getFullYear()); + })(); + + // Footer last-updated: based on document.lastModified. + (function () { + const el = byId("last-updated"); + if (!el) return; + + const raw = document.lastModified; + const date = raw ? new Date(raw) : null; + if (!date || Number.isNaN(date.getTime())) return; + + const iso = date.toISOString().slice(0, 10); + el.setAttribute("datetime", iso); + el.textContent = iso; + })(); +})(); -- cgit v1.2.3