aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/Grid.tsx39
1 files changed, 17 insertions, 22 deletions
diff --git a/src/components/Grid.tsx b/src/components/Grid.tsx
index 97448b0..23ab194 100644
--- a/src/components/Grid.tsx
+++ b/src/components/Grid.tsx
@@ -33,18 +33,22 @@ const Grid: React.FC<Props> = (props) => {
// 0 is O, 1 is X, 2 is blank
const [board, setBoard] = useState<number[]>([2,2,2,2,2,2,2,2,2]);
const [turn, setTurn] = useState<number>(1);
- const [winner, setWinner] = useState<number>(2)
const getBoard = (index: number) => {
setBoard(board.slice(0, index).concat(turn).concat(board.slice(index+1, 9)));
setTurn(turn === 1 ? 0 : 1)
}
- const allEqual = (arr: number[]) => arr.includes(2) ? false : arr.every(v => v === arr[0])
+ const allEqual = (arr: number[]) =>
+ arr.includes(2) ? false : arr.every(i => i === arr[0])
const getRow = (r: number) => board.slice(r * 3, (r * 3) + 3);
+ const getRows: any = (r: number = 0) =>
+ r <= 2 ? [getRow(r)].concat(getRows(r+1)) : getRow(r)
- const getCol: any = (c: number, arr=board) => arr.length <= 3 ? arr[c] : [arr[c]].concat(getCol(c, arr.slice(3)))
+ const getCol = (arr: number[][], c: number) => arr.map((i: any) => i[c])
+ const getCols: any = (rows: number[][], c: number = 0) =>
+ c < 2 ? [getCol(rows, c)].concat(getCols(rows, c+1)) : [getCol(rows, c)]
const getLeftDiagonal: any = (i: number = 0) =>
i < 3 ? [getRow(i)[i]].concat(getLeftDiagonal(i+1)) : [];
@@ -52,34 +56,25 @@ const Grid: React.FC<Props> = (props) => {
const getRightDiagonal: any = (i: number = 2) =>
i >= 0 ? [getRow(2-i)[i]].concat(getRightDiagonal(i-1)) : [];
- const checkHorMatch: any = (rowNum: number = 0) =>
- rowNum <= 2 && (allEqual(getRow(rowNum)) ? setWinner(turn === 1 ? 0 : 1) : checkHorMatch(rowNum+1))
-
- const checkVerMatch: any = (colNum: number = 0) =>
- colNum <= 2 && (allEqual(getCol(colNum)) ? setWinner(turn === 1 ? 0 : 1) : checkVerMatch(colNum+1))
-
- const checkDiagonalMatch: any = () => {
- (allEqual(getLeftDiagonal()) || allEqual(getRightDiagonal())) && setWinner(turn === 1 ? 0 : 1)
- }
-
const endGame = (winner: number) => {
const gameWinner = winner < 2 ? (winner === 1 ? "X" : "O") : "Draw";
props.setMessage(`WINNER: ${gameWinner}`);
props.setShowMessage(true);
- gameWinner === "Draw" || gameWinner === "X"
+ gameWinner === "Draw" || (gameWinner === "X"
? props.setScoreX(props.scoreX + 1)
- : props.setScoreO(props.scoreO + 1);
+ : props.setScoreO(props.scoreO + 1));
setBoard([2,2,2,2,2,2,2,2,2]);
- setWinner(2);
}
useEffect(() => {
- checkHorMatch();
- checkVerMatch();
- checkDiagonalMatch();
- winner < 2 && endGame(winner);
- board.includes(2) || endGame(2);
- })
+ if (board.includes(0) || board.includes(1)) {
+ const rows = getRows();
+ (rows.some((i: number[]) => allEqual(i))
+ || getCols(rows).some((i: number[]) => allEqual(i))
+ || [getLeftDiagonal(), getRightDiagonal()].some((i) => allEqual(i))
+ ) ? endGame(turn === 0 ? 1 : 0) : (board.includes(2) || endGame(2));
+ }
+ });
return (
<div className="Grid">