diff --git a/assets/js/components/chess-board.js b/assets/js/components/chess-board.js
index e8af715..a755029 100644
--- a/assets/js/components/chess-board.js
+++ b/assets/js/components/chess-board.js
@@ -6,6 +6,7 @@ import classNames from "classnames";
import ChessBoardSquare from "./chess-board-square";
import RankLabels from "./rank-labels";
import FileLabels from "./file-labels";
+import GameState from "./game-state";
class ChessBoard extends React.Component {
componentWillMount() {
@@ -74,12 +75,6 @@ class ChessBoard extends React.Component {
});
}
- get gameState() {
- const { store } = this.props;
- console.log(store.getState().state);
- return store.getState().state;
- }
-
get boardClass() {
const turn = this.getTurn();
const player = this.getPlayer();
@@ -88,6 +83,8 @@ class ChessBoard extends React.Component {
}
render() {
+ const { store } = this.props;
+
return (
@@ -97,9 +94,7 @@ class ChessBoard extends React.Component {
{this.renderSquares()}
-
- {this.gameState}
-
+
);
}
diff --git a/assets/js/components/file-labels.js b/assets/js/components/file-labels.js
index 81cc3da..e69ff5a 100644
--- a/assets/js/components/file-labels.js
+++ b/assets/js/components/file-labels.js
@@ -1,12 +1,7 @@
import React from "react";
import _ from "lodash";
-import classNames from "classnames";
class FileLabels extends React.Component {
- constructor(props) {
- super(props);
- }
-
get fileLabels() {
return ["a", "b", "c", "d", "e", "f", "g", "h"];
}
diff --git a/assets/js/components/game-state.js b/assets/js/components/game-state.js
new file mode 100644
index 0000000..9fd09eb
--- /dev/null
+++ b/assets/js/components/game-state.js
@@ -0,0 +1,37 @@
+import React from "react";
+import classNames from "classnames";
+
+class GameState extends React.Component {
+ get gameStates() {
+ return {
+ "checkmate": "Checkmate!",
+ "stalemate": "Stalemate",
+ "check": "Check",
+ };
+ }
+
+ get gameState() {
+ const { store } = this.props;
+ return store.getState().state;
+ }
+
+ get friendlyGameState() {
+ return this.gameStates[this.gameState];
+ }
+
+ get gameStateClass() {
+ const state = this.gameState;
+
+ return classNames("board-game-state", state);
+ }
+
+ render() {
+ return (
+
+ {this.friendlyGameState}
+
+ );
+ }
+}
+
+export default GameState;
diff --git a/assets/js/components/rank-labels.js b/assets/js/components/rank-labels.js
index 00781f7..16633ed 100644
--- a/assets/js/components/rank-labels.js
+++ b/assets/js/components/rank-labels.js
@@ -1,12 +1,7 @@
import React from "react";
import _ from "lodash";
-import classNames from "classnames";
class RankLabels extends React.Component {
- constructor(props) {
- super(props);
- }
-
get rankLabels() {
return [1, 2, 3, 4, 5, 6, 7, 8];
}