From 4d5fb9d8041eda3fd36b6f51af15bff059bdf1cf Mon Sep 17 00:00:00 2001 From: ame Date: Mon, 28 Apr 2025 15:46:45 -0500 Subject: add whitelist/blacklist for all styling --- background.js | 13 +++++++-- popup/popup.html | 20 ++++++++++++-- popup/popup.js | 80 +++++++++++++++++++++++++++++++++++++++++++++++++------- 3 files changed, 100 insertions(+), 13 deletions(-) diff --git a/background.js b/background.js index bc30678..99948ab 100644 --- a/background.js +++ b/background.js @@ -1,4 +1,5 @@ let SKIP_FORCE_THEMING_KEY = "skipForceThemingList"; +let SKIP_THEMING_KEY = "skipThemingList"; let logging = true; // Enable logging for debugging // Create a cache for pre-processed CSS to speed up repeated visits @@ -231,8 +232,16 @@ async function applyCSSToTab(tab) { const globalSettings = settings.transparentZenSettings || {}; console.log("DEBUG: Global settings:", JSON.stringify(globalSettings)); - if (globalSettings.enableStyling === false) { - console.log("DEBUG: Styling is globally disabled, exiting early"); + const skipStyleListData = await browser.storage.local.get( + SKIP_THEMING_KEY + ); + const skipStyleList = skipStyleListData[SKIP_THEMING_KEY] || []; + const styleMode = globalSettings.whitelistStyleMode ?? true; + + if (globalSettings.enableStyling === false || + !styleMode && skipStyleList.includes(hostname) || + styleMode && !skipStyleList.includes(hostname)) { + console.log("DEBUG: Styling is disabled, exiting early"); return; } diff --git a/popup/popup.html b/popup/popup.html index 9d8d042..c4d96e4 100644 --- a/popup/popup.html +++ b/popup/popup.html @@ -26,13 +26,29 @@
-
+
+
Enable Styling
+
+ + Blacklist Mode +
+
+ + Skip Styling for this Site +
+
@@ -110,4 +126,4 @@ - \ No newline at end of file + diff --git a/popup/popup.js b/popup/popup.js index c353182..9c546e8 100644 --- a/popup/popup.js +++ b/popup/popup.js @@ -1,5 +1,6 @@ let logging = false; let SKIP_FORCE_THEMING_KEY = "skipForceThemingList"; +let SKIP_THEMING_KEY = "skipThemingList"; // Helper function to normalize hostnames by removing www. prefix function normalizeHostname(hostname) { @@ -11,6 +12,11 @@ new (class ExtensionPopup { globalSettings = {}; siteSettings = {}; enableStylingSwitch = document.getElementById("enable-styling"); + whitelistStylingModeSwitch = document.getElementById("whitelist-style-mode"); + whitelistStylingModeLabel = document.getElementById("whitelist-style-mode-label"); + skipThemingSwitch = document.getElementById("skip-theming"); + siteStyleToggleLabel = document.getElementById("site-style-toggle-label"); + skipThemingList = []; refetchCSSButton = document.getElementById("refetch-css"); websitesList = document.getElementById("websites-list"); currentSiteFeatures = document.getElementById("current-site-toggles"); @@ -33,9 +39,11 @@ new (class ExtensionPopup { // Load settings and initialize the popup this.loadSettings().then(() => { this.loadSkipForceThemingList().then(() => { - this.getCurrentTabInfo().then(() => { - this.restoreSettings(); - this.bindEvents(); + this.loadSkipThemingList().then(() => { + this.getCurrentTabInfo().then(() => { + this.restoreSettings(); + this.bindEvents(); + }); }); }); }); @@ -66,6 +74,11 @@ new (class ExtensionPopup { this.handleWhitelistModeChange.bind(this) ); + this.whitelistStylingModeSwitch.addEventListener( + "change", + this.handleWhitelistStyleModeChange.bind(this) + ); + // Add event listener for the "What's New" button this.whatsNewButton.addEventListener("click", this.openWhatsNew.bind(this)); @@ -128,6 +141,10 @@ new (class ExtensionPopup { this.saveSkipForceThemingList(); }); + this.skipThemingSwitch.addEventListener("change", () => { + this.saveSkipThemingList(); + }); + this.reloadButton.addEventListener("click", this.reloadPage.bind(this)); } @@ -140,15 +157,20 @@ new (class ExtensionPopup { this.forceStylingSwitch.checked = this.globalSettings.forceStyling ?? false; this.whitelistModeSwitch.checked = this.globalSettings.whitelistMode ?? false; + this.whitelistStylingModeSwitch.checked = + this.globalSettings.whitelistStyleMode ?? false; this.updateModeLabels(); // In whitelist mode, checked means "include this site" - // In blacklist mode, checked means "skip this site" - const isInList = this.skipForceThemingList.includes( - this.currentSiteHostname + // In blacklist mode, checked means "skip this site" + this.skipForceThemingSwitch.checked = this.skipForceThemingList.includes( + normalizeHostname(this.currentSiteHostname) + ); + + this.skipThemingSwitch.checked = this.skipThemingList.includes( + normalizeHostname(this.currentSiteHostname) ); - this.skipForceThemingSwitch.checked = isInList; this.loadCurrentSiteFeatures(); } @@ -204,6 +226,7 @@ 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; browser.storage.local .set({ @@ -250,13 +273,18 @@ new (class ExtensionPopup { this.skipForceThemingList = data[SKIP_FORCE_THEMING_KEY] || []; } + async loadSkipThemingList() { + const data = await browser.storage.local.get(SKIP_THEMING_KEY); + this.skipThemingList = data[SKIP_THEMING_KEY] || []; + } + saveSkipForceThemingList() { const isChecked = this.skipForceThemingSwitch.checked; - const index = this.skipForceThemingList.indexOf(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(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); @@ -271,6 +299,27 @@ new (class ExtensionPopup { }); } + saveSkipThemingList() { + const isChecked = this.skipThemingSwitch.checked; + const index = this.skipThemingList.indexOf(normalizeHostname(this.currentSiteHostname)); + + if (isChecked && index === -1) { + // Add to the list (whitelist: include, blacklist: skip) + this.skipThemingList.push(normalizeHostname(this.currentSiteHostname)); + } else if (!isChecked && index !== -1) { + // Remove from the list (whitelist: exclude, blacklist: include) + this.skipThemingList.splice(index, 1); + } + + browser.storage.local + .set({ + [SKIP_THEMING_KEY]: this.skipThemingList, + }) + .then(() => { + this.updateActiveTabStyling(); + }); + } + async loadCurrentSiteFeatures() { if (logging) console.log("loadCurrentSiteFeatures called"); try { @@ -786,6 +835,11 @@ new (class ExtensionPopup { this.saveSettings(); } + handleWhitelistStyleModeChange() { + this.updateModeLabels(); + this.saveSettings(); + } + updateModeIndicator() { if (this.whitelistModeSwitch.checked) { this.modeIndicator.textContent = @@ -813,6 +867,14 @@ new (class ExtensionPopup { this.whitelistModeLabel.textContent = "Blacklist Mode"; this.siteToggleLabel.textContent = "Skip Forcing for this Site"; } + + if (this.whitelistStylingModeSwitch.checked) { + this.whitelistStylingModeLabel.textContent = "Whitelist Mode"; + this.siteStyleToggleLabel.textContent = "Enable for this Site"; + } else { + this.whitelistStylingModeLabel.textContent = "Blacklist Mode"; + this.siteStyleToggleLabel.textContent = "Skip Styling for this Site"; + } } // Open the What's New page -- cgit v1.2.3