Sea Select glow: defer sea-btn reopen + glow handoff past parse time; pulse the glow-handoff — TDD
room.html includes _sea_overlay.html (~L77) BEFORE _burger.html (~L167, which holds #id_burger_btn + #id_sea_btn), so the overlay's two inline scripts captured those btns at parse time → null → both bindings silently no-op'd: the sea btn (active post-completion) did nothing on click + the burger stayed stuck --priId because its glow-handoff transfer listener never bound. Defer both the sea-btn REOPEN binding (_bindSeaReopen) & the burger→sea_btn→.sea-select GLOW chain (_bindGlowHandoff) to DOMContentLoaded so the burger fan exists first. Also make the glow-handoff halo PULSE (quick ease-in swell, slow ease-out decay via per-segment timing fns + a lopsided 22/78 keystop split) instead of a flat glow — the burger, then the sea btn after the handoff click, keep cueing "click me to reopen your sea". Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -482,14 +482,23 @@ via epic:sea_save. `?seat` threads the CARTE-selected seat onto the action URLs.
|
||||
// ── Sea sub-btn = post-completion REOPEN (active only once the spread is
|
||||
// complete, like the sky btn). An ACTIVE click re-shows the felt to review the
|
||||
// saved spread (window.openSeaFelt); inactive clicks fall to burger-btn.js's
|
||||
// --priRd flash.
|
||||
var seaSubBtn = document.getElementById('id_sea_btn');
|
||||
if (seaSubBtn) {
|
||||
// --priRd flash. DEFERRED to DOMContentLoaded: #id_sea_btn lives in
|
||||
// _burger.html, which room.html includes AFTER this overlay — a parse-time
|
||||
// getElementById returns null → the binding would silently no-op (sea btn
|
||||
// dead). Bind once the burger fan exists.
|
||||
function _bindSeaReopen() {
|
||||
var seaSubBtn = document.getElementById('id_sea_btn');
|
||||
if (!seaSubBtn) return;
|
||||
seaSubBtn.addEventListener('click', function () {
|
||||
if (!seaSubBtn.classList.contains('active')) return;
|
||||
openSea();
|
||||
});
|
||||
}
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', _bindSeaReopen);
|
||||
} else {
|
||||
_bindSeaReopen();
|
||||
}
|
||||
|
||||
// Re-seed SeaDeal's `_seaHand` from the server-rendered saved slots so they
|
||||
// stay clickable to RE-OPEN the stage after a refresh.
|
||||
@@ -528,32 +537,44 @@ via epic:sea_save. `?seat` threads the CARTE-selected seat onto the action URLs.
|
||||
{# .sea-select → end, so the user is led to reopen + review their sea. #}
|
||||
<script>
|
||||
(function () {
|
||||
var burgerBtn = document.getElementById('id_burger_btn');
|
||||
var seaBtn = document.getElementById('id_sea_btn');
|
||||
var seaSelect = document.querySelector('#id_sea_overlay .sea-select');
|
||||
if (!burgerBtn || !seaBtn || !seaSelect) return;
|
||||
// DEFERRED to DOMContentLoaded: #id_burger_btn + #id_sea_btn live in
|
||||
// _burger.html, which room.html includes AFTER this overlay — capturing them at
|
||||
// parse time yields null and the early-return below would skip every listener
|
||||
// (burger never sheds .glow-handoff → stuck --priId; the chain never advances).
|
||||
// Bind once the burger fan exists.
|
||||
function _bindGlowHandoff() {
|
||||
var burgerBtn = document.getElementById('id_burger_btn');
|
||||
var seaBtn = document.getElementById('id_sea_btn');
|
||||
var seaSelect = document.querySelector('#id_sea_overlay .sea-select');
|
||||
if (!burgerBtn || !seaBtn || !seaSelect) return;
|
||||
|
||||
var glowDone = false;
|
||||
function endGlow() {
|
||||
glowDone = true;
|
||||
burgerBtn.classList.remove('glow-handoff');
|
||||
seaBtn.classList.remove('glow-handoff');
|
||||
seaSelect.classList.remove('glow-handoff');
|
||||
var glowDone = false;
|
||||
function endGlow() {
|
||||
glowDone = true;
|
||||
burgerBtn.classList.remove('glow-handoff');
|
||||
seaBtn.classList.remove('glow-handoff');
|
||||
seaSelect.classList.remove('glow-handoff');
|
||||
}
|
||||
|
||||
burgerBtn.addEventListener('click', function () {
|
||||
if (glowDone || !burgerBtn.classList.contains('glow-handoff')) return;
|
||||
burgerBtn.classList.remove('glow-handoff');
|
||||
seaBtn.classList.add('glow-handoff');
|
||||
});
|
||||
seaBtn.addEventListener('click', function () {
|
||||
if (glowDone || !seaBtn.classList.contains('glow-handoff')) return;
|
||||
seaBtn.classList.remove('glow-handoff');
|
||||
seaSelect.classList.add('glow-handoff');
|
||||
});
|
||||
seaSelect.addEventListener('click', function () {
|
||||
if (glowDone) return;
|
||||
endGlow();
|
||||
});
|
||||
}
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', _bindGlowHandoff);
|
||||
} else {
|
||||
_bindGlowHandoff();
|
||||
}
|
||||
|
||||
burgerBtn.addEventListener('click', function () {
|
||||
if (glowDone || !burgerBtn.classList.contains('glow-handoff')) return;
|
||||
burgerBtn.classList.remove('glow-handoff');
|
||||
seaBtn.classList.add('glow-handoff');
|
||||
});
|
||||
seaBtn.addEventListener('click', function () {
|
||||
if (glowDone || !seaBtn.classList.contains('glow-handoff')) return;
|
||||
seaBtn.classList.remove('glow-handoff');
|
||||
seaSelect.classList.add('glow-handoff');
|
||||
});
|
||||
seaSelect.addEventListener('click', function () {
|
||||
if (glowDone) return;
|
||||
endGlow();
|
||||
});
|
||||
}());
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user