76 lines
2.3 KiB
JavaScript
76 lines
2.3 KiB
JavaScript
import React, { Component } from 'react';
|
|
import '../styles/styles.css';
|
|
import '../styles/bootstrap.css';
|
|
import Field from '../components/Field.js';
|
|
import Ready from '../components/Ready.js';
|
|
import request, {host} from '../scripts/requests.js';
|
|
|
|
class NewGame extends Component {
|
|
|
|
getToken() {
|
|
return this.queryParams.get('playerToken');
|
|
}
|
|
|
|
getGameId() {
|
|
return this.queryParams.get('gameId');
|
|
}
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
ok: false
|
|
}
|
|
this.queryParams = new URLSearchParams(window.location.search);
|
|
}
|
|
|
|
update() {
|
|
const line = this.field.getLine();
|
|
request("check_field_correct", {field: line}, (response) => {
|
|
this.setState({ok: response.correct});
|
|
if (response.correct) {
|
|
this.ready.setState({
|
|
text: "Я готов",
|
|
disabled: false
|
|
})
|
|
} else {
|
|
this.ready.setState({
|
|
text: "Расставь корабли чтобы активировать",
|
|
disabled: true
|
|
})
|
|
}
|
|
this.ready.setState({ok: this.state.ok});
|
|
});
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<center><p className='logo'>Расставь корабли</p></center>
|
|
{/* <div className='row'>
|
|
<div className='col-1'>
|
|
<p>Player1</p>
|
|
<Field parent={this} changeable={true} />
|
|
</div>
|
|
<div className='col-5'></div>
|
|
<div className='col-1'>
|
|
<p>Player2</p>
|
|
<Field parent={this} changeable={false} />
|
|
</div>
|
|
</div> */}
|
|
<div className='row'>
|
|
<div className='col-1'>
|
|
<p>Player1</p>
|
|
<Field ready={false} parent={this} changeable={true} />
|
|
</div>
|
|
</div>
|
|
<center>
|
|
<p>Ссылка для подключения</p>
|
|
<input className='borders' value={host + "connect?token=" + this.getToken()} />
|
|
</center>
|
|
<Ready ok={this.state.ok} parent={this} />
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default NewGame; |