Floating Cats 0.1

1 files changed, 50 insertions, 0 deletions

diff --git a/floating-cats.js b/floating-cats.js
new file mode 100644
index 0000000..74acea4
--- /dev/null
+++ b/floating-cats.js
@@ -0,0 +1,50 @@
+"use strict";
+
+if (typeof(browser) == "undefined") {
+    globalThis.browser = chrome;
+}
+
+const cats = [];
+
+function reflectChange(changes, name, proc) {
+    if (name in changes
+        && "newValue" in changes[name]
+        && !Object.is(changes[name].newValue, changes[name].oldValue)) {
+        proc(changes[name].newValue);
+    }
+}
+
+async function main() {
+    let enabled = (await browser.storage.sync.get("enabled")).enabled;
+
+    browser.storage.onChanged.addListener(changes => {
+        reflectChange(changes, "enabled", newEnabled => {
+            enabled = newEnabled;
+            cats.forEach(cat => cat.hidden = !enabled);
+        });
+    });
+
+    let counter = 0;
+    function addCat(alt, url) {
+        const floatingX = document.createElement("div");
+        floatingX.style.setProperty("--floating-cats-floating-delay", `-${50 * counter++}s`);
+        floatingX.classList.add("floating-cats-clickthru");
+        floatingX.classList.add("floating-cats-floating");
+        floatingX.classList.add("floating-cats-floating-x");
+        floatingX.hidden = !enabled;
+        cats.push(floatingX);
+        document.body.appendChild(floatingX);
+
+        const floatingY = document.createElement("img");
+        floatingY.classList.add("floating-cats-clickthru");
+        floatingY.classList.add("floating-cats-floating-y");
+        floatingY.alt = alt;
+        floatingY.src = browser.runtime.getURL(url);
+        floatingX.appendChild(floatingY);
+    }
+
+    addCat("Spinning Marsey", "/marsey3d.webp");
+    addCat("Spinning Bob", "/bobvibes.webp");
+}
+
+main();