Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 236x 252x 236x | import React from "react";
import {idx2color} from "../visualization/color";
import {Grid, Paper} from "@mui/material";
import Scores, {Score} from "./Scores";
import JsGameState from "../SnakeLogic/JsGameState";
type Props = {
game: JsGameState,
highscores: Score[],
globalHighscores: Score[]
}
export default function ScorePane(props: Props) {
const scores = Object.values(props.game.snakes).map(snake => {
return {
idx: snake.idx,
playerName: snake.name,
score: snake.length,
color: idx2color(snake.idx)
}
})
return(
<Grid container
spacing={2}
pb={2}
direction={'column'}
justifyContent="space-around"
alignItems="baseline"
component={Paper}
>
<Grid item>
<Scores
key="Scores"
title="Scores"
scores={scores}
/>
</Grid>
<Grid item>
<Scores
key="highscoresSize"
title={`Highscores for ${props.game.width} x ${props.game.height}`}
scores={props.highscores}
/>
</Grid>
<Grid item>
<Scores
key="Highscores"
title="Highscores"
scores={props.globalHighscores}
/>
</Grid>
</Grid>
);
}
|