discoman/python-tdd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

position circles: rich .tt-pos-* hover tooltips on the gate-view + table circles — @handle/title/seat-sig/shoptalk/#tokens/expiry portal + CARTE me-also ?seat switch href — TDD

Browse Source 
Workstream A of the position-circle tooltips sprint (green; B/C ride @skip-ped).

The numbered gate-position circles (1-6) gain rich hover tooltips mirroring the My Buds bud tooltip on every surface — and now render on room_gate.html (the GATE VIEW), which showed no circles before (the headline gap).

- _gate_positions(room, user, current_slot): per-circle .tt-pos-* state class (empty / gamer / gamer+bud / me-current / me-also) + data-tt-* payload (@handle via at_handle NOT email, title, seat significator rank/suit, bud shoptalk, deposited #tokens [CARTE slots_claimed else 1], seat-clock cost_current_until expiry). _viewer_current_slot resolves the viewer's acting seat (?seat override or canonical) to split me-current vs me-also.
- room_gate view merges _gate_context so _table_positions renders there; room_view threads ?seat into _role_select_context.
- _table_positions.html: .tt-pos-* appended AFTER role-assigned (keeps the 'gate-slot filled role-assigned' substring + class-before-data-slot regex intact for RoleSelectRenderingTest), data-tt-* attrs, me-also ?seat switch anchor.
- #id_position_tooltip_portal (page-root, position:fixed) + position-tooltip.js (hover/clamp/union-hide modeled on tray-tooltip.js); .tt-sign rank+suit stack; .tt-pos-* circle accents; room-gate pointer-events re-enable.

Tests: 7 PositionTooltipTest + 2 CarteSeatSwitchTest (tokens, me-also href) FTs green; 8 fast render-level ITs (PositionTooltip{,Carte}RenderTest); full suite 1598 green.

[[project-position-circle-tooltips]]

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-06-01 12:13:09 -04:00
parent 19471662ff
commit 30246cc94a
10 changed files with 509 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/static_src/scss/_room.scss
View File

@@ -359,6 +359,10 @@ html:has(.role-select-backdrop) .position-strip .gate-slot { pointer-events: non
// Re-enable clicks on confirm/reject/drop-token forms inside slots
html:has(.gate-backdrop) .position-strip .gate-slot form,
html:has(.gate-backdrop) .position-strip .gate-slot button { pointer-events: auto; }
// The room-gate renewal modal renders its OWN .gate-backdrop, but its
// position circles are hover-only (tooltips) and must stay live — re-enable
// them (equal specificity to the suppressor above, wins on source order).
html .room-gate-page .position-strip .gate-slot { pointer-events: auto; }
.position-strip {
position: absolute;
@@ -438,6 +442,22 @@ html:has(.gate-backdrop) .position-strip .gate-slot button { pointer-events: aut
0.05rem 0.05rem 0.5rem rgba(0, 0, 0, 1);
}
}
// Occupant-relative accents (sprint 2026-06-02). Additive over the
// .filled/.reserved fill above — border tint only, appended last so
// a single-class modifier wins on source order.
&.tt-pos-me-current { border-color: rgba(var(--ninUser), 1); }
&.tt-pos-me-also { border-color: rgba(var(--ninUser), 0.6); cursor: pointer; }
&.tt-pos-bud { border-color: rgba(var(--secUser), 1); }
// CARTE seat-switch — a full-circle anchor on the viewer's own
// non-current seats; ?seat=N loads that seat's view. Sits below any
// confirm/release form (later in DOM) so the NVM button still wins.
.pos-seat-switch {
position: absolute;
inset: 0;
border-radius: 50%;
}
}
}