From bc21d380b04efc7fd89715e13d45ad1c3662b7f0 Mon Sep 17 00:00:00 2001 From: Craig Jennings Date: Mon, 13 Jul 2026 00:35:50 -0500 Subject: feat(gallery): slide-rule unit stops, zoom-safe clicks, and four faces MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Clicks compared e.clientX (visual px, scaled by the size toggle's CSS zoom) against layout-px mark coordinates, so at M or L size nearest-mark snapping picked the wrong stop, usually the far end — the dial felt impossible to select. The click handler now divides the zoom out (offsetWidth over rect width), and the widget shows a subtle outline on click focus so it reads as armed for arrow keys. The printed numerals are now majors with minor ticks at the integer units between them, all selectable: click a numeral, a mark, or between marks, and arrows step one unit instead of one numeral. The spec sheet claimed drag-only input, which was never true; it now names the click and key idioms. The face rides new --tn-* vars and GW.slideRule gains opts.skin plus setStyle backed by GW.slideRule.STYLES: warm backlit (shipped default), chrome with dark ink, 80s black glass with an LED-red needle, and marantz blue with a pale needle. Card 25 joins the styleChips rig. --- docs/prototypes/panel-widget-gallery.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'docs/prototypes/panel-widget-gallery.html') diff --git a/docs/prototypes/panel-widget-gallery.html b/docs/prototypes/panel-widget-gallery.html index 654ffd5..9740c46 100644 --- a/docs/prototypes/panel-widget-gallery.html +++ b/docs/prototypes/panel-widget-gallery.html @@ -387,7 +387,7 @@ const INFO={ limits:'Stepping is sequential — jumping to a far position takes several clicks.', origin:'Rotary switches on radios and instruments.',difficulty:'Intuitive.', prefer:'The selection should read like hardware, not a menu.'}, -'25':{input:'Drag to slide the cursor. Drag-only — needs a key idiom for Emacs.', +'25':{input:'Click a numeral, a mark, or between marks for the units; focused, arrows step one unit. Click + keys.', solves:'Reading a value against a long calibrated scale.', use:'Specialty. Shines where the scale itself carries meaning.', limits:'Scale literacy required; poor for quick setting.', @@ -1146,7 +1146,7 @@ card(C,'24','Rotary selector', 'pick one of N by position. Printed detents, the pointer names the value. Click to turn; readout shows it.'); card(C,'25','Slide-rule dial', (st,rd)=>GW.slideRule(st,{onChange:(v,t)=>rd(t)}), - 'value on a printed scale. A lit pointer glides a warm-backlit strip. Click a mark to jump, or focus it and press ←/→ (↑/↓); readout shows it.'); + 'value on a printed scale. A lit pointer glides a warm-backlit strip. Printed numerals are the majors; the units between them carry minor ticks. Click any of them to jump, or focus and press ←/→ (↑/↓) to step a unit; readout shows it. Four faces — warm backlit, chrome, 80s black glass, marantz blue — on the chips below.'); card(C,'N01','Rocker power switch', (st,rd)=>GW.rocker(st,{on:true,onChange:(v,t)=>rd(t)}), 'hard on / off, lit legend. A master power paddle — the pressed half glows. Click to rock.'); @@ -1606,6 +1606,7 @@ function styleChips(no,STYLES,AXES){ styleChips('01',GW.slideToggle.STYLES,[['on','on','amber'],['off','off','dark'],['off text','offText','white'],['thumb','thumb','light']]); styleChips('R05',GW.filterBank.STYLES,[['panel','panel','silver'],['shape','caps','block'],['color','capColor','black']]); styleChips('06',GW.segmented.STYLES,[['accent','accent','amber']]); +styleChips('25',GW.slideRule.STYLES,[['face','skin','warm']]); /* final tally pass: setV fires per card during build, but each card is still detached at that moment, so the running counts lag by one — recount now */ -- cgit v1.2.3