my-sea voice: voice-btn glow/pulse state machine (sea-precedence, pulse-while-alone, 2x on 2nd party) — TDD

Phase 3 of the my-sea voice batch (user-spec 2026-05-29). A --quaUser/--ninUser
glow + pulse machine for the burger btn + its voice sub-btn, driven by the
voice sub-btn availability (voice_active) + the live mesh state.

- voice-mesh.js: VoiceRoom gains a state-change hook — setOnStateChange(cb) +
  peerCount() + _notify({inCall, peerCount, muted}), fired on join, every peer
  add/drop, mute toggle, and teardown. No behaviour change without a subscriber
  (VoiceMeshSpec stays green).
- voice-glow.js (new): the glow machine. PRE-JOIN nudge — burger glows when the
  fan is closed (sea draw-nudge keeps burger precedence; voice reclaims it once
  the sea glow clears), voice sub-btn glows when the fan opens. LIVE — the glow
  PULSES on whichever surface shows (voice sub-btn fan-open, burger fan-closed):
  base 2s cadence while alone, doubled (.voice-pulse--fast) once a 2nd party
  connects (equalizer stand-in; a true volume-reactive equalizer is a live-only
  enhancement). Class writes are reconciled (idempotent) so the burger-class
  MutationObserver doesn't feed back on itself.
- _burger.scss: .voice-glow + @keyframes voice-pulse + .voice-pulse(--fast).
- loaded on my_sea.html + my_sea_visit.html (after burger-btn.js).
- VoiceGlowSpec.js (18 specs) + registered in SpecRunner; MySeaSeatsSpec flare
  window updated 1.5s → 2s (Phase 2 bump). 428 Jasmine specs green.

Live-verify on staging: the actual glow colours/cadence + the equalizer
upgrade (item 5) and disconnect states (item 7) land in later phases.

Code architected by Disco DeDisco <discodedisco@outlook.com>
Git commit message Co-Authored-By:
Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-05-29 21:06:02 -04:00
parent 7bd8e3256a
commit b021d8017c
11 changed files with 519 additions and 2 deletions

View File

@@ -189,6 +189,47 @@
0 0 1.2rem 0.3rem rgba(var(--ninUser), 0.35);
}
// ── Voice affordance glow + pulse (Phase 3, my-sea voice) ─────────────
//
// Distinct from the sea-btn's --priYl `.glow-handoff` draw nudge: voice uses
// a --quaUser tint + --ninUser halo. voice-glow.js owns the class transitions
// (sea takes burger precedence; the voice glow surfaces on the voice sub-btn
// when the fan is open, or on the burger once the sea nudge clears). Once the
// mic is live the glow PULSES — base cadence while alone, doubled once a 2nd
// party connects (equalizer stand-in).
#id_voice_btn.voice-glow,
#id_burger_btn.voice-glow {
color: rgba(var(--quaUser), 1);
border-color: rgba(var(--quaUser), 1);
box-shadow:
0 0 0.5rem 0.1rem rgba(var(--ninUser), 0.75),
0 0 1.2rem 0.3rem rgba(var(--ninUser), 0.35);
}
@keyframes voice-pulse {
0%, 100% {
box-shadow:
0 0 0.35rem 0.05rem rgba(var(--ninUser), 0.35),
0 0 0.7rem 0.1rem rgba(var(--ninUser), 0.2);
}
50% {
box-shadow:
0 0 0.7rem 0.2rem rgba(var(--ninUser), 0.9),
0 0 1.5rem 0.5rem rgba(var(--ninUser), 0.45);
}
}
// Base cadence — one full ease in+out per 2s (1s each way) while the visiting
// user is alone in the voice room.
#id_voice_btn.voice-pulse,
#id_burger_btn.voice-pulse {
animation: voice-pulse 2s ease-in-out infinite;
}
// Doubled cadence once a 2nd party is connected.
#id_voice_btn.voice-pulse--fast,
#id_burger_btn.voice-pulse--fast {
animation: voice-pulse 1s ease-in-out infinite;
}
// Burger hides when bud_panel is open — LANDSCAPE only. In portrait the
// burger sits ABOVE the bud panel (bottom:4.2rem vs panel at bottom:0.5
// + height:3rem); no visual conflict. In landscape they share the