Plant overview: header bands follow the rounded box corners
Deploy test site / deploy (push) Successful in 44s

Every machine box has rounded corners (rx 4), but its header band was
a square rect inset by 1, painted over the box. At both top corners the
band's square corner covered the inside of the curved border, so the
border looked thin and squared off there, most visibly on a selected
box. The band is now a path with top corners of radius 3, concentric
with the box.

Measured on zoomed crops in headless Edge (light theme, selected
border): border thickness along the 45-degree diagonal against the
straight edge was 0.26 to 0.42 on the Traceability box, Classic C1 and
the VEX 50; now 0.9 to 1.13. Full UI check unchanged: all press states,
47 stations, demo buttons, no overflow, canvas alignment, no errors.
This commit is contained in:
grabowski committed 2026-10-14 09:27:49 +07:00
1 parent f776025b58
commit 9b03e4de07
1 file changed
+6 -3
+6 -3
View File
@@ -299,6 +299,9 @@ const $=id=>document.getElementById(id);
const COMPACT=matchMedia('(max-height:560px)');
const L={pipes:$('lPipes'),mach:$('lMach'),tok:$('lTok'),top:$('lTop')};
function el(tag,attrs,parent,text){const e=document.createElementNS(NS,tag);for(const k in attrs)e.setAttribute(k,attrs[k]);if(text!=null)e.textContent=text;(parent||L.mach).appendChild(e);return e;}
// Machine header band: top corners rounded concentric with the box (rx 4, band inset 1, so radius 3).
// A square band paints over the inside of the curved border at both top corners.
const headD=(x,y,w)=>`M${x+1},${y+19}V${y+4}a3,3 0 0 1 3,-3H${x+w-4}a3,3 0 0 1 3,3V${y+19}Z`;
const rnd=(a,b)=>a+Math.random()*(b-a);
const jit=(v,a)=>v+(Math.random()-.5)*a;
const pick=a=>a[Math.floor(Math.random()*a.length)];
@@ -639,7 +642,7 @@ el('text',{x:1368,y:24,class:'roomlbl'},L.mach,'Stamper prep · Sibert');
function boxBase(m){const g=el('g',{class:'machine',id:'m_'+m.id});
el('rect',{x:m.x,y:m.y,width:m.w,height:m.h,rx:4,class:'mbox'},g);
el('rect',{x:m.x+1,y:m.y+1,width:m.w-2,height:18,class:'mhead'},g);
el('path',{d:headD(m.x,m.y,m.w),class:'mhead'},g);
el('text',{x:m.x+7,y:m.y+14,class:'mtitle'},g,m.t);
m.lamp=el('circle',{cx:m.x+m.w-10,cy:m.y+10,r:4,class:'lamp'},g);
if(m.s)el('text',{x:m.x+7,y:m.y+31,class:'msub'},g,m.s);
@@ -658,7 +661,7 @@ function drawSilo(m){const g=el('g',{class:'machine',id:'m_'+m.id});const {x,y,w
m.g=g;g.addEventListener('click',()=>select(m.id));}
function drawPress(m){const g=el('g',{class:'machine',id:'m_'+m.id});const {x,y,w,h}=m;
el('rect',{x,y,width:w,height:h,rx:4,class:'frame'},g);
el('rect',{x:x+1,y:y+1,width:w-2,height:18,class:'mhead'},g);
el('path',{d:headD(x,y,w),class:'mhead'},g);
el('text',{x:x+7,y:y+14,class:'mtitle'},g,m.t);
m.lamp=el('circle',{cx:x+w-10,cy:y+10,r:4,class:'lamp'},g);
el('text',{x:x+7,y:y+31,class:'msub'},g,m.s);
@@ -675,7 +678,7 @@ function drawPress(m){const g=el('g',{class:'machine',id:'m_'+m.id});const {x,y,
m.g=g;g.addEventListener('click',()=>select(m.id));}
function drawVex(m){const g=el('g',{class:'machine',id:'m_'+m.id});const {x,y,w,h}=m;
el('rect',{x,y,width:w,height:h,rx:4,class:'mbox'},g);
el('rect',{x:x+1,y:y+1,width:w-2,height:18,class:'mhead'},g);
el('path',{d:headD(x,y,w),class:'mhead'},g);
el('text',{x:x+7,y:y+14,class:'mtitle'},g,'VEX 50 extruder');
m.lamp=el('circle',{cx:x+w-10,cy:y+10,r:4,class:'lamp'},g);
m.tagEls=[el('text',{x:x+7,y:y+31,class:'msub'},g,''),el('text',{x:x+7,y:y+43,class:'msub'},g,'')];