refactoring - chess logic used from third party package
This commit is contained in:
Moon Patel
Generated
+6
@@ -14,6 +14,7 @@
|
||||
"@mantine/hooks": "^6.0.14",
|
||||
"@radix-ui/react-icons": "^1.3.0",
|
||||
"@tabler/icons-react": "^2.23.0",
|
||||
"chess.js": "^1.0.0-beta.6",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.14.0",
|
||||
@@ -1677,6 +1678,11 @@
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/chess.js": {
|
||||
"version": "1.0.0-beta.6",
|
||||
"resolved": "https://registry.npmjs.org/chess.js/-/chess.js-1.0.0-beta.6.tgz",
|
||||
"integrity": "sha512-sqBfX1VL3csSyqVM5ogbKA+aRlZyWDh276ruWXphwI0lDUMs7iYjZs29BOi49f7mXeunJE7cdfnIZhihsyLnsA=="
|
||||
},
|
||||
"node_modules/clsx": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz",
|
||||
|
||||
@@ -16,6 +16,7 @@
|
||||
"@mantine/hooks": "^6.0.14",
|
||||
"@radix-ui/react-icons": "^1.3.0",
|
||||
"@tabler/icons-react": "^2.23.0",
|
||||
"chess.js": "^1.0.0-beta.6",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.14.0",
|
||||
|
||||
@@ -4,35 +4,31 @@ import { socket } from '../socket';
|
||||
import { Box, Flex } from '@mantine/core';
|
||||
import { useDroppable } from '@dnd-kit/core'
|
||||
|
||||
const Cell = ({ cellProps, selectedPiece, dispatch, myColor }) => {
|
||||
const { row, col, piece, marked } = cellProps;
|
||||
const { isOver, setNodeRef } = useDroppable({ id: row + "-" + col });
|
||||
const Cell = ({ cell, chess, marked, dispatch }) => {
|
||||
const { square, type, color } = cell;
|
||||
const { isOver, setNodeRef } = useDroppable({ id: square });
|
||||
const [isDropped, setIsDropped] = useState(false);
|
||||
|
||||
let bgColor = (selectedPiece?.row === row && selectedPiece?.col === col) ? 'bg-gray-100' : ((row + col) % 2 ? 'bg-stone-800' : 'bg-neutral-200');
|
||||
bgColor = marked && piece ? `bg-red-300` : bgColor;
|
||||
|
||||
const handleClick = () => {
|
||||
// if (!myTurn) return;
|
||||
if (piece && piece.color === myColor) {
|
||||
dispatch({ type: 'SELECT_PIECE', val: { row, col, color: piece.color } }) // select piece
|
||||
if (type && chess.turn() === chess.myColor) {
|
||||
return dispatch({ type: 'SELECT_PIECE', val: square });
|
||||
}
|
||||
else if (!piece && selectedPiece && marked) {
|
||||
let payload = { fromRow: selectedPiece.row, fromCol: selectedPiece.col, toRow: row, toCol: col };
|
||||
socket.emit('move', payload);
|
||||
dispatch({ type: 'MOVE_PIECE', val: payload, }); // move piece
|
||||
console.log(type, chess.selected, marked)
|
||||
if (!type && chess.selected && marked) {
|
||||
console.log(square)
|
||||
dispatch({ type: 'MOVE_PIECE', val: { from: chess.selected, to: square } })
|
||||
}
|
||||
else if (piece && marked && piece.color !== myColor) {
|
||||
let payload = { fromRow: selectedPiece.row, fromCol: selectedPiece.col, toRow: row, toCol: col, color: piece.color };
|
||||
socket.emit('move', payload);
|
||||
dispatch({ type: 'CAPTURE_PIECE', val: payload }) // capture piece
|
||||
if (type && marked) {
|
||||
dispatch({ type: 'CAPTURE_PIECE', val: { from: chess.selected, to: square } })
|
||||
}
|
||||
}
|
||||
|
||||
const content = marked ? <Mark /> : <Piece piece={piece} row={row} col={col} dispatch={dispatch} />;
|
||||
let content;
|
||||
content = marked ? <Mark /> : <Piece cell={cell} dispatch={dispatch} />;
|
||||
let squareColor = chess.squareColor(square) === "dark" ? "gray" : "white";
|
||||
|
||||
return (
|
||||
<Flex ref={setNodeRef} onClick={handleClick} w="75px" h="75px" bg={(row + col) % 2 ? 'gray' : 'white'} className={`w-12 h-12 md:w-20 md:h-20 ${bgColor} flex justify-center items-center relative`}>
|
||||
<Flex ref={setNodeRef} onClick={handleClick} w="75px" h="75px" bg={squareColor} >
|
||||
{content}
|
||||
</Flex>
|
||||
)
|
||||
@@ -40,7 +36,7 @@ const Cell = ({ cellProps, selectedPiece, dispatch, myColor }) => {
|
||||
|
||||
export const Mark = () => {
|
||||
return (
|
||||
<Box w="33%" h="33%" sx={{ backgroundColor: 'gray', borderRadius: '100%' }} m="auto"></Box>
|
||||
<Box w="33%" h="33%" sx={{ backgroundColor: '#77777777', borderRadius: '100%' }} m="auto"></Box>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -2,34 +2,34 @@ import { Image } from '@mantine/core';
|
||||
import React, { useEffect } from 'react';
|
||||
import { useDraggable } from '@dnd-kit/core'
|
||||
|
||||
const Piece = ({ piece, row, col, dispatch }) => {
|
||||
if (piece === null) return null;
|
||||
const { type, color } = piece;
|
||||
const Piece = ({ cell, dispatch }) => {
|
||||
let { square, type, color } = cell;
|
||||
if (type === undefined) return null;
|
||||
let logo;
|
||||
switch (type) {
|
||||
case 'P':
|
||||
logo = color === 'W' ? 'pawn_white' : 'pawn_black';
|
||||
case 'p':
|
||||
logo = color === 'w' ? 'pawn_white' : 'pawn_black';
|
||||
break;
|
||||
case 'R':
|
||||
logo = color === 'W' ? 'rook_white' : 'rook_black';
|
||||
case 'r':
|
||||
logo = color === 'w' ? 'rook_white' : 'rook_black';
|
||||
break;
|
||||
case 'N':
|
||||
logo = color === 'W' ? 'knight_white' : 'knight_black';
|
||||
case 'n':
|
||||
logo = color === 'w' ? 'knight_white' : 'knight_black';
|
||||
break;
|
||||
case 'B':
|
||||
logo = color === 'W' ? 'bishop_white' : 'bishop_black';
|
||||
case 'b':
|
||||
logo = color === 'w' ? 'bishop_white' : 'bishop_black';
|
||||
break;
|
||||
case 'Q':
|
||||
logo = color === 'W' ? 'queen_white' : 'queen_black';
|
||||
case 'q':
|
||||
logo = color === 'w' ? 'queen_white' : 'queen_black';
|
||||
break;
|
||||
case 'K':
|
||||
logo = color === 'W' ? 'king_white' : 'king_black';
|
||||
case 'k':
|
||||
logo = color === 'w' ? 'king_white' : 'king_black';
|
||||
break;
|
||||
}
|
||||
|
||||
const { attributes, listeners, setNodeRef, transform, isDragging } = useDraggable({
|
||||
id: row + '-' + col, data: {
|
||||
...piece, row, col
|
||||
id: square, data: {
|
||||
...cell
|
||||
}
|
||||
});
|
||||
const style = transform ? {
|
||||
@@ -39,7 +39,7 @@ const Piece = ({ piece, row, col, dispatch }) => {
|
||||
} : undefined;
|
||||
useEffect(() => {
|
||||
if (isDragging) {
|
||||
dispatch({ type: 'SELECT_PIECE', val: { row, col, color } });
|
||||
dispatch({ type: 'SELECT_PIECE', val: cell });
|
||||
}
|
||||
}, [isDragging])
|
||||
|
||||
|
||||
@@ -20,8 +20,11 @@ const ChessGame = () => {
|
||||
description={"description"}
|
||||
/>
|
||||
</Flex>
|
||||
<Flex w="450px" bg='gray' h="600px" sx={{ borderRadius: '10px' }}>
|
||||
<Flex w="450px" bg='gray' p="10px" justify='center' h="600px" sx={{ borderRadius: '10px' }}>
|
||||
<Title>Game Data</Title>
|
||||
<Flex>
|
||||
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Flex>
|
||||
)
|
||||
|
||||
@@ -1,44 +1,33 @@
|
||||
import React, { useEffect, useReducer, useRef } from 'react';
|
||||
import { blackColor, chessBoardInit, getPieceHint, pieces, whiteColor } from '../../../utils/chess';
|
||||
import { ChessModified, chess } from '../../../utils/chess';
|
||||
import Cell from '../../components/Cell';
|
||||
import { socket } from '../../socket';
|
||||
import { Flex } from '@mantine/core';
|
||||
import { DndContext } from '@dnd-kit/core'
|
||||
|
||||
|
||||
let myColor = 'W';
|
||||
let myColor = 'w';
|
||||
|
||||
const reducer = (state, action) => {
|
||||
if (state.capturedPieces.length && state.capturedPieces.at(-1).type === pieces.king) return state;
|
||||
switch (action.type) {
|
||||
case 'SELECT_PIECE':
|
||||
{
|
||||
let { row, col, color } = action.val;
|
||||
let selectedPiece = { row, col, color };
|
||||
let possibleMoves = getPieceHint(state.chessBoard, { row, col, color, type: state.chessBoard[row][col].type }, color).movePos;
|
||||
return { ...state, selectedPiece, possibleMoves };
|
||||
state.chess.select(action.val.square);
|
||||
return { ...state, moveHints: state.chess.getMoves(state.chess.selected) };
|
||||
}
|
||||
break;
|
||||
case 'MOVE_PIECE':
|
||||
{
|
||||
let { fromRow, fromCol, toRow, toCol } = action.val;
|
||||
let newChessBoard = state.chessBoard.map(row => row.slice());
|
||||
let piece = state.chessBoard[fromRow][fromCol];
|
||||
newChessBoard[toRow][toCol] = piece;
|
||||
newChessBoard[fromRow][fromCol] = null;
|
||||
return { ...state, chessBoard: newChessBoard, possibleMoves: [], selectedPiece: null, myTurn: !state.myTurn };
|
||||
console.log('Moving', action.val, state.chess.turn());
|
||||
let newChessObj = new ChessModified(state.chess.fen())
|
||||
newChessObj.move(action.val);
|
||||
return { ...state, chess: newChessObj, chessBoard: newChessObj.getBoard(), moveHints: [] };
|
||||
}
|
||||
break;
|
||||
case 'CAPTURE_PIECE':
|
||||
{
|
||||
let { fromRow, fromCol, toRow, toCol } = action.val;
|
||||
let newChessBoard = state.chessBoard.map(row => row.slice());
|
||||
let capturedPieces = [...state.capturedPieces, state.chessBoard[toRow][toCol]];
|
||||
newChessBoard[toRow][toCol] = state.chessBoard[fromRow][fromCol];
|
||||
newChessBoard[fromRow][fromCol] = null;
|
||||
return { ...state, chessBoard: newChessBoard, capturedPieces, possibleMoves: [], selectedPiece: null, myTurn: !state.myTurn };
|
||||
console.log('Capture', action.val, state.chess.turn())
|
||||
let newChessObj = new ChessModified(state.chess.fen())
|
||||
newChessObj.move(action.val);
|
||||
return { ...state, chess: newChessObj, chessBoard: newChessObj.getBoard(), moveHints: [] };
|
||||
}
|
||||
break;
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
@@ -51,16 +40,15 @@ const ChessBoard = () => {
|
||||
const checkAudioRef = useRef(null);
|
||||
|
||||
const [gameState, dispatch] = useReducer(reducer, {
|
||||
chessBoard: chessBoardInit(myColor), selectedPiece: null, possibleMoves: [], capturedPieces: [], myTurn: myColor === whiteColor
|
||||
chess, chessBoard: chess.getBoard(), moveHints: []
|
||||
});
|
||||
// console.log(gameState)
|
||||
|
||||
const chessBoardRef = useRef(gameState.chessBoard);
|
||||
chessBoardRef.current = gameState.chessBoard;
|
||||
|
||||
useEffect(() => {
|
||||
function handleOpponentMove(data) {
|
||||
let { fromCol, fromRow, toCol, toRow } = data;
|
||||
let { from, to } = data;
|
||||
if (chessBoardRef.current[toRow][toCol] === null) {
|
||||
console.log('Moving piece: ', data)
|
||||
dispatch({ type: 'MOVE_PIECE', val: { fromRow, fromCol, toRow, toCol } });
|
||||
@@ -77,53 +65,33 @@ const ChessBoard = () => {
|
||||
|
||||
return (
|
||||
<DndContext onDragEnd={evt => {
|
||||
let [currentRow, currentCol] = evt.active.id.split('-');
|
||||
let [targetRow, targetCol] = evt.over.id.split('-');
|
||||
let piece = evt.active.data.current;
|
||||
if (gameState.chessBoard[targetRow][targetCol] && gameState.chessBoard[targetRow][targetCol]?.color !== myColor) {
|
||||
console.log('Captured by dragging');
|
||||
let payload = { fromRow: currentRow, fromCol: currentCol, toRow: targetRow, toCol: targetCol, color: piece.color };
|
||||
socket.emit('move', payload);
|
||||
captureAudioRef.current.play();
|
||||
dispatch({ type: 'CAPTURE_PIECE', val: payload }) // capture piece
|
||||
return;
|
||||
}
|
||||
let targetMarked = false;
|
||||
gameState.possibleMoves.forEach((move) => {
|
||||
if (move.row == targetRow && move.col == targetCol)
|
||||
targetMarked = true;
|
||||
});
|
||||
if (targetMarked) {
|
||||
console.log('Moved by dragging')
|
||||
let payload = { fromRow: currentRow, fromCol: currentCol, toRow: targetRow, toCol: targetCol };
|
||||
socket.emit('move', payload);
|
||||
moveAudioRef.current.play();
|
||||
dispatch({ type: 'MOVE_PIECE', val: payload, }); // move piece
|
||||
return;
|
||||
let srcSquare = evt.active.id;
|
||||
let destSquare = evt.over.id;
|
||||
|
||||
if (gameState.moveHints.includes(destSquare)) {
|
||||
console.log(gameState.chess.get(srcSquare))
|
||||
if (gameState.chess.get(destSquare)) {
|
||||
captureAudioRef.current.play();
|
||||
dispatch({ type: 'CAPTURE_PIECE', val: { from: srcSquare, to: destSquare } }); // capture piece
|
||||
} else {
|
||||
moveAudioRef.current.play();
|
||||
dispatch({ type: 'MOVE_PIECE', val: { from: srcSquare, to: destSquare } }); // move piece
|
||||
}
|
||||
}
|
||||
}}>
|
||||
<Flex w="600px">
|
||||
<div>
|
||||
{gameState.chessBoard.map((line, row) => {
|
||||
{gameState.chessBoard.map((row, rowIndex) => {
|
||||
return (
|
||||
<Flex className='flex' key={row * 2}>
|
||||
{line.map((cell, col) => {
|
||||
let marked = null;
|
||||
for (let k = 0; k < gameState.possibleMoves.length; k++) {
|
||||
if (gameState.possibleMoves[k].row === row && gameState.possibleMoves[k].col === col) {
|
||||
marked = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
let piece = cell ? { type: cell.type, color: cell.color } : null;
|
||||
<Flex className='flex' key={rowIndex * 2}>
|
||||
{row.map((cell, colIndex) => {
|
||||
return (
|
||||
<Cell
|
||||
key={col * 3 + 1}
|
||||
selectedPiece={gameState.selectedPiece}
|
||||
cellProps={{ row, col, piece, marked }}
|
||||
key={cell.square}
|
||||
cell={cell}
|
||||
chess={chess}
|
||||
marked={gameState.moveHints.includes(cell.square)}
|
||||
dispatch={dispatch}
|
||||
myColor={myColor}
|
||||
myTurn={gameState.myTurn}
|
||||
/>)
|
||||
})}
|
||||
</Flex>
|
||||
|
||||
+338
-292
@@ -1,305 +1,351 @@
|
||||
const pawn = "P",
|
||||
rook = "R",
|
||||
knight = "N",
|
||||
bishop = "B",
|
||||
queen = "Q",
|
||||
king = "K";
|
||||
// const pawn = "P",
|
||||
// rook = "R",
|
||||
// knight = "N",
|
||||
// bishop = "B",
|
||||
// queen = "Q",
|
||||
// king = "K";
|
||||
|
||||
export const pieces = {
|
||||
pawn,
|
||||
rook,
|
||||
knight,
|
||||
bishop,
|
||||
queen,
|
||||
king,
|
||||
};
|
||||
// export const pieces = {
|
||||
// pawn,
|
||||
// rook,
|
||||
// knight,
|
||||
// bishop,
|
||||
// queen,
|
||||
// king,
|
||||
// };
|
||||
|
||||
export const whiteColor = "W",
|
||||
blackColor = "B";
|
||||
// export const whiteColor = "W",
|
||||
// blackColor = "B";
|
||||
|
||||
export function chessBoardInit(myColor) {
|
||||
let opColor = myColor === whiteColor ? blackColor : whiteColor;
|
||||
const chessBoardMatrix = [
|
||||
[
|
||||
{ color: opColor, type: rook },
|
||||
{ color: opColor, type: knight },
|
||||
{ color: opColor, type: bishop },
|
||||
{ color: opColor, type: myColor === whiteColor ? queen : king },
|
||||
{ color: opColor, type: myColor === whiteColor ? king : queen },
|
||||
{ color: opColor, type: bishop },
|
||||
{ color: opColor, type: knight },
|
||||
{ color: opColor, type: rook },
|
||||
],
|
||||
Array(8).fill({ color: opColor, type: pawn }),
|
||||
[null, null, null, null, null, null, null, null],
|
||||
[null, null, null, null, null, null, null, null],
|
||||
[null, null, null, null, null, null, null, null],
|
||||
[null, null, null, null, null, null, null, null],
|
||||
Array(8).fill({ color: myColor, type: pawn }),
|
||||
[
|
||||
{ color: myColor, type: rook },
|
||||
{ color: myColor, type: knight },
|
||||
{ color: myColor, type: bishop },
|
||||
{ color: myColor, type: myColor === whiteColor ? queen : king },
|
||||
{ color: myColor, type: myColor === whiteColor ? king : queen },
|
||||
{ color: myColor, type: bishop },
|
||||
{ color: myColor, type: knight },
|
||||
{ color: myColor, type: rook },
|
||||
],
|
||||
];
|
||||
return chessBoardMatrix;
|
||||
}
|
||||
// export function chessBoardInit(myColor) {
|
||||
// let opColor = myColor === whiteColor ? blackColor : whiteColor;
|
||||
// const chessBoardMatrix = [
|
||||
// [
|
||||
// { color: opColor, type: rook },
|
||||
// { color: opColor, type: knight },
|
||||
// { color: opColor, type: bishop },
|
||||
// { color: opColor, type: myColor === whiteColor ? queen : king },
|
||||
// { color: opColor, type: myColor === whiteColor ? king : queen },
|
||||
// { color: opColor, type: bishop },
|
||||
// { color: opColor, type: knight },
|
||||
// { color: opColor, type: rook },
|
||||
// ],
|
||||
// Array(8).fill({ color: opColor, type: pawn }),
|
||||
// [null, null, null, null, null, null, null, null],
|
||||
// [null, null, null, null, null, null, null, null],
|
||||
// [null, null, null, null, null, null, null, null],
|
||||
// [null, null, null, null, null, null, null, null],
|
||||
// Array(8).fill({ color: myColor, type: pawn }),
|
||||
// [
|
||||
// { color: myColor, type: rook },
|
||||
// { color: myColor, type: knight },
|
||||
// { color: myColor, type: bishop },
|
||||
// { color: myColor, type: myColor === whiteColor ? queen : king },
|
||||
// { color: myColor, type: myColor === whiteColor ? king : queen },
|
||||
// { color: myColor, type: bishop },
|
||||
// { color: myColor, type: knight },
|
||||
// { color: myColor, type: rook },
|
||||
// ],
|
||||
// ];
|
||||
// return chessBoardMatrix;
|
||||
// }
|
||||
|
||||
function inBoard(i, j) {
|
||||
if (i >= 0 && i < 8 && j >= 0 && j < 8) return true;
|
||||
else return false;
|
||||
}
|
||||
// function inBoard(i, j) {
|
||||
// if (i >= 0 && i < 8 && j >= 0 && j < 8) return true;
|
||||
// else return false;
|
||||
// }
|
||||
|
||||
function isBlocked(chessBoard, chessPiece, i, j) {
|
||||
if (chessBoard[i][j] === null) return false;
|
||||
else if (chessBoard[i][j].color === chessPiece.color) return true;
|
||||
else return false;
|
||||
}
|
||||
// function isBlocked(chessBoard, chessPiece, i, j) {
|
||||
// if (chessBoard[i][j] === null) return false;
|
||||
// else if (chessBoard[i][j].color === chessPiece.color) return true;
|
||||
// else return false;
|
||||
// }
|
||||
|
||||
function isAttacking(chessBoard, chessPiece, i, j) {
|
||||
if (chessBoard[i][j] === null) return false;
|
||||
else if (chessBoard[i][j].color !== chessPiece.color) return true;
|
||||
else return false;
|
||||
}
|
||||
// function isAttacking(chessBoard, chessPiece, i, j) {
|
||||
// if (chessBoard[i][j] === null) return false;
|
||||
// else if (chessBoard[i][j].color !== chessPiece.color) return true;
|
||||
// else return false;
|
||||
// }
|
||||
|
||||
function getPawnHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col } = chessPiece;
|
||||
let movePos = [];
|
||||
if (chessPiece.color === myColor) {
|
||||
// for moving forward
|
||||
if (inBoard(row - 1, col) && chessBoard[row - 1][col] === null && movePos.push({ row: row - 1, col })) {
|
||||
chessPiece.row === 6 &&
|
||||
chessBoard[row - 2][col] === null &&
|
||||
inBoard(row - 2, col) &&
|
||||
!isBlocked(chessBoard, chessPiece, row - 1, col) &&
|
||||
movePos.push({ row: row - 2, col });
|
||||
// function getPawnHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col } = chessPiece;
|
||||
// let movePos = [];
|
||||
// if (chessPiece.color === myColor) {
|
||||
// // for moving forward
|
||||
// if (inBoard(row - 1, col) && chessBoard[row - 1][col] === null && movePos.push({ row: row - 1, col })) {
|
||||
// chessPiece.row === 6 &&
|
||||
// chessBoard[row - 2][col] === null &&
|
||||
// inBoard(row - 2, col) &&
|
||||
// !isBlocked(chessBoard, chessPiece, row - 1, col) &&
|
||||
// movePos.push({ row: row - 2, col });
|
||||
// }
|
||||
// // for killing opponent piece
|
||||
// if (
|
||||
// inBoard(row - 1, col + 1) &&
|
||||
// chessBoard[row - 1][col + 1]?.type &&
|
||||
// chessBoard[row - 1][col + 1]?.color !== myColor
|
||||
// )
|
||||
// inBoard(row - 1, col + 1) && movePos.push({ row: row - 1, col: col + 1 });
|
||||
// if (
|
||||
// inBoard(row - 1, col - 1) &&
|
||||
// chessBoard[row - 1][col - 1]?.type &&
|
||||
// chessBoard[row - 1][col - 1]?.color !== myColor
|
||||
// )
|
||||
// inBoard(row - 1, col - 1) && movePos.push({ row: row - 1, col: col - 1 });
|
||||
// } else {
|
||||
// // for moving forward
|
||||
// if (inBoard(row + 1, col) && chessBoard[row + 1][col] === null && movePos.push({ row: row + 1, col })) {
|
||||
// chessPiece.row === 1 &&
|
||||
// chessBoard[row + 2][col] === null &&
|
||||
// inBoard(row + 2, col) &&
|
||||
// movePos.push({ row: row + 2, col });
|
||||
// }
|
||||
// // for killing opponent piece
|
||||
// if (
|
||||
// inBoard(row + 1, col + 1) &&
|
||||
// chessBoard[row + 1][col + 1]?.type &&
|
||||
// chessBoard[row + 1][col + 1]?.color === myColor
|
||||
// )
|
||||
// inBoard(row + 1, col + 1) && movePos.push({ row: row + 1, col: col + 1 });
|
||||
// if (
|
||||
// inBoard(row + 1, col - 1) &&
|
||||
// chessBoard[row + 1][col - 1]?.type &&
|
||||
// chessBoard[row + 1][col - 1]?.color === myColor
|
||||
// )
|
||||
// inBoard(row + 1, col - 1) && movePos.push({ row: row + 1, col: col - 1 });
|
||||
// }
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// function getRookHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col, color } = chessPiece;
|
||||
// let movePos = [];
|
||||
// let i = row,
|
||||
// j = col;
|
||||
// while (inBoard(++i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// console.log(movePos);
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// function getKnightHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col, color } = chessPiece;
|
||||
// let movePos = [];
|
||||
|
||||
// if (inBoard(row + 2, col + 1) && !isBlocked(chessBoard, chessPiece, row + 2, col + 1))
|
||||
// movePos.push({ row: row + 2, col: col + 1 });
|
||||
// if (inBoard(row + 2, col - 1) && !isBlocked(chessBoard, chessPiece, row + 2, col - 1))
|
||||
// movePos.push({ row: row + 2, col: col - 1 });
|
||||
// if (inBoard(row - 2, col + 1) && !isBlocked(chessBoard, chessPiece, row - 2, col + 1))
|
||||
// movePos.push({ row: row - 2, col: col + 1 });
|
||||
// if (inBoard(row - 2, col - 1) && !isBlocked(chessBoard, chessPiece, row - 2, col - 1))
|
||||
// movePos.push({ row: row - 2, col: col - 1 });
|
||||
// if (inBoard(row + 1, col + 2) && !isBlocked(chessBoard, chessPiece, row + 1, col + 2))
|
||||
// movePos.push({ row: row + 1, col: col + 2 });
|
||||
// if (inBoard(row - 1, col + 2) && !isBlocked(chessBoard, chessPiece, row - 1, col + 2))
|
||||
// movePos.push({ row: row - 1, col: col + 2 });
|
||||
// if (inBoard(row + 1, col - 2) && !isBlocked(chessBoard, chessPiece, row + 1, col - 2))
|
||||
// movePos.push({ row: row + 1, col: col - 2 });
|
||||
// if (inBoard(row - 1, col - 2) && !isBlocked(chessBoard, chessPiece, row - 1, col - 2))
|
||||
// movePos.push({ row: row - 1, col: col - 2 });
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// function getBishopHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col, color } = chessPiece;
|
||||
// let movePos = [];
|
||||
|
||||
// let i = row,
|
||||
// j = col;
|
||||
// while (inBoard(++i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(++i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// function getQueenHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col, color } = chessPiece;
|
||||
// let movePos = [];
|
||||
// let i = row,
|
||||
// j = col;
|
||||
// while (inBoard(++i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(++i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(++i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
// i = row;
|
||||
// j = col;
|
||||
// while (inBoard(--i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
// movePos.push({ row: i, col: j });
|
||||
// if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
// }
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// function getKingHint(chessBoard, chessPiece, myColor) {
|
||||
// const { row, col } = chessPiece;
|
||||
// let movePos = [];
|
||||
|
||||
// if (inBoard(row, col + 1) && !isBlocked(chessBoard, chessPiece, row, col + 1))
|
||||
// movePos.push({ row: row, col: col + 1 });
|
||||
// if (inBoard(row, col - 1) && !isBlocked(chessBoard, chessPiece, row, col - 1))
|
||||
// movePos.push({ row: row, col: col - 1 });
|
||||
// if (inBoard(row + 1, col + 1) && !isBlocked(chessBoard, chessPiece, row + 1, col + 1))
|
||||
// movePos.push({ row: row + 1, col: col + 1 });
|
||||
// if (inBoard(row + 1, col) && !isBlocked(chessBoard, chessPiece, row + 1, col))
|
||||
// movePos.push({ row: row + 1, col: col });
|
||||
// if (inBoard(row + 1, col - 1) && !isBlocked(chessBoard, chessPiece, row + 1, col - 1))
|
||||
// movePos.push({ row: row + 1, col: col - 1 });
|
||||
// if (inBoard(row - 1, col + 1) && !isBlocked(chessBoard, chessPiece, row - 1, col + 1))
|
||||
// movePos.push({ row: row - 1, col: col + 1 });
|
||||
// if (inBoard(row - 1, col) && !isBlocked(chessBoard, chessPiece, row - 1, col))
|
||||
// movePos.push({ row: row - 1, col: col });
|
||||
// if (inBoard(row - 1, col - 1) && !isBlocked(chessBoard, chessPiece, row - 1, col - 1))
|
||||
// movePos.push({ row: row - 1, col: col - 1 });
|
||||
|
||||
// return { movePos };
|
||||
// }
|
||||
|
||||
// export function getPieceHint(chessBoard, chessPiece, myColor) {
|
||||
// switch (chessPiece.type) {
|
||||
// case pawn:
|
||||
// return getPawnHint(chessBoard, chessPiece, myColor);
|
||||
// case rook:
|
||||
// return getRookHint(chessBoard, chessPiece, myColor);
|
||||
// case knight:
|
||||
// return getKnightHint(chessBoard, chessPiece, myColor);
|
||||
// case bishop:
|
||||
// return getBishopHint(chessBoard, chessPiece, myColor);
|
||||
// case queen:
|
||||
// return getQueenHint(chessBoard, chessPiece, myColor);
|
||||
// case king:
|
||||
// return getKingHint(chessBoard, chessPiece, myColor);
|
||||
// }
|
||||
|
||||
// return [];
|
||||
// }
|
||||
|
||||
import { Chess } from "chess.js";
|
||||
|
||||
export class ChessModified extends Chess {
|
||||
constructor(obj, col) {
|
||||
super(obj, col);
|
||||
this.selected = null;
|
||||
}
|
||||
|
||||
select(square) {
|
||||
let piece = this.get(square);
|
||||
if (piece) {
|
||||
this.selected = square;
|
||||
}
|
||||
// for killing opponent piece
|
||||
if (
|
||||
inBoard(row - 1, col + 1) &&
|
||||
chessBoard[row - 1][col + 1]?.type &&
|
||||
chessBoard[row - 1][col + 1]?.color !== myColor
|
||||
)
|
||||
inBoard(row - 1, col + 1) && movePos.push({ row: row - 1, col: col + 1 });
|
||||
if (
|
||||
inBoard(row - 1, col - 1) &&
|
||||
chessBoard[row - 1][col - 1]?.type &&
|
||||
chessBoard[row - 1][col - 1]?.color !== myColor
|
||||
)
|
||||
inBoard(row - 1, col - 1) && movePos.push({ row: row - 1, col: col - 1 });
|
||||
} else {
|
||||
// for moving forward
|
||||
if (inBoard(row + 1, col) && chessBoard[row + 1][col] === null && movePos.push({ row: row + 1, col })) {
|
||||
chessPiece.row === 1 &&
|
||||
chessBoard[row + 2][col] === null &&
|
||||
inBoard(row + 2, col) &&
|
||||
movePos.push({ row: row + 2, col });
|
||||
}
|
||||
convertRowColToLAN(row, col) {
|
||||
const letters = ["a", "b", "c", "d", "e", "f", "g", "h"];
|
||||
const letter = letters[col];
|
||||
const number = 8 - row;
|
||||
return letter + number;
|
||||
}
|
||||
|
||||
getBoard() {
|
||||
let board = this.board();
|
||||
for (let i = 0; i < board.length; i++) {
|
||||
for (let j = 0; j < board[i].length; j++) {
|
||||
if (board[i][j] === null) {
|
||||
let square = this.convertRowColToLAN(i, j);
|
||||
board[i][j] = { square };
|
||||
}
|
||||
}
|
||||
}
|
||||
// for killing opponent piece
|
||||
if (
|
||||
inBoard(row + 1, col + 1) &&
|
||||
chessBoard[row + 1][col + 1]?.type &&
|
||||
chessBoard[row + 1][col + 1]?.color === myColor
|
||||
)
|
||||
inBoard(row + 1, col + 1) && movePos.push({ row: row + 1, col: col + 1 });
|
||||
if (
|
||||
inBoard(row + 1, col - 1) &&
|
||||
chessBoard[row + 1][col - 1]?.type &&
|
||||
chessBoard[row + 1][col - 1]?.color === myColor
|
||||
)
|
||||
inBoard(row + 1, col - 1) && movePos.push({ row: row + 1, col: col - 1 });
|
||||
return board;
|
||||
}
|
||||
|
||||
return { movePos };
|
||||
getMoves(square) {
|
||||
let moves = this.moves({ square, verbose: true });
|
||||
let newMoves = [];
|
||||
for (let i = 0; i < moves.length; i++) {
|
||||
newMoves.push(moves[i].to);
|
||||
}
|
||||
return newMoves;
|
||||
}
|
||||
}
|
||||
|
||||
function getRookHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col, color } = chessPiece;
|
||||
let movePos = [];
|
||||
let i = row,
|
||||
j = col;
|
||||
while (inBoard(++i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
console.log(movePos);
|
||||
|
||||
return { movePos };
|
||||
}
|
||||
|
||||
function getKnightHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col, color } = chessPiece;
|
||||
let movePos = [];
|
||||
|
||||
if (inBoard(row + 2, col + 1) && !isBlocked(chessBoard, chessPiece, row + 2, col + 1))
|
||||
movePos.push({ row: row + 2, col: col + 1 });
|
||||
if (inBoard(row + 2, col - 1) && !isBlocked(chessBoard, chessPiece, row + 2, col - 1))
|
||||
movePos.push({ row: row + 2, col: col - 1 });
|
||||
if (inBoard(row - 2, col + 1) && !isBlocked(chessBoard, chessPiece, row - 2, col + 1))
|
||||
movePos.push({ row: row - 2, col: col + 1 });
|
||||
if (inBoard(row - 2, col - 1) && !isBlocked(chessBoard, chessPiece, row - 2, col - 1))
|
||||
movePos.push({ row: row - 2, col: col - 1 });
|
||||
if (inBoard(row + 1, col + 2) && !isBlocked(chessBoard, chessPiece, row + 1, col + 2))
|
||||
movePos.push({ row: row + 1, col: col + 2 });
|
||||
if (inBoard(row - 1, col + 2) && !isBlocked(chessBoard, chessPiece, row - 1, col + 2))
|
||||
movePos.push({ row: row - 1, col: col + 2 });
|
||||
if (inBoard(row + 1, col - 2) && !isBlocked(chessBoard, chessPiece, row + 1, col - 2))
|
||||
movePos.push({ row: row + 1, col: col - 2 });
|
||||
if (inBoard(row - 1, col - 2) && !isBlocked(chessBoard, chessPiece, row - 1, col - 2))
|
||||
movePos.push({ row: row - 1, col: col - 2 });
|
||||
|
||||
return { movePos };
|
||||
}
|
||||
|
||||
function getBishopHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col, color } = chessPiece;
|
||||
let movePos = [];
|
||||
|
||||
let i = row,
|
||||
j = col;
|
||||
while (inBoard(++i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(++i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
|
||||
return { movePos };
|
||||
}
|
||||
|
||||
function getQueenHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col, color } = chessPiece;
|
||||
let movePos = [];
|
||||
let i = row,
|
||||
j = col;
|
||||
while (inBoard(++i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(++i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(++i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, ++j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
i = row;
|
||||
j = col;
|
||||
while (inBoard(--i, --j) && !isBlocked(chessBoard, chessPiece, i, j)) {
|
||||
movePos.push({ row: i, col: j });
|
||||
if (isAttacking(chessBoard, chessPiece, i, j)) break;
|
||||
}
|
||||
|
||||
return { movePos };
|
||||
}
|
||||
|
||||
function getKingHint(chessBoard, chessPiece, myColor) {
|
||||
const { row, col } = chessPiece;
|
||||
let movePos = [];
|
||||
|
||||
if (inBoard(row, col + 1) && !isBlocked(chessBoard, chessPiece, row, col + 1))
|
||||
movePos.push({ row: row, col: col + 1 });
|
||||
if (inBoard(row, col - 1) && !isBlocked(chessBoard, chessPiece, row, col - 1))
|
||||
movePos.push({ row: row, col: col - 1 });
|
||||
if (inBoard(row + 1, col + 1) && !isBlocked(chessBoard, chessPiece, row + 1, col + 1))
|
||||
movePos.push({ row: row + 1, col: col + 1 });
|
||||
if (inBoard(row + 1, col) && !isBlocked(chessBoard, chessPiece, row + 1, col))
|
||||
movePos.push({ row: row + 1, col: col });
|
||||
if (inBoard(row + 1, col - 1) && !isBlocked(chessBoard, chessPiece, row + 1, col - 1))
|
||||
movePos.push({ row: row + 1, col: col - 1 });
|
||||
if (inBoard(row - 1, col + 1) && !isBlocked(chessBoard, chessPiece, row - 1, col + 1))
|
||||
movePos.push({ row: row - 1, col: col + 1 });
|
||||
if (inBoard(row - 1, col) && !isBlocked(chessBoard, chessPiece, row - 1, col))
|
||||
movePos.push({ row: row - 1, col: col });
|
||||
if (inBoard(row - 1, col - 1) && !isBlocked(chessBoard, chessPiece, row - 1, col - 1))
|
||||
movePos.push({ row: row - 1, col: col - 1 });
|
||||
|
||||
return { movePos };
|
||||
}
|
||||
|
||||
export function getPieceHint(chessBoard, chessPiece, myColor) {
|
||||
switch (chessPiece.type) {
|
||||
case pawn:
|
||||
return getPawnHint(chessBoard, chessPiece, myColor);
|
||||
case rook:
|
||||
return getRookHint(chessBoard, chessPiece, myColor);
|
||||
case knight:
|
||||
return getKnightHint(chessBoard, chessPiece, myColor);
|
||||
case bishop:
|
||||
return getBishopHint(chessBoard, chessPiece, myColor);
|
||||
case queen:
|
||||
return getQueenHint(chessBoard, chessPiece, myColor);
|
||||
case king:
|
||||
return getKingHint(chessBoard, chessPiece, myColor);
|
||||
}
|
||||
|
||||
return [];
|
||||
}
|
||||
export const chess = new ChessModified();
|
||||
|
||||
Reference in New Issue
Block a user