fix(frontend): リバーシの対局中に制限時間の経過が実際より遅く計測されることがある問題を修正

CHANGELOG.md

@@ -40,6 +40,7 @@
 - Fix: チャートの描画終了後にリソースが解放されない問題を修正
 - Fix: ドライブの「このファイルからノートを作成」やギャラリーの「ノートで共有」、誕生日ウィジェットからのノート作成において、通常投稿の下書きが表示される問題を修正
 - Fix: QRコードリーダーがページを離れても停止しない問題を修正
+- Fix: リバーシの対局中に制限時間の経過が実際より遅く計測されることがある問題を修正
 
 ### Server
 - Feat: OpenTelemetryサポート

packages/frontend/src/pages/reversi/game.board.vue

@@ -279,29 +279,30 @@ function putStone(pos: number) {
 	});
 	appliedOps.push(id);
 
-	myTurnTimerRmain.value = game.value.timeLimitForEachTurn;
-	opTurnTimerRmain.value = game.value.timeLimitForEachTurn;
+	resetTurnTimer();
 
 	checkEnd();
 }
 
 const myTurnTimerRmain = ref<number>(game.value.timeLimitForEachTurn);
 const opTurnTimerRmain = ref<number>(game.value.timeLimitForEachTurn);
+let turnTimerDeadline = Date.now() + game.value.timeLimitForEachTurn * 1000;
+
+function resetTurnTimer() {
+	turnTimerDeadline = Date.now() + game.value.timeLimitForEachTurn * 1000;
+	myTurnTimerRmain.value = game.value.timeLimitForEachTurn;
+	opTurnTimerRmain.value = game.value.timeLimitForEachTurn;
+}
 
 const TIMER_INTERVAL_SEC = 3;
 if (!props.game.isEnded) {
 	useInterval(() => {
-		if (myTurnTimerRmain.value > 0) {
-			myTurnTimerRmain.value = Math.max(0, myTurnTimerRmain.value - TIMER_INTERVAL_SEC);
-		}
-		if (opTurnTimerRmain.value > 0) {
-			opTurnTimerRmain.value = Math.max(0, opTurnTimerRmain.value - TIMER_INTERVAL_SEC);
-		}
+		const remain = Math.max(0, Math.ceil((turnTimerDeadline - Date.now()) / 1000));
+		myTurnTimerRmain.value = remain;
+		opTurnTimerRmain.value = remain;
 
-		if (iAmPlayer.value) {
-			if ((isMyTurn.value && myTurnTimerRmain.value === 0) || (!isMyTurn.value && opTurnTimerRmain.value === 0)) {
-				props.connection!.send('claimTimeIsUp', {});
-			}
+		if (iAmPlayer.value && remain === 0) {
+			props.connection!.send('claimTimeIsUp', {});
 		}
 	}, TIMER_INTERVAL_SEC * 1000, { immediate: false, afterMounted: true });
 }
@@ -333,8 +334,7 @@ async function onStreamLog(log: Reversi.Serializer.Log & { id: string | null })
 				engine.value.putStone(log.pos);
 				triggerRef(engine);
 
-				myTurnTimerRmain.value = game.value.timeLimitForEachTurn;
-				opTurnTimerRmain.value = game.value.timeLimitForEachTurn;
+				resetTurnTimer();
 
 				checkEnd();
 				break;