68 lines
1.9 KiB
JavaScript
Executable file
68 lines
1.9 KiB
JavaScript
Executable file
var accScale;
|
|
var accBase;
|
|
|
|
function createAccessibilityNodes() {
|
|
document.querySelector("#accessibility").innerHTML = `<fieldset>
|
|
<legend>Accessibility controls</legend>
|
|
<label for="size_width">
|
|
<input
|
|
id="acc-scale"
|
|
type="number"
|
|
style="width: 8ch"
|
|
min="8"
|
|
max="48"
|
|
value="16"
|
|
/>
|
|
UI scale</label><br />
|
|
<label for="acc-base" class="checkbox">
|
|
<input id="acc-base" type="checkbox" id="acc-base" />
|
|
<span class="checkbox">◉</span>
|
|
Base style (requires reload)
|
|
</label>
|
|
</fieldset>`;
|
|
|
|
accScale = document.getElementById("acc-scale");
|
|
accBase = document.getElementById("acc-base");
|
|
|
|
accScale.addEventListener("change", function (e) {
|
|
window.localStorage.setItem("acc-scale", e.target.value);
|
|
changeScale(e.target.value);
|
|
});
|
|
|
|
accBase.addEventListener("change", function (e) {
|
|
window.localStorage.setItem("acc-base", e.target.checked);
|
|
window.location.reload();
|
|
});
|
|
}
|
|
|
|
window.addEventListener("load", (e) => initializeChanges(e, true));
|
|
|
|
// on localStorage change
|
|
window.addEventListener("storage", initializeChanges);
|
|
|
|
let prevBase; // previous base, for reload check
|
|
|
|
function initializeChanges(_, loading) {
|
|
if (window.frameElement == null) createAccessibilityNodes();
|
|
|
|
const scale = window.localStorage.getItem("acc-scale");
|
|
const base = window.localStorage.getItem("acc-base");
|
|
changeScale(scale);
|
|
|
|
if (loading) {
|
|
prevBase = base;
|
|
changeBase(base === "true");
|
|
} else if (base != prevBase) window.location.reload();
|
|
|
|
if (scale != null && accScale != null) accScale.value = scale;
|
|
if (base != null && accBase != null) accBase.checked = base === "true";
|
|
}
|
|
|
|
function changeScale(scale) {
|
|
document.documentElement.style.setProperty("--base-scale", scale + "px");
|
|
}
|
|
|
|
function changeBase(base) {
|
|
if (base) document.documentElement.classList.add("base");
|
|
else document.documentElement.classList.remove("base");
|
|
}
|