diff options
| -rw-r--r-- | api/game/random.py | 7 | ||||
| -rw-r--r-- | components/gameBar.tsx | 3 | ||||
| -rw-r--r-- | pages/game.tsx | 39 |
3 files changed, 22 insertions, 27 deletions
diff --git a/api/game/random.py b/api/game/random.py index 09408e1..68ba44c 100644 --- a/api/game/random.py +++ b/api/game/random.py @@ -22,12 +22,13 @@ def index(): user_id = token_login(token)[0] public_games = cursor.execute("select game_id from games where private = FALSE and status = \"wait_for_opponent\"").fetchall() - print(public_games) + if len(public_games) == 0: game_id = new_uuid("games") cursor.execute("insert into games values (?, NULL, NULL, ?, NULL, NULL, 0, NULL, NULL, NULL, \"wait_for_opponent\", \"default\", FALSE) ", (game_id, user_id)) connection.commit() + player_1 = True else: game_id = random.choice(public_games)[0] timestamp = int( time.time() * 1000 ) @@ -37,4 +38,6 @@ 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]) - return { "id": game_id }, 200 + player_1 = False + + return { "id": game_id, "player_1": player_1 }, 200 diff --git a/components/gameBar.tsx b/components/gameBar.tsx index b1e6a2d..a2ced12 100644 --- a/components/gameBar.tsx +++ b/components/gameBar.tsx @@ -28,6 +28,7 @@ var GameBarAlignStyle: CSSProperties = { export function GameBar(props: { turn: boolean; + player1: boolean; }) { return <Vierkant className="gameBar" style={{ padding: 8, @@ -47,7 +48,7 @@ export function GameBar(props: { margin: 12, verticalAlign: "top", display: "inline-block" - }}>{ props.turn ? "Jouw beurt" : "Tegenstander" }</h2> + }}>{ props.turn == props.player1 ? "Jouw beurt" : "Tegenstander" }</h2> </div> <div style={{ ...GameBarAlignStyle, diff --git a/pages/game.tsx b/pages/game.tsx index 6890a7e..481d7bd 100644 --- a/pages/game.tsx +++ b/pages/game.tsx @@ -1,7 +1,6 @@ import { CSSProperties, Component } from 'react'; import { io as socket, Socket } from 'socket.io-client'; import axios from 'axios'; -import { userInfo } from '../api/api'; import * as cookies from 'react-cookies'; import { NavBar } from '../components/navbar'; @@ -19,6 +18,8 @@ import RefreshIcon from '@material-ui/icons/Refresh'; interface VoerGameProps { gameID: string; token: string; + active: boolean; + player1: boolean; } class VoerGame extends Component<VoerGameProps> { @@ -89,8 +90,8 @@ class VoerGame extends Component<VoerGameProps> { maxWidth: "100vh", margin: "0 auto" }}> - <VoerBord width={this.width} height={this.height} onMove={m => this.move(m % this.width + 1)} active={this.state.outcome == -1}/> - <GameBar turn={this.state.turn}/> + <VoerBord width={this.width} height={this.height} onMove={m => this.move(m % this.width + 1)} active={this.props.active == true && this.state.outcome == -1}/> + <GameBar turn={this.state.turn} player1={this.props.player1}/> <GameOutcomeDialog outcome={this.state.outcome} visible={this.state.outcome != -1}/> </div> } @@ -162,35 +163,28 @@ var InviteButtonLabelStyle: CSSProperties = { export default class GamePage extends Component { constructor(props: {}) { super(props); - - /* if (typeof window === "undefined") return; */ - /* if (document.cookie.includes("token") == false) return; */ - /* axios.request<userInfo>({ */ - /* method: "get", */ - /* url: `/api/user/info`, */ - /* headers: {"content-type": "application/json"} */ - /* }) */ - /* .then(request => this.setState({ */ - /* user: request.data, */ - /* token: cookies.load("token") */ - /* })) */ - /* .catch(() => {}); */ } state: { gameID: string; token: string; + player1: boolean; } = { gameID: "", token: "", + player1: true } render() { return <div> <NavBar/> <CenteredPage width={900} style={{ height: "100vh" }}> - <VoerGame gameID={this.state.gameID} token={this.state.token}/> - {true && <DialogBox title="Nieuw spel"> + <VoerGame + active={!!this.state.gameID} + gameID={this.state.gameID} + token={this.state.token} + player1={this.state.player1}/> + <DialogBox title="Nieuw spel" style={{ display: !this.state.gameID ? "inline-block" : "none" }}> <CurrentGameSettings/> <div style={{ marginTop: 24, @@ -199,7 +193,7 @@ export default class GamePage extends Component { gridGap: 24 }}> <Button style={InviteButtonStyle} onclick={() => { - axios.request<{ id: string }>({ + axios.request<{ id: string, player_1: boolean }>({ method: "post", url: "/api/game/random", headers: {"content-type": "application/json"}, @@ -207,6 +201,7 @@ export default class GamePage extends Component { }) .then(request => this.setState({ gameID: request.data.id, + player1: request.data.player_1, token: cookies.load("token") })) .catch(() => {}); @@ -226,11 +221,7 @@ export default class GamePage extends Component { </Button> </div> <SearchBar label="Zoeken in vriendenlijst"/> - <code> - {this.state.gameID} - {this.state.token} - </code> - </DialogBox>} + </DialogBox> </CenteredPage> </div> } |