From c383a20455f6152f54072998519fffdb9c32f8f7 Mon Sep 17 00:00:00 2001
From: keanu77 <20503845+keanu77@users.noreply.github.com>
Date: Mon, 19 Oct 2026 20:36:47 +0800
Subject: [PATCH 1/2] =?UTF-8?q?fix:=20=E6=8A=95=E7=A5=A8=E6=8A=95=E5=BD=B1?=
 =?UTF-8?q?=E7=89=87=E7=AB=AF=E6=96=B7=E7=B7=9A=E5=BE=8C=E9=87=8D=E9=80=81?=
 =?UTF-8?q?=E7=9B=AE=E5=89=8D=E9=80=99=E9=A0=81=E7=9A=84=E9=96=8B=E9=A1=8C?=
 =?UTF-8?q?=EF=BC=8F=E9=9B=A2=E9=96=8B=E7=8B=80=E6=85=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

控制請求逾時後以退避（上限 15 秒、最多 8 次）重送目前這頁的狀態，
online 事件或 WebSocket 重連時立即重送；換頁即作廢舊重送，揭曉／清空不重送。
另以 navDone 追蹤後端已確認的換頁，修正斷線時連過兩張非投票頁、後端停在上一題。
重新 build docs/index.html。
---
 CHANGELOG.md                                  |  1 +
 docs/index.html                               | 39 +++++++++++++++++--
 .../references/live-poll/screen/live-poll.js  | 35 ++++++++++++++++-
 3 files changed, 69 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6d6af0e..7abd88f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - 新增 `README.en.md`（英文完整說明）、`SECURITY.md`（漏洞回報、ADMIN_KEY 處理與輪替、QA 會執行 JS）；README 開頭放 Live Demo 連結與 45 秒流程 GIF（`docs/demo.gif`）。
 - 乾淨環境安裝測試（OrbStack Ubuntu 24.04，照 README 從 clone 到離線 QA、講義、PDF、做法 B 全程）：發現 **Node 18 跑不了 Playwright**，需求改為 Node 20+（README 徽章、install.sh 檢查、SKILL.md、engines），疑難排解補上；`build-handout.mjs` 找不到 render 目錄時改成明確錯誤訊息。
 - 修正 PR #3／#4 的 Codex 審查意見：數字題中位數偶數筆改取中間兩筆平均（抽出 `worker/src/stats.js` 並加 `node --test` 測試，CI 一併執行）；投影片端快速換頁不再重開已離開的題目（控制請求排隊＋換頁序號）；手機頁回前景時不會多開一條 WebSocket；模擬模式開在加入頁時就顯示模擬人數；`qrcode` 改為 skill 自帶套件，照文件安裝即可跑 `poll-slides.mjs`；README 部署指令改用子 shell，不會停在 `my-poll` 裡；Live Demo 安裝頁改為 Node 20+。
+- 投票投影片端：斷線超過 5 秒時，開題／離開的控制請求逾時後會以退避（1、2、4… 秒，上限 15 秒、最多 8 次）重送**目前這頁**的狀態，網路恢復（`online` 事件或 WebSocket 重連）時立即重送；換頁後舊的重送作廢，揭曉、清空不重送。也修正斷線時連過兩張非投票頁、後端停在上一題的情況。
 
 ## 1.3.0 — 2026-10-18
 
diff --git a/docs/index.html b/docs/index.html
index d74d65c..7708e40 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -621,7 +621,7 @@ <h2>點點看：這是真的能作答的測驗</h2>
 <div class="lp-side"><div class="lp-sim">示範模式<br><b>模擬 60 人作答</b><br>正式使用時這裡是加入 QR</div><div class="lp-count"><b class="lp-total">0</b> 人作答</div>
 <div class="lp-phones-line"><span class="lp-dot"></span><b class="lp-phones">0</b> 支手機在線</div><div class="lp-net"></div>
 <div class="lp-hint">按 A 揭曉</div></div></div>
-<aside class="notes">請大家猜一個數字，看分布與中位數後按 A 揭曉。答案 279 KB。單一檔案、拔掉網路照樣能播。數字由 build 時實際量測。（彩排後按 Shift+R 清空這題）</aside></section>
+<aside class="notes">請大家猜一個數字，看分布與中位數後按 A 揭曉。答案 281 KB。單一檔案、拔掉網路照樣能播。數字由 build 時實際量測。（彩排後按 Shift+R 清空這題）</aside></section>
 
     <!-- 10 滑桿對比 -->
     <section>
@@ -804,7 +804,7 @@ <h1 data-letters>謝謝觀看</h1>
 @keyframes lpPulse{70%{box-shadow:0 0 0 12px rgba(111,207,151,0)}0%{box-shadow:0 0 0 0 rgba(111,207,151,.6)}}
 @media (prefers-reduced-motion:reduce){.lp-bar span,.lp-bin-bar span,.lp-answer{transition:none}.lp-live .lp-dot{animation:none}}
 </style>
-<script>window.POLL_CFG={"sim":60,"polls":{"warmup":{"type":"choice","kicker":"手機即時投票（示範模式）","title":"你平常用什麼做簡報？","stem":"正式使用時，觀眾掃 QR 用手機作答；這裡模擬 60 人作答。作答數穩定後按 A 揭曉，Shift+R 重來。","options":["PowerPoint／Keynote","Google 簡報","HTML（reveal.js 等）","其他"],"answer":2,"explain":"這題沒有標準答案，示範揭曉效果：正式場合時，答案會同步推到每一支手機。"},"size":{"type":"number","kicker":"猜數字（示範模式）","title":"這份 Demo 整份 HTML 有多大？","stem":"reveal.js、講者備註外掛、QR、測驗、投票程式全部內嵌在同一個檔案裡。猜猜看幾 KB？","min":0,"max":5000,"unit":"KB","answer":279,"bins":[[0,99],[100,299],[300,499],[500,999],[1000,1999],[2000,5000]],"explain":"單一檔案、拔掉網路照樣能播。數字由 build 時實際量測。"}},"event":"htmlpptskill Live Demo"};</script>
+<script>window.POLL_CFG={"sim":60,"polls":{"warmup":{"type":"choice","kicker":"手機即時投票（示範模式）","title":"你平常用什麼做簡報？","stem":"正式使用時，觀眾掃 QR 用手機作答；這裡模擬 60 人作答。作答數穩定後按 A 揭曉，Shift+R 重來。","options":["PowerPoint／Keynote","Google 簡報","HTML（reveal.js 等）","其他"],"answer":2,"explain":"這題沒有標準答案，示範揭曉效果：正式場合時，答案會同步推到每一支手機。"},"size":{"type":"number","kicker":"猜數字（示範模式）","title":"這份 Demo 整份 HTML 有多大？","stem":"reveal.js、講者備註外掛、QR、測驗、投票程式全部內嵌在同一個檔案裡。猜猜看幾 KB？","min":0,"max":5000,"unit":"KB","answer":281,"bins":[[0,99],[100,299],[300,499],[500,999],[1000,1999],[2000,5000]],"explain":"單一檔案、拔掉網路照樣能播。數字由 build 時實際量測。"}},"event":"htmlpptskill Live Demo"};</script>
 <script>/* 手機即時投票：投影片端（講者電腦）。需要 window.POLL_CFG = { url, key, polls }，由 scripts/poll-slides.mjs 注入。
    進到投票頁自動開題；離開投票頁手機回到「等下一題」。
    講者鍵：A 揭曉、Shift+R 清空本題（彩排後用）。網路斷了照樣能按 A 顯示答案。
@@ -819,6 +819,7 @@ <h1 data-letters>謝謝觀看</h1>
   const pollSec = id => document.querySelector(`section[data-poll="${id}"]`);
   const results = {};
   let current = null, ws = null, wsRetry = 0, poller = null, navSeq = 0;
+  let navDone = 0, navTry = 0, navTimer = null, navWait = 0, navBad = false;   // 後端已確認的換頁序號；換頁重送的退避狀態
 
   /* ---------------------------------------------------------------- 模擬模式 */
   const SIM = CFG.sim ? (CFG.sim === true ? 60 : CFG.sim) : 0;
@@ -897,7 +898,7 @@ <h1 data-letters>謝謝觀看</h1>
     if (OFFLINE) return setNet(false, '離線模式：按 A 仍可揭曉');
     try { ws = new WebSocket(CFG.url.replace(/^http/, 'ws') + '/ws?role=screen'); }
     catch (e) { return startPolling(); }
-    ws.onopen = () => { wsRetry = 0; setNet(true); stopPolling(); };
+    ws.onopen = () => { wsRetry = 0; setNet(true); stopPolling(); navResendNow(); };
     ws.onmessage = e => { if (e.data !== 'pong') onMessage(JSON.parse(e.data)); };
     ws.onclose = () => {
       setNet(false, '連線中斷，重試中…（按 A 仍可揭曉）');
@@ -907,6 +908,28 @@ <h1 data-letters>謝謝觀看</h1>
   }
   setInterval(() => { if (ws && ws.readyState === 1) ws.send('ping'); }, 25000);
 
+  window.addEventListener('online', () => navResendNow());
+
+  /* 換頁狀態（開題／離開）沒送到後端時退避重送「目前這頁」的狀態；換頁就作廢舊的，揭曉／清空不重送 */
+  function navOk(seq) {
+    if (seq !== navSeq) return;
+    navDone = seq; navTry = 0; navWait = 0; clearTimeout(navTimer);
+    if (navBad) { navBad = false; setNet(ws && ws.readyState === 1, '已送到伺服器；即時推播重連中…（按 A 仍可揭曉）'); }
+  }
+  function navFail(seq) {
+    if (seq !== navSeq || OFFLINE) return;            // 已換頁：新的那頁自己會送
+    setNet(false, '連不到投票伺服器，自動重試中（按 A 仍可揭曉）');
+    clearTimeout(navTimer); navWait = seq; navBad = true;
+    if (navTry < 8) navTimer = setTimeout(() => navResend(seq), Math.min(15000, 1000 * 2 ** navTry++));
+  }
+  function navResend(seq) {
+    if (seq !== navSeq || navWait !== seq) return;
+    navWait = 0;
+    const sec = Reveal.getCurrentSlide(), id = sec && sec.dataset.poll;
+    if (id) enterPoll(id, seq); else leavePoll(seq);
+  }
+  function navResendNow() { if (navWait) { clearTimeout(navTimer); navTry = 0; navResend(navWait); } }   // 網路恢復：不必等退避
+
   function startPolling() {
     if (poller || OFFLINE) return;
     poller = setInterval(async () => {
@@ -976,11 +999,16 @@ <h1 data-letters>謝謝觀看</h1>
         if (!r) return;                                   // 排隊期間已換頁
         results[id] = r.results;
       } else if (!await control({ poll: id, phase: 'revealed' }, seq)) return;   // 回到已揭曉的題：讓手機也顯示答案
+      navOk(seq);
       render(id);
     } catch (e) {
       setNet(false, '連不到投票伺服器（按 A 仍可揭曉）');
+      navFail(seq);
     }
   }
+  function leavePoll(seq) {
+    control({ poll: null }, seq).then(r => { if (r) navOk(seq); }, () => navFail(seq));
+  }
 
   async function reveal(id) {
     if (results[id]) results[id].phase = 'revealed';
@@ -1000,7 +1028,10 @@ <h1 data-letters>謝謝觀看</h1>
   function onShow(sec) {
     const id = sec && sec.dataset.poll, seq = ++navSeq;
     if (id) return enterPoll(id, seq);
-    if (current) { current = null; if (!SIM) control({ poll: null }, seq).catch(() => {}); }
+    const wasPoll = current; current = null;
+    if (SIM) return;
+    if (!wasPoll && navDone === seq - 1) return navOk(seq);   // 本來就沒開題、後端也確認過：不用送
+    leavePoll(seq);                                           // 上一頁的狀態還沒確認（排隊被略過或失敗）也要送
   }
 
   // capture 階段攔截，避免和 reveal.js 內建鍵衝突；只在投票頁生效
diff --git a/skills/html-slide-deck/references/live-poll/screen/live-poll.js b/skills/html-slide-deck/references/live-poll/screen/live-poll.js
index dd712b6..8654740 100644
--- a/skills/html-slide-deck/references/live-poll/screen/live-poll.js
+++ b/skills/html-slide-deck/references/live-poll/screen/live-poll.js
@@ -12,6 +12,7 @@
   const pollSec = id => document.querySelector(`section[data-poll="${id}"]`);
   const results = {};
   let current = null, ws = null, wsRetry = 0, poller = null, navSeq = 0;
+  let navDone = 0, navTry = 0, navTimer = null, navWait = 0, navBad = false;   // 後端已確認的換頁序號；換頁重送的退避狀態
 
   /* ---------------------------------------------------------------- 模擬模式 */
   const SIM = CFG.sim ? (CFG.sim === true ? 60 : CFG.sim) : 0;
@@ -90,7 +91,7 @@
     if (OFFLINE) return setNet(false, '離線模式：按 A 仍可揭曉');
     try { ws = new WebSocket(CFG.url.replace(/^http/, 'ws') + '/ws?role=screen'); }
     catch (e) { return startPolling(); }
-    ws.onopen = () => { wsRetry = 0; setNet(true); stopPolling(); };
+    ws.onopen = () => { wsRetry = 0; setNet(true); stopPolling(); navResendNow(); };
     ws.onmessage = e => { if (e.data !== 'pong') onMessage(JSON.parse(e.data)); };
     ws.onclose = () => {
       setNet(false, '連線中斷，重試中…（按 A 仍可揭曉）');
@@ -100,6 +101,28 @@
   }
   setInterval(() => { if (ws && ws.readyState === 1) ws.send('ping'); }, 25000);
 
+  window.addEventListener('online', () => navResendNow());
+
+  /* 換頁狀態（開題／離開）沒送到後端時退避重送「目前這頁」的狀態；換頁就作廢舊的，揭曉／清空不重送 */
+  function navOk(seq) {
+    if (seq !== navSeq) return;
+    navDone = seq; navTry = 0; navWait = 0; clearTimeout(navTimer);
+    if (navBad) { navBad = false; setNet(ws && ws.readyState === 1, '已送到伺服器；即時推播重連中…（按 A 仍可揭曉）'); }
+  }
+  function navFail(seq) {
+    if (seq !== navSeq || OFFLINE) return;            // 已換頁：新的那頁自己會送
+    setNet(false, '連不到投票伺服器，自動重試中（按 A 仍可揭曉）');
+    clearTimeout(navTimer); navWait = seq; navBad = true;
+    if (navTry < 8) navTimer = setTimeout(() => navResend(seq), Math.min(15000, 1000 * 2 ** navTry++));
+  }
+  function navResend(seq) {
+    if (seq !== navSeq || navWait !== seq) return;
+    navWait = 0;
+    const sec = Reveal.getCurrentSlide(), id = sec && sec.dataset.poll;
+    if (id) enterPoll(id, seq); else leavePoll(seq);
+  }
+  function navResendNow() { if (navWait) { clearTimeout(navTimer); navTry = 0; navResend(navWait); } }   // 網路恢復：不必等退避
+
   function startPolling() {
     if (poller || OFFLINE) return;
     poller = setInterval(async () => {
@@ -169,11 +192,16 @@
         if (!r) return;                                   // 排隊期間已換頁
         results[id] = r.results;
       } else if (!await control({ poll: id, phase: 'revealed' }, seq)) return;   // 回到已揭曉的題：讓手機也顯示答案
+      navOk(seq);
       render(id);
     } catch (e) {
       setNet(false, '連不到投票伺服器（按 A 仍可揭曉）');
+      navFail(seq);
     }
   }
+  function leavePoll(seq) {
+    control({ poll: null }, seq).then(r => { if (r) navOk(seq); }, () => navFail(seq));
+  }
 
   async function reveal(id) {
     if (results[id]) results[id].phase = 'revealed';
@@ -193,7 +221,10 @@
   function onShow(sec) {
     const id = sec && sec.dataset.poll, seq = ++navSeq;
     if (id) return enterPoll(id, seq);
-    if (current) { current = null; if (!SIM) control({ poll: null }, seq).catch(() => {}); }
+    const wasPoll = current; current = null;
+    if (SIM) return;
+    if (!wasPoll && navDone === seq - 1) return navOk(seq);   // 本來就沒開題、後端也確認過：不用送
+    leavePoll(seq);                                           // 上一頁的狀態還沒確認（排隊被略過或失敗）也要送
   }
 
   // capture 階段攔截，避免和 reveal.js 內建鍵衝突；只在投票頁生效

From 615fa501a681ccf2a98d519b939663bbe4ea83ea Mon Sep 17 00:00:00 2001
From: keanu77 <20503845+keanu77@users.noreply.github.com>
Date: Mon, 19 Oct 2026 20:49:07 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E6=8F=9B=E9=A0=81=E6=99=82=E9=87=8D?=
 =?UTF-8?q?=E8=A8=AD=E9=87=8D=E9=80=81=E6=AC=A1=E6=95=B8=EF=BC=8C=E6=AF=8F?=
 =?UTF-8?q?=E9=A0=81=E5=90=84=E6=9C=89=208=20=E6=AC=A1=E9=87=8D=E9=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

上一頁斷線用完 8 次後換頁，新頁失敗不會再排重送；在網路與 WebSocket 都正常、
只有控制路徑失敗時，後端可能一直停在舊題。改在 onShow 重設 navTry。
---
 CHANGELOG.md                                                    | 2 +-
 docs/index.html                                                 | 1 +
 skills/html-slide-deck/references/live-poll/screen/live-poll.js | 1 +
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7abd88f..6e00997 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,7 +7,7 @@
 - 新增 `README.en.md`（英文完整說明）、`SECURITY.md`（漏洞回報、ADMIN_KEY 處理與輪替、QA 會執行 JS）；README 開頭放 Live Demo 連結與 45 秒流程 GIF（`docs/demo.gif`）。
 - 乾淨環境安裝測試（OrbStack Ubuntu 24.04，照 README 從 clone 到離線 QA、講義、PDF、做法 B 全程）：發現 **Node 18 跑不了 Playwright**，需求改為 Node 20+（README 徽章、install.sh 檢查、SKILL.md、engines），疑難排解補上；`build-handout.mjs` 找不到 render 目錄時改成明確錯誤訊息。
 - 修正 PR #3／#4 的 Codex 審查意見：數字題中位數偶數筆改取中間兩筆平均（抽出 `worker/src/stats.js` 並加 `node --test` 測試，CI 一併執行）；投影片端快速換頁不再重開已離開的題目（控制請求排隊＋換頁序號）；手機頁回前景時不會多開一條 WebSocket；模擬模式開在加入頁時就顯示模擬人數；`qrcode` 改為 skill 自帶套件，照文件安裝即可跑 `poll-slides.mjs`；README 部署指令改用子 shell，不會停在 `my-poll` 裡；Live Demo 安裝頁改為 Node 20+。
-- 投票投影片端：斷線超過 5 秒時，開題／離開的控制請求逾時後會以退避（1、2、4… 秒，上限 15 秒、最多 8 次）重送**目前這頁**的狀態，網路恢復（`online` 事件或 WebSocket 重連）時立即重送；換頁後舊的重送作廢，揭曉、清空不重送。也修正斷線時連過兩張非投票頁、後端停在上一題的情況。
+- 投票投影片端：斷線超過 5 秒時，開題／離開的控制請求逾時後會以退避（1、2、4… 秒，上限 15 秒、每次換頁最多 8 次）重送**目前這頁**的狀態，網路恢復（`online` 事件或 WebSocket 重連）時立即重送；換頁後舊的重送作廢，揭曉、清空不重送。也修正斷線時連過兩張非投票頁、後端停在上一題的情況。
 
 ## 1.3.0 — 2026-10-18
 
diff --git a/docs/index.html b/docs/index.html
index 7708e40..5e5fe9b 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1027,6 +1027,7 @@ <h1 data-letters>謝謝觀看</h1>
 
   function onShow(sec) {
     const id = sec && sec.dataset.poll, seq = ++navSeq;
+    navTry = 0;                                               // 每次換頁都有自己的重送次數
     if (id) return enterPoll(id, seq);
     const wasPoll = current; current = null;
     if (SIM) return;
diff --git a/skills/html-slide-deck/references/live-poll/screen/live-poll.js b/skills/html-slide-deck/references/live-poll/screen/live-poll.js
index 8654740..3fe1f1c 100644
--- a/skills/html-slide-deck/references/live-poll/screen/live-poll.js
+++ b/skills/html-slide-deck/references/live-poll/screen/live-poll.js
@@ -220,6 +220,7 @@
 
   function onShow(sec) {
     const id = sec && sec.dataset.poll, seq = ++navSeq;
+    navTry = 0;                                               // 每次換頁都有自己的重送次數
     if (id) return enterPoll(id, seq);
     const wasPoll = current; current = null;
     if (SIM) return;