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
|
// ==============================================================================
// Copyright (C) 2019 - Philip Paquette, Steven Bocco
//
// This program is free software: you can redistribute it and/or modify it under
// the terms of the GNU Affero General Public License as published by the Free
// Software Foundation, either version 3 of the License, or (at your option) any
// later version.
//
// This program is distributed in the hope that it will be useful, but WITHOUT
// ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
// FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
// details.
//
// You should have received a copy of the GNU Affero General Public License along
// with this program. If not, see <https://www.gnu.org/licenses/>.
// ==============================================================================
import React from 'react';
import {Forms} from "../components/forms";
import {STRINGS} from "../../diplomacy/utils/strings";
import PropTypes from "prop-types";
export class CreateForm extends React.Component {
constructor(props) {
super(props);
this.state = this.initState();
}
initState() {
const state = {
game_id: '',
power_name: '',
n_controls: 7,
deadline: 300,
registration_password: ''
};
for (let rule of STRINGS.PUBLIC_RULES)
state[`rule_${rule.toLowerCase()}`] = false;
return state;
}
render() {
const onChange = Forms.createOnChangeCallback(this, this.props.onChange);
const onSubmit = Forms.createOnSubmitCallback(this, this.props.onSubmit);
return (
<form>
{Forms.createRow(
Forms.createColLabel('game_id', 'Game ID (optional)'),
<input id={'game_id'} className={'form-control'} type={'text'}
value={Forms.getValue(this.state, 'game_id')} onChange={onChange}/>
)}
{Forms.createRow(
Forms.createColLabel('power_name', 'power:'),
<select id={'power_name'} className={'form-control custom-select'}
value={Forms.getValue(this.state, 'power_name')} onChange={onChange}>
{Forms.createSelectOptions(STRINGS.ALL_POWER_NAMES, true)}
</select>
)}
{Forms.createRow(
Forms.createColLabel('n_controls', 'number of required players:'),
<input id={'n_controls'} className={'form-control'} type={'number'}
value={Forms.getValue(this.state, 'n_controls')} onChange={onChange}/>
)}
{Forms.createRow(
Forms.createColLabel('deadline', 'deadline (in seconds)'),
<input id={'deadline'} className={'form-control'} type={'number'}
value={Forms.getValue(this.state, 'deadline')}
onChange={onChange}/>
)}
{Forms.createRow(
Forms.createColLabel('registration_password', 'registration password'),
<input id={'registration_password'} className={'form-control'} type={'password'}
value={Forms.getValue(this.state, 'registration_password')} onChange={onChange}/>
)}
<div><strong>RULES:</strong></div>
<div className={'mb-4'}>
{STRINGS.PUBLIC_RULES.map((rule, index) => (
<div key={index} className={'form-check-inline'}>
{Forms.createCheckbox(
`rule_${rule.toLowerCase()}`,
rule,
Forms.getValue(this.state, `rule_${rule.toLowerCase()}`),
onChange)}
</div>
))}
</div>
{Forms.createRow('', Forms.createSubmit('create a game', true, onSubmit))}
</form>
);
}
}
CreateForm.propTypes = {
onChange: PropTypes.func,
onSubmit: PropTypes.func
};
|
