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 =