Amolith
/
codies
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Say 'your turn' on player's turn

This commit is contained in:
zikaeroh 2020-06-14 11:36:31 -07:00
parent 6c81171a5f
commit efbb29278d
1 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/src/pages/gameView.tsx
View File

@ -77,9 +77,10 @@ interface CenterTextProps {
winner: number | undefined | null; winner: number | undefined | null;
timer: StateTimer | undefined | null; timer: StateTimer | undefined | null;
turn: number; turn: number;
myTurn: boolean;
} }
const CenterText = ({ winner, timer, turn }: DeepReadonly<CenterTextProps>) => { const CenterText = ({ winner, timer, turn, myTurn }: DeepReadonly<CenterTextProps>) => {
const classes = useCenterStyles(); const classes = useCenterStyles();
const [countdown, setCountdown] = React.useState<number | undefined>(); const [countdown, setCountdown] = React.useState<number | undefined>();
const { now } = useServerTime(); const { now } = useServerTime();
@ -122,14 +123,18 @@ const CenterText = ({ winner, timer, turn }: DeepReadonly<CenterTextProps>) => {
}, [countdown, winner, deadline, now]); }, [countdown, winner, deadline, now]);
const centerText = React.useMemo(() => { const centerText = React.useMemo(() => {
const text = isDefined(winner) ? `${teamSpecs[winner].name} wins!` : `${teamSpecs[turn].name}'s turn`; const text = isDefined(winner)
? `${teamSpecs[winner].name} wins!`
: myTurn
? 'Your turn'
: `${teamSpecs[turn].name}'s turn`;
if (!isDefined(countdown) || isDefined(winner)) { if (!isDefined(countdown) || isDefined(winner)) {
return text; return text;
} }
return `${text} [${countdown}s]`; return `${text} [${countdown}s]`;
}, [winner, turn, countdown]); }, [winner, turn, myTurn, countdown]);
return ( return (
<h1 <h1
@ -182,7 +187,7 @@ const Header = React.memo(function Header({
</h1> </h1>
</Grid> </Grid>
<Grid item xs style={{ textAlign: 'center' }}> <Grid item xs style={{ textAlign: 'center' }}>
<CenterText winner={winner} timer={timer} turn={turn} /> <CenterText winner={winner} timer={timer} turn={turn} myTurn={myTurn} />
</Grid> </Grid>
<Grid item xs style={{ textAlign: 'right' }}> <Grid item xs style={{ textAlign: 'right' }}>
<Button <Button