varlamov

diff --git a/src/App.scss b/src/App.scss
index 7d62206de1635b809770dddac54e34f4d0f013cd..9d1ec05a5a3cbc1ce1756bb5853542c58203a8ac 100644 (file)
--- a/src/App.scss
+++ b/src/App.scss
@@ -56,7 +56,7 @@
   .Game-frame {
     margin: 40px 100px;
     border: solid 6px;
-    min-height: 600px;
+    min-height: 60vh;
     display: flex;
   }
 
@@ -96,7 +96,23 @@
   }
 
   #map {
-    min-height: 80vh;
+    min-height: 60vh;
+  }
+
+  .varlamov-on {
+    background-image: url(./img/varlamov.png);
+    :local {
+      animation: V-spin infinite 10s linear;
+    }
+  }
+
+  @keyframes V-spin {
+    from {
+      background-size: 30px 30px;
+    }
+    to {
+      background-size: 500px 500px;
+    }
   }
 
   @keyframes App-logo-spin {

diff --git a/src/Game.js b/src/Game.js
index 516e3e3cfe878a4e6e191253721017508dba44d8..9d5302aa7e303eceda4b9cb4965d00e7c4958bdf 100644 (file)
--- a/src/Game.js
+++ b/src/Game.js
@@ -14,10 +14,6 @@ export class Game extends Component {
   constructor(props) {
     super(props);
     this.notification = new Notification();
-    this.handleVarlamov = function(tips) {
-      console.log(tips);
-      return tips;
-    }
     this.gameController = new GameController(this.notification);
     this.state = {
       tips: this.gameController.tips(),
@@ -29,7 +25,7 @@ export class Game extends Component {
   componentDidMount() {
     this.gameController.createGame(this.props.city).then(() => this.gameController.loadTips()).then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         loading: false,
         inProcess: false
@@ -50,7 +46,7 @@ export class Game extends Component {
     });
     this.gameController.getMoreTips().then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         inProcess: false
       })
@@ -71,7 +67,7 @@ export class Game extends Component {
     });
     this.gameController.goNorth().then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         inProcess: false
       })
@@ -92,7 +88,7 @@ export class Game extends Component {
     });
     this.gameController.goWest().then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         inProcess: false
       })
@@ -113,7 +109,7 @@ export class Game extends Component {
     });
     this.gameController.goSouth().then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         inProcess: false
       })
@@ -134,7 +130,7 @@ export class Game extends Component {
       });
       this.gameController.goEast().then(() => {
       this.setState({
-        tips: this.handleVarlamov(this.gameController.tips()),
+        tips: this.gameController.tips(),
         hasMoreTips: this.gameController.hasMoreTips(),
         inProcess: false
       })
@@ -151,7 +147,7 @@ export class Game extends Component {
 
   startNewGame = () => {
     window.location = '/';
-  }
+  };
 
   onMapClick = (e, map) => {
 
@@ -208,7 +204,7 @@ export class Game extends Component {
               <h2 className="Game-tips-header">What you see:</h2>
               {this.state.tips.length > 0 && (
                 <ul className="Game-tips-list">
-                  {this.state.tips.map(tip => <li key={tip}>{tip}</li>)}
+                  {this.state.tips.map((tip, i) => <li key={tip + i}>{tip}</li>)}
                 </ul>
               )}
 

diff --git a/src/GameController.js b/src/GameController.js
index 6452382db063ddede26af46b65784b7a3ac29571..35cb7e0f60cb7e0ac129759697b09b7389ae31c7 100644 (file)
--- a/src/GameController.js
+++ b/src/GameController.js
@@ -3,6 +3,7 @@ import deepEq from 'fast-deep-equal';
 
 export class GameController {
   constructor(notification) {
+    this.varlamov = true;
     this.notification = notification;
   }
 
@@ -55,6 +56,22 @@ export class GameController {
     if(!this._tips) {
       return [];
     }
+    if(this.varlamov) {
+      const match = this._tips[this._tips.length - 1].match(/высотой в (.) этажей/);
+      if(match && match[1]) {
+        const num = parseInt(match[1], 10);
+        if(num > 5) {
+          const el = document.querySelector('.Game-frame');
+          if(el) {
+            el.classList.add('varlamov-on');
+            setTimeout(() => {
+              el.classList.remove('varlamov-on');
+            }, 10000);
+            this.varlamov = false;
+          }
+        }
+      }
+    }
     return this._tips;
   }