MrDiderot/Michess
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move validation fixes, update page title on turn

Browse Source
This commit is contained in:
Nathaniel Tampus
2023-03-06 15:11:35 +08:00
parent c548f10d63
commit d858853bf4
2 changed files with 35 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
client/src/components/game/GamePage.tsx
View File

@@ -51,11 +51,9 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
handleResize(); handleResize();
if (lobby.pgn && lobby.actualGame.pgn() !== lobby.pgn) { if (lobby.pgn && lobby.actualGame.pgn() !== lobby.pgn) {
const gameCopy = new Chess(); lobby.actualGame.loadPgn(lobby.pgn as string);
gameCopy.loadPgn(lobby.pgn as string);
updateLobby({ type: "setGame", payload: gameCopy });
const lastMove = gameCopy.history({ verbose: true }).pop(); const lastMove = lobby.actualGame.history({ verbose: true }).pop();
let lastMoveSquares = undefined; let lastMoveSquares = undefined;
let kingSquare = undefined; let kingSquare = undefined;
@@ -65,10 +63,10 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
[lastMove.to]: { background: "rgba(255, 255, 0, 0.4)" } [lastMove.to]: { background: "rgba(255, 255, 0, 0.4)" }
}; };
} }
if (gameCopy.inCheck()) { if (lobby.actualGame.inCheck()) {
const kingPos = gameCopy.board().reduce((acc, row, index) => { const kingPos = lobby.actualGame.board().reduce((acc, row, index) => {
const squareIndex = row.findIndex( const squareIndex = row.findIndex(
(square) => square && square.type === "k" && square.color === gameCopy.turn() (square) => square && square.type === "k" && square.color === lobby.actualGame.turn()
); );
return squareIndex >= 0 ? `${String.fromCharCode(squareIndex + 97)}${8 - index}` : acc; return squareIndex >= 0 ? `${String.fromCharCode(squareIndex + 97)}${8 - index}` : acc;
}, ""); }, "");
@@ -115,6 +113,21 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
chatlist.scrollTop = chatlist.scrollHeight; chatlist.scrollTop = chatlist.scrollHeight;
}, [chatMessages]); }, [chatMessages]);
useEffect(() => {
updateTurnTitle();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [lobby]);
function updateTurnTitle() {
if (lobby.side === "s" || !lobby.white?.id || !lobby.black?.id) return;
if (lobby.side === lobby.actualGame.turn()) {
document.title = "(your turn) chessu";
} else {
document.title = "chessu";
}
}
function handleResize() { function handleResize() {
if (window.innerWidth >= 1920) { if (window.innerWidth >= 1920) {
setBoardWidth(580); setBoardWidth(580);
@@ -161,7 +174,13 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
function makeMove(m: { from: string; to: string; promotion?: string }) { function makeMove(m: { from: string; to: string; promotion?: string }) {
try { try {
const result = lobby.actualGame.move(m); const result = lobby.actualGame.move(m);
if (result) { if (result) {
updateLobby({
type: "updateLobby",
payload: { pgn: lobby.actualGame.pgn() }
});
updateTurnTitle();
let kingSquare = undefined; let kingSquare = undefined;
if (lobby.actualGame.inCheck()) { if (lobby.actualGame.inCheck()) {
const kingPos = lobby.actualGame.board().reduce((acc, row, index) => { const kingPos = lobby.actualGame.board().reduce((acc, row, index) => {

18
client/src/components/game/handlers.ts
View File

@@ -49,14 +49,10 @@ export function initSocket(
}); });
socket.on("receivedLatestGame", (latestGame: Game) => { socket.on("receivedLatestGame", (latestGame: Game) => {
actions.updateLobby({ type: "updateLobby", payload: latestGame });
if (latestGame.pgn && latestGame.pgn !== lobby.actualGame.pgn()) { if (latestGame.pgn && latestGame.pgn !== lobby.actualGame.pgn()) {
const gameCopy = new Chess(); lobby.actualGame.loadPgn(latestGame.pgn as string);
gameCopy.loadPgn(latestGame.pgn as string);
actions.updateLobby({ type: "setGame", payload: gameCopy });
const lastMove = gameCopy.history({ verbose: true }).pop(); const lastMove = lobby.actualGame.history({ verbose: true }).pop();
let lastMoveSquares = undefined; let lastMoveSquares = undefined;
let kingSquare = undefined; let kingSquare = undefined;
@@ -66,11 +62,13 @@ export function initSocket(
[lastMove.to]: { background: "rgba(255, 255, 0, 0.4)" } [lastMove.to]: { background: "rgba(255, 255, 0, 0.4)" }
}; };
} }
if (gameCopy.inCheck()) { if (lobby.actualGame.inCheck()) {
const kingPos = gameCopy.board().reduce((acc, row, index) => { const kingPos = lobby.actualGame.board().reduce((acc, row, index) => {
const squareIndex = row.findIndex( const squareIndex = row.findIndex(
(square) => (square) =>
square && square.type === "k" && square.color === gameCopy.turn() square &&
square.type === "k" &&
square.color === lobby.actualGame.turn()
); );
return squareIndex >= 0 return squareIndex >= 0
? `${String.fromCharCode(squareIndex + 97)}${8 - index}` ? `${String.fromCharCode(squareIndex + 97)}${8 - index}`
@@ -88,6 +86,7 @@ export function initSocket(
check: kingSquare check: kingSquare
}); });
} }
actions.updateLobby({ type: "updateLobby", payload: latestGame });
if (latestGame.black?.id === user?.id) { if (latestGame.black?.id === user?.id) {
if (lobby.side !== "b") actions.updateLobby({ type: "setSide", payload: "b" }); if (lobby.side !== "b") actions.updateLobby({ type: "setSide", payload: "b" });
@@ -100,6 +99,7 @@ export function initSocket(
socket.on("receivedMove", (m: { from: string; to: string; promotion?: string }) => { socket.on("receivedMove", (m: { from: string; to: string; promotion?: string }) => {
const success = actions.makeMove(m); const success = actions.makeMove(m);
console.log(success);
if (!success) { if (!success) {
socket.emit("getLatestGame"); socket.emit("getLatestGame");
} }