var accScale; var accWidth; var accFont; var accHueOverride; var accHue; var accSaturationOverride; var accSaturation; var accBase; // if interface.js is existent var propagateStyles = propagateStyles ?? null; const FONTS = [ ["Lexend Deca", ""], ["Renogare", "Renogare"], ["OpenDyslexic", "OpenDyslexic"], // ["Mojangles", "Minecraft"], // ["Nintendo DS", "NDS12"], [ "System Default", `-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"`, ], ["Sans-serif", "sans-serif"], ["Serif", "serif"], ["Mono", "monospace"], ]; function createAccessibilityNodes() { document.querySelector("#accessibility").innerHTML = `
Site Modifiers





`; document.querySelector("#accessibility").hidden = false; accScale = document.getElementById("acc-scale"); accWidth = document.getElementById("acc-width"); accFont = document.getElementById("acc-font"); accHueOverride = document.getElementById("acc-hue-over"); accHue = document.getElementById("acc-hue"); accSaturationOverride = document.getElementById("acc-sat-over"); accSaturation = document.getElementById("acc-sat"); accBase = document.getElementById("acc-base"); accScale.addEventListener("change", function (e) { window.localStorage.setItem("acc-scale", e.target.value); changeScale(e.target.value); }); accWidth.addEventListener("change", function (e) { window.localStorage.setItem("acc-width", e.target.value); changeWidth(e.target.value); }); accFont.addEventListener("change", function (e) { window.localStorage.setItem("acc-font", e.target.value); changeFont(e.target.value); }); accHueOverride.addEventListener("change", function (e) { window.localStorage.setItem("acc-hue-over", e.target.checked); changeColor( accHue?.value, accSaturation?.value, e.target.checked, accSaturationOverride?.checked ); }); accHue.addEventListener("input", function (e) { window.localStorage.setItem("acc-hue", e.target.value); changeColor( e.target.value, accSaturation?.value, accHueOverride?.checked, accSaturationOverride?.checked ); }); accSaturationOverride.addEventListener("change", function (e) { window.localStorage.setItem("acc-sat-over", e.target.checked); changeColor( accHue?.value, accSaturation?.value, accHueOverride?.checked, e.target.checked ); }); accSaturation.addEventListener("input", function (e) { window.localStorage.setItem("acc-sat", e.target.value); changeColor( accHue?.value, e.target.value, accHueOverride?.checked, accSaturationOverride?.checked ); }); accBase.addEventListener("change", function (e) { window.localStorage.setItem("acc-base", e.target.checked); changeBase(e.target.checked); }); } // For metered conenctions async function fetch_ask(...args) { // return new Promise(async (resolve, reject) => { // let canFetch = window.sessionStorage.getItem("canFetch"); // if (canFetch == null) { // canFetch = confirm("may the site fetch data for this session?"); // window.sessionStorage.setItem("canFetch", canFetch); // } // if (canFetch === "true") resolve(await fetch(...args)); // else reject(null); // }); return await fetch(...args); } window.addEventListener("DOMContentLoaded", (e) => initializeChanges(e, true)); // on localStorage change window.addEventListener("storage", (e) => initializeChanges(e, false)); let prevBase; // previous base, for reload check function initializeChanges(_, loading) { if (window.frameElement == null) createAccessibilityNodes(); let scale = window.localStorage.getItem("acc-scale-v2"); if (scale == null) { window.localStorage.setItem("acc-scale-v2", 1); scale = window.localStorage.getItem("acc-scale-v2"); } let width = window.localStorage.getItem("acc-width"); if (width == null) { window.localStorage.setItem("acc-width", 50); width = window.localStorage.getItem("acc-width"); } let font = window.localStorage.getItem("acc-font"); if (font == null || font == "Lexend Deca") { window.localStorage.setItem("acc-font", ""); font = window.localStorage.getItem("acc-font"); } let hueOver = window.localStorage.getItem("acc-hue-over"); if (hueOver == null) { window.localStorage.setItem("acc-hue-over", false); hueOver = window.localStorage.getItem("acc-hue-over"); } let hue = window.localStorage.getItem("acc-hue"); if (hue == null) { window.localStorage.setItem("acc-hue", 0); hue = window.localStorage.getItem("acc-hue"); } let satOver = window.localStorage.getItem("acc-sat-over"); if (satOver == null) { window.localStorage.setItem("acc-sat-over", false); satOver = window.localStorage.getItem("acc-sat-over"); } let sat = window.localStorage.getItem("acc-sat"); if (sat == null) { window.localStorage.setItem("acc-sat", 0); sat = window.localStorage.getItem("acc-sat"); } let base = window.localStorage.getItem("acc-base"); if (base == null) { window.localStorage.setItem("acc-base", false); base = window.localStorage.getItem("acc-base"); } changeScale(scale); changeWidth(width); changeColor(hue, sat, hueOver === "true", satOver === "true"); changeFont(font); changeBase(base === "true"); if (scale != null && accScale != null) accScale.value = scale; if (width != null && accWidth != null) accWidth.value = width; if (font != null && accFont != null) accFont.value = font; if (hueOver != null && accHueOverride != null) accHueOverride.checked = hueOver === "true"; if (hue != null && accHue != null) accHue.value = hue; if (satOver != null && accSaturationOverride != null) accSaturationOverride.checked = satOver === "true"; if (sat != null && accSaturation != null) accSaturation.value = sat; if (base != null && accBase != null) accBase.checked = base === "true"; } function changeScale(scale) { document.documentElement.style.setProperty("--base-scale", scale + "rem"); } function changeWidth(width) { document.documentElement.style.setProperty("--document-width", width + "em"); } function changeFont(font) { document.documentElement.style.setProperty("--font-family", font); document.documentElement.style.setProperty("--header-font-family", font); } const baseColor = getComputedStyle(document.documentElement) .getPropertyValue("--base-color") .split(", "); function changeColor(hue, sat, hueOver, satOver) { if (accHue != null) accHue.disabled = !hueOver; if (accSaturation != null) accSaturation.disabled = !satOver; document.documentElement.style.setProperty( "--base-color", (hueOver ? hue : baseColor[0]) + ", " + (satOver ? sat + "%" : baseColor[1]) ); if (propagateStyles != null) propagateStyles(getComputedStyle(document.documentElement)); } function changeBase(base) { if (base) document.documentElement.classList.add("base"); else document.documentElement.classList.remove("base"); }