feat(web): add Restart button to replay viewer
Build and Deploy / build-and-push (push) Successful in 4m31s

Splits the old single "⏮ Restart" button into two: "⏮ Restart" (resets
to step 0 with card fade-in from dealt positions) and "◀ Back" (steps
back one move at a time via fast-forward replay). Both are disabled at
step 0 and enabled after any forward step.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
funman300
2026-05-15 17:24:25 -07:00
parent a9285ccb41
commit 9d3cc94831
2 changed files with 12 additions and 0 deletions
+1
View File
@@ -30,6 +30,7 @@
<section id="board"></section>
<section id="controls">
<button id="btn-restart" disabled>⏮ Restart</button>
<button id="btn-prev" disabled>◀ Back</button>
<button id="btn-play">▶ Play</button>
<button id="btn-step">⏭ Step</button>
+11
View File
@@ -62,6 +62,7 @@ const resultEl = document.getElementById("result");
const btnPlay = document.getElementById("btn-play");
const btnStep = document.getElementById("btn-step");
const btnPrev = document.getElementById("btn-prev");
const btnRestart = document.getElementById("btn-restart");
let player = null;
let replayJson = null;
@@ -122,6 +123,7 @@ function resetPlayer() {
}
player = new ReplayPlayer(replayJson);
btnPrev.disabled = true;
btnRestart.disabled = true;
btnStep.disabled = false;
btnPlay.disabled = false;
render(player.state());
@@ -134,6 +136,7 @@ function step() {
return null;
}
btnPrev.disabled = false;
btnRestart.disabled = false;
render(snap);
return snap;
}
@@ -319,6 +322,7 @@ function stepBack() {
}
render(player.state());
btnPrev.disabled = player.step_idx() === 0;
btnRestart.disabled = player.step_idx() === 0;
btnStep.disabled = false;
btnPlay.disabled = false;
}
@@ -327,4 +331,11 @@ btnPrev.addEventListener("click", () => {
if (player) stepBack();
});
btnRestart.addEventListener("click", () => {
if (!replayJson) return;
cardEls.forEach((el) => el.remove());
cardEls.clear();
resetPlayer();
});
bootstrap();