nik/watch-party
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed the timesync display to show seconds

Browse Source
This commit is contained in:
Nik Afiq 2025-11-11 23:10:31 +09:00
parent 66c40ef604
commit 8e157cc3ad
1 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/components/TimeSyncNotice.tsx
View File

@ -1,9 +1,15 @@
import { useEffect, useState } from "react";
import { useTimeSkew } from "../hooks/useTimeSkew";
function formatMs(ms: number) {
const sign = ms > 0 ? "+" : "";
return `${sign}${ms}ms`;
function formatDelay(ms: number, withSign = true) {
const sign = withSign ? (ms > 0 ? "+" : ms < 0 ? "−" : "") : "";
const abs = Math.abs(ms);
if (abs >= 1000) {
const s = Math.floor(abs / 1000);
const rem = abs % 1000;
return `${sign}${s}s${rem ? ` ${rem}ms` : ""}`;
}
return `${sign}${abs}ms`;
}
export default function TimeSyncNotice({
@ -33,11 +39,11 @@ export default function TimeSyncNotice({
const ahead = skewMs > 0;
const msgJa = ahead
? `端末の時計が正確な時刻より ${formatMs(skewMs)} 進んでいます（往復遅延 ${rttMs ?? "-"}ms）`
: `端末の時計が正確な時刻より ${formatMs(-skewMs)} 遅れています（往復遅延 ${rttMs ?? "-"}ms）`;
? `端末の時計が正確な時刻より ${formatDelay(skewMs)} 進んでいます（通信往復遅延 ${rttMs ?? "-"}ms）`
: `端末の時計が正確な時刻より ${formatDelay(-skewMs)} 遅れています（通信往復遅延 ${rttMs ?? "-"}ms）`;
const msgEn = ahead
? `Your device clock is ${formatMs(skewMs)} ahead of the correct time (RTT ${rttMs ?? "-"}ms).`
: `Your device clock is ${formatMs(-skewMs)} behind the correct time (RTT ${rttMs ?? "-"}ms).`;
? `Your device clock is ${formatDelay(skewMs)} ahead of the correct time (RTT ${rttMs ?? "-"}ms).`
: `Your device clock is ${formatDelay(-skewMs)} behind the correct time (RTT ${rttMs ?? "-"}ms).`;
const onClose = () => {
setDismissed(true);