diff options
| -rw-r--r-- | api/events.py | 2 | ||||
| -rw-r--r-- | api/game/random.py | 2 | ||||
| -rw-r--r-- | api/game/socket.py | 11 | ||||
| -rw-r--r-- | pages/game.tsx | 29 |
4 files changed, 24 insertions, 20 deletions
diff --git a/api/events.py b/api/events.py index b7b8ab4..8974666 100644 --- a/api/events.py +++ b/api/events.py @@ -24,5 +24,5 @@ def connect(): user_id = token_login(token) if not user_id: return - join_room(user_id) + join_room("user-" + user_id) diff --git a/api/game/random.py b/api/game/random.py index 8d730ad..54ab2a8 100644 --- a/api/game/random.py +++ b/api/game/random.py @@ -41,7 +41,7 @@ def index(): players = cursor.execute("select player_1_id, player_2_id from games where game_id = ?", [game_id]).fetchone() games[game_id] = game(game_id, io, players[0], players[1]) - io.emit("gameStart", room=game_id) + io.emit("gameStart", room=games[game_id].room) player_1 = False game_started = True diff --git a/api/game/socket.py b/api/game/socket.py index 6f1112a..60fea00 100644 --- a/api/game/socket.py +++ b/api/game/socket.py @@ -12,6 +12,7 @@ games = {} class game: def __init__(self, game_id, io, player_1_id, player_2_id): self.game_id = game_id + self.room = "game-" + game_id self.board = bord(7, 6) self.io = io self.player_1_id = player_1_id @@ -23,7 +24,7 @@ class game: if user_id != move: return self.board.drop_fisje(column) - io.emit("fieldUpdate", { "field": self.board.board }, room=self.game_id) + io.emit("fieldUpdate", { "field": self.board.board }, room=self.room) now = int( time.time() * 1000 ) cursor.execute("update games set last_activity = ?, moves = moves || ? || ',' where game_id = ?", [now, column, self.game_id]) @@ -37,15 +38,15 @@ class game: io.emit("finish", { "winPositions": self.board.win_positions, "boardFull": self.board.board_full - }, room=self.game_id) + }, room=self.room) self.close("finished", outcome) return - io.emit("turnUpdate", { "player1": self.board.player_1 }, room=self.game_id) + io.emit("turnUpdate", { "player1": self.board.player_1 }, room=self.room) def resign(self): self.board.kill_voerbak() - io.emit("resign", room=self.game_id) + io.emit("resign", room=self.room) self.close("resign", "d") def close(self, new_status, outcome): @@ -98,5 +99,5 @@ def register_game_listener(data): game_id = data.get("game_id") if not game_id: return - join_room(game_id) + join_room("game-" + game_id) diff --git a/pages/game.tsx b/pages/game.tsx index a7083a6..aa90588 100644 --- a/pages/game.tsx +++ b/pages/game.tsx @@ -1,8 +1,9 @@ -import { CSSProperties, useState, useEffect } from 'react'; -import { io as socket } from 'socket.io-client'; +import { CSSProperties, useState, useEffect, useContext } from 'react'; import axios from 'axios'; import * as cookies from 'react-cookies'; import { useRouter } from 'next/router'; +import { SocketContext } from '../components/socketContext'; +import { Socket } from 'socket.io-client'; import { NavBar } from '../components/navbar'; import { CenteredPage } from '../components/page'; @@ -16,12 +17,11 @@ import WifiTetheringRoundedIcon from '@material-ui/icons/WifiTetheringRounded'; import LinkRoundedIcon from '@material-ui/icons/LinkRounded'; import RefreshIcon from '@material-ui/icons/Refresh'; -var io = socket(); - function VoerGame(props: { gameID: string; active: boolean; player1: boolean; + io: Socket; }) { var width = 7; var height = 6; @@ -35,18 +35,18 @@ function VoerGame(props: { useEffect(() => { if (ioListeners) return; - io.on("connect", () => console.log("connect")); - io.on("disconnect", () => console.log("disconnect")); + props.io.on("connect", () => console.log("connect")); + props.io.on("disconnect", () => console.log("disconnect")); - io.on("fieldUpdate", (data: { field: string }) => { + props.io.on("fieldUpdate", (data: { field: string }) => { board = data.field.split("").map(i => Number(i)); for(let i = 0; i < data.field.length; i++) document.getElementById(`pos-${i}`).parentNode.children.item(1).classList.add(`state-${data.field[i]}`); }); - io.on("turnUpdate", (data: { player1: boolean }) => setTurn(data.player1)); + props.io.on("turnUpdate", (data: { player1: boolean }) => setTurn(data.player1)); - io.on("finish", (data: { + props.io.on("finish", (data: { winPositions: Array<Array<number>> boardFull: boolean winner: number @@ -57,7 +57,7 @@ function VoerGame(props: { if (data.winPositions.length > 0) setOutcome(board[data.winPositions[0][0]]); }); - io.on("resign", () => { + props.io.on("resign", () => { alert("resign") }); @@ -74,7 +74,7 @@ function VoerGame(props: { <VoerBord width={width} height={height} onMove={move => { - io.emit("newMove", { + props.io.emit("newMove", { move: move % width + 1, token: cookies.load("token"), game_id: props.gameID @@ -86,7 +86,7 @@ function VoerGame(props: { turn={turn} player1={props.player1} active={props.active} - resignFunction={() => {io.emit("resign", { game_id: props.gameID })}} + resignFunction={() => { props.io.emit("resign", { game_id: props.gameID }) }} /> <GameOutcomeDialog outcome={outcome} @@ -173,6 +173,8 @@ export default function GamePage() { var [active, setActive] = useState(false); var gameIDUrl = useRouter().query["id"] as string; + var { io } = useContext(SocketContext); + if (gameIDUrl && gameIDUrl != gameID) { // join game axios.request<{ id: string, player_1: boolean }>({ @@ -204,7 +206,8 @@ export default function GamePage() { <VoerGame active={active} gameID={gameID} - player1={player1}/> + player1={player1} + io={io}/> <DialogBox title="Nieuw spel" style={{ display: gameIDUrl || gameID ? "none" : "inline-block" }} |