minigame 4 add more design 1.6

www/html/Game/data/quiz-settings.json

@@ -4,20 +4,20 @@
     "betweenMs": 3000,
     "carryReadMs": 3000,
     "carryAnswerMs": 15000,
-    "carrySessionLength": 10,
+    "carrySessionLength": 2,
     "carryMapPanelTheme": {
         "panelBg": "rgba(255, 0, 0, 0)",
         "panelBorder": "rgba(255, 255, 255, 0)",
-        "borderWidthPx": 0,
         "textColor": "rgba(241, 245, 249, 1)",
+        "borderWidthPx": 0,
         "questionFontMinPx": 10,
         "questionFontMaxPx": 24
     },
     "quizMapPanelTheme": {
         "panelBg": "rgba(12, 14, 28, 0)",
         "panelBorder": "rgba(255, 214, 102, 0)",
-        "textColor": "rgba(255, 224, 102, 1)",
         "borderWidthPx": 2,
+        "textColor": "rgba(255, 224, 102, 1)",
         "questionFontMinPx": 10,
         "questionFontMaxPx": 28
     },

www/html/Game/public/js/play.js

@@ -1847,6 +1847,9 @@
   let quizCarryEmbedPendingQuestion = null;
   let quizCarryEmbedCountdownStartAt = 0;
   let quizCarryEmbedCountdownEndAt = 0;
+  /** editor embed: นับ 3–2–1 รอบสองหลังโชว์คำถาม ก่อนเปิดป้ายตัวเลือกบนแมป */
+  let quizCarryEmbedPreOptionCountdownStartAt = 0;
+  let quizCarryEmbedPreOptionCountdownEndAt = 0;
   /** quiz_carry: epoch ให้หยิบตัวเลือกได้ · epoch ปิดรอบตอบ (ตั้งที่ Admin แท็บหยิบมาวาง) */
   let quizCarryOptionRevealAt = 0;
   let quizCarryAnswerCloseAt = 0;
@@ -6599,7 +6602,9 @@
   }
 
   function isQuizCarryEmbedCountdownBlockingMovement() {
-    return !!(previewMode && editorEmbedReturn && isQuizCarry() && quizCarryEmbedCountdownEndAt > Date.now());
+    if (!(previewMode && editorEmbedReturn && isQuizCarry())) return false;
+    const now = Date.now();
+    return (quizCarryEmbedCountdownEndAt > now) || (quizCarryEmbedPreOptionCountdownEndAt > now);
   }
 
   function isQuizCarryEmbedLobbyBlockingMovement() {
@@ -6711,13 +6716,17 @@
     quizCarryPregameActive = false;
     hideQuizCarryPregameOverlay();
     quizCarryPickNextQuestion();
-    if (!(previewMode && editorEmbedReturn && quizCarryEmbedCountdownEndAt > Date.now())) {
+    const nowEmb = Date.now();
+    if (!(previewMode && editorEmbedReturn && quizCarryEmbedCountdownEndAt > nowEmb)
+      && !(previewMode && editorEmbedReturn && quizCarryEmbedPreOptionCountdownEndAt > nowEmb)) {
       quizCarryRestoreEmbedPhaseLabel();
     }
   }
 
   function quizCarryOptionsPickableNow() {
     if (!isQuizCarry() || !quizCarryCurrent) return true;
+    /* embed: ระหว่าง 3–2–1 รอบสอง (คำถามขึ้นแล้ว) — ยังไม่วาด/ไม่ให้หยิบป้ายตัวเลือก */
+    if (previewMode && editorEmbedReturn && quizCarryEmbedPreOptionCountdownEndAt > Date.now()) return false;
     if (!quizCarryOptionRevealAt || quizCarryOptionRevealAt <= 0) return true;
     return Date.now() >= quizCarryOptionRevealAt;
   }
@@ -6740,6 +6749,15 @@
     }
   }
 
+  /** embed: หลัง 3–2–1 ก่อนหยิบ — เปิดป้ายตัวเลือกทันที + จับเวลาตอบ carryAnswerMs */
+  function quizCarryApplyEmbedAnswerWindowAfterPreOption321() {
+    if (!quizCarryCurrent) return;
+    const ansMs = Math.max(1000, Math.floor(Number(quizCarryCarryTimingMs.carryAnswerMs)) || 5000);
+    const t0 = Date.now();
+    quizCarryOptionRevealAt = 0;
+    quizCarryAnswerCloseAt = t0 + ansMs;
+  }
+
   function updateQuizCarryCarryPhaseHud() {
     if (quizCarrySessionEnded) return;
     if (quizCarryPregameActive) return;
@@ -6752,6 +6770,11 @@
       return;
     }
     const now = Date.now();
+    if (previewMode && editorEmbedReturn && quizCarryEmbedPreOptionCountdownEndAt > 0 && now < quizCarryEmbedPreOptionCountdownEndAt) {
+      const sec = Math.max(0, Math.ceil((quizCarryEmbedPreOptionCountdownEndAt - now) / 1000));
+      phaseEl.textContent = 'เตรียมหยิบคำตอบ — นับ 3·2·1 (' + sec + ' วิ)';
+      return;
+    }
     if (quizCarryOptionRevealAt > 0 && now < quizCarryOptionRevealAt) {
       const remain = Math.max(0, Math.ceil((quizCarryOptionRevealAt - now) / 1000));
       phaseEl.textContent = 'อ่านคำถาม — ตัวเลือกขึ้นใน ' + remain + ' วิ';
@@ -6770,6 +6793,7 @@
     if (quizCarryPregameActive) return;
     if (!isQuizCarry() || !mapData || !quizCarryCurrent) return;
     if (quizCarryEmbedCountdownEndAt > Date.now()) return;
+    if (quizCarryEmbedPreOptionCountdownEndAt > Date.now()) return;
     if (quizCarryEmbedPendingQuestion) return;
     if (quizCarryAnswerTimeupAwaitNext) return;
     if (!quizCarryAnswerCloseAt || quizCarryAnswerCloseAt <= 0) return;
@@ -6829,10 +6853,36 @@
 
   function tickQuizCarryEmbedCountdown() {
     if (!previewMode || !editorEmbedReturn || !isQuizCarry()) return;
-    if (!quizCarryEmbedPendingQuestion || quizCarryEmbedCountdownEndAt <= 0) return;
     const now = Date.now();
     const ov = document.getElementById('quiz-carry-embed-countdown');
     const numEl = document.getElementById('quiz-carry-embed-countdown-num');
+
+    if (quizCarryCurrent && quizCarryEmbedPreOptionCountdownEndAt > 0) {
+      if (!numEl) return;
+      if (now >= quizCarryEmbedPreOptionCountdownEndAt) {
+        quizCarryEmbedPreOptionCountdownEndAt = 0;
+        quizCarryEmbedPreOptionCountdownStartAt = 0;
+        hideQuizCarryEmbedCountdownOverlay();
+        quizCarryApplyEmbedAnswerWindowAfterPreOption321();
+        quizCarryRestoreEmbedPhaseLabel();
+        syncQuizCarryEmbedQuestionStrip();
+        updateQuizCarryCarryPhaseHud();
+        return;
+      }
+      const elapsedPre = now - quizCarryEmbedPreOptionCountdownStartAt;
+      const nPre = 3 - Math.min(2, Math.floor(elapsedPre / 1000));
+      setCountdown321QuestionAssetGraphic(numEl, Math.max(1, Math.min(3, nPre)));
+      if (ov) {
+        ov.classList.remove('is-hidden');
+        ov.setAttribute('aria-hidden', 'false');
+      }
+      syncQuizCarryEmbedCountdownLayout();
+      showQuizCarryEmbedCountdownDigitsOnlyChrome();
+      syncQuizCarryEmbedQuestionStrip();
+      return;
+    }
+
+    if (!quizCarryEmbedPendingQuestion || quizCarryEmbedCountdownEndAt <= 0) return;
     if (now >= quizCarryEmbedCountdownEndAt) {
       const pq = quizCarryEmbedPendingQuestion;
       quizCarryEmbedPendingQuestion = null;
@@ -6851,7 +6901,9 @@
         o.botQuizCarryPathfindAfter = 0;
       });
       syncQuizCarryEmbedQuestionStrip();
-      quizCarryApplyPhaseTimersForCurrentQuestion();
+      quizCarryEmbedPreOptionCountdownStartAt = Date.now();
+      quizCarryEmbedPreOptionCountdownEndAt = quizCarryEmbedPreOptionCountdownStartAt + 3000;
+      updateQuizCarryCarryPhaseHud();
       return;
     }
     const elapsed = now - quizCarryEmbedCountdownStartAt;
@@ -6874,6 +6926,8 @@
       quizCarryEmbedPendingQuestion = null;
       quizCarryEmbedCountdownEndAt = 0;
       quizCarryEmbedCountdownStartAt = 0;
+      quizCarryEmbedPreOptionCountdownStartAt = 0;
+      quizCarryEmbedPreOptionCountdownEndAt = 0;
       quizCarryOptionRevealAt = 0;
       quizCarryAnswerCloseAt = 0;
       hideQuizCarryEmbedCountdownOverlay();
@@ -6891,6 +6945,8 @@
       preloadQuizCarryChoiceImages(q);
       quizCarryEmbedCountdownStartAt = Date.now();
       quizCarryEmbedCountdownEndAt = quizCarryEmbedCountdownStartAt + 3000;
+      quizCarryEmbedPreOptionCountdownStartAt = 0;
+      quizCarryEmbedPreOptionCountdownEndAt = 0;
       quizCarryCurrent = null;
       playQuizText = '';
       clearQuizMapQuestionCarryFeedback();
@@ -7372,6 +7428,8 @@
     quizCarryEmbedPendingQuestion = null;
     quizCarryEmbedCountdownEndAt = 0;
     quizCarryEmbedCountdownStartAt = 0;
+    quizCarryEmbedPreOptionCountdownStartAt = 0;
+    quizCarryEmbedPreOptionCountdownEndAt = 0;
     quizCarryOptionRevealAt = 0;
     quizCarryAnswerCloseAt = 0;
     hideQuizCarryEmbedCountdownOverlay();
@@ -7676,6 +7734,8 @@
     quizCarryEmbedPendingQuestion = null;
     quizCarryEmbedCountdownStartAt = 0;
     quizCarryEmbedCountdownEndAt = 0;
+    quizCarryEmbedPreOptionCountdownStartAt = 0;
+    quizCarryEmbedPreOptionCountdownEndAt = 0;
     quizCarryOptionRevealAt = 0;
     quizCarryAnswerCloseAt = 0;
     quizCarryAnswerTimeupAwaitNext = false;
@@ -7738,6 +7798,8 @@
   }
 
   async function loadQuizCarryPoolAndStart() {
+    quizCarryEmbedPreOptionCountdownStartAt = 0;
+    quizCarryEmbedPreOptionCountdownEndAt = 0;
     quizCarryRoundsCompleted = 0;
     quizCarrySessionEnded = false;
     hideQuizCarryTimeupOnDeskLayer();
@@ -7842,7 +7904,9 @@
     } else {
       quizCarryPickNextQuestion();
     }
-    if (!(previewMode && editorEmbedReturn && quizCarryEmbedCountdownEndAt > Date.now())) {
+    const nowJoin = Date.now();
+    if (!(previewMode && editorEmbedReturn && quizCarryEmbedCountdownEndAt > nowJoin)
+      && !(previewMode && editorEmbedReturn && quizCarryEmbedPreOptionCountdownEndAt > nowJoin)) {
       quizCarryRestoreEmbedPhaseLabel();
     }
     try {
@@ -14856,6 +14920,9 @@
         } else if (previewMode && editorEmbedReturn && quizCarryEmbedCountdownEndAt > Date.now()) {
           const rem = Math.max(0, Math.ceil((quizCarryEmbedCountdownEndAt - Date.now()) / 1000));
           timeVal.textContent = String(rem);
+        } else if (previewMode && editorEmbedReturn && quizCarryEmbedPreOptionCountdownEndAt > Date.now()) {
+          const rem2 = Math.max(0, Math.ceil((quizCarryEmbedPreOptionCountdownEndAt - Date.now()) / 1000));
+          timeVal.textContent = String(rem2);
         } else if (quizCarryPregameActive) {
           timeVal.textContent = '···';
         } else if (!quizCarryCurrent) {
@@ -16003,7 +16070,8 @@
     if (isQuizCarry()) {
       drawQuizCarryEmbedCountdownHighlight(ctx, worldToScreen, zDraw, timeMs);
     }
-    if (previewMode && editorEmbedReturn && isQuizCarry() && quizCarryEmbedCountdownEndAt > Date.now()) {
+    if (previewMode && editorEmbedReturn && isQuizCarry()
+      && (quizCarryEmbedCountdownEndAt > Date.now() || quizCarryEmbedPreOptionCountdownEndAt > Date.now())) {
       syncQuizCarryEmbedCountdownLayout();
     }
     drawQuizTfScorePopupsLayer(ctx, worldToScreen, zDraw, timeMs);

www/html/Game/public/js/version.js

@@ -1,6 +1,6 @@
 // ทุกครั้งที่มีการเพิ่มหรือเปลี่ยน ให้เพิ่ม v +0.0001
 // หลังแก้ค่าแล้วต้อง copy ไป path ที่ Nginx ชี้ (หรือรัน copy-frogger-files-only.sh) ถึงจะเห็นบนเว็บ
-window.APP_VERSION = '0.0295';
+window.APP_VERSION = '0.0298';
 document.addEventListener('DOMContentLoaded', function () {
   var t = document.querySelector('.version-tag');
   if (t) t.textContent = 'v ' + window.APP_VERSION;

www/html/Game/public/play.html

@@ -1890,10 +1890,7 @@
       max-width: none;
       align-self: center;
       justify-self: start;
-      display: flex;
-      flex-direction: column;
-      align-items: flex-start;
-      justify-content: center;
+      display: none;
     }
     #play-cyber-hud.play-cyber-hud--gauntlet-crown-strip.play-cyber-hud--score-flush-left .play-cyber-scoreboard.play-cyber-scoreboard--crown-strip {
       grid-area: unset;
@@ -3024,8 +3021,8 @@
     </div>
   </div>
   <script src="/Game/socket.io/socket.io.js"></script>
-    <script src="js/version.js?v=0.0295"></script>
-    <script src="js/play.js?v=0.0295"></script>
+    <script src="js/version.js?v=0.0298"></script>
+    <script src="js/play.js?v=0.0298"></script>
   <div class="version-tag">v —</div>
 </body>
 </html>