6d1dd5d56c
- server.py: zero-dependency stdlib backend (HTTP + WebSocket /ws), 大话骰 rule engine, server-driven bots - live.html: real MVP frontend wired to the backend over WebSocket - index.html/app.js/style.css: older static prototype - deploy/: systemd unit + Nginx reverse proxy + Let's Encrypt setup.sh - test_*.py: standalone HTTP / in-process test scripts Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
73 lines
4.5 KiB
HTML
73 lines
4.5 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>酒桌派对 - 可点击原型</title>
|
||
<link rel="stylesheet" href="style.css?v=4" />
|
||
</head>
|
||
<body>
|
||
<main class="app-shell">
|
||
<header class="app-top">
|
||
<button class="icon-btn" data-back hidden>‹</button>
|
||
<div class="brand"><span class="logo">🍻</span><div><strong>酒桌派对</strong><small id="subtitle">Drinking Game Hub</small></div></div>
|
||
<button class="ghost-btn small" data-open="rules">规则</button>
|
||
</header>
|
||
|
||
<section class="screen active" id="home">
|
||
<div class="hero-card">
|
||
<p class="eyebrow">多人聚会 · 手机即开 · 房间制</p>
|
||
<h1>一站式喝酒游戏大厅</h1>
|
||
<p class="lead">集合德州扑克、大话骰、六张牌、抓二游，适合线下酒局、朋友聚会、KTV、酒吧局。</p>
|
||
<div class="join-panel">
|
||
<label>你的昵称</label>
|
||
<div class="input-row"><input id="nickname" placeholder="例如：小鱼" value="小鱼" /><button data-action="enter">进入大厅</button></div>
|
||
</div>
|
||
</div>
|
||
<div class="quick-actions">
|
||
<button class="primary-action" data-open="create">快速开房</button>
|
||
<button data-open="join">输入房间号</button>
|
||
<button data-action="randomJoin">随机加入</button>
|
||
</div>
|
||
<div class="section-head"><div><p class="eyebrow">Game Collection</p><h2>选择游戏</h2></div><span class="online-pill">128 人在线</span></div>
|
||
<section class="game-grid" id="gameGrid"></section>
|
||
<section class="room-section"><div class="section-head compact"><div><p class="eyebrow">Open Rooms</p><h2>可加入房间</h2></div><button class="ghost-btn dark" data-action="toast">刷新</button></div><div class="room-list" id="roomList"></div></section>
|
||
</section>
|
||
|
||
<section class="screen" id="room">
|
||
<div class="room-hero">
|
||
<p class="eyebrow">Room <span id="roomCode">A102</span></p>
|
||
<h1 id="roomTitle">大话骰房间</h1>
|
||
<p class="lead" id="roomDesc">等待玩家加入，房主可调整规则并开始游戏。</p>
|
||
<div class="room-actions"><button data-action="copyInvite">复制邀请</button><button class="ghost-btn" data-action="toggleLock">暂停加入</button></div>
|
||
</div>
|
||
<div class="panel"><div class="section-head compact"><h2>玩家</h2><span class="online-pill" id="playerCount">5/8</span></div><div class="players" id="players"></div></div>
|
||
<div class="panel"><div class="section-head compact"><h2>房间设置</h2></div><div class="settings"><label>喝酒惩罚<select><option>输家 1 杯</option><option>输家 2 杯</option><option>自定义</option></select></label><label>游戏节奏<select><option>普通</option><option>快速</option><option>疯狂</option></select></label></div></div>
|
||
<button class="wide primary-action" data-action="startGame">开始游戏</button>
|
||
</section>
|
||
|
||
<section class="screen" id="game">
|
||
<div class="game-header"><p class="eyebrow" id="gameMode">Dice Round 03</p><h1 id="gameTitle">大话骰</h1><p class="lead" id="gameHint">轮到阿杰叫点。</p></div>
|
||
<div id="gameBoard"></div>
|
||
<div class="action-dock" id="gameActions"></div>
|
||
</section>
|
||
|
||
<section class="screen" id="result">
|
||
<div class="result-card"><div class="trophy">🏆</div><p class="eyebrow">Round Result</p><h1 id="resultTitle">小鱼获胜</h1><p class="lead" id="resultDesc">阿杰本局失败，按规则喝 1 杯。</p><div class="punish">🍺 <strong id="punishText">阿杰喝 1 杯</strong></div><button class="wide primary-action" data-action="again">再来一局</button><button class="wide ghost-btn" data-go="home">返回大厅</button></div>
|
||
</section>
|
||
|
||
<section class="screen" id="profile">
|
||
<div class="panel"><p class="eyebrow">My Stats</p><h1>我的酒桌战绩</h1><div class="stats"><div><strong>12</strong><span>胜场</span></div><div><strong>7</strong><span>喝酒</span></div><div><strong>4</strong><span>开房</span></div></div></div>
|
||
</section>
|
||
|
||
<nav class="bottom-nav"><a class="active" data-go="home">大厅</a><a data-go="room">房间</a><a data-go="result">结算</a><a data-go="profile">我的</a></nav>
|
||
</main>
|
||
|
||
<div class="modal" id="modal">
|
||
<div class="modal-card"><button class="close" data-close>×</button><div id="modalContent"></div></div>
|
||
</div>
|
||
<div class="toast" id="toast">已刷新</div>
|
||
<script src="app.js?v=2"></script>
|
||
</body>
|
||
</html>
|