summaryrefslogtreecommitdiff
path: root/popup/popup.js
diff options
context:
space:
mode:
Diffstat (limited to 'popup/popup.js')
-rw-r--r--popup/popup.js70
1 files changed, 64 insertions, 6 deletions
diff --git a/popup/popup.js b/popup/popup.js
index 9c546e8..c86a882 100644
--- a/popup/popup.js
+++ b/popup/popup.js
@@ -13,7 +13,9 @@ new (class ExtensionPopup {
siteSettings = {};
enableStylingSwitch = document.getElementById("enable-styling");
whitelistStylingModeSwitch = document.getElementById("whitelist-style-mode");
- whitelistStylingModeLabel = document.getElementById("whitelist-style-mode-label");
+ whitelistStylingModeLabel = document.getElementById(
+ "whitelist-style-mode-label"
+ );
skipThemingSwitch = document.getElementById("skip-theming");
siteStyleToggleLabel = document.getElementById("site-style-toggle-label");
skipThemingList = [];
@@ -69,6 +71,11 @@ new (class ExtensionPopup {
.getElementById("toggle-features")
?.addEventListener("click", this.toggleFeatures.bind(this));
+ // Add toggle forcing button event listener
+ document
+ .getElementById("toggle-forcing")
+ ?.addEventListener("click", this.toggleForcing.bind(this));
+
this.whitelistModeSwitch.addEventListener(
"change",
this.handleWhitelistModeChange.bind(this)
@@ -116,6 +123,14 @@ new (class ExtensionPopup {
this.normalizedCurrentSiteHostname,
")"
);
+
+ // Update the site label with current hostname (without www.)
+ const siteDomainElement = document.getElementById("site-domain");
+ if (siteDomainElement) {
+ const displayDomain = normalizeHostname(this.currentSiteHostname);
+ siteDomainElement.textContent = displayDomain;
+ siteDomainElement.title = displayDomain; // Add full domain as tooltip for long domains
+ }
}
} catch (error) {
console.error("Error getting current tab info:", error);
@@ -163,7 +178,7 @@ new (class ExtensionPopup {
this.updateModeLabels();
// In whitelist mode, checked means "include this site"
- // In blacklist mode, checked means "skip this site"
+ // In blacklist mode, checked means "skip this site"
this.skipForceThemingSwitch.checked = this.skipForceThemingList.includes(
normalizeHostname(this.currentSiteHostname)
);
@@ -226,7 +241,8 @@ new (class ExtensionPopup {
this.globalSettings.autoUpdate = this.autoUpdateSwitch.checked;
this.globalSettings.forceStyling = this.forceStylingSwitch.checked;
this.globalSettings.whitelistMode = this.whitelistModeSwitch.checked;
- this.globalSettings.whitelistStyleMode = this.whitelistStylingModeSwitch.checked;
+ this.globalSettings.whitelistStyleMode =
+ this.whitelistStylingModeSwitch.checked;
browser.storage.local
.set({
@@ -280,11 +296,15 @@ new (class ExtensionPopup {
saveSkipForceThemingList() {
const isChecked = this.skipForceThemingSwitch.checked;
- const index = this.skipForceThemingList.indexOf(normalizeHostname(this.currentSiteHostname));
+ const index = this.skipForceThemingList.indexOf(
+ normalizeHostname(this.currentSiteHostname)
+ );
if (isChecked && index === -1) {
// Add to the list (whitelist: include, blacklist: skip)
- this.skipForceThemingList.push(normalizeHostname(this.currentSiteHostname));
+ this.skipForceThemingList.push(
+ normalizeHostname(this.currentSiteHostname)
+ );
} else if (!isChecked && index !== -1) {
// Remove from the list (whitelist: exclude, blacklist: include)
this.skipForceThemingList.splice(index, 1);
@@ -301,7 +321,9 @@ new (class ExtensionPopup {
saveSkipThemingList() {
const isChecked = this.skipThemingSwitch.checked;
- const index = this.skipThemingList.indexOf(normalizeHostname(this.currentSiteHostname));
+ const index = this.skipThemingList.indexOf(
+ normalizeHostname(this.currentSiteHostname)
+ );
if (isChecked && index === -1) {
// Add to the list (whitelist: include, blacklist: skip)
@@ -384,6 +406,26 @@ new (class ExtensionPopup {
}
}
+ // Set the forcing section's initial collapsed state
+ const forcingContent = document.getElementById("forcing-content");
+ const toggleForcingButton = document.getElementById("toggle-forcing");
+
+ if (hasSpecificTheme) {
+ // We have a specific theme, collapse the forcing section
+ forcingContent.classList.add("collapsed");
+ if (toggleForcingButton) {
+ const icon = toggleForcingButton.querySelector("i");
+ if (icon) icon.className = "fas fa-chevron-down";
+ }
+ } else {
+ // No specific theme found, expand the forcing section
+ forcingContent.classList.remove("collapsed");
+ if (toggleForcingButton) {
+ const icon = toggleForcingButton.querySelector("i");
+ if (icon) icon.className = "fas fa-chevron-up";
+ }
+ }
+
// Disable the force styling toggle if we found a theme for this site
if (hasSpecificTheme) {
// We found a specific theme for this site, no need for force styling
@@ -906,4 +948,20 @@ new (class ExtensionPopup {
icon.className = "fas fa-chevron-up";
}
}
+
+ // Toggle forcing section visibility
+ toggleForcing() {
+ const forcingContent = document.getElementById("forcing-content");
+ const toggleButton = document.getElementById("toggle-forcing");
+
+ forcingContent.classList.toggle("collapsed");
+
+ // Update the icon
+ const icon = toggleButton.querySelector("i");
+ if (forcingContent.classList.contains("collapsed")) {
+ icon.className = "fas fa-chevron-down";
+ } else {
+ icon.className = "fas fa-chevron-up";
+ }
+ }
})();