From 9d3cc94831bc29145de88654d2454930330d9506 Mon Sep 17 00:00:00 2001
From: funman300 <funman300@gmail.com>
Date: Fri, 15 May 2026 17:24:25 -0700
Subject: [PATCH] feat(web): add Restart button to replay viewer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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>
---
 solitaire_server/web/index.html |  1 +
 solitaire_server/web/replay.js  | 11 +++++++++++
 2 files changed, 12 insertions(+)

diff --git a/solitaire_server/web/index.html b/solitaire_server/web/index.html
index 7338013..1dd18cb 100644
--- a/solitaire_server/web/index.html
+++ b/solitaire_server/web/index.html
@@ -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>
diff --git a/solitaire_server/web/replay.js b/solitaire_server/web/replay.js
index 23c8c5b..4ae8f10 100644
--- a/solitaire_server/web/replay.js
+++ b/solitaire_server/web/replay.js
@@ -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();