diff options
| -rw-r--r-- | scripts/theme-studio/app.js | 1 | ||||
| -rw-r--r-- | scripts/theme-studio/browser-gates.js | 11 | ||||
| -rw-r--r-- | scripts/theme-studio/theme-studio.html | 12 | ||||
| -rw-r--r-- | todo.org | 6 |
4 files changed, 30 insertions, 0 deletions
diff --git a/scripts/theme-studio/app.js b/scripts/theme-studio/app.js index 126926fec..fea46f227 100644 --- a/scripts/theme-studio/app.js +++ b/scripts/theme-studio/app.js @@ -1128,6 +1128,7 @@ function cellVal(td){if(!td)return '';const dd=td.querySelector('.cdd');if(dd)re function srtTable(tbId,col){tableSort[tbId]={col,asc:!(tableSort[tbId]&&tableSort[tbId].col===col&&tableSort[tbId].asc)};applyTableSort(tbId);} function applyTableSort(tbId){const s=tableSort[tbId];if(!s)return;const tb=document.getElementById(tbId);if(!tb)return;const dir=s.asc?1:-1;const r=[...tb.rows];r.sort((a,b)=>{const x=cellVal(a.cells[s.col]),y=cellVal(b.cells[s.col]);return ((typeof x==='number'&&typeof y==='number')?x-y:(x<y?-1:x>y?1:0))*dir;});r.forEach(x=>tb.appendChild(x));} function initApp(){ + paletteShowFull=false; // open collapsed to base colors; the arrow expands the spans buildLangSel();buildViewSel();renderPalette();rebuildColorTables();renderCode();applyGround(); initGeneratorControls(); updateTitle();initPicker();buildPkgPreview();syncMockHeight();syncPkgHeight(); diff --git a/scripts/theme-studio/browser-gates.js b/scripts/theme-studio/browser-gates.js index e474cd4e5..de11bc3ee 100644 --- a/scripts/theme-studio/browser-gates.js +++ b/scripts/theme-studio/browser-gates.js @@ -569,6 +569,7 @@ if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if( // is left on its old (now-gone) hex. if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; + paletteShowFull=true; // this gate asserts span tiles, so render the full palette setSyntaxFg('bg','#204060');setSyntaxFg('p','#f0fef0'); PALETTE=[['#204060','bg'],['#f0fef0','fg']]; setGroundSpan(2); @@ -839,10 +840,20 @@ if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(cluster&&cluster.querySelectorAll('.sbtn').length===4,'four-style-buttons-in-cluster'); document.title='STYLETEST '+(ok?'PASS':'FAIL'); const d=document.createElement('div');d.id='styletest';d.textContent='STYLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} +// Palette default-state gate (open with #paldefaulttest): the studio opens with +// the palette collapsed to base colors so the span tints don't crowd the first +// view. initApp() ran at page load, so the live toggle reflects the opening state. +if(location.hash==='#paldefaulttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; + const tg=document.getElementById('paltoggle'); + A(!!tg,'palette toggle present after boot'); + A(tg&&tg.textContent==='▶','palette opens collapsed to base colors (arrow shows right-pointing ▶)'); + document.title='PALDEFAULTTEST '+(ok?'PASS':'FAIL'); + const d=document.createElement('div');d.id='paldefaulttest';d.textContent='PALDEFAULTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} // Palette display-toggle gate (open with #paltoggletest): the arrow control // collapses each column to its base color and expands back to full spans. if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; const saveP=PALETTE.slice(),saveM=Object.assign({},MAP); + paletteShowFull=true; // start expanded so the first click collapses to base-only setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground']]; regenColumn('#67809c',2,{ground:groundPair()}).members.forEach(m=>PALETTE.push([m.hex,m.offset===0?'blue':'blue'+(m.offset>0?'+'+m.offset:m.offset),'blue'])); diff --git a/scripts/theme-studio/theme-studio.html b/scripts/theme-studio/theme-studio.html index 6459960dd..8b8a5f75c 100644 --- a/scripts/theme-studio/theme-studio.html +++ b/scripts/theme-studio/theme-studio.html @@ -2747,6 +2747,7 @@ function cellVal(td){if(!td)return '';const dd=td.querySelector('.cdd');if(dd)re function srtTable(tbId,col){tableSort[tbId]={col,asc:!(tableSort[tbId]&&tableSort[tbId].col===col&&tableSort[tbId].asc)};applyTableSort(tbId);} function applyTableSort(tbId){const s=tableSort[tbId];if(!s)return;const tb=document.getElementById(tbId);if(!tb)return;const dir=s.asc?1:-1;const r=[...tb.rows];r.sort((a,b)=>{const x=cellVal(a.cells[s.col]),y=cellVal(b.cells[s.col]);return ((typeof x==='number'&&typeof y==='number')?x-y:(x<y?-1:x>y?1:0))*dir;});r.forEach(x=>tb.appendChild(x));} function initApp(){ + paletteShowFull=false; // open collapsed to base colors; the arrow expands the spans buildLangSel();buildViewSel();renderPalette();rebuildColorTables();renderCode();applyGround(); initGeneratorControls(); updateTitle();initPicker();buildPkgPreview();syncMockHeight();syncPkgHeight(); @@ -3325,6 +3326,7 @@ if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if( // is left on its old (now-gone) hex. if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; + paletteShowFull=true; // this gate asserts span tiles, so render the full palette setSyntaxFg('bg','#204060');setSyntaxFg('p','#f0fef0'); PALETTE=[['#204060','bg'],['#f0fef0','fg']]; setGroundSpan(2); @@ -3595,10 +3597,20 @@ if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(cluster&&cluster.querySelectorAll('.sbtn').length===4,'four-style-buttons-in-cluster'); document.title='STYLETEST '+(ok?'PASS':'FAIL'); const d=document.createElement('div');d.id='styletest';d.textContent='STYLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} +// Palette default-state gate (open with #paldefaulttest): the studio opens with +// the palette collapsed to base colors so the span tints don't crowd the first +// view. initApp() ran at page load, so the live toggle reflects the opening state. +if(location.hash==='#paldefaulttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; + const tg=document.getElementById('paltoggle'); + A(!!tg,'palette toggle present after boot'); + A(tg&&tg.textContent==='▶','palette opens collapsed to base colors (arrow shows right-pointing ▶)'); + document.title='PALDEFAULTTEST '+(ok?'PASS':'FAIL'); + const d=document.createElement('div');d.id='paldefaulttest';d.textContent='PALDEFAULTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} // Palette display-toggle gate (open with #paltoggletest): the arrow control // collapses each column to its base color and expands back to full spans. if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; const saveP=PALETTE.slice(),saveM=Object.assign({},MAP); + paletteShowFull=true; // start expanded so the first click collapses to base-only setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground']]; regenColumn('#67809c',2,{ground:groundPair()}).members.forEach(m=>PALETTE.push([m.hex,m.offset===0?'blue':'blue'+(m.offset>0?'+'+m.offset:m.offset),'blue'])); @@ -44,6 +44,12 @@ Tags are additive. For example, a small wrong-behavior fix can be =:bug:quick:=, and a feature that requires internal restructuring can be =:feature:refactor:=. * Emacs Open Work +** DONE [#C] theme-studio: open with the palette collapsed to base colors :feature:studio:next: +CLOSED: [2026-06-16 Tue] +Every time theme-studio opens, the palette shows all colors including the span tints. Instead it should open showing the base colors only, and the user expands the spans by clicking the left-side arrow menu. From the roam inbox 2026-06-16. Craig: "just do it. :)" +Done 2026-06-16: initApp sets paletteShowFull=false before the first render, so the studio opens collapsed (arrow ▶); the existing toggle expands the spans. New #paldefaulttest gate asserts the opening collapsed state; #counttest and #paltoggletest now opt into full mode explicitly since they assert span tiles. Full suite green. +** TODO [#C] theme-studio: custom view-assignment dropdown with lock indicators :feature:studio:next: +The view-assignment dropdown is a plain HTML menu. Make it a custom menu colored like the other custom menus, and have it indicate which assignment views have all their elements locked, so the user knows when a view's assignments are done. From the roam inbox 2026-06-16. ** DONE [#C] theme-studio: realistic markdown-mode preview :feature:studio: CLOSED: [2026-06-16 Tue] markdown-mode fell back to the generic preview (face names in their own colors). Built renderMarkdownPreview (app.js): a realistic README exercising 28 markdown faces in context (front matter, H1-H3, bold/italic, inline + fenced code with a language tag, links + bare URLs, lists + GFM checkboxes, blockquote + footnote, table, hr, strikethrough, highlight, math, inline HTML, comment). Routed via a PREVIEW_KEYS map in app_inventory.py (markdown-mode -> markdown). #mdtest gate validates every data-face is a real markdown face; full theme-studio suite green. Commit =0682b24f=, pushed. Visual sign-off is a VERIFY under Manual testing and validation. |