Artmura site: per-series 'Pattern' filter in catalog (21 collections) — honors committed per-series browsing

91724510f0bbf2b9c1c1932090f9a84a09aba215 · 2026-06-12 09:57:07 -0700 · Steve Abrams

Files touched

M artmura-site/public/index.html

Diff

commit 91724510f0bbf2b9c1c1932090f9a84a09aba215
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Fri Jun 12 09:57:07 2026 -0700

    Artmura site: per-series 'Pattern' filter in catalog (21 collections) — honors committed per-series browsing
---
 artmura-site/public/index.html | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/artmura-site/public/index.html b/artmura-site/public/index.html
index 9edd064..972c777 100644
--- a/artmura-site/public/index.html
+++ b/artmura-site/public/index.html
@@ -46,6 +46,10 @@
   <div class="controls-in">
     <a href="#" class="bar-wm">Artmura<span class="dot">.</span></a>
     <div class="count"><b id="cnt">—</b> wallcoverings</div>
+    <div class="ctl">
+      <label for="pattern">Pattern</label>
+      <select id="pattern"><option value="">All patterns</option></select>
+    </div>
     <div class="ctl">
       <label for="sort">Sort</label>
       <select id="sort">
@@ -87,7 +91,7 @@
 
 <script>
 const $=s=>document.querySelector(s), grid=$('#grid');
-let ALL=[], view=[], activeBook=null, activeColor=null, FACETS=null;
+let ALL=[], view=[], activeBook=null, activeColor=null, activeSeries=null, FACETS=null;
 const LS={sort:'artmura.sort', dens:'artmura.density'};
 const BUCKET_HEX={white:'#efeae0',grey:'#9e978c',black:'#2a2722',red:'#a23b2e',orange:'#c8763a',brown:'#7b5a3c',gold:'#b8923f',green:'#5d7150',teal:'#3f8a86',blue:'#5a7494',purple:'#7a5f86',pink:'#bb8aa0'};
 
@@ -134,6 +138,7 @@ function render(){
   let items = ALL;
   if(activeBook) items = items.filter(p=>p.book===activeBook);
   if(activeColor) items = items.filter(p=>p.color_bucket===activeColor);
+  if(activeSeries) items = items.filter(p=>p.series===activeSeries);
   items = sortItems(items, $('#sort').value);
   view=items;
   $('#cnt').textContent=items.length;
@@ -170,6 +175,11 @@ function colorbar(facets){
 function applyDensity(v){document.documentElement.style.setProperty('--cols',v);}
 $('#density').addEventListener('input',e=>{applyDensity(e.target.value);localStorage.setItem(LS.dens,e.target.value);});
 $('#sort').addEventListener('change',()=>{localStorage.setItem(LS.sort,$('#sort').value);render();});
+$('#pattern').addEventListener('change',()=>{activeSeries=$('#pattern').value||null;render();$('#catalog').scrollIntoView({behavior:'smooth'});});
+function fillPatterns(facets){
+  const sel=$('#pattern');
+  sel.innerHTML='<option value="">All patterns</option>'+facets.series.map(([s,n])=>`<option value="${s}">${s} (${n})</option>`).join('');
+}
 
 // hide hero corners + show bar wordmark once scrolled into catalog
 addEventListener('scroll',()=>{document.body.classList.toggle('scrolled',scrollY>innerHeight*0.82);});
@@ -178,7 +188,7 @@ addEventListener('scroll',()=>{document.body.classList.toggle('scrolled',scrollY
   const savedSort=localStorage.getItem(LS.sort); if(savedSort)$('#sort').value=savedSort;
   const savedDens=localStorage.getItem(LS.dens)||'4'; $('#density').value=savedDens; applyDensity(savedDens);
   const [pd,fc]=await Promise.all([fetch('/api/products').then(r=>r.json()),fetch('/api/facets').then(r=>r.json())]);
-  ALL=pd.products; FACETS=fc; startHero(ALL); chips(fc); colorbar(fc); render();
+  ALL=pd.products; FACETS=fc; startHero(ALL); chips(fc); colorbar(fc); fillPatterns(fc); render();
 })();
 </script>
 </body>

← 55fc397 Artmura push: fix 422 (drop metafields from create — store d · back to Dw Yolo Loop · Artmura titles: insert 'Wallcovering' → '<name> Wallcovering 52f8e55 →