From db903ea32b10ac2f8d10c7e718d81b68492225cc Mon Sep 17 00:00:00 2001 From: Craig Jennings Date: Mon, 29 Jun 2026 22:48:28 -0400 Subject: feat(theme-studio): render nov-reading preview as a book page The nov-reading app fell back to the generic preview (face names in their own colors), which doesn't show what a palette looks like. I added a renderer that draws a real book page per palette: a mock page of Hawthorne's "Dr. Heidegger's Experiment" in sepia, dark, and light, with a small-caps byline, a drop cap, and justified serif prose. Each page takes its background and foreground from its palette face, so tuning a palette repaints its page. --- scripts/theme-studio/app.js | 1 + scripts/theme-studio/previews.js | 23 +++++++++++++++++++++++ scripts/theme-studio/theme-studio.html | 24 ++++++++++++++++++++++++ 3 files changed, 48 insertions(+) diff --git a/scripts/theme-studio/app.js b/scripts/theme-studio/app.js index bcba9c4c7..75ff9f581 100644 --- a/scripts/theme-studio/app.js +++ b/scripts/theme-studio/app.js @@ -561,6 +561,7 @@ const PACKAGE_PREVIEWS={ org:renderOrgPreview,magit:renderMagitPreview,elfeed:renderElfeedPreview,eat:renderEatPreview, dashboard:renderDashboardPreview,mu4e:renderMu4ePreview,gnus:renderGnusPreview,orgfaces:renderOrgFacesPreview,lsp:renderLspPreview,gitgutter:renderGitGutterPreview, flycheck:renderFlycheckPreview,dired:renderDiredPreview,dirvish:renderDirvishPreview,calibredb:renderCalibredbPreview, + novreading:renderNovReadingPreview, erc:renderErcPreview,orgdrill:renderOrgdrillPreview,orgnoter:renderOrgnoterPreview,signel:renderSignelPreview, pearl:renderPearlPreview,slack:renderSlackPreview,telega:renderTelegaPreview,shr:renderShrPreview, nerdicons:renderNerdIconsPreview diff --git a/scripts/theme-studio/previews.js b/scripts/theme-studio/previews.js index 72bf242e2..e6d740eea 100644 --- a/scripts/theme-studio/previews.js +++ b/scripts/theme-studio/previews.js @@ -468,6 +468,29 @@ function renderShrPreview(){const a='shr',L=[]; L.push(os(a,'shr-text','some ')+os(a,'shr-code','inline_code()')+os(a,'shr-text',', a ')+os(a,'shr-mark','highlighted mark')+os(a,'shr-text',', ')+os(a,'shr-strike-through','struck out')+os(a,'shr-text',', a footnote')+os(a,'shr-sup','[1]')+os(a,'shr-text',',')); L.push(os(a,'shr-text','an ')+os(a,'shr-abbreviation','HTML')+os(a,'shr-text',' abbreviation, and an ')+os(a,'shr-sliced-image','[image]')+os(a,'shr-text',' slice.')); return previewLines(L);} +// nov-reading: a realistic book page per palette, not the line-based format. +// Each palette face supplies the page bg+fg (via ofs); the serif typography and +// hierarchy are CSS so the preview reads like an actual novel page. Tuning a +// palette face repaints its page. data-owner-app/-face keep face-locate working. +function novReadingPage(a,face,label){ + const cls=isLocateOnPane(a,curApp())?' class="locate-onpane"':''; + const title=attresc(formatLocateTitle(locateFaceMeta(a,face,LOCATE_REG))); + const page=ofs(a,face)+";width:34em;max-width:100%;border-radius:6px;box-shadow:0 1px 8px #0007;padding:24px 30px 18px;font:13pt/1.62 Georgia,'Times New Roman',serif"; + return `
` + +`
Nathaniel Hawthorne · Twice-Told Tales
` + +`
Dr. Heidegger’s Experiment
` + +`

` + +`T` + +`hat very singular man, old Dr. Heidegger, once invited four venerable friends to meet him in his study. There were three white-bearded gentlemen, Mr. Medbourne, Colonel Killigrew, and Mr. Gascoigne, and a withered gentlewoman whose name was the Widow Wycherly.

` + +`

They were all melancholy old creatures, who had been unfortunate in life, and whose greatest misfortune it was that they were not long ago in their graves. If the powder be genuine, said the doctor, the rose of half a century should bloom again.

` + +`
${esc(label)} · 12
` + +`
`;} +function renderNovReadingPreview(){ + const a='nov-reading',faces=(APPS[a]&&APPS[a].faces)||[]; + if(!faces.length)return genericPreview(a); + let h='
'; + for(const row of faces)h+=novReadingPage(a,row[0],row[1]); + return h+'
';} function renderSlackPreview(){const a='slack',L=[]; L.push(os(a,'slack-room-info-title-room-name-face','#general')+' '+os(a,'slack-room-info-title-face','Acme Workspace')); L.push(os(a,'slack-room-info-section-title-face','Topic')+' '+os(a,'slack-room-info-section-label-face','daily standup')+' '+os(a,'slack-room-unread-face','3 unread')); diff --git a/scripts/theme-studio/theme-studio.html b/scripts/theme-studio/theme-studio.html index e71658f62..e3d88a46a 100644 --- a/scripts/theme-studio/theme-studio.html +++ b/scripts/theme-studio/theme-studio.html @@ -3136,6 +3136,29 @@ function renderShrPreview(){const a='shr',L=[]; L.push(os(a,'shr-text','some ')+os(a,'shr-code','inline_code()')+os(a,'shr-text',', a ')+os(a,'shr-mark','highlighted mark')+os(a,'shr-text',', ')+os(a,'shr-strike-through','struck out')+os(a,'shr-text',', a footnote')+os(a,'shr-sup','[1]')+os(a,'shr-text',',')); L.push(os(a,'shr-text','an ')+os(a,'shr-abbreviation','HTML')+os(a,'shr-text',' abbreviation, and an ')+os(a,'shr-sliced-image','[image]')+os(a,'shr-text',' slice.')); return previewLines(L);} +// nov-reading: a realistic book page per palette, not the line-based format. +// Each palette face supplies the page bg+fg (via ofs); the serif typography and +// hierarchy are CSS so the preview reads like an actual novel page. Tuning a +// palette face repaints its page. data-owner-app/-face keep face-locate working. +function novReadingPage(a,face,label){ + const cls=isLocateOnPane(a,curApp())?' class="locate-onpane"':''; + const title=attresc(formatLocateTitle(locateFaceMeta(a,face,LOCATE_REG))); + const page=ofs(a,face)+";width:34em;max-width:100%;border-radius:6px;box-shadow:0 1px 8px #0007;padding:24px 30px 18px;font:13pt/1.62 Georgia,'Times New Roman',serif"; + return `
` + +`
Nathaniel Hawthorne · Twice-Told Tales
` + +`
Dr. Heidegger’s Experiment
` + +`

` + +`T` + +`hat very singular man, old Dr. Heidegger, once invited four venerable friends to meet him in his study. There were three white-bearded gentlemen, Mr. Medbourne, Colonel Killigrew, and Mr. Gascoigne, and a withered gentlewoman whose name was the Widow Wycherly.

` + +`

They were all melancholy old creatures, who had been unfortunate in life, and whose greatest misfortune it was that they were not long ago in their graves. If the powder be genuine, said the doctor, the rose of half a century should bloom again.

` + +`
${esc(label)} · 12
` + +`
`;} +function renderNovReadingPreview(){ + const a='nov-reading',faces=(APPS[a]&&APPS[a].faces)||[]; + if(!faces.length)return genericPreview(a); + let h='
'; + for(const row of faces)h+=novReadingPage(a,row[0],row[1]); + return h+'
';} function renderSlackPreview(){const a='slack',L=[]; L.push(os(a,'slack-room-info-title-room-name-face','#general')+' '+os(a,'slack-room-info-title-face','Acme Workspace')); L.push(os(a,'slack-room-info-section-title-face','Topic')+' '+os(a,'slack-room-info-section-label-face','daily standup')+' '+os(a,'slack-room-unread-face','3 unread')); @@ -3288,6 +3311,7 @@ const PACKAGE_PREVIEWS={ org:renderOrgPreview,magit:renderMagitPreview,elfeed:renderElfeedPreview,eat:renderEatPreview, dashboard:renderDashboardPreview,mu4e:renderMu4ePreview,gnus:renderGnusPreview,orgfaces:renderOrgFacesPreview,lsp:renderLspPreview,gitgutter:renderGitGutterPreview, flycheck:renderFlycheckPreview,dired:renderDiredPreview,dirvish:renderDirvishPreview,calibredb:renderCalibredbPreview, + novreading:renderNovReadingPreview, erc:renderErcPreview,orgdrill:renderOrgdrillPreview,orgnoter:renderOrgnoterPreview,signel:renderSignelPreview, pearl:renderPearlPreview,slack:renderSlackPreview,telega:renderTelegaPreview,shr:renderShrPreview, nerdicons:renderNerdIconsPreview -- cgit v1.2.3