incorrect
This commit is contained in:
Administrator
parent
a64c39d8ab
commit
e2e65bc617
@ -7,6 +7,8 @@ services:
|
||||
image: mathwave/sprint-repo:battleship-front
|
||||
networks:
|
||||
- battleship-net
|
||||
environment:
|
||||
HOST_URL: "http://battleship.develop.sprinthub.ru/"
|
||||
deploy:
|
||||
mode: replicated
|
||||
restart_policy:
|
||||
|
||||
@ -7,6 +7,8 @@ services:
|
||||
image: mathwave/sprint-repo:battleship-front
|
||||
networks:
|
||||
- battleship-net
|
||||
environment:
|
||||
HOST_URL: "http://battleship.develop.sprinthub.ru/"
|
||||
deploy:
|
||||
mode: replicated
|
||||
restart_policy:
|
||||
|
||||
@ -12,15 +12,30 @@ class Cell extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
click() {
|
||||
if (!this.props.changeable) return;
|
||||
changeColor() {
|
||||
if (this.state.color === "white")
|
||||
this.setState({color: "green"});
|
||||
else
|
||||
this.setState({color: "white"});
|
||||
this.props.parent.props.parent.update();
|
||||
}
|
||||
|
||||
shoot() {
|
||||
|
||||
}
|
||||
|
||||
click() {
|
||||
if (!this.props.changeable) return;
|
||||
if (this.props.parent.props.ready)
|
||||
this.shoot();
|
||||
else
|
||||
this.changeColor();
|
||||
}
|
||||
|
||||
render() {
|
||||
this.props.parent.cells.push(this);
|
||||
this.props.parent.cells.sort((a, b) => a.key < b.key);
|
||||
console.log(this.props.parent.cells.length);
|
||||
return (
|
||||
<button style={{backgroundColor: this.state.color}} onClick={() => this.click()} className="cell"></button>
|
||||
)
|
||||
@ -29,16 +44,32 @@ class Cell extends Component {
|
||||
|
||||
class Field extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
props.parent.field = this;
|
||||
|
||||
this.getLine = () => {
|
||||
let line = "";
|
||||
for (let i = 0; i < 100; i++) {
|
||||
line += this.cells.at(i).state.color === "white" ? " " : "o";
|
||||
}
|
||||
return line;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
render() {
|
||||
let cells = []
|
||||
this.cells = [];
|
||||
let cells = [];
|
||||
for (let i = 0; i < 10; i++) {
|
||||
let line = []
|
||||
for (let j = 0; j < 10; j++) {
|
||||
line.push(<td key={(i * 10 + j) * 100}><Cell changeable={this.props.changeable} key={(i * 10 + j)} h={i} v={j} /></td>);
|
||||
const cell = <Cell parent={this} changeable={this.props.changeable} key={(i * 10 + j)} h={i} v={j} />;
|
||||
line.push(<td key={(i * 10 + j) * 100}>{cell}</td>);
|
||||
}
|
||||
cells.push(<tr key={(i * 100000)}>{line}</tr>);
|
||||
}
|
||||
|
||||
return (
|
||||
<table>
|
||||
<tbody>
|
||||
|
||||
@ -4,14 +4,29 @@ export default class Ready extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.update();
|
||||
this.state = {
|
||||
text: "Расставь корабли чтобы активировать",
|
||||
disabled: true
|
||||
}
|
||||
}
|
||||
|
||||
update() {
|
||||
if (!this.props.ok)
|
||||
this.setState({
|
||||
text: "Расставь корабли чтобы активировать",
|
||||
disabled: true
|
||||
})
|
||||
else
|
||||
this.setState({
|
||||
text: "Я готов",
|
||||
disabled: false
|
||||
})
|
||||
this.props.parent.ready = this;
|
||||
}
|
||||
|
||||
render() {
|
||||
return <button className='main' disabled={this.state.disabled} onClick={this.goNewGame}><p>{this.state.text}</p></button>
|
||||
return <button className='main' disabled={this.state.disabled}><p>{this.state.text}</p></button>
|
||||
}
|
||||
|
||||
}
|
||||
@ -6,9 +6,7 @@ import reportWebVitals from './reportWebVitals';
|
||||
|
||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
);
|
||||
|
||||
// If you want to start measuring performance in your app, pass a function
|
||||
|
||||
@ -3,7 +3,7 @@ import '../styles/styles.css';
|
||||
import '../styles/bootstrap.css';
|
||||
import Field from '../components/Field.js';
|
||||
import Ready from '../components/Ready.js';
|
||||
import {host} from '../scripts/requests.js';
|
||||
import request, {host} from '../scripts/requests.js';
|
||||
|
||||
class NewGame extends Component {
|
||||
|
||||
@ -12,12 +12,28 @@ class NewGame extends Component {
|
||||
return queryParams.get('playerToken');
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
ok: false
|
||||
}
|
||||
}
|
||||
|
||||
update() {
|
||||
const line = this.field.getLine();
|
||||
request("check_field_correct", {field: line}, (response) => {
|
||||
this.setState({ok: response.correct});
|
||||
this.ready.setState({ok: this.state.ok});
|
||||
this.ready.update();
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<center><p className='logo'>Расставь корабли</p></center>
|
||||
<div className='row'>
|
||||
{/* <div className='row'>
|
||||
<div className='col-1'>
|
||||
<p>Player1</p>
|
||||
<Field parent={this} changeable={true} />
|
||||
@ -27,12 +43,18 @@ class NewGame extends Component {
|
||||
<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 />
|
||||
<Ready ok={this.state.ok} parent={this} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,8 +1,15 @@
|
||||
export const host = "http://battleship.develop.sprinthub.ru/";
|
||||
var h = null;
|
||||
if (process.env.HOST_URL !== undefined) {
|
||||
h = process.env.HOST_URL;
|
||||
} else {
|
||||
h = "http://127.0.0.1:8000/";
|
||||
}
|
||||
|
||||
export const host = h;
|
||||
|
||||
|
||||
function request(method, body, callback) {
|
||||
const options = {
|
||||
const options = {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(body),
|
||||
headers: {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user