1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
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 <PanelChooseMap forward={this.forward}
params={this.state}
onUpdateParams={this.updateParams}
cancel={this.props.onCancel}/>;
case Panels.CHOOSE_PLAYERS:
return <PanelChoosePlayers backward={this.backward}
forward={this.forward}
onUpdateParams={this.updateParams}
nbPowers={this.props.availableMaps[this.state.map.name].powers.length}
cancel={this.props.onCancel}/>;
case Panels.CHOOSE_POWER:
return <PanelChoosePower backward={this.backward}
forward={this.forward}
onUpdateParams={this.updateParams}
powers={this.props.availableMaps[this.state.map.name].powers}
cancel={this.props.onCancel}/>;
case Panels.CHOOSE_SETTINGS:
return <PanelChooseSettings backward={this.backward}
forward={this.forward}
onUpdateParams={this.updateParams}
username={this.props.username}
params={this.state}
cancel={this.props.onCancel}/>;
default:
return '';
}
}
render() {
return (
<div className="game-creation-wizard">{this.renderPanel()}</div>
);
}
}
GameCreationWizard.propTypes = {
onCancel: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
availableMaps: PropTypes.object.isRequired,
username: PropTypes.string.isRequired
};
|
