Pup - the AI's own browser

@@ -11337,7 +11337,9 @@ select,input{background:#111b23;color:#e6edf3;border:1px solid #23303c;border-ra .mdef{position:absolute;top:4px;right:6px;font:600 8.5px 'Familjen Grotesk',sans-serif;color:#00b8b1;border:1px solid #00b8b1;border-radius:4px;padding:0 4px;letter-spacing:.04em} .mcell:hover{border-color:#8b949e} .mcell.mcur{border-color:#00b8b1;box-shadow:0 0 0 1px #00b8b1 inset}-.mic canvas{width:44px;height:44px;border-radius:7px;display:block}+.mic{position:relative;display:inline-block}+.mic canvas.mbase,.mic canvas[data-mtile],.mic canvas[data-tname],.mic img.mbase{width:44px;height:44px;border-radius:7px;display:block}+.mic .mbadge{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:5px} .texnames{display:flex;flex-wrap:wrap;gap:12px;padding-top:10px;border-top:1px solid #30363d} .srow{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid #21262d} .srow:last-child{border-bottom:none}@@ -11751,70 +11753,88 @@ function renderDlg(){ // so the strip always shows a range of name lengths. function paintThreadExamples(){   const strip=_q('#texstrip'); if(!strip) return;-  // v2.0.180 (John): the preview is the FULL 6-state matrix — mode (tiles | aumid | plain) x-  // overlay badges (on | off) — every cell live-drawn, the CURRENT state highlighted, and every-  // cell CLICKABLE to jump straight to that combination. No more guessing what a choice means.+  // v2.0.196 (John: "you are not showing TRUE icon states — why are you being lazy?"). He was+  // right: the cells were hand-drawn approximations, including the Adom-mark badge that 2.0.192+  // REMOVED from real badges. The preview is now DERIVED from the same sources as the taskbar:+  //   tiles base   = the real name-tile algorithm (drawNameTile, same code as the .ico renderer)+  //   aumid base   = /dashboard/stampicon (the REAL registered category icon for a live session)+  //   plain base   = /dashboard/baseicon  (the REAL browser exe icon)+  //   overlay      = /dashboard/badge     (the EXACT composed PNG Windows was handed)+  // Drawn fallbacks (mark-free) appear only when no live window exists to source from.   const st2=(SNAP&&SNAP.bridge&&SNAP.bridge.settings)||{};   const mode=st2.aumidIcons!=='on'?'plain':(st2.threadTiles==='on'?'tiles':'aumid');   const ovOn=st2.overlayBadges!=='off';-  const live=[];-  try{ ((SNAP&&SNAP.windows)||[]).forEach(w=>{const t=w.owner||w.ownerThread;if(t&&live.indexOf(t)<0)live.push(t);}); }catch(e){}+  const wins=(SNAP&&SNAP.windows)||[];+  const live=[]; const sidByOwner={};+  wins.forEach(function(w){const t=w.owner||w.ownerThread;const sid=w.sessionId||w.id;+    if(t&&live.indexOf(t)<0){live.push(t);} if(t&&sid&&!sidByOwner[t])sidByOwner[t]=sid;});+  const liveSid=wins.length?(wins[0].sessionId||wins[0].id||''):'';   const sampleName=live[0]||'kicad';+  const V='&v='+(typeof PAGE_VERSION!=='undefined'?PAGE_VERSION:'0');   const cells=[];   [true,false].forEach(function(ov){ ['tiles','aumid','plain'].forEach(function(m){ cells.push([m,ov]); }); });+  function baseHtml(m){+    if(m==='tiles') return '<canvas width="128" height="128" class="mbase" data-mtile="1"></canvas>';+    if(m==='aumid') return liveSid?'<img class="mbase" src="/dashboard/stampicon?session='+encodeURIComponent(liveSid)+V+'" data-fb="aumid">':'<canvas width="128" height="128" class="mbase" data-mfb="aumid"></canvas>';+    return '<img class="mbase" src="/dashboard/baseicon?profile=adom-you'+V+'" data-fb="plain">';+  }+  function badgeHtml(){+    return liveSid?'<img class="mbadge" src="/dashboard/badge?session='+encodeURIComponent(liveSid)+V+'" data-fbb="1">':'<canvas width="44" height="44" class="mbadge" data-genb="1"></canvas>';+  }   var matrixHtml='<div class="texmatrix">'+cells.map(function(c,i){     const m=c[0],ov=c[1];     const cur=(m===mode&&ov===ovOn);-    const isDefault=(m==='tiles'&&ov);   // v2.0.189 (John): flag the suggested default combination+    const isDefault=(m==='tiles'&&ov);     return '<div class="mcell'+(cur?' mcur':'')+'" data-mi="'+i+'" title="click to switch to this combination">'       +(isDefault?'<span class="mdef">default</span>':'')-      +'<div class="mic"><canvas width="128" height="128" data-mmode="'+m+'" data-mov="'+(ov?1:0)+'"></canvas></div>'+      +'<div class="mic">'+baseHtml(m)+(ov?badgeHtml():'')+'</div>'       +'<span class="texn">'+m+(ov?' + overlay':'')+(cur?' (current)':'')+'</span></div>';   }).join('')+'</div>';-  // v2.0.189 (John: "the cells are blank and I can't click them"): the name strip used to be-  // APPENDED with innerHTML+= AFTER the matrix canvases were painted and wired — which re-creates-  // the whole subtree, wiping the painted pixels and orphaning every click handler. Build ALL the-  // HTML first, assign innerHTML ONCE, then paint canvases, then bind clicks.   var namesHtml='';   var names=[];   if(mode==='tiles'){     const fill=['kicad','nb','fusion','ah build','shotlog','adom-tts','pup bridge maintenance'];     names=live.concat(fill.filter(function(f){return live.indexOf(f)<0;})).slice(0,8);-    namesHtml='<div class="texnames">'+names.map(function(n){return '<div class="tex"><canvas width="128" height="128" data-tname="'+esc(n)+'"></canvas><span class="texn">'+esc(n)+'</span></div>';}).join('')+'</div>';+    namesHtml='<div class="texnames">'+names.map(function(n){+      const sid=sidByOwner[n];+      const badge=ovOn?(sid?'<img class="mbadge" src="/dashboard/badge?session='+encodeURIComponent(sid)+V+'" data-fbb="1">':'<canvas width="44" height="44" class="mbadge" data-genb="1"></canvas>'):'';+      return '<div class="tex"><div class="mic"><canvas width="128" height="128" data-tname="'+esc(n)+'"></canvas>'+badge+'</div><span class="texn">'+esc(n)+'</span></div>';}).join('')+'</div>';   }   strip.innerHTML=matrixHtml+namesHtml;   const cap=strip.parentElement?strip.parentElement.querySelector('.texcap'):null;-  if(cap)cap.textContent='All six taskbar states, drawn by the same rules as the real icons: tiles = the thread NAME on the Adom tile; aumid = per-window pup/category icons; plain = the stock Chrome-for-Testing button, untouched. The small corner square is the overlay badge (active tab favicon + Adom mark). Click any cell to switch to it. Sample thread: "'+sampleName+'".';-  strip.querySelectorAll('canvas[data-mmode]').forEach(function(cv){-    const m=cv.getAttribute('data-mmode'), ov=cv.getAttribute('data-mov')==='1';-    const box=128, ctx=cv.getContext('2d');-    if(m==='tiles'){ drawNameTile(ctx,box,sampleName); }-    else if(m==='aumid'){-      rr(ctx,0,0,box,box,box*0.14,'#00b8b1');-      rr(ctx,box*0.18,box*0.18,box*0.64,box*0.64,box*0.1,'#053b38');-      ctx.strokeStyle='#7fe7e2';ctx.lineWidth=box*0.045;-      ctx.beginPath();ctx.arc(box/2,box/2,box*0.19,0,7);ctx.stroke();-      ctx.beginPath();ctx.ellipse(box/2,box/2,box*0.08,box*0.19,0,0,7);ctx.stroke();-      ctx.beginPath();ctx.moveTo(box*0.31,box/2);ctx.lineTo(box*0.69,box/2);ctx.stroke();-    } else {-      rr(ctx,0,0,box,box,box*0.14,'#2a2f36');-      ctx.fillStyle='#dfe3e8';ctx.beginPath();ctx.arc(box/2,box/2,box*0.30,0,7);ctx.fill();-      ctx.fillStyle='#4a90e2';ctx.beginPath();ctx.arc(box/2,box/2,box*0.17,0,7);ctx.fill();-    }-    if(ov){-      const bs=box*0.34,bx=box-bs-box*0.02,by=box*0.02;-      rr(ctx,bx,by,bs,bs,bs*0.22,'#8b5cf6');-      ctx.fillStyle='#0d1117';const r=bs*0.11;-      [[0.32,0.34],[0.66,0.34],[0.32,0.68],[0.66,0.68]].forEach(function(pt){ctx.beginPath();ctx.arc(bx+bs*pt[0],by+bs*pt[1],r,0,7);ctx.fill();});-    }+  if(cap)cap.textContent='All six taskbar states, sourced from the REAL machinery: tiles are drawn by the same code as the actual .ico; the aumid and plain bases and every overlay badge are the actual images pup registered with Windows (live window: "'+(liveSid||'none open')+'"). Click any cell to switch to it.';+  strip.querySelectorAll('canvas[data-mtile]').forEach(function(cv){ drawNameTile(cv.getContext('2d'),128,sampleName); });+  strip.querySelectorAll('canvas[data-tname]').forEach(function(cv){ drawNameTile(cv.getContext('2d'),128,cv.getAttribute('data-tname')); });+  strip.querySelectorAll('canvas[data-mfb="aumid"]').forEach(function(cv){+    const ctx=cv.getContext('2d'),box=128;+    rr(ctx,0,0,box,box,box*0.14,'#00b8b1');+    rr(ctx,box*0.18,box*0.18,box*0.64,box*0.64,box*0.1,'#053b38');+    ctx.strokeStyle='#7fe7e2';ctx.lineWidth=box*0.045;+    ctx.beginPath();ctx.arc(box/2,box/2,box*0.19,0,7);ctx.stroke();+  });+  strip.querySelectorAll('canvas[data-genb]').forEach(function(cv){+    // mark-free generic badge fallback: light card + gray globe, mirroring the compositor generic+    const ctx=cv.getContext('2d'),b=44;+    rr(ctx,0,0,b,b,b*0.16,'#f1f3f4');+    ctx.strokeStyle='#5f6368';ctx.lineWidth=2.6;+    ctx.beginPath();ctx.arc(b/2,b/2,b*0.28,0,7);ctx.stroke();+    ctx.beginPath();ctx.ellipse(b/2,b/2,b*0.12,b*0.28,0,0,7);ctx.stroke();+    ctx.beginPath();ctx.moveTo(b*0.22,b/2);ctx.lineTo(b*0.78,b/2);ctx.stroke();   });-  strip.querySelectorAll('canvas[data-tname]').forEach(function(cv){-    const ctx=cv.getContext('2d'); drawNameTile(ctx,128,cv.getAttribute('data-tname'));-    const box=128,bs=box*0.34,bx=box-bs-box*0.02,by=box*0.02;-    rr(ctx,bx,by,bs,bs,bs*0.22,'#8b5cf6');-    ctx.fillStyle='#0d1117';const r=bs*0.11;-    [[0.32,0.34],[0.66,0.34],[0.32,0.68],[0.66,0.68]].forEach(function(pt){ctx.beginPath();ctx.arc(bx+bs*pt[0],by+bs*pt[1],r,0,7);ctx.fill();});+  // real-image fallbacks: a 1x1 transparent badge (no composed overlay yet) or a failed base image+  // falls back to the drawn stand-in so a cell is never empty+  strip.querySelectorAll('img.mbadge[data-fbb]').forEach(function(im){+    im.onload=function(){ if(im.naturalWidth<=2){ swapGenB(im); } };+    im.onerror=function(){ swapGenB(im); };   });+  function swapGenB(im){+    const cv=document.createElement('canvas'); cv.width=44; cv.height=44; cv.className='mbadge';+    const ctx=cv.getContext('2d'),b=44;+    rr(ctx,0,0,b,b,b*0.16,'#f1f3f4');+    ctx.strokeStyle='#5f6368';ctx.lineWidth=2.6;+    ctx.beginPath();ctx.arc(b/2,b/2,b*0.28,0,7);ctx.stroke();+    im.replaceWith(cv);+  }   strip.querySelectorAll('.mcell').forEach(function(cell,i){     cell.onclick=function(){       const c=cells[i];