connect FE submit pass to BE game service
This commit is contained in:
parent
249789944b
commit
be8cb70431
7 changed files with 87 additions and 3 deletions
|
@ -1,7 +1,12 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import "./PlayerArea.scss";
|
import "./PlayerArea.scss";
|
||||||
|
|
||||||
const PlayerArea = ({ handleResignClick, playerMeta, turn }) => {
|
const PlayerArea = ({
|
||||||
|
handleResignClick,
|
||||||
|
handlePassClick,
|
||||||
|
playerMeta,
|
||||||
|
turn,
|
||||||
|
}) => {
|
||||||
const { stones, player, rank, captures } = playerMeta;
|
const { stones, player, rank, captures } = playerMeta;
|
||||||
const isTurn =
|
const isTurn =
|
||||||
(stones === "black" && turn === 1) || (stones === "white" && turn === -1);
|
(stones === "black" && turn === 1) || (stones === "white" && turn === -1);
|
||||||
|
@ -10,7 +15,9 @@ const PlayerArea = ({ handleResignClick, playerMeta, turn }) => {
|
||||||
<div className={`player-container player-container--${stones}`}>
|
<div className={`player-container player-container--${stones}`}>
|
||||||
<div
|
<div
|
||||||
className={`player-container__bowl player-container__bowl--${stones}`}
|
className={`player-container__bowl player-container__bowl--${stones}`}
|
||||||
{...(isTurn ? { "data-turn": true } : null)}
|
{...(isTurn
|
||||||
|
? { "data-turn": true, onClick: () => handlePassClick(stones) }
|
||||||
|
: null)}
|
||||||
>
|
>
|
||||||
<p>Pass?</p>
|
<p>Pass?</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -70,6 +70,15 @@ const Game = (props) => {
|
||||||
dispatch(action);
|
dispatch(action);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handlePassClick = (player) => {
|
||||||
|
const action = {
|
||||||
|
type: "SOCKET",
|
||||||
|
message: "PASS",
|
||||||
|
body: { game, player },
|
||||||
|
};
|
||||||
|
dispatch(action);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="Game" data-testid="Game">
|
<div className="Game" data-testid="Game">
|
||||||
<div className="Game__meta-container">
|
<div className="Game__meta-container">
|
||||||
|
@ -94,6 +103,7 @@ const Game = (props) => {
|
||||||
<div className="Game__board-container">
|
<div className="Game__board-container">
|
||||||
<PlayerArea
|
<PlayerArea
|
||||||
handleResignClick={handleResignClick}
|
handleResignClick={handleResignClick}
|
||||||
|
handlePassClick={handlePassClick}
|
||||||
playerMeta={
|
playerMeta={
|
||||||
state.user &&
|
state.user &&
|
||||||
playerBlackMeta.playerBlack &&
|
playerBlackMeta.playerBlack &&
|
||||||
|
@ -113,6 +123,7 @@ const Game = (props) => {
|
||||||
/>
|
/>
|
||||||
<PlayerArea
|
<PlayerArea
|
||||||
handleResignClick={handleResignClick}
|
handleResignClick={handleResignClick}
|
||||||
|
handlePassClick={handlePassClick}
|
||||||
playerMeta={
|
playerMeta={
|
||||||
state.user &&
|
state.user &&
|
||||||
playerBlackMeta.playerWhite &&
|
playerBlackMeta.playerWhite &&
|
||||||
|
|
|
@ -25,6 +25,7 @@ export const gamesReducer = (state, action) => {
|
||||||
return {
|
return {
|
||||||
...state,
|
...state,
|
||||||
board: action.body.board,
|
board: action.body.board,
|
||||||
|
territory: action.body.territory,
|
||||||
meta: { gameRecord, pass, turn, winner, playerState },
|
meta: { gameRecord, pass, turn, winner, playerState },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -38,6 +38,10 @@ export const socketReducer = (state, action) => {
|
||||||
return resign(state, action);
|
return resign(state, action);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
case "PASS": {
|
||||||
|
return pass(state, action);
|
||||||
|
}
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
@ -72,3 +76,9 @@ function resign(state, action) {
|
||||||
socket.emit("resign", { ...action.body });
|
socket.emit("resign", { ...action.body });
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function pass(state, action) {
|
||||||
|
const socket = state.socket;
|
||||||
|
socket.emit("pass", { ...action.body });
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
|
|
@ -199,6 +199,7 @@ const Game = ({ gameData = {}, gameRecord = [] } = {}) => {
|
||||||
score: 0,
|
score: 0,
|
||||||
groups: {}, // key is Symbol(position): {points: Set(), liberties: Set()}
|
groups: {}, // key is Symbol(position): {points: Set(), liberties: Set()}
|
||||||
boardState: {},
|
boardState: {},
|
||||||
|
territory: {},
|
||||||
kos: [],
|
kos: [],
|
||||||
gameRecord: gameRecord,
|
gameRecord: gameRecord,
|
||||||
playerState: gameData.playerState || {
|
playerState: gameData.playerState || {
|
||||||
|
@ -241,6 +242,7 @@ const Game = ({ gameData = {}, gameRecord = [] } = {}) => {
|
||||||
if (this.pass > 1) {
|
if (this.pass > 1) {
|
||||||
return { ...this, success: false };
|
return { ...this, success: false };
|
||||||
}
|
}
|
||||||
|
if (x === 0) return this.submitPass(player);
|
||||||
let game = this;
|
let game = this;
|
||||||
let success = false;
|
let success = false;
|
||||||
const point = game.boardState[`${x}-${y}`];
|
const point = game.boardState[`${x}-${y}`];
|
||||||
|
@ -342,7 +344,7 @@ const Game = ({ gameData = {}, gameRecord = [] } = {}) => {
|
||||||
this.boardState = boardState;
|
this.boardState = boardState;
|
||||||
// submit board state to users
|
// submit board state to users
|
||||||
this.turn = 0;
|
this.turn = 0;
|
||||||
return this;
|
return { ...this, territory: getTerritory(this) };
|
||||||
},
|
},
|
||||||
|
|
||||||
toggleTerritory: function (key) {
|
toggleTerritory: function (key) {
|
||||||
|
|
|
@ -59,6 +59,7 @@ const GameService = (moveQueries) => {
|
||||||
getDataForUI: (id) => {
|
getDataForUI: (id) => {
|
||||||
return {
|
return {
|
||||||
board: gamesInProgress[id].legalMoves,
|
board: gamesInProgress[id].legalMoves,
|
||||||
|
territory: gamesInProgress[id].territory,
|
||||||
...gamesInProgress[id].getMeta(),
|
...gamesInProgress[id].getMeta(),
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
@ -74,6 +75,31 @@ const GameService = (moveQueries) => {
|
||||||
resign: ({ id, player }) => {
|
resign: ({ id, player }) => {
|
||||||
return gamesInProgress[id].submitResign(player).getMeta();
|
return gamesInProgress[id].submitResign(player).getMeta();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
async pass({ id, player }) {
|
||||||
|
gamesInProgress[id] = gamesInProgress[id].submitPass(player);
|
||||||
|
if (gamesInProgress[id].success === false)
|
||||||
|
return { message: "illegal move" };
|
||||||
|
try {
|
||||||
|
if (moveQueries) {
|
||||||
|
const priorMove = gamesInProgress[id].gameRecord.length;
|
||||||
|
const movePass = {
|
||||||
|
gameId: id,
|
||||||
|
player,
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
gameRecord: true,
|
||||||
|
priorMove,
|
||||||
|
};
|
||||||
|
let moveDbResult;
|
||||||
|
moveDbResult = await moveQueries.addMove(movePass);
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
gamesInProgress[id].returnToMove(-1);
|
||||||
|
} finally {
|
||||||
|
return this.getDataForUI(id);
|
||||||
|
}
|
||||||
|
},
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -28,6 +28,8 @@ io.on("connection", async (socket) => {
|
||||||
io.of(room).to(game).emit("game_connected", { board, meta });
|
io.of(room).to(game).emit("game_connected", { board, meta });
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// MAKE MOVE
|
||||||
socket.on("make_move", async (data) => {
|
socket.on("make_move", async (data) => {
|
||||||
const { user, move, board, game, room } = data;
|
const { user, move, board, game, room } = data;
|
||||||
const gameNsp = `game-${data.game.id}`;
|
const gameNsp = `game-${data.game.id}`;
|
||||||
|
@ -50,6 +52,8 @@ io.on("connection", async (socket) => {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// RESIGN
|
||||||
socket.on("resign", async ({ game, player }) => {
|
socket.on("resign", async ({ game, player }) => {
|
||||||
const { id, room } = game;
|
const { id, room } = game;
|
||||||
const gameNsp = `game-${id}`;
|
const gameNsp = `game-${id}`;
|
||||||
|
@ -65,6 +69,29 @@ io.on("connection", async (socket) => {
|
||||||
console.log(e);
|
console.log(e);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
// PASS
|
||||||
|
socket.on("pass", async ({ game, player }) => {
|
||||||
|
const { id, room } = game;
|
||||||
|
const gameNsp = `game${id}`;
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
board,
|
||||||
|
message,
|
||||||
|
territory,
|
||||||
|
...meta
|
||||||
|
} = await gameServices.pass({
|
||||||
|
id,
|
||||||
|
player,
|
||||||
|
});
|
||||||
|
socket.join(gameNsp, () => {
|
||||||
|
io.of(room)
|
||||||
|
.to(gameNsp)
|
||||||
|
.emit("update_board", { board, message, territory, meta });
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e);
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue