236 lines
13 KiB
HTML
236 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="th">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<title>Main Lobby — JD JUSTICE DIVERS</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="style.css?v=0.0189">
|
|
<link rel="stylesheet" href="daily-popup.css?v=8">
|
|
<link rel="stylesheet" href="../Game/css/customize-popup.css?v=39">
|
|
<link rel="stylesheet" href="../Game/css/profile-popup.css?v=5">
|
|
</head>
|
|
<body class="lobby-page">
|
|
<div class="lobby-bg" role="img" aria-label="พื้นหลัง">
|
|
<img src="IMAGE/BG-Main-Lobby.png" alt="" class="lobby-bg-img" role="presentation" decoding="async">
|
|
</div>
|
|
<div class="lobby-vignette" aria-hidden="true"></div>
|
|
|
|
<div class="lobby-ui">
|
|
<header class="lobby-header">
|
|
<div class="lobby-profile-panel">
|
|
<img src="IMAGE/profile-bg.png" alt="" class="lobby-profile-bg" role="presentation" decoding="async">
|
|
<div class="lobby-profile-inner">
|
|
<div class="lobby-avatar-wrap">
|
|
<img src="" alt="" class="lobby-avatar-mask" id="lobby-profile-avatar" width="50" height="50" decoding="async">
|
|
</div>
|
|
<div class="lobby-profile-info">
|
|
<p class="lobby-profile-name" id="lobby-profile-name">MONE</p>
|
|
<p class="lobby-profile-meta">AGENT ID : <span id="lobby-profile-agent-id">001998</span></p>
|
|
<p class="lobby-profile-coins">
|
|
<img src="IMAGE/coin-JD.png" alt="" class="lobby-coin-icon" role="presentation" width="18" height="18" decoding="async">
|
|
COINS : <span id="lobby-profile-coins">0</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="lobby-news-wrap">
|
|
<img src="IMAGE/news-banner-bg.png" alt="" class="lobby-news-bg" role="presentation" decoding="async">
|
|
<img src="IMAGE/news.png" alt="ข่าวสารศูนย์บัญชาการ" class="lobby-news-img" role="presentation" decoding="async">
|
|
</div>
|
|
<div class="lobby-header-row2-left">
|
|
<button type="button" class="lobby-btn-tutorial" id="btn-tutorial" title="วิธีเล่น" aria-label="วิธีเล่น">
|
|
<img src="IMAGE/btn-tutorial.png" alt="" class="lobby-btn-tutorial-img" role="presentation" decoding="async">
|
|
</button>
|
|
</div>
|
|
<button type="button" class="lobby-btn-daily" id="btn-daily" aria-label="รางวัลประจำวัน">
|
|
<img src="IMAGE/daily-rewards.png" alt="" class="lobby-daily-img" role="presentation" decoding="async">
|
|
<span class="lobby-daily-dot" aria-hidden="true"></span>
|
|
</button>
|
|
</header>
|
|
|
|
<div class="lobby-character-area">
|
|
<div class="lobby-center-left">
|
|
<button type="button" class="lobby-btn-cloth" id="btn-cloth" aria-label="ห้องแต่งตัว">
|
|
<img src="IMAGE/btn-cloth.png" alt="" class="lobby-btn-cloth-img" role="presentation" decoding="async">
|
|
</button>
|
|
</div>
|
|
<div class="lobby-character-center" id="lobby-character-center" aria-hidden="true">
|
|
<img id="lobby-character-img" src="" alt="" class="lobby-character-img" width="256" height="256" decoding="async">
|
|
</div>
|
|
</div>
|
|
|
|
<aside class="lobby-leaderboard" aria-label="กระดานผู้นำ">
|
|
<img src="IMAGE/leaderboard-bg.png" alt="" class="lobby-leaderboard-bg" role="presentation" decoding="async">
|
|
<div class="lobby-leaderboard-mask">
|
|
<div class="lobby-leaderboard-inner">
|
|
<div class="lobby-leaderboard-scroll">
|
|
<ul class="lobby-leaderboard-list">
|
|
<li>
|
|
<img src="IMAGE/leaderboard-1.png" alt="" class="lobby-rank-icon" role="presentation" decoding="async">
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Mixie Kim</span>
|
|
<span class="lobby-rank-case">(คดี : มหาเศรษฐีนามปลอม)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9999</span>
|
|
</li>
|
|
<li>
|
|
<img src="IMAGE/leaderboard-2.png" alt="" class="lobby-rank-icon" role="presentation" decoding="async">
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Golden L.</span>
|
|
<span class="lobby-rank-case">(คดี : โจรกรรมไซเบอร์)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9951</span>
|
|
</li>
|
|
<li>
|
|
<img src="IMAGE/leaderboard-3.png" alt="" class="lobby-rank-icon" role="presentation" decoding="async">
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Lilly 991</span>
|
|
<span class="lobby-rank-case">(คดี : ปั่นแอพพลวงเกม)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9552</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">4</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Nova Byte</span>
|
|
<span class="lobby-rank-case">(คดี : ฟิชชิงองค์กร)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9410</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">5</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Aster R.</span>
|
|
<span class="lobby-rank-case">(คดี : แก๊งค์หลอกลงทุน)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9280</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">6</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Hexa One</span>
|
|
<span class="lobby-rank-case">(คดี : เจาะระบบธนาคาร)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9145</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">7</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Mint C.</span>
|
|
<span class="lobby-rank-case">(คดี : ปลอมเพจขายสินค้า)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">9032</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">8</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Q-Logic</span>
|
|
<span class="lobby-rank-case">(คดี : หลอกโอนผ่านแชท)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">8918</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">9</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Rin 47</span>
|
|
<span class="lobby-rank-case">(คดี : ลักข้อมูลส่วนบุคคล)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">8804</span>
|
|
</li>
|
|
<li>
|
|
<span class="lobby-rank-num">10</span>
|
|
<div class="lobby-rank-info">
|
|
<span class="lobby-rank-name">Skyline X</span>
|
|
<span class="lobby-rank-case">(คดี : ฟอกเงินคริปโต)</span>
|
|
</div>
|
|
<span class="lobby-rank-score">8690</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="lobby-leaderboard-scroll-track" id="lobby-leaderboard-scroll-track" aria-hidden="true"></div>
|
|
<div class="lobby-leaderboard-scroll-thumb" id="lobby-leaderboard-scroll-thumb" aria-hidden="true"></div>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<footer class="lobby-footer">
|
|
<div class="lobby-footer-left">
|
|
<button type="button" class="lobby-btn-ai-chat" id="btn-ai-chat" aria-label="เทพความรู้">
|
|
<img src="IMAGE/BTN-AI-ChatBOT.png" alt="" class="lobby-btn-ai-chat-img" role="presentation" decoding="async">
|
|
</button>
|
|
</div>
|
|
<div class="lobby-footer-center">
|
|
<button type="button" class="lobby-btn-start" id="btn-start-mission" aria-label="ไปเมนูหลัก" data-href="../Main-Menu/">
|
|
<img src="IMAGE/btn-start-mission.png" alt="" class="lobby-btn-start-img" role="presentation" decoding="async">
|
|
</button>
|
|
<button type="button" class="lobby-btn-quiz" id="btn-quiz-battle" aria-label="ห้องเกมตอบคำถาม" data-href="../Quiz-Battle/">
|
|
<img src="IMAGE/btn-quix%20battle.png" alt="" class="lobby-btn-quiz-img" role="presentation" decoding="async">
|
|
</button>
|
|
</div>
|
|
<div class="lobby-footer-right">
|
|
<button type="button" class="lobby-btn-profile" id="btn-myprofile" aria-label="โปรไฟล์ของฉัน">
|
|
<img src="IMAGE/btn-myprofile.png" alt="" class="lobby-btn-profile-img" role="presentation" decoding="async">
|
|
</button>
|
|
</div>
|
|
</footer>
|
|
|
|
<div id="lobby-guide-dim" class="lobby-guide-dim hidden" aria-hidden="true"></div>
|
|
<div id="lobby-guide-focus" class="lobby-guide-focus hidden" aria-hidden="true"></div>
|
|
<div class="lobby-guide-bar hidden" id="lobby-guide-bar" role="dialog" aria-modal="true" aria-labelledby="guide-img-label">
|
|
<span id="guide-img-label" class="sr-only">คำแนะนำทีละขั้น</span>
|
|
<div class="lobby-guide-frame">
|
|
<img src="IMAGE/guide/guide-01.png" alt="คำแนะนำ" class="lobby-guide-img" id="guide-img" decoding="async">
|
|
<button type="button" class="lobby-guide-next" id="btn-guide-next" aria-label="ถัดไป">
|
|
<img src="IMAGE/guide/btn-next.png" alt="" decoding="async">
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- แชท AI — API เดียวกับ room-lobby -->
|
|
<div id="lobby-ai-chat-panel" class="lobby-ai-chat-panel lobby-ai-chat-hidden" role="dialog" aria-label="เทพความรู้">
|
|
<div class="lobby-ai-chat-header">
|
|
<span class="lobby-ai-chat-title">
|
|
<img src="../Game/img/ai-chat-header.png" alt="คุยกับ AI" decoding="async">
|
|
<img src="../Game/img/ai-chat-title-label.png" alt="เทพความรู้" class="lobby-ai-chat-title-label" decoding="async">
|
|
</span>
|
|
<button type="button" class="lobby-ai-chat-close" id="lobby-ai-chat-close-btn" title="ปิดแชท AI" aria-label="ปิดแชท AI">
|
|
<img src="../Game/img/chat-close-btn.png" alt="ปิด" id="lobby-ai-chat-toggle-img" width="50" height="50" decoding="async">
|
|
</button>
|
|
</div>
|
|
<div id="lobby-ai-chat-messages" class="lobby-ai-chat-messages"></div>
|
|
<form id="lobby-ai-chat-form" class="lobby-ai-chat-form">
|
|
<input id="lobby-ai-chat-input" type="text" placeholder="Type a here..." autocomplete="off" aria-label="ข้อความถึง AI">
|
|
<button type="submit" class="lobby-ai-chat-send" title="ส่ง" aria-label="ส่ง">
|
|
<img src="../Game/img/chat-btn-send.png" alt="" decoding="async">
|
|
</button>
|
|
</form>
|
|
<p class="lobby-ai-chat-admin-link"><a href="../Game/ai-admin.html" target="_blank" rel="noopener noreferrer">ตั้งค่า AI (Admin)</a></p>
|
|
</div>
|
|
|
|
<div id="lobby-howto-overlay" class="lobby-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="lobby-howto-title">
|
|
<div class="lobby-howto-inner">
|
|
<h2 id="lobby-howto-title" class="sr-only">วิธีเล่น</h2>
|
|
<img src="IMAGE/Howto/howtoplay.png" alt="วิธีเล่น" decoding="async">
|
|
<div class="lobby-howto-close">
|
|
<button type="button" class="lobby-icon-btn" id="btn-howto-got-it" aria-label="เข้าใจแล้ว">
|
|
<img src="IMAGE/Howto/btn-got-it.png" alt="" decoding="async" onerror="this.style.display='none'; this.parentElement.textContent='ปิด';">
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="lobby-toast" class="lobby-toast" role="status" aria-live="polite"></div>
|
|
|
|
<script src="../app-base.js?v=2"></script>
|
|
<script src="../Game/js/display-name.js?v=2"></script>
|
|
<script src="daily-popup.js?v=25" data-daily-trigger="#btn-daily" data-daily-asset-base="IMAGE/Daily" data-daily-test-reset-seconds="0"></script>
|
|
<script src="../Game/js/customize-popup.js?v=26" data-customize-triggers="#btn-cloth" data-customize-asset-base="/Game/img/03-5-Customize"></script>
|
|
<script src="../Game/js/profile-popup.js?v=6" data-profile-trigger="#btn-myprofile" data-profile-asset-base="/Game/img/03-6-Profile"></script>
|
|
<script src="lobby.js?v=0.0190"></script>
|
|
</body>
|
|
</html>
|