The fireworks get the stage before the victory modal takes it

Winning raised the modal on the same frame the fireworks lit,
covering them. The modal now waits behind the curtain for 2.4
seconds — three volleys over the winner's home, seen — then takes
the stage.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Eric Wagoner
2026-08-17 10:40:11 -04:00
co-authored by Claude Fable 5
parent c6d73550df
commit ca55f7d00b
+9 -1
View File
@@ -21,6 +21,14 @@
let showHelp = $state(false); let showHelp = $state(false);
/** The finished game whose victory fanfare has been dismissed. */ /** The finished game whose victory fanfare has been dismissed. */
let victorySeen = $state(false); let victorySeen = $state(false);
/** The fireworks get the stage before the modal takes it. */
let victoryCurtain = $state(false);
$effect(() => {
if (view?.phase === "finished" && view.winner && !victoryCurtain) {
const t = setTimeout(() => (victoryCurtain = true), 2400);
return () => clearTimeout(t);
}
});
/** Quiet mode: skip the attack announcement modal (device preference). */ /** Quiet mode: skip the attack announcement modal (device preference). */
let noFanfare = $state(localStorage.getItem("wizwar-no-fanfare") === "1"); let noFanfare = $state(localStorage.getItem("wizwar-no-fanfare") === "1");
function setFanfare(announce: boolean) { function setFanfare(announce: boolean) {
@@ -949,7 +957,7 @@
<Help initialTab={helpTab} stats={net.stats} onstats={() => net.requestStats()} onclose={() => (showHelp = false)} /> <Help initialTab={helpTab} stats={net.stats} onstats={() => net.requestStats()} onclose={() => (showHelp = false)} />
{/if} {/if}
{#if view?.phase === "finished" && view.winner && !victorySeen} {#if view?.phase === "finished" && view.winner && victoryCurtain && !victorySeen}
<div class="scrim attack-scrim" role="alertdialog" aria-label="the game is won"> <div class="scrim attack-scrim" role="alertdialog" aria-label="the game is won">
<div class="attack-notice victory-notice"> <div class="attack-notice victory-notice">
<div class="victory-trophy">🏆</div> <div class="victory-trophy">🏆</div>