Every screen deals itself in, every time
The entrance is no longer a one-off on the boot: dealStage re-arms the class at the funnel every stage change already passes, so the title screen flies its plaque and buttons in whenever you arrive at it. The sub-menus join in — their header, content and footer arrive one after the other instead of the panel dropping in as one slab — and the poster wall deals its three rooms rather than its list, since a moving child inside a moving parent starts at twice the offset and reads as a stutter. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
aab83dacdc
commit
3324fe9cda
3 files changed
+67
-18
No files matched your search
+16
-1
@@ -93,8 +93,22 @@ const go = stage => {
|
||||
if (stage === 'train') buildTrain();
|
||||
intro.dataset.stage = stage;
|
||||
intro.scrollTop = 0;
|
||||
dealStage(stage);
|
||||
menuMusic();
|
||||
};
|
||||
// THE ARCADE ENTRANCE, re-armed. The title screen deals its plaque and buttons in from the left
|
||||
// every time you arrive at it — off a run, off the stats, off the boot. Removing the class and
|
||||
// forcing a reflow before adding it back is the whole trick: an animation whose class never left
|
||||
// cannot restart, and there is no "replay" switch in CSS.
|
||||
function dealStage(stage) {
|
||||
// the title screen waits for the boot: while the loading state is up there is nothing to deal
|
||||
// (the element is looked up here, not read off the const below: go() can fire before that line
|
||||
// has run, and a temporal-dead-zone throw in the menu funnel would take every screen with it)
|
||||
if (stage === 'splash' && document.getElementById('splash').classList.contains('busy')) return;
|
||||
intro.classList.remove('deal');
|
||||
void intro.offsetWidth;
|
||||
intro.classList.add('deal');
|
||||
}
|
||||
|
||||
// --- MODE selection in TWO STEPS (config.MENU + config.MODES): three posters on top, and the
|
||||
// picked one deals its own second step underneath — classic deals the difficulty chips, zombie
|
||||
@@ -1001,7 +1015,8 @@ const tick = setInterval(function watchLoad() {
|
||||
clearInterval(tick);
|
||||
// fonts.ready resolves once nothing is pending — including the three faces warmed above — so the
|
||||
// first canvas frame is never the system serif.
|
||||
(document.fonts ? document.fonts.ready : Promise.resolve()).then(() => splash.classList.remove('busy'));
|
||||
(document.fonts ? document.fonts.ready : Promise.resolve())
|
||||
.then(() => { splash.classList.remove('busy'); dealStage('splash'); });
|
||||
}, 100);
|
||||
|
||||
// THE FIRST TAP ANYWHERE ON THE OVERLAY STARTS THE THEME, and does nothing else — the screens have
|
||||
|
||||
Reference in new issue
Block a user