From 628c2b932eb1ae926eefd8b4a884004346ca6f3d Mon Sep 17 00:00:00 2001 From: Administrator Date: Sun, 28 Aug 2022 16:07:40 +0300 Subject: [PATCH] new --- src/components/Field.js | 59 +++++++++++++++++++++++++++++++---------- src/screens/Game.js | 1 - src/screens/NewGame.js | 1 - 3 files changed, 45 insertions(+), 16 deletions(-) diff --git a/src/components/Field.js b/src/components/Field.js index d468850..3ecd856 100644 --- a/src/components/Field.js +++ b/src/components/Field.js @@ -9,7 +9,8 @@ class Cell extends Component { this.state = { h: props.h, v: props.v, - shotState: props.shotState + shotState: props.shotState, + changeable: props.changeable } if (this.state.shotState === "x") { this.state.color = "red"; @@ -18,7 +19,13 @@ class Cell extends Component { } else { this.state.color = "white"; } - this.symb = " "; + } + + componentWillReceiveProps(props) { + this.setState({ + shotState: props.shotState, + changeable: props.changeable + }) } changeColor() { @@ -35,21 +42,30 @@ class Cell extends Component { } shoot() { - + this.props.parent.setState({ + changeable: false + }) request("shoot", { game_id: localStorage.getItem("gameId"), token: localStorage.getItem("token"), h: this.props.h, v: this.props.v }, (response) => { - this.setState({ - color: response.shoot ? "red" : "grey" - }) + if (response.shot) { + this.setState({ + shotState: "x", + }) + } else { + this.setState({ + shotState: "." + }) + } }) } click() { - if (!this.props.changeable) return; + if (!this.state.changeable) return; + if (this.state.shotState !== " ") return; if (this.props.parent.props.ready) this.shoot(); else @@ -57,11 +73,16 @@ class Cell extends Component { } render() { - if (!this.props.parent.cells.includes(this)) - this.props.parent.cells.push(this); - this.props.parent.cells.sort((a, b) => a.key < b.key); + let color = "white"; + if (this.state.shotState === "x") { + color = "red"; + } else if (this.state.shotState === "o") { + color = "darkcyan"; + } else if (this.state.shotState === ".") { + color = "gray"; + } return ( - + ) } } @@ -86,18 +107,28 @@ class Field extends Component { } this.state = { - cells: this.props.cells + cells: this.props.cells, + changeable: props.changeable } } + componentWillReceiveProps(props) { + this.setState({ + changeable: props.changeable + }) + } + render() { - this.cells = []; let cells = []; for (let i = 0; i < 10; i++) { let line = [] for (let j = 0; j < 10; j++) { - const cell = ; + let shotState = null; + if (this.props.cells !== undefined && this.props.cells !== null) { + shotState = this.props.cells[i][j] + } + const cell = ; line.push({cell}); } cells.push({line}); diff --git a/src/screens/Game.js b/src/screens/Game.js index eea3293..8d9aa5f 100644 --- a/src/screens/Game.js +++ b/src/screens/Game.js @@ -16,7 +16,6 @@ class Game extends Component { doUpdate = () => { const process = (response) => { - console.log(response); this.setState({ myField: response.my_field, opponentField: response.opponent_field, diff --git a/src/screens/NewGame.js b/src/screens/NewGame.js index 4c6c1d6..fbef7d1 100644 --- a/src/screens/NewGame.js +++ b/src/screens/NewGame.js @@ -62,7 +62,6 @@ class NewGame extends Component { game_id: game_id, token: localStorage.getItem("token") }, function(response) { - console.log(response); obj.setState({ readyText: response.attend ? "Соперник ставит корабли" : "Ждем ответа соперника", readyDisabled: true