Fix v3 Songs A–Z rail: reliable taps, precise drag, hittable size#653
Merged
Conversation
byrongamatos
added a commit
that referenced
this pull request
Jul 2, 2026
…review) Right- or middle-clicking the A–Z rail (or a secondary multi-touch pointer) no longer triggers a seek; only the primary tap/drag scrubs. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
byrongamatos
added a commit
that referenced
this pull request
Jul 2, 2026
…review) Right- or middle-clicking the A–Z rail (or a secondary multi-touch pointer) no longer triggers a seek; only the primary tap/drag scrubs. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
byrongamatos
force-pushed
the
fix/v3-az-rail-pointer-scrub
branch
from
July 2, 2026 11:53
78fb9bb to
ff54ae4
Compare
Follow-up to #634. Three rail bugs reported on macOS + Windows (0.3.0, 2026-06-29 — =Scr4tch=, MajorMokoto): - Taps often did nothing ("clicked O, nothing happened"). pointerdown calls setPointerCapture, after which the browser retargets the follow-up click to the rail container, so the click handler's closest('.v3-azrail-letter') resolved null and a plain tap (no pointermove) had no other path. Drive the jump from pointerdown itself; reduce the click handler to keyboard activation only (e.detail === 0, Enter/Space). - A drag landed short of the release ("where you release isn't where you get sent"). Every letter crossed fired jumpToLetter with behavior:'smooth'; stacked smooth-scroll animations over the virtualized grid lagged and settled imprecisely. jumpToLetter now takes a smooth flag and scrolls instantly ('auto') while scrubbing, animating only discrete taps/keyboard jumps, so the grid tracks the finger and the release lands on the let-go letter. - The rail was too small at 1440p and didn't scale. Letters were a fixed .62rem glued at right:2px (~13px-tall target). They now scale with the viewport (clamp(.72rem, 1.4vh, 1.05rem)), sit off the edge with taller/wider equal-width hit targets and a hover/active highlight so the scrub target is visible. Keyboard arrow-nav and present-letter gating are unchanged. Tests: tests/js/v3_az_rail.test.js gains pointerdown-seek, keyboard-only click guard, and instant-vs-smooth assertions (809 JS tests; the 13 pre-existing unrelated failures are unchanged). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QbexxfTt8q2tAn436MqGWF
…review) Right- or middle-clicking the A–Z rail (or a secondary multi-touch pointer) no longer triggers a seek; only the primary tap/drag scrubs. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
byrongamatos
force-pushed
the
fix/v3-az-rail-pointer-scrub
branch
from
July 2, 2026 11:59
ff54ae4 to
056f9d5
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Follow-up to #634 (the A–Z fast-scroll rail). Three bugs reported on macOS + Windows (0.3.0, 2026-06-29 — =Scr4tch=, MajorMokoto):
Root causes & fixes
All in
static/v3/songs.js(bindRailOnce/jumpToLetter) +static/v3/v3.css(.v3-azrail).Taps often did nothing.
pointerdowncallssetPointerCapture, after which the browser retargets the follow-upclickto the rail container — so the click handler'sclosest('.v3-azrail-letter')resolvednull, and a plain tap (nopointermove) had no other code path → no-op. The jump is now driven frompointerdownitself (seek on press); theclickhandler is reduced to keyboard activation only (e.detail === 0, i.e. Enter/Space).A drag landed short of the release. Every letter crossed fired
jumpToLetterwithbehavior:'smooth'; stacked smooth-scroll animations over the virtualized grid lagged and settled imprecisely.jumpToLetter(letter, smooth)now scrolls instantly ('auto') while scrubbing and animates only discrete taps/keyboard jumps — so the grid tracks the finger and the release lands on the let-go letter.Too small / didn't scale. Letters were a fixed
.62remglued atright:2px(~13px-tall target on the screen edge). They now scale with the viewport (clamp(.72rem, 1.4vh, 1.05rem)), sit off the edge with taller/wider equal-width hit targets and a hover/active highlight so the scrub target is visible. The short-viewport media query is kept (clamped).Keyboard arrow-nav and present-letter gating are unchanged.
Testing
tests/js/v3_az_rail.test.jsgains assertions pinning: pointerdown-seek, the keyboard-only (detail === 0) click guard, and instant-vs-smooth scrolling.main(colour-facade / viz-attribution / loop-seek; unrelated to the rail) and unchanged by this PR.node --check static/v3/songs.jspasses.🤖 Generated with Claude Code
https://claude.ai/code/session_01QbexxfTt8q2tAn436MqGWF