static/js: Add pseudo state mechanism

Semi auto

1 files changed, 42 insertions, 0 deletions

diff --git a/assets/js/index.js b/assets/js/index.js
index 176959d..78539a2 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -684,6 +684,48 @@
     });
 })();
 (function() {
+    const cookiesDisabled = !navigator.cookieEnabled;
+    if (cookiesDisabled) {
+        document.cookie = "disabled";
+        document.cookie.indexOf("disabled");
+        return console.warn("WARNING: Cannot persist form state due to cookie restrictions");
+    }
+    [
+        "URLChangedCustomEvent",
+        "DOMContentLoaded"
+    ].forEach(function(event) {
+        self.addEventListener(event, function(event) {
+            const input = Array.prototype.slice.call(document.querySelectorAll("input"));
+            const select = Array.prototype.slice.call(document.querySelectorAll("select"));
+            const textarea = Array.prototype.slice.call(document.querySelectorAll("textarea"));
+            const states = input.concat(select).concat(textarea);
+            for(let i1 = 0; i1 < states.length; i1++){
+                if (localStorage[states[i1].id]) {
+                    if (states[i1].type === "radio" || states[i1].type === "checkbox") {
+                        if (localStorage[states[i1].id] === "on") states[i1].checked = true;
+                    } else states[i1].value = localStorage[states[i1].id];
+                    self.dispatchEvent(new Event("storage"));
+                }
+                states[i1].addEventListener("change", function(event) {
+                    localStorage[event.target.id] = event.target.value;
+                    const group = document.querySelectorAll(`input[name='${event.target.name}']`);
+                    for(let i1 = 0; i1 < group.length; i1++){
+                        if ((group[i1].type === "radio" || group[i1].type === "checkbox") && !group[i1].checked) {
+                            localStorage[group[i1].id] = "off";
+                        }
+                    }
+                    self.dispatchEvent(new Event("storage"));
+                });
+            }
+        });
+    });
+    self.addEventListener("storage", function() {
+        let stylesheet = document.querySelector('link[href$="default-simple.css"]');
+        if (localStorage["config.density.low"] === "on") stylesheet.rel = "stylesheet";
+        if (localStorage["config.density.high"] === "on") stylesheet.rel = "alternate stylesheet";
+    });
+})();
+(function() {
     const relative = new Intl.RelativeTimeFormat("en", {
         localeMatcher: "best fit",
         numeric: "always",