12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455 |
- 'use strict';
- const React = require('react/addons');
- const CreateGameForm = React.createClass({
- propTypes: {
- link: React.PropTypes.string.isRequired,
- time: React.PropTypes.string.isRequired,
- inc: React.PropTypes.string.isRequired,
- onChangeForm: React.PropTypes.func.isRequired,
- createGame: React.PropTypes.func.isRequired
- },
- mixins: [React.addons.PureRenderMixin],
- render() {
- return (
- <form onSubmit={this.props.createGame}>
- <fieldset>
- <label>
- <span>Minutes per side: </span>
- <input
- type="number"
- name="time"
- value={this.props.time}
- onChange={this.props.onChangeForm}
- min="1"
- max="50"
- required />
- </label>
- <label style={{paddingLeft: '2em'}}>
- <span>Increment in seconds: </span>
- <input
- type="number"
- name="inc"
- value={this.props.inc}
- onChange={this.props.onChangeForm}
- min="0"
- max="50"
- required />
- </label>
- </fieldset>
- <input
- id="game-link"
- type="text"
- value={this.props.link || 'Game link will be generated here.'}
- onClick={e => e.target.select()}
- readOnly />
- <button type="submit" className="btn">Play</button>
- </form>
- );
- }
- });
- module.exports = CreateGameForm;
|