Replace preconfigured sites with intelligent dynamic proxy switching

src/pages/index.astro

@@ -41,6 +41,7 @@ const link = Astro.url.searchParams.get("redir");
     import { Settings } from "@utils/settings.ts";
     import { BareClient } from "@mercuryworkshop/bare-mux";
     import { setupIframeInterceptor } from "@utils/iframe-interceptor.ts";
+    import { getDynamicLoading } from "@utils/dynamic-loading.ts";
 
     const init = async () => {
         const input = document.getElementById("input") as HTMLInputElement;
@@ -64,9 +65,15 @@ const link = Astro.url.searchParams.get("redir");
         const sw = SW.getInstance().next().value!;
         await sw.ready();
 
+        // Initialize dynamic loading
+        const dynamicLoading = getDynamicLoading();
+
         // Setup iframe interceptor to prevent new tabs/windows
         setupIframeInterceptor(iframe, (url: string) => sw.encodeURL(url));
 
+        // Track current site URL for dynamic loading
+        let currentSiteUrl: string | null = null;
+
         input.addEventListener("keypress", async (event: any) => {
             if (event.key === "Enter") {
                 // Handle "about:" URLs
@@ -88,6 +95,18 @@ const link = Astro.url.searchParams.get("redir");
                 }
 
                 const settings = await Settings.getInstance();
+
+                // If leaving a previous site, restore original config
+                if (currentSiteUrl && dynamicLoading.isEnabled()) {
+                    await dynamicLoading.onSiteLeave();
+                }
+
+                // Notify dynamic loading of new site
+                currentSiteUrl = inputValue;
+                if (dynamicLoading.isEnabled()) {
+                    await dynamicLoading.onSiteEnter(inputValue);
+                }
+
                 iframe.classList.remove("hidden");
                 iframe.src = sw.encodeURL(input.value); 
                 buttons();
@@ -133,7 +152,17 @@ const link = Astro.url.searchParams.get("redir");
             phlImage.src = object;
             bhl.classList.add("hidden");
             phl.classList.remove("hidden");
-        }); 
+        });
+
+        // Handle page unload to restore config (synchronous cleanup)
+        // Use both beforeunload and pagehide for better cross-browser support
+        const cleanupHandler = () => {
+            if (currentSiteUrl && dynamicLoading.isEnabled()) {
+                dynamicLoading.cleanupSync();
+            }
+        };
+        window.addEventListener("beforeunload", cleanupHandler);
+        window.addEventListener("pagehide", cleanupHandler);
     }
 
     class CustomComponent extends HTMLElement {

src/pages/settings/experiments.astro

@@ -13,16 +13,10 @@ import { Icon } from "astro-icon/components";
         </div>
 
         <div class="divide-y divide-(--border)">
-            <Switch 
-                id="preconfiguredSites" 
-                label="Preconfigured Sites"
-                description="Automatically use optimal proxy configurations for sites that struggle to load. The system will detect known problematic sites and switch to a working configuration (e.g., Scramjet with Bare server for Amazon)."
-            />
-
             <Switch 
                 id="dynamicLoading" 
                 label="Dynamic Loading"
-                description="Monitor console for errors from Bare/Wisp servers and web proxies. When a site fails to load, automatically try different configurations. If all configurations fail, show the 404 page."
+                description="Automatically detect when a site can't load due to proxy errors and switch to a different configuration. If all configurations fail, you'll be redirected to the 404 page. Configuration changes are site-specific and revert when you leave the site."
             />
         </div>
     </div>
@@ -32,23 +26,14 @@ import { Icon } from "astro-icon/components";
     import { StoreManager } from "@utils/storage";
 
     const initExperiments = (storage: StoreManager<"radius||settings">) => {
-        const preconfiguredSitesSwitch = document.getElementById("switch-preconfiguredSites");
         const dynamicLoadingSwitch = document.getElementById("switch-dynamicLoading");
 
-        if (!preconfiguredSitesSwitch || !dynamicLoadingSwitch) return;
+        if (!dynamicLoadingSwitch) return;
 
-        // Load saved states
-        const preconfiguredSitesEnabled = storage.getVal("experimentPreconfiguredSites") === "true";
+        // Load saved state
         const dynamicLoadingEnabled = storage.getVal("experimentDynamicLoading") === "true";
 
-        // Set initial states
-        if (preconfiguredSitesEnabled) {
-            preconfiguredSitesSwitch.setAttribute("aria-checked", "true");
-            preconfiguredSitesSwitch.setAttribute("data-state", "checked");
-            const thumb = preconfiguredSitesSwitch.querySelector("span");
-            if (thumb) thumb.setAttribute("data-state", "checked");
-        }
-
+        // Set initial state
         if (dynamicLoadingEnabled) {
             dynamicLoadingSwitch.setAttribute("aria-checked", "true");
             dynamicLoadingSwitch.setAttribute("data-state", "checked");
@@ -57,14 +42,12 @@ import { Icon } from "astro-icon/components";
         }
 
         // Listen for changes
-        preconfiguredSitesSwitch.addEventListener("switch-change", (e: Event) => {
-            const customEvent = e as CustomEvent<{ checked: boolean }>;
-            storage.setVal("experimentPreconfiguredSites", customEvent.detail.checked.toString());
-        });
-
-        dynamicLoadingSwitch.addEventListener("switch-change", (e: Event) => {
+        dynamicLoadingSwitch.addEventListener("switch-change", async (e: Event) => {
             const customEvent = e as CustomEvent<{ checked: boolean }>;
             storage.setVal("experimentDynamicLoading", customEvent.detail.checked.toString());
+            // Sync the state with the DynamicLoading instance
+            const { getDynamicLoading } = await import("@utils/dynamic-loading");
+            getDynamicLoading().setEnabled(customEvent.detail.checked);
         });
     };