130 lines
9.0 KiB
HTML
130 lines
9.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="th">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="robots" content="noindex,nofollow">
|
|
<title>สรุปงานพัฒนา Justice — 17 มิ.ย. 2026</title>
|
|
<style>
|
|
:root{--blue:#1f3864;--blue2:#2e75b6;--bg:#0e1426;--card:#161e36;--ink:#e7ecff;--mut:#9aa6c8;--ok:#5dffa0;--warn:#ffd166}
|
|
*{box-sizing:border-box}
|
|
body{margin:0;background:linear-gradient(160deg,#0b1020,#101a33);color:var(--ink);font-family:"Segoe UI","Tahoma","Leelawadee UI",system-ui,sans-serif;line-height:1.6}
|
|
.wrap{max-width:880px;margin:0 auto;padding:32px 20px 80px}
|
|
header{text-align:center;padding:28px 16px 22px;border-bottom:2px solid var(--blue2);margin-bottom:26px}
|
|
h1{margin:0 0 6px;font-size:30px;color:#bcd4ff}
|
|
.sub{color:var(--mut);font-size:15px}
|
|
.badge{display:inline-block;margin-top:10px;padding:4px 12px;border:1px solid var(--ok);border-radius:999px;color:var(--ok);font-size:13px}
|
|
section{background:var(--card);border:1px solid #25304f;border-radius:14px;padding:18px 22px;margin:16px 0;box-shadow:0 6px 24px rgba(0,0,0,.3)}
|
|
h2{margin:0 0 10px;font-size:20px;color:#9fc3ff;display:flex;align-items:center;gap:10px}
|
|
h2 .n{flex:none;width:30px;height:30px;border-radius:8px;background:var(--blue2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
|
|
h3{margin:14px 0 6px;font-size:15px;color:#c8d6ff;letter-spacing:.02em}
|
|
ul{margin:6px 0;padding-left:22px}
|
|
li{margin:4px 0}
|
|
.lead{color:var(--mut);font-style:italic;margin:0 0 8px}
|
|
.pend{color:var(--warn)}
|
|
.pend b{color:#ffe08a}
|
|
.ref b{color:#9fffd0}
|
|
code{background:#0c1224;border:1px solid #2a3656;border-radius:5px;padding:1px 6px;font-size:13px;color:#bfe0ff}
|
|
footer{text-align:center;color:var(--mut);font-size:13px;margin-top:30px}
|
|
.pill{display:inline-block;background:#0c1224;border:1px solid #2a3656;border-radius:6px;padding:1px 8px;font-size:12px;color:#9fc3ff;margin-left:6px}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<header>
|
|
<h1>สรุปงานพัฒนา — เกม Justice (นักสืบไซเบอร์)</h1>
|
|
<div class="sub">วันที่ 17 มิถุนายน 2026 · Production: srv1361159.hstgr.cloud</div>
|
|
<div class="badge">✓ Deploy ขึ้น prod แล้วทั้งหมด</div>
|
|
</header>
|
|
|
|
<p class="lead">เอกสารนี้สรุปงานที่พัฒนา/แก้ไขในวันนี้ทั้งหมด 6 เรื่องหลัก — ทุกอย่างถูก deploy ขึ้น production และตรวจสอบการทำงานแล้ว</p>
|
|
|
|
<section>
|
|
<h2><span class="n">1</span> Special Quiz — หน้าคำถาม/เฉลย</h2>
|
|
<p class="lead">รื้อดีไซน์ใหม่ให้ตรงกับ mock 09-Quiz</p>
|
|
<ul>
|
|
<li>กรอบ panel ใช้ <code>special-quiz.png</code>, ตัวเลือกแบบ "A : ข้อความ" ใช้ <code>choice-*.png</code> + เครื่องหมายถูก/ผิด</li>
|
|
<li>วงนับเวลาย้ายมากลาง-ล่างของกรอบ</li>
|
|
<li>ตัด chip "สมาชิกในรอบนี้" ออก → แสดง <b>avatar ผู้เล่นใต้คำตอบที่เลือก</b> (ตัวเองตอนกดตอบ, ทุกคนตอนเฉลย)</li>
|
|
<li class="pend"><b>ยังค้าง:</b> avatar เป็นวงเลขสี (ยังไม่ใช่หน้าตัวละครจริง), ปุ่ม "ถัดไป" ยังซ่อน, หน้าการ์ดรางวัล (m3) ยัง layout เดิม</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2><span class="n">2</span> หน้าสรุปผลภารกิจ — โบนัสพิเศษ</h2>
|
|
<ul>
|
|
<li>แสดงรูปสถานะการ์ดเสมอ (ไม่ขึ้นกับเกรด): ได้การ์ด = <code>mission-complete-select.png</code>, ไม่ได้ = <code>mission-complete.png</code></li>
|
|
<li>ช่องการ์ด: ได้ = โชว์การ์ดที่ได้, ไม่ได้ = <code>popup-result-card-bg.png</code></li>
|
|
<li>เอาข้อความ "ไม่ได้รับการ์ด" ออกตามที่ขอ</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2><span class="n">3</span> ระบบ Achievements <span class="pill">สร้างใหม่ทั้งระบบ</span></h2>
|
|
<p class="lead">25 รางวัล แบ่ง 5 หมวด (Analyst / Explorer / Risk / Support / Elite)</p>
|
|
<h3>ส่วนผู้เล่น (โปรไฟล์)</h3>
|
|
<ul>
|
|
<li>แสดงแคตตาล็อก 25 รางวัล (ชื่อ + คำอธิบาย + แถบ progress + ตัวนับ) สลับหมวด 5 ปุ่ม</li>
|
|
<li>ใส่รูป badge 25 ใบในกรอบ icon</li>
|
|
</ul>
|
|
<h3>ส่วน Admin</h3>
|
|
<ul>
|
|
<li>แท็บ "Achievements": แก้แคตตาล็อก + จัดการ progress รายผู้เล่น (ตั้งค่า/ปลดล็อก/รีเซ็ต)</li>
|
|
</ul>
|
|
<h3>Auto-track (ติดตามอัตโนมัติ)</h3>
|
|
<ul>
|
|
<li>d1 Minigame Solver — รอดมินิเกม</li>
|
|
<li>a1 First Deduction / a5 Truth Hunter — โหวตถูกตัวคนร้าย</li>
|
|
<li>e2 The Impostor / e4 Agent of Chaos — รับบทตัวป่วน · e3 / e5 — เมื่อตัวป่วนชนะ</li>
|
|
<li class="pend"><b>ยังค้าง:</b> a2, a3, a4, a6, b*, c*, d2-d4, e1 (ต้องเก็บ state เพิ่ม) — ตั้งค่าผ่าน Admin ได้</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2><span class="n">4</span> ฉากจบ (Trial Final)</h2>
|
|
<ul>
|
|
<li>ชนะ + ไม่มีตัวป่วน → แสดง <b>ผู้เล่นทุกคน</b>บนโพเดียม (เดิมแสดงแค่ผู้โหวตถูก)</li>
|
|
<li>โหวตผิด + มีตัวป่วน → <code>troll-win-bg.png</code> + ตัวละครตัวป่วน + <code>txt-troll-win.png</code></li>
|
|
<li>โหวตผิด + ไม่มีตัวป่วน → <code>lose-bg.png</code> + <code>txt-your-lose.png</code> (เดิมขึ้น troll-win ผิด)</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2><span class="n">5</span> Leaderboard (Main-Lobby)</h2>
|
|
<ul>
|
|
<li>เปลี่ยนจาก "(เหรียญ : ...)" → <b>"(คดี : ชื่อคดี)"</b></li>
|
|
<li>แสดงคะแนนสูงสุดของแต่ละผู้เล่น + ระบุว่าได้จากคดีไหน (ดึงชื่อจาก case-media.json)</li>
|
|
<li class="pend"><b>หมายเหตุ:</b> คดี 4-15 ยังเป็นชื่อ default "คดีที่ N" — ตั้งชื่อจริงที่ Admin → "รูปคดี & Cutscene"</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2><span class="n">6</span> การ์ด Bail Coin — รอบโหวตใหม่ (จับผิดตัว)</h2>
|
|
<ul>
|
|
<li>ใบที่โหวตผิดไปแล้วถูกตีตรา "โหวตผิดไปแล้ว" + หรี่/เทาทั้งใบ</li>
|
|
<li>ห้ามโหวตซ้ำ — กัน 3 ชั้น: client (กดไม่ได้), server (ปฏิเสธ), บอท (หลบไปโหวตคนร้ายจริง)</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section class="ref">
|
|
<h2>ตอบคำถาม / อ้างอิง</h2>
|
|
<ul>
|
|
<li><b>แก้ Quiz-Battle:</b> เนื้อหา/หมวด → Admin → แท็บ "Quiz Battle" · หน้าตาเพจ → ไฟล์ <code>Quiz-Battle/index.html, quiz-battle.js, style.css</code></li>
|
|
<li><b>ทดสอบฉากจบ:</b> Test Mode → <code>Ctrl+Alt+1</code> ชนะ · <code>Ctrl+Alt+2</code> แพ้ · <code>Ctrl+Alt+3</code> สลับตัวป่วน · <code>Ctrl+Alt+W</code> บังคับโหวตผิด</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>งานที่ยังเปิดค้าง</h2>
|
|
<ul>
|
|
<li>Special Quiz: avatar หน้าตัวละครจริง + ปุ่ม "ถัดไป" + หน้าการ์ดรางวัล (m3)</li>
|
|
<li>Achievements: auto-track เงื่อนไขที่เหลือ (ต้องเก็บ state ระดับหลักฐาน/สตรีค)</li>
|
|
<li>ตั้งชื่อคดี 4-15 ใน Admin เพื่อให้ leaderboard แสดงชื่อจริง</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<footer>Justice — สรุปงานพัฒนา 17 มิถุนายน 2026</footer>
|
|
</div>
|
|
</body>
|
|
</html>
|