more word filtering, improved color @ wins

iuliuvisovan · Jan 24, 2017 · 11e471c · 11e471c
1 parent 85d42ad
commit 11e471c
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 36 deletions.
diff --git a/index.html b/index.html
@@ -16,7 +16,7 @@
 </head>
 
 <body>
-    <div class="page flex-centered" data-bind="visible: !IsStarted() && !Winner() && !SomeoneRageQuit()" style="padding: 15px">
+    <div class="page flex-centered" data-bind="visible: !IsStarted() && !WinnerId() && !SomeoneRageQuit()" style="padding: 15px">
         <h1 style="margin: 0">Hi</h1>
         <h3>Do you have a name?</h3>
         <input data-bind="textInput: CurrentPlayerName" placeholder="Yes sir. My name is..">
@@ -28,20 +28,20 @@ <h3 data-bind="visible: Players().length" style="text-align: center;">
             Great. <br/>You can wait invite more friends or <a href="#" style="color: #FF5722" data-bind="click: Go">start right now</a>.
         </h3>
     </div>
-    <div class="page flex-centered" data-bind="visible: !IsStarted() && !Winner() && SomeoneRageQuit()" style="padding: 15px; display: none">
+    <div class="page flex-centered" data-bind="visible: !IsStarted() && !WinnerId() && SomeoneRageQuit()" style="padding: 15px; display: none">
         <h1 style="text-align: center">Your opponent left, game can't continue :(</h1>
         <input data-bind="textInput: CurrentPlayerName" placeholder="My name's'">
         <h5 class="score-count">You have <span data-bind="text: CurrentPlayerWinCount">0</span> wins thus far.</h5>
         <br/>
-       <div data-bind='component: { name: "player-list", params: { Players: Players }}'></div>
+        <div data-bind='component: { name: "player-list", params: { Players: Players }}'></div>
         <h3 data-bind="visible: Players().length" style="text-align: center;">
             Ok. <br/><a href="#" style="color: #FF5722" data-bind="click: Go">Go?</a>
         </h3>
     </div>
-    <div class="page flex-centered" data-bind="visible: !IsStarted() && Winner() && !SomeoneRageQuit()" style="padding: 15px; display: none">
+    <div class="page flex-centered" data-bind="visible: !IsStarted() && WinnerId() && !SomeoneRageQuit()" style="padding: 15px; display: none">
         <h1>Game over!</h1>
         <h3 style="margin: 0">Winner:</h3>
-        <h1 style="margin: 0" data-bind="text: Winner"></h1>
+        <h1 style="margin: 0" data-bind="text: WinnerName, style: { color: WinnerId() == (socket && socket.id) ? '#00BCD4' : '#FF5722' }"></h1>
         <h3>Your name:</h3>
         <input data-bind="textInput: CurrentPlayerName" placeholder="My name's'">
         <h5 class="score-count">You have <span data-bind="text: CurrentPlayerWinCount">0</span> wins thus far.</h5>
@@ -51,7 +51,7 @@ <h3 data-bind="visible: Players().length" style="text-align: center;">
             Wanna <br/><a href="#" style="color: #FF5722" data-bind="click: Go">Go again?</a>
         </h3>
     </div>
-    <div style="display: none" class="flex-centered" data-bind="visible: IsStarted() && !Winner()">
+    <div style="display: none" class="flex-centered" data-bind="visible: IsStarted() && !WinnerId()">
         <div data-bind="visible: Loading">
             <h3>Ready?</h3>
             <h1 style="text-align: center" data-bind="text: CountDownSeconds">Ready?</h1>
@@ -73,14 +73,13 @@ <h3 class="player-progress-name" data-bind="text: name"></h3>
                 <!-- /ko -->
             </div>
             <div class="nope" data-bind="visible: CurrentCorrectAnswer().length">
-                Nope, Google says that was a<span data-bind="visible: CurrentCorrectAnswer().startsWith('a') || CurrentCorrectAnswer().startsWith('e') || CurrentCorrectAnswer().startsWith('i')  ||  CurrentCorrectAnswer().startsWith('o')">n</span>                "
-                <span style="text-shadow: 1px 1px rgba(0,0,0,0.4);" data-bind="text: CurrentCorrectAnswer"></span>".
+                Nope, Google says that was <span style="text-shadow: 1px 1px rgba(0,0,0,0.4);" data-bind="text: '\'' + CurrentCorrectAnswer() + '\''"></span>.
             </div>
             <div class="question-image-wrapper">
                 <img id="questionImage" class="question-image" data-bind="attr: { src: CurrentQuestion }" /><br/>
             </div>
             <div style="display: flex;justify-content: space-between; align-items: center; margin: 212px 5px 0 0px">
-                <h3 id="h3WhatIsThis" style="margin: 0; background: rgba(255, 255, 255, 0.6); color: #00bcd4;padding: 6px; margin-top: -418px">What is this?</h3>
+                <h3 id="h3WhatIsThis" style="margin: 0; background: transparent; color: #FF5722; padding: 6px; margin-top: -418px; text-shadow: 1px 1px 2px white;">What is this?</h3>
                 <input id="inputCurrentAnswer" autofocus placeholder="Your answer here..." onkeydown="event.keyCode == 13 && manager.SendAnswer()"
                     data-bind="textInput: CurrentAnswer" />
             </div>

diff --git a/public/css/styles.css b/public/css/styles.css
@@ -102,14 +102,14 @@ input {
 input {
     font-size: 14px;
     font-family: inherit;
-    border: 1px solid #BF360C;
+    border: 1px solid #00BCD4;
     background: rgba(255, 255, 255, 1);
 }
 
 .nope {
     position: absolute;
     width: 171px;
-    top: 240px;
+    top: 268px;
     color: #F44336;
     background: rgba(255, 255, 255, 0.7);
     padding: 5px;

diff --git a/public/js/whatisthis-client.js b/public/js/whatisthis-client.js
@@ -38,7 +38,8 @@ var RushManager = function () {
     self.SomeoneRageQuit = ko.observable(false);
     self.CountDownSeconds = ko.observable(3);
 
-    self.Winner = ko.observable('');
+    self.WinnerName = ko.observable('');
+    self.WinnerId = ko.observable('');
 
     self.SendAnswer = function (forced) {
         if (self.LoadingNextImage() && !forced)
@@ -62,7 +63,8 @@ var RushManager = function () {
         socket.emit('go');
         ga('send', 'event', 'Game', 'action', 'play');
 
-        self.Winner('');
+        self.WinnerName('');
+        self.WinnerId('');
         self.CurrentPlayerScore(0);
         self.CurrentAnswer('');
         self.SomeoneRageQuit(false);
@@ -176,9 +178,8 @@ var RushManager = function () {
             self.CurrentPlayerScore(self.CurrentPlayerScore() + 1);
             setTimeout(() => {
                 self.End();
-                if (JSON.parse(winner).socketId == socket.id)
-                    self.CurrentPlayerWinCount(self.CurrentPlayerWinCount() + 1);
-                self.Winner(JSON.parse(winner).name);
+                self.WinnerName(JSON.parse(winner).name);
+                self.WinnerId(JSON.parse(winner).id);
             }, 500);
         });
     }

diff --git a/rawwords.txt b/rawwords.txt
@@ -74,7 +74,6 @@ McDonalds
 Burger King
 Burger
 Sandwich
-Im hungry af I would eat a duck sorry if you find this word :D
 Adidas
 Nike
 Suit
@@ -83,7 +82,6 @@ Maradona
 Zidane
 Di Stefano
 Ronaldinho
-Ronaldo
 David Beckham
 Victoria Beckham
 Shakira
@@ -625,7 +623,6 @@ nurse
 sandwich
 surprise
 yard
-alarm
 bottle
 cable
 cloud
@@ -664,7 +661,6 @@ win
 attack
 pull
 soft
-solid
 round
 slide
 digging

diff --git a/words.json b/words.json
@@ -299,10 +299,6 @@
         "word": "Sandwich",
         "imageUrl": "http://cdn-image.realsimple.com/sites/default/files/styles/rs_photo_gallery_horz/public/image/images/1309/pork-cucumber_gal.jpg?itok=eb6bYsMl"
     },
-    {
-        "word": "Im hungry af I would eat a duck sorry if you find this word :D",
-        "imageUrl": "http://static.wixstatic.com/media/e8f57b_ee880da5c99445d8b8f386115833992f~mv2.jpg/v1/fill/w_601,h_400/e8f57b_ee880da5c99445d8b8f386115833992f~mv2.jpg"
-    },
     {
         "word": "Adidas",
         "imageUrl": "https://www.tillys.com/Tillys/content/images/adidas-blackbird-logo.gif"
@@ -335,10 +331,6 @@
         "word": "Ronaldinho",
         "imageUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/0/0c/Ronaldinho_olympics-soccer-6_cropped.jpg/170px-Ronaldinho_olympics-soccer-6_cropped.jpg"
     },
-    {
-        "word": "Ronaldo",
-        "imageUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/Cristiano_Ronaldo_20120609.jpg/170px-Cristiano_Ronaldo_20120609.jpg"
-    },
     {
         "word": "David Beckham",
         "imageUrl": "https://images-na.ssl-images-amazon.com/images/M/MV5BMjA3ODA0MDI4OF5BMl5BanBnXkFtZTgwMjEyNzI3MDE@._V1_UY317_CR131,0,214,317_AL_.jpg"
@@ -2503,10 +2495,6 @@
         "word": "yard",
         "imageUrl": "http://riversinsgroup.com/wp-content/uploads/front-lawn.jpg"
     },
-    {
-        "word": "alarm",
-        "imageUrl": "http://thecharmalarm.com/wp-content/uploads/2014/04/alarm.png"
-    },
     {
         "word": "bottle",
         "imageUrl": "http://packagingoptionsdirect.com/content/images/thumbs/0000068_12-oz-ring-neck-clear-glass-sauce-bottle.jpeg"
@@ -2659,10 +2647,6 @@
         "word": "soft",
         "imageUrl": "http://ghk.h-cdn.co/assets/cm/15/12/5508fc2eca95a-ghk-scott-extra-soft-toilet-paper-mdn.jpg"
     },
-    {
-        "word": "solid",
-        "imageUrl": "http://3.imimg.com/data3/WL/FE/MY-3545487/solid-bricks-500x500.jpg"
-    },
     {
         "word": "round",
         "imageUrl": "https://dilogrenme.com/assets/img/uploads/round.png"