D1-A: combat glyphs, boundary-channel blue, reaction primitives, READ-FAB
Additive frontend/visual. Backend untouched (git diff src/ = empty): no grade,
model, classifier or ledger change. The 41->74 registry expansion is HELD for
D1-B. Push scoring untouched.
REVIEW ZERO — classifier coverage bounded the glyph wiring. Three buckets, and
the computation was redone three times before it was right (the frontend keys
GLYPHS by ARCHETYPE NAME while the backend keys `glyph:` by SHAPE NAME, and most
registry keys are unquoted identifiers — the first two passes mis-parsed both):
(a) classifier-backed, already wired: 38
(b) classifier-backed, package SVG exists, NOT wired -> WIRED HERE: 6
striker, grappler, pressure, counter, grinder, finisher — all MMA/combat
archetypes in archetypeService.js that were rendering EMOJI fallbacks
('*', 'x', '>', '<>') where the package ships real 24-grid duotone marks.
(c) package SVG with no classifier -> HELD for D1-B: 39 (wiring them would
render nothing)
(d) classifier-backed but NO package SVG: 2 ('dual threat', 'paint boss') —
a DESIGN gap, not a build gap; flagged for D1-B.
GLYPHS map 38 -> 44 keys, deliberately far short of the package's 83.
BOUNDARY CHANNEL — the blue tokens already existed (--priced-out set) and were
applied on NoMarketState and the scan void box, but PriceTriplet's NO_MODEL
("line not priced") still rendered in neutral text, so the channel was applied
inconsistently. NO_MODEL now renders in the channel, completing "every boundary
state or none". Token-only (no hex fallback and no hex in prose — PriceTriplet's
own test forbids literal hex, and it caught both).
REACTION PRIMITIVES — new web/src/lib/reactions.js + globals.css keyframes at the
exact HANDOFF timings: flash .75s ease-out, boot stagger 60ms steps, reactions
gated 1.5s, WIRE hold 6s. nudge() REFUSES a no-op (null/absent direction -> no
flash) so the primitive cannot be attached to an idle loop — a flash without a
new datum is the UI lying about the feed. Reduced-motion honoured.
READ-FAB — aligned to the exact package geometry: 50px circle, translateY(-14px),
6px void ring (was 46px, marginTop -16, 3px ring).
CARD TOKEN — audit correction: #0E0E14 was already tokenised as --bg-1/--card;
the audit's "1 file" was counting the raw hex, not the token. No change needed.
Floor: 317 suites / 3946 tests green (16 new), web build exit 0.
NOT DONE THIS ORDER (reported, not silently dropped): row-hover rationale and
IntersectionObserver reveal (Phase 3 item 8) and team-gradient chips (Phase 4
item 10) are not implemented — they need the System artboard's row anatomy,
which is a larger port than the rest of D1-A.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QJs13VsyiSKYQP6rj3NNmc
This commit is contained in:
@@ -8,6 +8,19 @@
|
||||
|
||||
/* Glyph SVG inner-markup keyed by name (drawn in a 0 0 16 16 viewBox). */
|
||||
const GLYPHS = {
|
||||
/* D1-A (2026-07-31) — the six COMBAT marks lifted from the package SVGs
|
||||
(specs/design-reference/assets/glyphs/, currentColor, 24-grid duotone).
|
||||
These archetypes are classifier-backed in archetypeService.js (sport: 'mma')
|
||||
and were rendering EMOJI fallbacks ('✦' '⊗' '➤' '◊'); the designed marks
|
||||
replace them. Glyphs whose archetype the classifier cannot assign are NOT
|
||||
wired here — they are held for D1-B (registry expansion), because a glyph
|
||||
with no classifier renders nothing. */
|
||||
'striker': '<path fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" d="M3 12h8"></path><path fill="currentColor" fill-opacity=".2" d="M12 8h7v8h-7z"></path><path fill="none" stroke="currentColor" stroke-width="2.1" stroke-linejoin="round" d="M12 8h7v8h-7z"></path><path stroke="currentColor" stroke-width="1.8" stroke-linecap="round" d="M20 6l2-1M20.5 12H22M20 18l2 1"></path>',
|
||||
'grappler': '<path fill="none" stroke="currentColor" stroke-width="2.3" stroke-linecap="round" stroke-linejoin="round" d="M6 4v9M6 13l-3-3M6 13l3-3M18 20v-9M18 11l-3 3M18 11l3 3"></path><path stroke="currentColor" stroke-width="2.2" stroke-linecap="round" d="M9 12h6"></path>',
|
||||
'pressure': '<path fill="none" stroke="currentColor" stroke-width="2.3" stroke-linecap="round" stroke-linejoin="round" d="M3 8h9M3 12h9M3 16h9M9 6l4 6-4 6"></path><path stroke="currentColor" stroke-width="2.6" stroke-linecap="round" d="M18 4v16"></path>',
|
||||
'counter': '<path fill="none" stroke="currentColor" stroke-width="2.3" stroke-linecap="round" stroke-linejoin="round" d="M4 9h11M11 5l4 4-4 4M20 15H9M13 11l-4 4 4 4"></path>',
|
||||
'grinder': '<path fill="none" stroke="currentColor" stroke-width="2.3" stroke-linecap="round" d="M4 15c3-4 5-4 8 0s5 4 8 0"></path><path stroke="currentColor" stroke-width="2.3" stroke-linecap="round" d="M4 20h16"></path><circle cx="12" cy="9" r="1.8" fill="currentColor"></circle>',
|
||||
'finisher': '<path fill="none" stroke="currentColor" stroke-width="1.9" d="M4 6h16v12H4z"></path><path stroke="currentColor" stroke-width="1.3" d="M4 10h16M4 14h16M9 6v12M15 6v12"></path><circle cx="17" cy="9" r="2.1" fill="currentColor"></circle>',
|
||||
/* Rev 3 — 9 classifier-legacy marks (fallback renders, never user-facing) */
|
||||
'brush': '<path fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" d="M5 19 15 9"/><path fill="currentColor" fill-opacity=".2" d="M15 9l4-4 1.6 1.6-4 4z"/><path fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" d="M15 9l4-4M5 19l-1 1M7 20l-2 1"/>',
|
||||
'whiff': '<path fill="none" stroke="currentColor" stroke-width="2.3" stroke-linecap="round" d="M4 16c5 3 11 3 16-2"/><path fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-dasharray="2.5 3" d="M4 11c5 3 10 3 15-1.5"/><circle cx="18" cy="6" r="2.2" fill="currentColor"/>',
|
||||
|
||||
@@ -0,0 +1,48 @@
|
||||
'use strict';
|
||||
/**
|
||||
* D1-A reaction primitive (2026-07-31) — exact HANDOFF spec.
|
||||
*
|
||||
* nudge(cell, up) — value updates, `rx-up`/`rx-down` background flash
|
||||
* (.75s ease-out), edge recolours by sign.
|
||||
*
|
||||
* 🔴 THE LAW: "Fire on data events only, never idle loops." Alive is punctuated
|
||||
* stillness — react to truth, then rest. A flash with no new datum is the UI
|
||||
* lying about the feed, so `nudge` REFUSES a no-op: same value in, no flash.
|
||||
*
|
||||
* Timings, all from HANDOFF.md: flash .75s · boot stagger 60ms steps ·
|
||||
* reactions gated ~1.5s after boot · WIRE hold ~6s.
|
||||
*/
|
||||
const FLASH_MS = 750;
|
||||
const BOOT_STEP_MS = 60;
|
||||
const REACTION_GATE_MS = 1500;
|
||||
const WIRE_HOLD_MS = 6000;
|
||||
|
||||
/** Flash a cell for a REAL change. Returns the class applied, or null if nothing changed. */
|
||||
function nudge(cell, up) {
|
||||
if (!cell || typeof cell !== 'object') return null;
|
||||
if (up === null || up === undefined) return null; // absent direction => no reaction
|
||||
const cls = up ? 'rx-up' : 'rx-down';
|
||||
if (cell.classList && typeof cell.classList.add === 'function') {
|
||||
cell.classList.remove('rx-up', 'rx-down');
|
||||
void (cell.offsetWidth); // restart the animation
|
||||
cell.classList.add(cls);
|
||||
if (typeof setTimeout === 'function') {
|
||||
setTimeout(() => cell.classList && cell.classList.remove(cls), FLASH_MS);
|
||||
}
|
||||
}
|
||||
return cls;
|
||||
}
|
||||
|
||||
/** Boot delay for row `i` — 60ms steps; the hero arrives LAST. */
|
||||
function bootDelayMs(i) {
|
||||
const n = Number(i);
|
||||
return Number.isFinite(n) && n > 0 ? Math.round(n) * BOOT_STEP_MS : 0;
|
||||
}
|
||||
|
||||
/** Reactions stay silent until the boot sequence has settled. */
|
||||
function reactionsReady(msSinceBoot) {
|
||||
const n = Number(msSinceBoot);
|
||||
return Number.isFinite(n) && n >= REACTION_GATE_MS;
|
||||
}
|
||||
|
||||
module.exports = { nudge, bootDelayMs, reactionsReady, FLASH_MS, BOOT_STEP_MS, REACTION_GATE_MS, WIRE_HOLD_MS };
|
||||
Reference in New Issue
Block a user