room wall: show repeat count + black pinstripe vertical lines at each repeat boundary

def6e5273d93c65de4b776194897fb2fbc7ba88a · 2026-05-27 16:32:28 -0700 · Steve Abrams

drawRoomRulers draws a thin black vertical pinstripe at every pattern-repeat
boundary across the 12′ wall (edge lines emphasized) + a '↔ N repeats × W″'
badge. Updates live with the width preset (24″=6, 36″=4, 54″=2.7 repeats across
the 12ft wall). Lines align 1:1 with the wallpaper tile boundaries.

Files touched

M public/admin/drunk-curator.html

Diff

commit def6e5273d93c65de4b776194897fb2fbc7ba88a
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Wed May 27 16:32:28 2026 -0700

    room wall: show repeat count + black pinstripe vertical lines at each repeat boundary
    
    drawRoomRulers draws a thin black vertical pinstripe at every pattern-repeat
    boundary across the 12′ wall (edge lines emphasized) + a '↔ N repeats × W″'
    badge. Updates live with the width preset (24″=6, 36″=4, 54″=2.7 repeats across
    the 12ft wall). Lines align 1:1 with the wallpaper tile boundaries.
---
 public/admin/drunk-curator.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/public/admin/drunk-curator.html b/public/admin/drunk-curator.html
index 798fe0d..a57b3f7 100644
--- a/public/admin/drunk-curator.html
+++ b/public/admin/drunk-curator.html
@@ -34,6 +34,11 @@
   .wall{position:absolute;inset:0 0 24% 0;background-repeat:repeat;background-position:center top;background-size:24% auto;filter:brightness(.98);}
   .wall::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 35%,transparent 55%,rgba(0,0,0,.28));} /* gentle room light */
   .floor{position:absolute;left:0;right:0;bottom:0;height:24%;background:linear-gradient(#b9a684,#8d7a5b);}
+  /* vertical pinstripe lines marking each pattern-repeat boundary on the wall */
+  .repeats{position:absolute;inset:0 0 24% 0;z-index:5;pointer-events:none;}
+  .repeats .vline{position:absolute;top:0;bottom:0;width:1px;background:#000;opacity:.6;}
+  .repeats .vline.edge{opacity:.9;width:1.5px;}
+  .repbadge{position:absolute;top:8px;right:10px;z-index:7;background:rgba(0,0,0,.62);color:#fff;font:800 10px sans-serif;padding:3px 9px;border-radius:20px;}
   .baseboard{position:absolute;left:0;right:0;bottom:24%;height:3.2%;background:#efe9df;border-top:1px solid rgba(0,0,0,.12);box-shadow:0 2px 5px rgba(0,0,0,.18);}
   .furn{position:absolute;left:50%;bottom:24%;transform:translateX(-50%);width:64%;z-index:2;filter:drop-shadow(0 8px 14px rgba(0,0,0,.32));}
   .meta{display:flex;justify-content:space-between;width:min(96vw,1100px);font-size:11.5px;color:var(--mut);font-variant-numeric:tabular-nums;}
@@ -214,6 +219,11 @@ function drawRoomRulers(){
   const side=Math.max(180, Math.min(availW, availH));
   room.style.width=side+'px'; room.style.height=side+'px';
   const ppi=side/WALL_INCHES;
+  // vertical pinstripe lines at each pattern-repeat boundary + a repeat count
+  const repPx=scaleInches*ppi, nRep=WALL_INCHES/scaleInches;
+  const rep=document.getElementById('repeats');
+  if(rep){ let s=''; for(let x=0; x<=side+0.5; x+=repPx){ const edge=(x<1||x>side-1); s+=`<div class="vline${edge?' edge':''}" style="left:${x.toFixed(1)}px"></div>`; } rep.innerHTML=s; }
+  const badge=document.getElementById('repbadge'); if(badge) badge.textContent=`↔ ${nRep.toFixed(nRep%1?1:0)} repeats × ${scaleInches}″`;
   const fmt=v=>{const f=Math.floor(v/12), i=Math.round(v%12); return i?`${f}′${i}″`:`${f}′`;};
   const tag=document.getElementById('roomtag'); if(tag) tag.textContent=`room setting · ${fmt(WALL_INCHES)} × ${fmt(WALL_INCHES)} room (ft·in)`;
   const rh=document.getElementById('roomRulerH');
@@ -312,6 +322,8 @@ function render(){
         <div class="roomrow">
           <div class="room" id="room">
             <div class="wall" style="background-image:url('${src}')"></div>
+            <div class="repeats" id="repeats"></div>
+            <div class="repbadge" id="repbadge"></div>
             <div class="rruler h" id="roomRulerH"></div>
             <div class="rruler v" id="roomRulerV"></div>
             <div class="baseboard"></div><div class="floor"></div>

← 39a931a curator: 24/36/54 widths + 12x12 sq room (fix 0x0 wall) + dr · back to Wallco Ai · drunk-curator: click pattern to enlarge (1x/2x/3x repeat lig 152132e →