feat: expand campaign and refine puzzle visuals and controls

This commit is contained in:
cabinw
2026-09-09 11:02:45 +08:00
parent 9f8990b579
commit 70b021d4cc
66 changed files with 41108 additions and 10553 deletions
+4 -4
View File
@@ -6,8 +6,8 @@
<header class="game-top"><button class="game-icon" id="map-button" aria-label="选择关卡"><svg><use href="#i-grid"/></svg></button><button class="game-icon help-trigger" aria-label="玩法与设置"><svg><use href="#i-help"/></svg></button></header>
<main class="workspace">
<section class="game-column">
<div class="level-heading"><div class="level-ribbon" id="level-eyebrow">LEVEL 01</div><h1 id="level-name">转一转,路就通了</h1><button class="difficulty-pill" id="difficulty-button"><span id="difficulty-label">轻松 · 29</span><span>详情</span></button></div>
<div class="hud"><div class="hud-pill"><span class="ui-icon hud-symbol" data-icon="gem"></span><div><span id="remaining-title">待离场</span><strong id="remaining">7<small> / 7</small></strong></div></div><div class="moves-bubble"><span id="moves-title">剩余步数</span><strong id="moves">11</strong></div><div class="hud-pill turn-counter"><span class="ui-icon hud-symbol" data-icon="right"></span><div><span id="orientation-title">底盘朝向</span><strong id="orientation">0<small>°</small></strong></div></div></div>
<div class="level-heading"><div class="level-ribbon" id="level-eyebrow">LEVEL 01</div><h1 id="level-name">一眼看见出口</h1><button class="difficulty-pill" id="difficulty-button"><span id="difficulty-label">轻松 · 0</span><span>详情</span></button></div>
<div class="theme-caption" id="theme-caption"></div><div class="hud"><div class="hud-pill"><span class="ui-icon hud-symbol" data-icon="gem"></span><div><span id="remaining-title">待离场</span><strong id="remaining">12<small> / 12</small></strong></div></div><div class="moves-bubble"><span id="moves-title">待解棋子</span><strong id="moves">12</strong></div><div class="hud-pill turn-counter"><span class="ui-icon hud-symbol" data-icon="right"></span><div><span id="orientation-title">底盘朝向</span><strong id="orientation">0<small>°</small></strong></div></div></div>
<article class="game-card">
<div class="canvas-wrap"><canvas id="board" aria-label="六角轨道棋盘,点击棋子沿轨道离场,拖动边缘旋转底盘"></canvas><div class="board-toast" id="board-toast" role="status" aria-live="polite"></div></div>
<div class="board-instruction" id="instruction">点击箭头,让棋子沿轨道离场</div>
@@ -20,7 +20,7 @@
<aside class="inspector panel editor-panel" id="editor-panel" hidden>
<div class="eyebrow">LEVEL WORKSHOP</div><h3>把灵感,连成轨迹</h3><p class="muted">选择工具,再轻点棋盘中的格子。</p>
<label class="field">关卡名称<input id="editor-name" maxlength="60" value="我的第一条轨迹"></label>
<div class="field-row"><label class="field">底板大小<select id="editor-radius"><option value="2">小 · 19 格</option><option value="3" selected>中 · 37 格</option></select></label><label class="field">步数上限<input id="editor-moves" type="number" min="1" max="999" value="30"></label></div>
<div class="field-row"><label class="field">底板大小<select id="editor-radius"><option value="2">小 · 19 格</option><option value="3" selected>中 · 37 格</option><option value="4">大 · 61 格</option><option value="5">超大 · 边长 6 · 91 格</option><option value="6">极大 · 边长 7 · 127 格</option></select></label><label class="field">成功离场额度<input id="editor-moves" type="number" min="1" max="999" value="30"></label></div>
<div class="editor-rotation"><button id="editor-turn-left"><span class="ui-icon" data-icon="left"></span> 底盘左转</button><button id="editor-turn-right"><span class="ui-icon" data-icon="right"></span> 底盘右转</button></div><div class="section-label">编辑工具</div><div class="tool-palette" id="tool-palette"><button data-tool="tile" class="active"><span class="ui-icon" data-icon="arrow"></span><span>放置棋子</span></button><button data-tool="rotate"><span class="ui-icon" data-icon="right"></span><span>转向棋子</span></button><button data-tool="track"><span class="ui-icon" data-icon="track"></span><span>切换轨道</span></button><button data-tool="rotate-track"><span class="ui-icon" data-icon="right"></span><span>旋转轨道</span></button><button data-tool="erase"><span class="ui-icon" data-icon="erase"></span><span>擦除棋子</span></button><button data-tool="inspect"><span class="ui-icon" data-icon="bulb"></span><span>查看路径</span></button></div>
<div class="field-row"><div><div class="section-label">箭头方向</div><div class="directions" id="directions"></div></div><div><div class="section-label">棋子配色</div><div class="swatches" id="swatches"></div></div></div>
<p id="selection-info" class="selection-info">还没有选择格子</p>
@@ -29,7 +29,7 @@
<p class="editor-footnote">轨道、棋子与评分均使用独立数据模型。JSON 可作为后续 Cocos Creator 关卡资源。碰撞检查与正式游戏保持一致。</p>
</aside>
</main>
<nav class="game-bottom"><button id="play-tab" class="active"><svg><use href="#i-hex"/></svg>游戏</button><span class="journey-badge"><span class="ui-icon" data-icon="star"></span> <b id="progress-label">0 / 24</b><small>已完成</small></span><button id="edit-tab"><svg><use href="#i-edit"/></svg>关卡工坊</button></nav>
<nav class="game-bottom"><button id="play-tab" class="active"><svg><use href="#i-hex"/></svg>游戏</button><span class="journey-badge"><span class="ui-icon" data-icon="star"></span> <b id="progress-label">0 / 48</b><small>已完成</small></span><button id="edit-tab"><svg><use href="#i-edit"/></svg>关卡工坊</button></nav>
</div>
<div class="compat" hidden><span id="breadcrumb"></span><span id="mini-caption"></span><div id="level-list"></div><i id="campaign-progress"></i><div id="play-inspector"><span id="score-value"></span><span id="score-name"></span><span id="score-summary"></span><div id="score-bars"></div><button id="score-help"></button><button id="workshop-link"></button></div></div>
<dialog class="win-overlay" id="result" aria-label="关卡结果" hidden></dialog>