live twin gauges: speedo=SKUs normalized, tach=descriptor tags, mini=per-job counts — poll /api/stats every 3s, needles climb in real time

bad80a3379b1b438e2ea7eb933c69a56e230ba58 · 2026-07-28 09:12:44 -0700 · Steve Abrams

Files touched

M public/index.html

Diff

commit bad80a3379b1b438e2ea7eb933c69a56e230ba58
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Tue Jul 28 09:12:44 2026 -0700

    live twin gauges: speedo=SKUs normalized, tach=descriptor tags, mini=per-job counts — poll /api/stats every 3s, needles climb in real time
---
 public/index.html | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/public/index.html b/public/index.html
index 273dd36..04ff2e3 100644
--- a/public/index.html
+++ b/public/index.html
@@ -165,8 +165,8 @@ footer{text-align:center; margin-top:22px; font-size:10px; letter-spacing:3px; c
       <div class="mini-row">
         <div class="mini"><div class="m-t">STYLE</div><div class="m-v" id="mStyle">–</div></div>
         <div class="mini"><div class="m-t">MATERIAL</div><div class="m-v" id="mMat">–</div></div>
-        <div class="mini"><div class="m-t">VENDORS</div><div class="m-v" id="mVen">–</div></div>
-        <div class="mini"><div class="m-t">AVG COLORS</div><div class="m-v" id="mAvg">–</div></div>
+        <div class="mini"><div class="m-t">COLLECTION</div><div class="m-v" id="mVen">–</div></div>
+        <div class="mini"><div class="m-t">LABEL→BARE</div><div class="m-v" id="mAvg">–</div></div>
       </div>
       <div class="switches" id="switches"></div>
     </div>
@@ -293,6 +293,21 @@ function render(){
   });
 }
 
+// ---- LIVE gauge driver: re-reads /api/stats every 3s so the twin gauges climb in
+// real time as the TK-135 jobs write. Speedo=SKUs normalized, tach=descriptor tags,
+// mini-stack=per-job counts. All numbers CHANGE as work lands. ----
+async function pollStats(){
+  try{
+    const r=await fetch('/api/stats',{cache:'no-store'}); if(!r.ok)return;
+    const s=await r.json();
+    const sp=document.getElementById('gaugeSpeedo'), ta=document.getElementById('gaugeTach');
+    if(sp&&sp.__drive) sp.__drive(s.color||0);
+    if(ta&&ta.__drive) ta.__drive(s.descriptors||0);
+    const set=(id,v)=>{const e=document.getElementById(id);if(e)e.textContent=(v||0).toLocaleString();};
+    set('mStyle',s.style); set('mMat',s.material); set('mVen',s.collection); set('mAvg',s.label);
+  }catch(e){/* transient; next tick retries */}
+}
+
 // ---- collapsible glovebox (starts collapsed) ----
 document.getElementById('feedHead').onclick=()=>{
   const f=document.getElementById('feed'), c=document.getElementById('feedCar');

← 26818b3 pm2-manage the console (ecosystem.config.js, reboot-safe) · back to Corvette Dashboard Viewer · 5x sweep 1: proxy live-ticker images via /img (placeholder o 5539a5c →