feat : arrow up/down to go to end/start position

This commit is contained in:
GuillaumeSD
2024-03-27 00:27:01 +01:00
parent 6177824d28
commit afbb89c9c5
3 changed files with 19 additions and 3 deletions

View File

@@ -3,6 +3,7 @@ import { Grid, IconButton, Tooltip } from "@mui/material";
import { useAtomValue } from "jotai"; import { useAtomValue } from "jotai";
import { boardAtom, gameAtom } from "../states"; import { boardAtom, gameAtom } from "../states";
import { useChessActions } from "@/hooks/useChessActions"; import { useChessActions } from "@/hooks/useChessActions";
import { useEffect } from "react";
export default function GoToLastPositionButton() { export default function GoToLastPositionButton() {
const { setPgn: setBoardPgn } = useChessActions(boardAtom); const { setPgn: setBoardPgn } = useChessActions(boardAtom);
@@ -14,6 +15,21 @@ export default function GoToLastPositionButton() {
const isButtonDisabled = boardHistory >= gameHistory; const isButtonDisabled = boardHistory >= gameHistory;
useEffect(() => {
const onKeyDown = (e: KeyboardEvent) => {
if (e.key === "ArrowUp") {
if (isButtonDisabled) return;
setBoardPgn(game.pgn());
}
};
window.addEventListener("keydown", onKeyDown);
return () => {
window.removeEventListener("keydown", onKeyDown);
};
}, [isButtonDisabled, setBoardPgn, game]);
return ( return (
<Tooltip title="Go to final position"> <Tooltip title="Go to final position">
<Grid> <Grid>

View File

@@ -22,6 +22,8 @@ export default function ReviewPanelToolBar() {
if (boardHistory.length === 0) return; if (boardHistory.length === 0) return;
if (e.key === "ArrowLeft") { if (e.key === "ArrowLeft") {
undoBoardMove(); undoBoardMove();
} else if (e.key === "ArrowDown") {
resetBoard({ fen: getStartingFen({ game: board }) });
} }
}; };
@@ -30,7 +32,7 @@ export default function ReviewPanelToolBar() {
return () => { return () => {
window.removeEventListener("keydown", onKeyDown); window.removeEventListener("keydown", onKeyDown);
}; };
}, [undoBoardMove, boardHistory]); }, [undoBoardMove, boardHistory, resetBoard, board]);
return ( return (
<Grid container item justifyContent="center" alignItems="center" xs={12}> <Grid container item justifyContent="center" alignItems="center" xs={12}>

View File

@@ -10,8 +10,6 @@ export const currentPositionAtom = atom<CurrentPosition>({});
export const boardOrientationAtom = atom(true); export const boardOrientationAtom = atom(true);
export const showBestMoveArrowAtom = atom(true); export const showBestMoveArrowAtom = atom(true);
export const showPlayerMoveIconAtom = atom(true); export const showPlayerMoveIconAtom = atom(true);
export const clickedSquaresAtom = atom<string[]>([]);
export const playableSquaresAtom = atom<string[]>([]);
export const engineDepthAtom = atom(16); export const engineDepthAtom = atom(16);
export const engineMultiPvAtom = atom(3); export const engineMultiPvAtom = atom(3);