137 lines
3.3 KiB
JavaScript
137 lines
3.3 KiB
JavaScript
|
import * as utils from "./utils";
|
||
|
import { bindBooleanOptions } from "./common";
|
||
|
|
||
|
let activeTab;
|
||
|
let savedOptions;
|
||
|
let tabOptions;
|
||
|
|
||
|
let statusIndicator;
|
||
|
let statusText;
|
||
|
let reloadButton;
|
||
|
|
||
|
// prettier-ignore
|
||
|
const STATUS_COLORS = {
|
||
|
"status_init": "gray",
|
||
|
"status_no_tab": "red",
|
||
|
"status_tabs_error": "red",
|
||
|
"status_message_init": "gray",
|
||
|
"status_result_protected": "gray",
|
||
|
"status_result_error": "red",
|
||
|
"status_result_running": "green",
|
||
|
"status_result_optout": "gray",
|
||
|
"status_result_disabled": "gray",
|
||
|
};
|
||
|
|
||
|
async function queryTabStatus(listener) {
|
||
|
listener("status_init");
|
||
|
|
||
|
let tabs;
|
||
|
try {
|
||
|
tabs = await utils.tabs.query({
|
||
|
currentWindow: true,
|
||
|
active: true,
|
||
|
});
|
||
|
|
||
|
if (tabs.length < 1) {
|
||
|
listener("status_no_tabs");
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (tabs.length > 1) {
|
||
|
throw new Error(
|
||
|
`Got ${tabs.length} tabs in response to active tab query.`
|
||
|
);
|
||
|
}
|
||
|
} catch (e) {
|
||
|
listener("status_tabs_error");
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
activeTab = tabs[0];
|
||
|
listener("status_message_init");
|
||
|
|
||
|
let response;
|
||
|
try {
|
||
|
response = await utils.tabs.sendMessage(activeTab.id, {});
|
||
|
} catch (e) {
|
||
|
listener("status_result_protected");
|
||
|
reloadButton.disabled = true;
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (!response) {
|
||
|
listener("status_result_error");
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
tabOptions = response.tabSettings;
|
||
|
|
||
|
if (response.loaded) {
|
||
|
listener("status_result_running");
|
||
|
} else if (tabOptions.ruffleEnable) {
|
||
|
listener("status_result_optout");
|
||
|
} else {
|
||
|
listener("status_result_disabled");
|
||
|
}
|
||
|
|
||
|
optionsChanged();
|
||
|
}
|
||
|
|
||
|
function objectsEqual(x, y) {
|
||
|
for (const [key, value] of Object.entries(x)) {
|
||
|
if (y[key] !== value) {
|
||
|
return false;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
for (const [key, value] of Object.entries(y)) {
|
||
|
if (x[key] !== value) {
|
||
|
return false;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
return true;
|
||
|
}
|
||
|
|
||
|
function optionsChanged() {
|
||
|
if (!tabOptions) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
const isDifferent = !objectsEqual(savedOptions, tabOptions);
|
||
|
reloadButton.disabled = !isDifferent;
|
||
|
}
|
||
|
|
||
|
function displayTabStatus() {
|
||
|
queryTabStatus((status) => {
|
||
|
statusIndicator.style.setProperty("--color", STATUS_COLORS[status]);
|
||
|
statusText.textContent = utils.i18n.getMessage(status);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
window.addEventListener("DOMContentLoaded", () => {
|
||
|
bindBooleanOptions((options) => {
|
||
|
savedOptions = options;
|
||
|
optionsChanged();
|
||
|
});
|
||
|
|
||
|
statusIndicator = document.getElementById("status-indicator");
|
||
|
statusText = document.getElementById("status-text");
|
||
|
|
||
|
const optionsButton = document.getElementById("options-button");
|
||
|
optionsButton.textContent = utils.i18n.getMessage("open_settings_page");
|
||
|
optionsButton.addEventListener("click", () => utils.openOptionsPage());
|
||
|
|
||
|
reloadButton = document.getElementById("reload-button");
|
||
|
reloadButton.textContent = utils.i18n.getMessage("action_reload");
|
||
|
reloadButton.addEventListener("click", async () => {
|
||
|
await utils.tabs.reload(activeTab.id);
|
||
|
// TODO: wait for tab to load?
|
||
|
setTimeout(() => {
|
||
|
displayTabStatus();
|
||
|
}, 1000);
|
||
|
});
|
||
|
|
||
|
displayTabStatus();
|
||
|
});
|