Merge branch 'fix/delay' into 'main'

Fix/delay

See merge request mycard/Neos!192

src/service/duel/gameMsg.ts

 import { ygopro } from "@/api";
-import { useConfig } from "@/config";
 import { matStore } from "@/stores";
 
 import onMsgAttack from "./attack";
@@ -57,228 +56,221 @@ const ActiveList = [
   "select_yes_no",
 ];
 
-const NeosConfig = useConfig();
-
 export default function handleGameMsg(pb: ygopro.YgoStocMsg) {
-  // 防止MSG更新太频繁，做下控频
-  const delay = matStore.delay;
-
-  setTimeout(() => {
-    const msg = pb.stoc_game_msg;
-
-    if (ActiveList.includes(msg.gameMsg)) {
-      matStore.waiting = false;
-    }
-
-    switch (msg.gameMsg) {
-      case "start": {
-        onMsgStart(msg.start);
-
-        break;
-      }
-      case "draw": {
-        onMsgDraw(msg.draw);
-
-        break;
-      }
-      case "new_turn": {
-        onMsgNewTurn(msg.new_turn);
-
-        break;
-      }
-      case "new_phase": {
-        onMsgNewPhase(msg.new_phase);
-
-        break;
-      }
-      case "hint": {
-        onMsgHint(msg.hint);
-
-        break;
-      }
-      case "select_idle_cmd": {
-        onMsgSelectIdleCmd(msg.select_idle_cmd);
-
-        break;
-      }
-      case "select_place": {
-        onMsgSelectPlace(msg.select_place);
-
-        break;
-      }
-      case "move": {
-        onMsgMove(msg.move);
-
-        break;
-      }
-      case "select_card": {
-        onMsgSelectCard(msg.select_card);
-
-        break;
-      }
-      case "select_chain": {
-        onMsgSelectChain(msg.select_chain);
-
-        break;
-      }
-      case "select_effect_yn": {
-        onMsgSelectEffectYn(msg.select_effect_yn);
-
-        break;
-      }
-      case "select_position": {
-        onMsgSelectPosition(msg.select_position);
-
-        break;
-      }
-      case "select_option": {
-        onMsgSelectOption(msg.select_option);
-
-        break;
-      }
-      case "shuffle_hand": {
-        onMsgShuffleHand(msg.shuffle_hand);
-
-        break;
-      }
-      case "select_battle_cmd": {
-        onMsgSelectBattleCmd(msg.select_battle_cmd);
-
-        break;
-      }
-      case "pos_change": {
-        onMsgPosChange(msg.pos_change);
-
-        break;
-      }
-      case "select_unselect_card": {
-        onMsgSelectUnselectCard(msg.select_unselect_card);
-
-        break;
-      }
-      case "select_yes_no": {
-        onMsgSelectYesNo(msg.select_yes_no);
-
-        break;
-      }
-      case "update_hp": {
-        onMsgUpdateHp(msg.update_hp);
-
-        break;
-      }
-      case "win": {
-        onMsgWin(msg.win);
-
-        break;
-      }
-      case "wait": {
-        onMsgWait(msg.wait);
-
-        break;
-      }
-      case "update_data": {
-        onMsgUpdateData(msg.update_data);
-
-        break;
-      }
-      case "reload_field": {
-        onMsgReloadField(msg.reload_field);
-
-        break;
-      }
-      case "select_sum": {
-        onMsgSelectSum(msg.select_sum);
-
-        break;
-      }
-      case "select_tribute": {
-        onMsgSelectTribute(msg.select_tribute);
-
-        break;
-      }
-      case "update_counter": {
-        onMsgUpdateCounter(msg.update_counter);
-
-        break;
-      }
-      case "select_counter": {
-        onMsgSelectCounter(msg.select_counter);
-
-        break;
-      }
-      case "sort_card": {
-        onMsgSortCard(msg.sort_card);
-
-        break;
-      }
-      case "set": {
-        onMsgSet(msg.set);
-
-        break;
-      }
-      case "swap": {
-        onMsgSwap(msg.swap);
-
-        break;
-      }
-      case "attack": {
-        onMsgAttack(msg.attack);
-
-        break;
-      }
-      case "attack_disable": {
-        onMsgAttackDisable(msg.attack_disable);
-
-        break;
-      }
-      case "chaining": {
-        onMsgChaining(msg.chaining);
-
-        break;
-      }
-      case "chain_solved": {
-        onMsgChainSolved(msg.chain_solved);
-
-        break;
-      }
-      case "summoning": {
-        onMsgSummoning(msg.summoning);
-
-        break;
-      }
-      case "summoned": {
-        onMsgSummoned(msg.summoned);
-
-        break;
-      }
-      case "flip_summoning": {
-        onMsgFlipSummoning(msg.flip_summoning);
-
-        break;
-      }
-      case "flip_summoned": {
-        onMsgFilpSummoned(msg.flip_summoned);
-
-        break;
-      }
-      case "sp_summoning": {
-        onMsgSpSummoning(msg.sp_summoning);
-
-        break;
-      }
-      case "sp_summoned": {
-        onMsgSpSummoned(msg.sp_summoned);
-
-        break;
-      }
-      case "unimplemented": {
-        onUnimplemented(msg.unimplemented);
-
-        break;
-      }
-      default: {
-        break;
-      }
-    }
-  }, delay);
+  const msg = pb.stoc_game_msg;
+
+  if (ActiveList.includes(msg.gameMsg)) {
+    matStore.waiting = false;
+  }
+
+  switch (msg.gameMsg) {
+    case "start": {
+      onMsgStart(msg.start);
+
+      break;
+    }
+    case "draw": {
+      onMsgDraw(msg.draw);
+
+      break;
+    }
+    case "new_turn": {
+      onMsgNewTurn(msg.new_turn);
+
+      break;
+    }
+    case "new_phase": {
+      onMsgNewPhase(msg.new_phase);
+
+      break;
+    }
+    case "hint": {
+      onMsgHint(msg.hint);
+
+      break;
+    }
+    case "select_idle_cmd": {
+      onMsgSelectIdleCmd(msg.select_idle_cmd);
+
+      break;
+    }
+    case "select_place": {
+      onMsgSelectPlace(msg.select_place);
+
+      break;
+    }
+    case "move": {
+      onMsgMove(msg.move);
+
+      break;
+    }
+    case "select_card": {
+      onMsgSelectCard(msg.select_card);
+
+      break;
+    }
+    case "select_chain": {
+      onMsgSelectChain(msg.select_chain);
+
+      break;
+    }
+    case "select_effect_yn": {
+      onMsgSelectEffectYn(msg.select_effect_yn);
+
+      break;
+    }
+    case "select_position": {
+      onMsgSelectPosition(msg.select_position);
+
+      break;
+    }
+    case "select_option": {
+      onMsgSelectOption(msg.select_option);
+
+      break;
+    }
+    case "shuffle_hand": {
+      onMsgShuffleHand(msg.shuffle_hand);
+
+      break;
+    }
+    case "select_battle_cmd": {
+      onMsgSelectBattleCmd(msg.select_battle_cmd);
+
+      break;
+    }
+    case "pos_change": {
+      onMsgPosChange(msg.pos_change);
+
+      break;
+    }
+    case "select_unselect_card": {
+      onMsgSelectUnselectCard(msg.select_unselect_card);
+
+      break;
+    }
+    case "select_yes_no": {
+      onMsgSelectYesNo(msg.select_yes_no);
+
+      break;
+    }
+    case "update_hp": {
+      onMsgUpdateHp(msg.update_hp);
+
+      break;
+    }
+    case "win": {
+      onMsgWin(msg.win);
+
+      break;
+    }
+    case "wait": {
+      onMsgWait(msg.wait);
+
+      break;
+    }
+    case "update_data": {
+      onMsgUpdateData(msg.update_data);
+
+      break;
+    }
+    case "reload_field": {
+      onMsgReloadField(msg.reload_field);
+
+      break;
+    }
+    case "select_sum": {
+      onMsgSelectSum(msg.select_sum);
+
+      break;
+    }
+    case "select_tribute": {
+      onMsgSelectTribute(msg.select_tribute);
+
+      break;
+    }
+    case "update_counter": {
+      onMsgUpdateCounter(msg.update_counter);
+
+      break;
+    }
+    case "select_counter": {
+      onMsgSelectCounter(msg.select_counter);
+
+      break;
+    }
+    case "sort_card": {
+      onMsgSortCard(msg.sort_card);
+
+      break;
+    }
+    case "set": {
+      onMsgSet(msg.set);
+
+      break;
+    }
+    case "swap": {
+      onMsgSwap(msg.swap);
+
+      break;
+    }
+    case "attack": {
+      onMsgAttack(msg.attack);
+
+      break;
+    }
+    case "attack_disable": {
+      onMsgAttackDisable(msg.attack_disable);
+
+      break;
+    }
+    case "chaining": {
+      onMsgChaining(msg.chaining);
+
+      break;
+    }
+    case "chain_solved": {
+      onMsgChainSolved(msg.chain_solved);
+
+      break;
+    }
+    case "summoning": {
+      onMsgSummoning(msg.summoning);
+
+      break;
+    }
+    case "summoned": {
+      onMsgSummoned(msg.summoned);
+
+      break;
+    }
+    case "flip_summoning": {
+      onMsgFlipSummoning(msg.flip_summoning);
+
+      break;
+    }
+    case "flip_summoned": {
+      onMsgFilpSummoned(msg.flip_summoned);
+
+      break;
+    }
+    case "sp_summoning": {
+      onMsgSpSummoning(msg.sp_summoning);
+
+      break;
+    }
+    case "sp_summoned": {
+      onMsgSpSummoned(msg.sp_summoned);
+
+      break;
+    }
+    case "unimplemented": {
+      onUnimplemented(msg.unimplemented);
+
+      break;
+    }
+    default: {
+      break;
+    }
+  }
 }

src/service/duel/timeLimit.ts

 import { sendTimeConfirm, ygopro } from "@/api";
-import { useConfig } from "@/config";
 import { matStore } from "@/stores";
 
 export default function handleTimeLimit(timeLimit: ygopro.StocTimeLimit) {
-  setTimeout(() => {
-    matStore.timeLimits.set(timeLimit.player, timeLimit.left_time);
+  matStore.timeLimits.set(timeLimit.player, timeLimit.left_time);
+  if (matStore.isMe(timeLimit.player)) {
     sendTimeConfirm();
-  }, useConfig().ui.commonDelay);
+  }
 }

src/service/onSocketMessage.ts

@@ -2,8 +2,11 @@
  * 长连接消息事件订阅处理逻辑
  *
  * */
+import { ygopro } from "@/api";
 import { adaptStoc } from "@/api/ocgcore/ocgAdapter/adapter";
 import { YgoProPacket } from "@/api/ocgcore/ocgAdapter/packet";
+import { useConfig } from "@/config";
+import { matStore } from "@/stores";
 
 import handleGameMsg from "./duel/gameMsg";
 import handleTimeLimit from "./duel/timeLimit";
@@ -18,6 +21,8 @@ import handleHsWatchChange from "./room/hsWatchChange";
 import handleJoinGame from "./room/joinGame";
 import handleTypeChange from "./room/typeChange";
 
+const NeosConfig = useConfig();
+
 /*
  * 先将从长连接中读取到的二进制数据通过Adapter转成protobuf结构体，
  * 然后再分发到各个处理函数中去处理。
@@ -26,78 +31,103 @@ import handleTypeChange from "./room/typeChange";
 export default function handleSocketMessage(e: MessageEvent) {
   const packet = YgoProPacket.deserialize(e.data);
   const pb = adaptStoc(packet);
-
-  switch (pb.msg) {
-    case "stoc_join_game": {
-      handleJoinGame(pb);
-
-      break;
-    }
-    case "stoc_chat": {
-      handleChat(pb);
-
-      break;
-    }
-    case "stoc_hs_player_change": {
-      handleHsPlayerChange(pb);
-
-      break;
-    }
-    case "stoc_hs_watch_change": {
-      handleHsWatchChange(pb);
-
-      break;
-    }
-    case "stoc_hs_player_enter": {
-      handleHsPlayerEnter(pb);
-
-      break;
-    }
-    case "stoc_type_change": {
-      handleTypeChange(pb);
-
-      break;
-    }
-    case "stoc_select_hand": {
-      handleSelectHand(pb);
-
-      break;
+  const delay = handleDelay(pb);
+
+  setTimeout(() => {
+    switch (pb.msg) {
+      case "stoc_join_game": {
+        handleJoinGame(pb);
+
+        break;
+      }
+      case "stoc_chat": {
+        handleChat(pb);
+
+        break;
+      }
+      case "stoc_hs_player_change": {
+        handleHsPlayerChange(pb);
+
+        break;
+      }
+      case "stoc_hs_watch_change": {
+        handleHsWatchChange(pb);
+
+        break;
+      }
+      case "stoc_hs_player_enter": {
+        handleHsPlayerEnter(pb);
+
+        break;
+      }
+      case "stoc_type_change": {
+        handleTypeChange(pb);
+
+        break;
+      }
+      case "stoc_select_hand": {
+        handleSelectHand(pb);
+
+        break;
+      }
+      case "stoc_hand_result": {
+        // TODO
+        console.log("TODO: handle STOC HandResult.");
+
+        break;
+      }
+      case "stoc_select_tp": {
+        handleSelectTp(pb);
+
+        break;
+      }
+      case "stoc_deck_count": {
+        handleDeckCount(pb);
+
+        break;
+      }
+      case "stoc_duel_start": {
+        handleDuelStart(pb);
+
+        break;
+      }
+      case "stoc_game_msg": {
+        handleGameMsg(pb);
+
+        break;
+      }
+      case "stoc_time_limit": {
+        handleTimeLimit(pb.stoc_time_limit);
+
+        break;
+      }
+      default: {
+        console.log(packet);
+
+        break;
+      }
     }
-    case "stoc_hand_result": {
-      // TODO
-      console.log("TODO: handle STOC HandResult.");
-
-      break;
-    }
-    case "stoc_select_tp": {
-      handleSelectTp(pb);
-
-      break;
-    }
-    case "stoc_deck_count": {
-      handleDeckCount(pb);
-
-      break;
-    }
-    case "stoc_duel_start": {
-      handleDuelStart(pb);
-
-      break;
-    }
-    case "stoc_game_msg": {
-      handleGameMsg(pb);
-
-      break;
-    }
-    case "stoc_time_limit": {
-      handleTimeLimit(pb.stoc_time_limit);
-
-      break;
-    }
-    default: {
-      console.log(packet);
+  }, delay);
+}
 
-      break;
+// 该函数用于控频，防止MSG更新太频繁，返回值是延迟的时间戳（毫秒）
+//
+// 对于一般的MSG，我们会延迟200ms执行处理逻辑；
+// 当处理一些带有动画效果的MSG时，比如`MSG_MOVE`，`MSG_CHAINING`，我们会设置下一次执行处理逻辑的延迟，确保动画完整
+function handleDelay(stoc: ygopro.YgoStocMsg): number {
+  const delay = matStore.delay;
+
+  // 重置下次`delay`
+  matStore.delay = NeosConfig.ui.commonDelay;
+
+  // 对特定的`MSG`，设置特化的`delay`
+  if (stoc.has_stoc_game_msg) {
+    if (stoc.stoc_game_msg.gameMsg == "move") {
+      matStore.delay = NeosConfig.ui.moveDelay + 500;
+    } else if (stoc.stoc_game_msg.gameMsg == "chaining") {
+      matStore.delay = NeosConfig.ui.chainingDelay;
     }
   }
+
+  return delay;
 }