diff options
Diffstat (limited to 'frontend/src/components')
-rw-r--r-- | frontend/src/components/Application.jsx | 2 | ||||
-rw-r--r-- | frontend/src/components/game-browser/GameBrowser.jsx | 16 | ||||
-rw-r--r-- | frontend/src/components/game-browser/GameList.jsx | 3 | ||||
-rw-r--r-- | frontend/src/components/game/GameScene.jsx | 64 | ||||
-rw-r--r-- | frontend/src/components/home/ChooseNameForm.jsx | 2 | ||||
-rw-r--r-- | frontend/src/components/lobby/Lobby.jsx | 3 |
6 files changed, 80 insertions, 10 deletions
diff --git a/frontend/src/components/Application.jsx b/frontend/src/components/Application.jsx index d7e1738c..e0ec604d 100644 --- a/frontend/src/components/Application.jsx +++ b/frontend/src/components/Application.jsx @@ -1,11 +1,13 @@ import React from 'react'; import { Redirect, Route, Switch } from 'react-router-dom'; import { GameBrowser } from './game-browser/GameBrowser'; +import { GameScene } from './game/GameScene'; import { Lobby } from './lobby/Lobby'; import { Home } from './home/Home'; export const Application = () => ( <Switch> + <Route path="/game" component={GameScene} /> <Route path="/games" component={GameBrowser} /> <Route path="/lobby" component={Lobby} /> <Route path="/" component={Home} /> diff --git a/frontend/src/components/game-browser/GameBrowser.jsx b/frontend/src/components/game-browser/GameBrowser.jsx index 10d823b4..cfa0e45e 100644 --- a/frontend/src/components/game-browser/GameBrowser.jsx +++ b/frontend/src/components/game-browser/GameBrowser.jsx @@ -3,9 +3,9 @@ import { Button, Classes, InputGroup, Intent } from '@blueprintjs/core'; import React, { Component } from 'react'; import { connect } from 'react-redux'; import { Flex } from 'reflexbox'; +import { actions } from '../../redux/actions/lobby'; import { GameList } from './GameList'; import { PlayerInfo } from './PlayerInfo'; -import { actions } from '../../redux/games'; type GameBrowserProps = { createGame: (gameName: string) => void, @@ -26,12 +26,14 @@ class GameBrowserPresenter extends Component<GameBrowserProps> { return ( <div> <Flex align="center" justify='space-between' p={1}> - <InputGroup - placeholder="Game name" - name="game_name" - onChange={(e: SyntheticInputEvent<*>) => (this._gameName = e.target.value)} - rightElement={<CreateGameButton onClick={this.createGame}/>} - /> + <form onSubmit={this.createGame}> + <InputGroup + placeholder="Game name" + name="game_name" + onChange={(e: SyntheticInputEvent<*>) => (this._gameName = e.target.value)} + rightElement={<CreateGameButton onClick={this.createGame}/>} + /> + </form> <PlayerInfo /> </Flex> <GameList /> diff --git a/frontend/src/components/game-browser/GameList.jsx b/frontend/src/components/game-browser/GameList.jsx index 6363cff2..64ced9b0 100644 --- a/frontend/src/components/game-browser/GameList.jsx +++ b/frontend/src/components/game-browser/GameList.jsx @@ -3,7 +3,8 @@ import type { List } from 'immutable'; import React from 'react'; import { connect } from 'react-redux'; import type { Game } from '../../models/games'; -import { actions, getAllGames } from '../../redux/games'; +import { actions } from '../../redux/actions/lobby'; +import { getAllGames } from '../../redux/games'; import { IconButton } from '../shared/IconButton'; import './GameList.css'; import { GameStatus } from './GameStatus'; diff --git a/frontend/src/components/game/GameScene.jsx b/frontend/src/components/game/GameScene.jsx new file mode 100644 index 00000000..fb5763db --- /dev/null +++ b/frontend/src/components/game/GameScene.jsx @@ -0,0 +1,64 @@ +import { Button, Classes, Intent } from '@blueprintjs/core'; +import { List } from 'immutable'; +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import type { ApiPlayerTurnInfo } from '../../api/model'; +import { Game } from '../../models/games'; +import { Player } from '../../models/players'; +import { actions } from '../../redux/actions/game'; +import { getCurrentTurnInfo } from '../../redux/currentGame'; +import { getCurrentGame } from '../../redux/games'; + +import { getCurrentPlayer, getPlayers } from '../../redux/players'; +import { PlayerList } from '../lobby/PlayerList'; + +type GameSceneProps = { + game: Game, + currentPlayer: Player, + players: List<Player>, + turnInfo: ApiPlayerTurnInfo, + sayReady: () => void +} + +class GameScenePresenter extends Component<GameSceneProps> { + getTitle() { + if (this.props.game) { + return this.props.game.name + ' — Game'; + } else { + return 'What are you doing here? You haven\'t joined a game yet!'; + } + } + + render() { + return ( + <div> + <h2>{this.getTitle()}</h2> + <PlayerList players={this.props.players} currentPlayer={this.props.currentPlayer} owner={this.props.game.owner}/> + <Button text="READY" className={Classes.LARGE} intent={Intent.PRIMARY} icon='play' onClick={this.props.sayReady} /> + + <h3>Turn Info</h3> + <div> + <pre>{JSON.stringify(this.props.turnInfo, null, 2) }</pre> + </div> + </div> + ); + } +} + +const mapStateToProps: (state) => GameSceneProps = state => { + const game = getCurrentGame(state.get('games')); + console.info(game); + + return { + game: game, + currentPlayer: getCurrentPlayer(state), + players: game ? getPlayers(state.get('players'), game.players) : new List(), + turnInfo: getCurrentTurnInfo(state.get('currentGame')) + }; +}; + +const mapDispatchToProps = { + sayReady: actions.sayReady, +}; + +export const GameScene = connect(mapStateToProps, mapDispatchToProps)(GameScenePresenter); diff --git a/frontend/src/components/home/ChooseNameForm.jsx b/frontend/src/components/home/ChooseNameForm.jsx index 614ad172..619d967c 100644 --- a/frontend/src/components/home/ChooseNameForm.jsx +++ b/frontend/src/components/home/ChooseNameForm.jsx @@ -2,7 +2,7 @@ import { Classes, InputGroup, Intent } from '@blueprintjs/core'; import React, { Component } from 'react'; import { connect } from 'react-redux'; -import { actions } from '../../redux/players'; +import { actions } from '../../redux/actions/players'; import { IconButton } from '../shared/IconButton'; type ChooseNameFormPresenterProps = { diff --git a/frontend/src/components/lobby/Lobby.jsx b/frontend/src/components/lobby/Lobby.jsx index 82c00b20..df6557af 100644 --- a/frontend/src/components/lobby/Lobby.jsx +++ b/frontend/src/components/lobby/Lobby.jsx @@ -5,7 +5,8 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; import type { Game } from '../../models/games'; import type { Player } from '../../models/players'; -import { actions, getCurrentGame } from '../../redux/games'; +import { actions } from '../../redux/actions/lobby'; +import { getCurrentGame } from '../../redux/games'; import { getCurrentPlayer, getPlayers } from '../../redux/players'; import { RadialPlayerList } from './RadialPlayerList'; |