Two Keys: co-op mystery games for couples. Eight games on four engines (story, defuse, sync, labyrinth), two-device and couch play, mobile-first UI. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
25 lines
989 B
TypeScript
25 lines
989 B
TypeScript
import { formatClock, type RoomState } from '@two-keys/shared';
|
|
import { useNow } from '../lib/hooks';
|
|
|
|
/** Elapsed time plus penalties. Runs locally between server updates. */
|
|
export function Timer({ timer, receivedAt }: { timer: RoomState['timer']; receivedAt: number }) {
|
|
const now = useNow(1000);
|
|
if (timer.startedAt === null) return null;
|
|
const serverNow = timer.serverNow + (now - receivedAt);
|
|
const elapsed = ((timer.finishedAt ?? serverNow) - timer.startedAt) / 1000;
|
|
return (
|
|
<div
|
|
className="flex items-baseline gap-1.5 font-mono tabular-nums"
|
|
role="timer"
|
|
aria-label={`Time ${formatClock(elapsed + timer.penaltySeconds)}`}
|
|
>
|
|
<span className="text-base font-bold">{formatClock(elapsed + timer.penaltySeconds)}</span>
|
|
{timer.penaltySeconds > 0 && (
|
|
<span className="text-[11px] text-red-300" title="Penalty time from hints and traps">
|
|
+{formatClock(timer.penaltySeconds)}
|
|
</span>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|