Fix dark theme detection

Honor the Hugging Face __theme parameter and follow the browser color scheme for system mode.

src/demo/server_frontend/app.js

@@ -24,35 +24,22 @@ let running = false;
 let toastTimer = null;
 
 const colorScheme = window.matchMedia("(prefers-color-scheme: dark)");
+const requestedTheme = new URLSearchParams(window.location.search).get("__theme");
+const followsSystemTheme = requestedTheme !== "dark" && requestedTheme !== "light";
 
-function storedTheme() {
-  try {
-    return localStorage.getItem("infinisplat-theme");
-  } catch {
-    return null;
-  }
-}
-
-function applyTheme(theme, persist = false) {
+function applyTheme(theme) {
   document.documentElement.dataset.theme = theme;
   themeToggle.checked = theme === "dark";
-  if (persist) {
-    try {
-      localStorage.setItem("infinisplat-theme", theme);
-    } catch {
-      // The selected theme still applies when storage is unavailable.
-    }
-  }
 }
 
 applyTheme(document.documentElement.dataset.theme || (colorScheme.matches ? "dark" : "light"));
 
 themeToggle.addEventListener("change", () => {
-  applyTheme(themeToggle.checked ? "dark" : "light", true);
+  applyTheme(themeToggle.checked ? "dark" : "light");
 });
 
 colorScheme.addEventListener("change", (event) => {
-  if (!storedTheme()) applyTheme(event.matches ? "dark" : "light");
+  if (followsSystemTheme) applyTheme(event.matches ? "dark" : "light");
 });
 
 function resultValue(result) {

src/demo/server_frontend/index.html

@@ -6,14 +6,12 @@
   <meta name="color-scheme" content="light dark">
   <title>InfiniSplat</title>
   <script>
-    let savedTheme = null;
-    try {
-      savedTheme = localStorage.getItem("infinisplat-theme");
-    } catch {
-      savedTheme = null;
-    }
+    const requestedTheme = new URLSearchParams(window.location.search).get("__theme");
     const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
-    document.documentElement.dataset.theme = savedTheme || (prefersDark ? "dark" : "light");
+    document.documentElement.dataset.theme =
+      requestedTheme === "dark" || requestedTheme === "light"
+        ? requestedTheme
+        : (prefersDark ? "dark" : "light");
   </script>
   <link rel="stylesheet" href="/infinisplat/assets/styles.css?v=4">
 </head>
@@ -87,6 +85,6 @@
   </main>
 
   <div class="toast" id="toast" role="status" aria-live="polite"></div>
-  <script type="module" src="/infinisplat/assets/app.js?v=4"></script>
+  <script type="module" src="/infinisplat/assets/app.js?v=5"></script>
 </body>
 </html>