← back to Wallco Ai

PDP theme switcher: fix dropdown on bare /design/:id — treat as route mode, resolve current theme from live/?theme (slug not in URL)

1044ed0f668c8067b65972dc5ea3147d01dcdfb9 · 2026-06-02 09:22:08 -0700 · Steve Abrams

Files touched

• M public/theme-variants/theme-variant-nav.js

Diff

commit 1044ed0f668c8067b65972dc5ea3147d01dcdfb9
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Tue Jun 2 09:22:08 2026 -0700

    PDP theme switcher: fix dropdown on bare /design/:id — treat as route mode, resolve current theme from live/?theme (slug not in URL)
---
 public/theme-variants/theme-variant-nav.js | 35 ++++++++++++++++++++++++------
 1 file changed, 28 insertions(+), 7 deletions(-)

diff --git a/public/theme-variants/theme-variant-nav.js b/public/theme-variants/theme-variant-nav.js
index ca5acc4..3f2e9d5 100644
--- a/public/theme-variants/theme-variant-nav.js
+++ b/public/theme-variants/theme-variant-nav.js
@@ -64,19 +64,38 @@
   ];
   var SLUGS = THEMES.map(function (t) { return t[0]; });
 
-  // Detect current context. Canonical: /design/:id/:slug. Fallback: /theme-variants/vN-slug.html
-  var m = location.pathname.match(/^\/design\/([^/]+)\/([^/?#]+)/);
+  // Detect current context.
+  //  • /design/:id/:slug  → route mode, slug from URL.
+  //  • /design/:id (bare) → route mode too, but the server serves the LIVE
+  //    theme (or ?theme=) with NO slug in the URL, so we can't read it from the
+  //    path. Mark slug=null and resolve the "current" theme from /api/pdp-theme
+  //    (or ?theme=) once it's known, in tvnInit() / the pill fetch.
+  //  • /theme-variants/vN-slug.html → file mode (dev).
+  var mRoute = location.pathname.match(/^\/design\/([^/]+)\/([^/?#]+)/);
+  var mBare  = location.pathname.match(/^\/design\/([^/?#]+)\/?$/);
   var mode, designId, slug, idx;
-  if (m) {
-    mode = 'route'; designId = m[1]; slug = m[2];
+  if (mRoute) {
+    mode = 'route'; designId = mRoute[1]; slug = mRoute[2];
     idx = SLUGS.indexOf(slug);
+  } else if (mBare) {
+    mode = 'route'; designId = mBare[1]; slug = null; idx = -1; // resolved async
   } else {
     mode = 'file';
     var base = location.pathname.split('/').pop().replace(/\.html?$/i, ''); // vN-slug
     slug = base.replace(/^v\d+-/, '');
     idx = SLUGS.indexOf(slug);
   }
-  if (idx === -1) idx = 0;
+  if (idx === -1) idx = 0; // safe synchronous default; bare URL overridden once live theme is known
+
+  // Resolve the served theme on a bare /design/:id (no slug in URL): prefer an
+  // explicit ?theme= preview, else the live theme. Call after LIVE_IDX is set.
+  function resolveBareIdx() {
+    if (slug !== null) return;
+    var tp = new URLSearchParams(location.search).get('theme');
+    var ti = tp ? SLUGS.indexOf(tp) : -1;
+    if (ti !== -1) idx = ti;
+    else if (LIVE_IDX !== -1) idx = LIVE_IDX;
+  }
 
   // map slug -> the vN-slug filename (for file mode)
   var FILEMAP = {
@@ -152,7 +171,7 @@
         if (li !== -1) LIVE_IDX = li;
       })
       .catch(function () {})
-      .then(buildDropdown);
+      .then(function () { resolveBareIdx(); buildDropdown(); });
   }
   if (document.body) tvnInit();
   else document.addEventListener('DOMContentLoaded', tvnInit);
@@ -201,7 +220,9 @@
       .then(function (j) {
         var s = j && typeof j.theme === 'string' ? j.theme.toLowerCase().trim() : '';
         var li = SLUGS.indexOf(s);
-        if (li !== -1) { LIVE_IDX = li; var l = document.getElementById('tvn-label'); if (l) l.innerHTML = label(); }
+        if (li !== -1) LIVE_IDX = li;
+        resolveBareIdx(); // bare /design/:id has no slug → current = live/?theme
+        var l = document.getElementById('tvn-label'); if (l) l.innerHTML = label();
       })
       .catch(function () {});
   }

← 4b22f53 pilot-build-tifs.py: source from design image_url, fall back  ·  back to Wallco Ai  ·  needs-tif admin: count disk truth (findTifOnDisk), not PG ti d6068de →