From 25cc3910f5da482305327d9c52035aa046e041d5 Mon Sep 17 00:00:00 2001
From: Lang <langlasz@gmail.com>
Date: Fri, 18 Nov 2016 20:42:29 +0100
Subject: [PATCH] some refactor #13

---
 .../Resources/public/css/style.mineseeker.css |  4 ++++
 .../Resources/public/js/mine-seeker/app.js    | 17 ++++---------
 .../js/mine-seeker/grid/grid-control.js       | 24 ++++++-------------
 3 files changed, 15 insertions(+), 30 deletions(-)

diff --git a/src/Mine/SeekerBundle/Resources/public/css/style.mineseeker.css b/src/Mine/SeekerBundle/Resources/public/css/style.mineseeker.css
index b0da53f..5d9737e 100644
--- a/src/Mine/SeekerBundle/Resources/public/css/style.mineseeker.css
+++ b/src/Mine/SeekerBundle/Resources/public/css/style.mineseeker.css
@@ -689,6 +689,10 @@ main {
     display: block;
 }
 
+/*#mine-wrapper .grid .field-wrapper.targeted > img.field-target {*/
+    /*display: block;*/
+/*}*/
+
 /** width = 4 x .field */
 #mine-wrapper .grid .field-wrapper > img.field-bomb-target {
     position: absolute;
diff --git a/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js b/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js
index 8dc7bda..bcb148e 100644
--- a/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js
+++ b/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js
@@ -71,13 +71,12 @@ class MineSeeker extends React.Component {
                     (gridServer) => {
                         console.info("Grid has been created! Return w/ gameAssoc.");
 
-                        this.state.session = session;
+                        this.setState({session: session});
 
                         /** save session to GridControl */
                         /** render grid fields - #12 */
                         this.refs.gridControl.setState({
                             grid: this.state.gameInherited ? JSON.parse(Base64.decode(gridServer)) : gridClient,
-                            session: this.state.session,
                             channel: this.state.channel,
                             overlay: true,
                             overlayTitle: "We are waiting for your opponent...",
@@ -88,13 +87,7 @@ class MineSeeker extends React.Component {
                         });
 
                         /** setup the web player */
-                        if (this.refs.gridControl.state.webPlayer === null) {
-                            if (this.state.gameInherited) {
-                                this.refs.gridControl.state.webPlayer = 'blue';
-                            } else {
-                                this.refs.gridControl.state.webPlayer = 'red';
-                            }
-                        }
+                        this.refs.gridControl.state.webPlayer === null && this.refs.gridControl.setState({webPlayer: this.state.gameInherited ? 'blue' : 'red'});
 
                         /** Connect - Subscribe */
                         this.state.session.subscribe(
@@ -111,7 +104,7 @@ class MineSeeker extends React.Component {
                                     if (this.refs.gridControl.state.webPlayer !== payload.data.player) {
                                         console.warn('Opponent stepped: Auto-Step process');
 
-                                        this.refs.gridControl.refs.userControl.state.bombSelected = payload.data.bomb;
+                                        this.refs.gridControl.refs.userControl.setState({bombSelected: payload.data.bomb});
                                         this.refs.gridControl.stepEvent(payload.data.coords);
 
                                         /** End-game control */
@@ -128,10 +121,8 @@ class MineSeeker extends React.Component {
                                             (typeof payload.user !== 'undefined' ? payload.user : 'user') + " has been subscribed to the channel!"
                                         );
 
-                                        var activePlayer = this.refs.gridControl.refs.userControl.state.activePlayer ? 'blue' : 'red';
-
                                         /** remove overlay when every user has been came */
-                                        this.refs.gridControl.setState({ overlay: payload.userCnt < 2});
+                                        this.refs.gridControl.setState({overlay: payload.userCnt < 2});
 
                                         /** Set up player names w/ server data */
                                         this.refs.gridControl.refs.userControl.refs.red.setState({
diff --git a/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js b/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js
index de478c3..f070877 100644
--- a/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js
+++ b/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js
@@ -52,21 +52,10 @@ class GridControl extends React.Component {
 
         /** if the (5x5) target not fits the grid */
         if (!isBombTargetCenter) {
-            if (col < 2) {
-                col = 2;
-            }
-
-            if (row < 2) {
-                row = 2;
-            }
-
-            if (row > this.state.grid.length - 3) {
-                row = this.state.grid.length - 3;
-            }
-
-            if (col > this.state.grid[0].length - 3) {
-                col = this.state.grid[0].length - 3;
-            }
+            col = col < 2 ? 2 : col;
+            row = row < 2 ? 2 : row;
+            row = row > this.state.grid.length - 3 ? this.state.grid.length - 3 : row;
+            col = col > this.state.grid[0].length - 3 ? this.state.grid[0].length - 3 : col;
         }
 
         return [
@@ -362,9 +351,10 @@ class GridControl extends React.Component {
 
     /**
      * On Hover when you want to drop BOMB
+     * Target grid field
      * @param coords
      */
-    onHoverWithBomb(coords) {
+    onHoverGridField(coords) {
         if (this.refs.userControl.state.bombSelected) {
             var activePlayer = this.refs.userControl.state.activePlayer ? 'blue' : 'red';
 
@@ -393,7 +383,7 @@ class GridControl extends React.Component {
                                    col={k}
                                    ref={this.refString(i, k)}
                                    key={i + k * Math.random() * 0.5}
-                                   handleHoverOn={this.onHoverWithBomb.bind(this, [i, k])}
+                                   handleHoverOn={this.onHoverGridField.bind(this, [i, k])}
                                    onClick={this.props.onClick.bind(null, [i, k])}/>
                     );
                 }