diff --git a/www/html/Game/public/js/play.js b/www/html/Game/public/js/play.js index 469ae97..bb9f2d5 100644 --- a/www/html/Game/public/js/play.js +++ b/www/html/Game/public/js/play.js @@ -1490,14 +1490,16 @@ } function normalizeQuizCarryQuestionFromAny(q) { - if (!q || !String(q.text || '').trim()) return null; - const text = String(q.text).trim(); + if (!q) return null; + let text = String(q.text || q.question || q.prompt || q.title || '').trim(); if (Array.isArray(q.choices) && q.choices.length >= 2) { const choices = q.choices.map((c) => String(c)); let ci = Number(q.correctIndex); if (!Number.isFinite(ci) || ci < 0 || ci >= choices.length) ci = 0; + if (!text) text = 'เลือกคำตอบที่ถูกต้อง — หยิบตัวเลือกไปวางโซนส่งคำตอบ'; return { text, choices, correctIndex: ci }; } + if (!text) return null; const t = !!q.answerTrue; return { text, choices: ['จริง', 'เท็จ'], correctIndex: t ? 0 : 1 }; } @@ -1859,7 +1861,7 @@ /** ข้อความใน HUD / โซนคำถาม — ไม่รวมตัวเลือก (แสดงบนแผนที่ตามจุดสี) */ function formatQuizCarryQuestionHud(q) { if (!q) return ''; - return String(q.text || '').trim(); + return String(q.text || q.question || q.prompt || q.title || '').trim(); } function quizCarryRestoreEmbedPhaseLabel() { diff --git a/www/html/Game/public/play.html b/www/html/Game/public/play.html index 26fd08b..a632cad 100644 --- a/www/html/Game/public/play.html +++ b/www/html/Game/public/play.html @@ -121,34 +121,45 @@ text-shadow: 0 0 48px rgba(255, 224, 102, 0.55), 0 4px 24px rgba(0, 0, 0, 0.65); letter-spacing: -0.04em; } + /* ด้านบน: ไม่ชน HUD ล่างบนแคนวาส + เห็นชัดกว่าแถบล่าง */ #quiz-carry-embed-q-strip { position: fixed; left: 50%; - bottom: max(52px, calc(env(safe-area-inset-bottom) + 44px)); + top: max(52px, calc(env(safe-area-inset-top) + 46px)); + bottom: auto; transform: translateX(-50%); - z-index: 10075; - max-width: min(92vw, 640px); - padding: 0.45rem 0.75rem 0.5rem; + z-index: 10100; + max-width: min(92vw, min(640px, calc(100vw - 200px))); + padding: 0.4rem 0.75rem 0.48rem; border-radius: 12px; - background: rgba(12, 14, 28, 0.94); - border: 1px solid rgba(122, 162, 247, 0.45); - box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5); + background: rgba(12, 14, 28, 0.96); + border: 1px solid rgba(122, 162, 247, 0.55); + box-shadow: 0 10px 32px rgba(0, 0, 0, 0.55); pointer-events: none; } #quiz-carry-embed-q-strip.is-hidden { display: none !important; } + .quiz-carry-embed-q-strip-kicker { + display: block; + font: 800 0.58rem / 1.2 system-ui, "Kanit", sans-serif; + letter-spacing: 0.12em; + text-transform: uppercase; + color: #7aa2f7; + margin: 0 0 0.2rem; + text-align: center; + } #quiz-carry-embed-q-strip-text { margin: 0; - font: 600 clamp(0.78rem, 2.2vmin, 1.05rem) / 1.45 system-ui, "Kanit", sans-serif; - color: #f1f5f9; + font: 600 clamp(0.82rem, 2.4vmin, 1.12rem) / 1.45 system-ui, "Kanit", sans-serif; + color: #f8fafc; text-align: center; - text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55); - max-height: 22vh; + text-shadow: 0 1px 10px rgba(0, 0, 0, 0.65); + max-height: min(28vh, 200px); overflow: auto; } - /* อยู่เหนือ overlay นับถอยหลัง (10080) เพื่อให้อ่านคำถามระหว่าง 3–2–1 */ + /* ระหว่าง 3–2–1 อยู่เหนือ overlay นับถอยหลัง (10080) */ #quiz-carry-embed-q-strip.quiz-carry-embed-q-strip--countdown { - z-index: 10082; - bottom: max(14px, calc(env(safe-area-inset-bottom) + 8px)); + z-index: 10120; + top: max(52px, calc(env(safe-area-inset-top) + 46px)); } #play-quiz-scoreboard { position: fixed; @@ -664,6 +675,7 @@
3
- +
v —