initial

popup.js

@@ -0,0 +1,83 @@
+(function () {
+  "use strict";
+
+  const status = document.getElementById("status");
+  const toggle = document.getElementById("toggle");
+  let activeTabId = null;
+  let currentEnabled = false;
+  let busy = false;
+
+  function render(enabled) {
+    currentEnabled = enabled;
+    toggle.disabled = busy || activeTabId === null;
+    toggle.setAttribute("aria-pressed", String(enabled));
+    toggle.textContent = enabled ? "Restore Cyrillic" : "Enable Glagolitic";
+    status.textContent = enabled ? "Glagolitic is on for this tab." : "Cyrillic is unchanged in this tab.";
+  }
+
+  function showUnavailable() {
+    activeTabId = null;
+    currentEnabled = false;
+    toggle.disabled = true;
+    toggle.setAttribute("aria-pressed", "false");
+    toggle.textContent = "Unavailable on this page";
+    status.textContent = "Firefox protects this page from extensions.";
+  }
+
+  async function askBackground(type, extra = {}) {
+    return browser.runtime.sendMessage({ type, ...extra });
+  }
+
+  toggle.addEventListener("click", async () => {
+    if (busy || activeTabId === null) {
+      return;
+    }
+
+    const targetEnabled = !currentEnabled;
+    busy = true;
+    toggle.disabled = true;
+    status.textContent = "Updating tab…";
+    try {
+      const response = await askBackground("glagolify:set-tab-enabled", {
+        tabId: activeTabId,
+        enabled: targetEnabled
+      });
+      if (!response || !response.available) {
+        showUnavailable();
+        return;
+      }
+      render(response.enabled === true);
+    } catch (error) {
+      showUnavailable();
+    } finally {
+      busy = false;
+      if (activeTabId !== null) {
+        toggle.disabled = false;
+      }
+    }
+  });
+
+  async function initialize() {
+    try {
+      const tabs = await browser.tabs.query({ active: true, currentWindow: true });
+      if (!tabs[0] || typeof tabs[0].id !== "number") {
+        showUnavailable();
+        return;
+      }
+
+      activeTabId = tabs[0].id;
+      const response = await askBackground("glagolify:get-tab-state", {
+        tabId: activeTabId
+      });
+      if (!response || !response.available) {
+        showUnavailable();
+        return;
+      }
+      render(response.enabled === true);
+    } catch (error) {
+      showUnavailable();
+    }
+  }
+
+  initialize();
+})();