From 48ee1a065debde5027fc17e49144d348258dc5e4 Mon Sep 17 00:00:00 2001 From: notoraptor Date: Thu, 25 Jul 2019 10:59:36 -0400 Subject: [Web] Added game creation interface - Replaced fancybox with react-confirm-alert + dialog box - Removed unused code - Default map can be selected with 1-click - Added ability to select map variants --- .../gui/wizards/gameCreation/gameCreationWizard.js | 109 +++++++++++++++++++++ 1 file changed, 109 insertions(+) create mode 100644 diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.js (limited to 'diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.js') diff --git a/diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.js b/diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.js new file mode 100644 index 0000000..daaa461 --- /dev/null +++ b/diplomacy/web/src/gui/wizards/gameCreation/gameCreationWizard.js @@ -0,0 +1,109 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import {Panels} from "./panelList"; +import {PanelChooseMap} from "./panelChooseMap"; +import {PanelChoosePlayers} from "./panelChoosePlayers"; +import {PanelChoosePower} from "./panelChoosePower"; +import {PanelChooseSettings} from "./panelChooseSettings"; +import {Maps} from "./mapList"; +import {UTILS} from "../../../diplomacy/utils/utils"; + +export class GameCreationWizard extends React.Component { + constructor(props) { + super(props); + this.state = { + panel: Panels.CHOOSE_MAP, + game_id: UTILS.createGameID(this.props.username), + power_name: null, + n_controls: -1, + deadline: 0, + registration_password: '', + + map: Maps[0], + no_press: false + }; + this.backward = this.backward.bind(this); + this.forward = this.forward.bind(this); + this.updateParams = this.updateParams.bind(this); + } + + updateParams(params) { + this.setState(params); + } + + goToPanel(panelID) { + if (panelID < Panels.CHOOSE_MAP) + this.props.onCancel(); + else if (panelID > Panels.CHOOSE_SETTINGS) { + const rules = ['POWER_CHOICE']; + if (this.state.no_press) + rules.push('NO_PRESS'); + if (!this.state.deadline) { + rules.push('NO_DEADLINE'); + rules.push('REAL_TIME'); + } + this.props.onSubmit({ + game_id: this.state.game_id, + map_name: this.state.map.name, + power_name: this.state.power_name, + n_controls: this.state.n_controls, + deadline: this.state.deadline, + registration_password: this.state.registration_password || null, + rules: rules + }); + } else + this.setState({panel: panelID, registration_password: ''}); + } + + backward(step) { + this.goToPanel(this.state.panel - (step ? step : 1)); + } + + forward(step) { + this.goToPanel(this.state.panel + (step ? step : 1)); + } + + renderPanel() { + switch (this.state.panel) { + case Panels.CHOOSE_MAP: + return ; + case Panels.CHOOSE_PLAYERS: + return ; + case Panels.CHOOSE_POWER: + return ; + case Panels.CHOOSE_SETTINGS: + return ; + default: + return ''; + } + } + + render() { + return ( +
{this.renderPanel()}
+ ); + } +} + +GameCreationWizard.propTypes = { + onCancel: PropTypes.func.isRequired, + onSubmit: PropTypes.func.isRequired, + availableMaps: PropTypes.object.isRequired, + username: PropTypes.string.isRequired +}; -- cgit v1.2.3