save code

game/index.html

@@ -63,6 +63,19 @@
     }
     @keyframes fadein{from{opacity:0}to{opacity:1}}
 
+    /* ── 操作提示栏 ── */
+    #hint{
+      position:fixed;bottom:0;left:0;right:0;z-index:70;
+      padding:12px 24px 20px;
+      text-align:center;
+      font-size:11px;letter-spacing:1.5px;color:#444;
+      background:linear-gradient(transparent,rgba(0,0,0,0.85));
+      pointer-events:none;
+      min-height:52px;
+      display:flex;align-items:flex-end;justify-content:center;
+      transition:opacity 0.4s;
+    }
+
     /* ── 调试条（开发用） ── */
     #dbg{
       display:none;
@@ -125,6 +138,7 @@
 </div>
 
 <div id="caption"></div>
+<div id="hint"></div>
 <div id="dbg"></div>
 
 <script src="js/utils.js"></script>

game/js/engine.js

@@ -2,8 +2,8 @@
 
 class GameEngine {
   constructor() {
-    // 游戏状态
+    // 游戏状态（通过 setter 自动更新提示栏）
-    this.state = 'idle';  // idle→playing→ringing→in_call→msg_incoming→msg_playing→await_reply→detail_reply→inbox→ending
+    this._state = 'idle'; // idle→playing→ringing→in_call→msg_incoming→msg_playing→await_reply→detail_reply→inbox→ending
 
     // 剧情变量
     this.vars = {
@@ -42,6 +42,27 @@ class GameEngine {
     this._doorbell = false;
   }
 
+  // ── state getter/setter（自动更新提示栏）──
+  get state()  { return this._state; }
+  set state(s) {
+    this._state = s;
+    const el = document.getElementById('hint');
+    if (!el) return;
+    const H = {
+      playing:      '↓ 查状态   ↑ 收件箱',
+      ringing:      '单点 接听   左滑 拒接',
+      in_call:      '左滑 挂断',
+      msg_incoming: '单点 播放   左滑 忽略',
+      msg_playing:  '播放中…',
+      await_reply:  '单点 嗯   双点 标准   长按 细回复   左滑 不回',
+      detail_reply: '上下左右 选择   单点 重听',
+      inbox:        '单点 进入   左滑 返回',
+      ending:       '',
+      idle:         '',
+    };
+    el.textContent = H[s] ?? '';
+  }
+
   // ══════════════════════════════════════════
   //   初始化
   // ══════════════════════════════════════════