Reformat timer

This commit is contained in:
Daniel Schädler 2025-03-13 13:40:32 +01:00
parent f1fc76b7bd
commit ec35269861
1 changed files with 15 additions and 6 deletions

View File

@ -68,18 +68,25 @@ function FullscreenPageHeader(props) {
} }
}, [props.timerEnd]); }, [props.timerEnd]);
const formatTimeLeft = (timeLeft) => { const formatTimeLeft = timeLeft => {
if (timeLeft === null) return ''; if (timeLeft === null) return '';
const hours = Math.floor(timeLeft / (1000 * 60 * 60)); const hours = Math.floor(timeLeft / (1000 * 60 * 60));
const minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60)); const minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((timeLeft % (1000 * 60)) / 1000); const seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);
return `${hours}h ${minutes}m ${seconds}s`; const formattedSeconds = seconds < 10 ? '0' + seconds : seconds;
let formattedTimeLeft = '';
if (hours > 0) {
formattedTimeLeft += hours + 'h ';
}
formattedTimeLeft += minutes + ':' + formattedSeconds;
return formattedTimeLeft;
}; };
return (<Navbar color='light' className='mb-4 border-bottom py-0'> return (<Navbar color='light' className='mb-4 border-bottom py-0'>
<FilterDropdown {...props.filter}/> <FilterDropdown {...props.filter}/>
<NavbarBrand>{props.title}</NavbarBrand> <NavbarBrand>{props.title}</NavbarBrand>
{props.timerEnd && <div className='ml-auto'>Timer: {formatTimeLeft(timeLeft)}</div>} {props.timerEnd && <div className='ml-auto'>Spielzeit: {formatTimeLeft(timeLeft)}</div>}
</Navbar>); </Navbar>);
} }
@ -124,12 +131,14 @@ class Main extends React.Component {
getTournamentMeta(tournamentId, this.onTournamentRequestSuccess, this.onTournamentRequestError); getTournamentMeta(tournamentId, this.onTournamentRequestSuccess, this.onTournamentRequestError);
this.updateMatches(); this.updateMatches();
this.updateTimerEnd(); this.updateTimerEnd();
const intervalId = setInterval(this.updateMatches, 10000); const matchesIntervalId = setInterval(this.updateMatches, 10000);
this.setState({intervalId: intervalId}); const timerEndIntervalId = setInterval(this.updateTimerEnd, 10000);
this.setState({matchesIntervalId: matchesIntervalId, timerEndIntervalId: timerEndIntervalId});
} }
componentWillUnmount() { componentWillUnmount() {
clearInterval(this.state.intervalId); clearInterval(this.state.matchesIntervalId);
clearInterval(this.state.timerEndIntervalId);
} }
updateMatches() { updateMatches() {