130 lines
3.7 KiB
JavaScript
130 lines
3.7 KiB
JavaScript
(function () {
|
|
"use strict";
|
|
|
|
const status = document.getElementById("status");
|
|
const toggle = document.getElementById("toggle");
|
|
const fontStyleInputs = [...document.querySelectorAll('input[name="font-style"]')];
|
|
const fontStyles = new Set(fontStyleInputs.map((input) => input.value));
|
|
let activeTabId = null;
|
|
let currentEnabled = false;
|
|
let currentFontStyle = "round";
|
|
let busy = false;
|
|
let fontStyleBusy = 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 setFontStyleDisabled(disabled) {
|
|
for (const input of fontStyleInputs) {
|
|
input.disabled = disabled;
|
|
}
|
|
}
|
|
|
|
function renderFontStyle(style) {
|
|
currentFontStyle = fontStyles.has(style) ? style : "round";
|
|
for (const input of fontStyleInputs) {
|
|
input.checked = input.value === currentFontStyle;
|
|
}
|
|
setFontStyleDisabled(false);
|
|
}
|
|
|
|
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);
|
|
renderFontStyle(response.fontStyle);
|
|
} catch (error) {
|
|
showUnavailable();
|
|
} finally {
|
|
busy = false;
|
|
if (activeTabId !== null) {
|
|
toggle.disabled = false;
|
|
}
|
|
}
|
|
});
|
|
|
|
for (const input of fontStyleInputs) {
|
|
input.addEventListener("change", async () => {
|
|
if (!input.checked || fontStyleBusy || input.value === currentFontStyle) {
|
|
return;
|
|
}
|
|
|
|
const previousFontStyle = currentFontStyle;
|
|
fontStyleBusy = true;
|
|
setFontStyleDisabled(true);
|
|
try {
|
|
const response = await askBackground("glagolify:set-font-style", {
|
|
fontStyle: input.value
|
|
});
|
|
if (!response || !response.accepted) {
|
|
throw new Error("Font style was rejected");
|
|
}
|
|
renderFontStyle(response.fontStyle);
|
|
} catch (error) {
|
|
renderFontStyle(previousFontStyle);
|
|
} finally {
|
|
fontStyleBusy = false;
|
|
setFontStyleDisabled(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
|
|
});
|
|
renderFontStyle(response && response.fontStyle);
|
|
if (!response || !response.available) {
|
|
showUnavailable();
|
|
return;
|
|
}
|
|
render(response.enabled === true);
|
|
} catch (error) {
|
|
showUnavailable();
|
|
}
|
|
}
|
|
|
|
initialize();
|
|
})();
|