Merge pull request #22 from CoryWritesCode/corywritescode/issue19/tog…

…gle-not-working-on-mobile Update rest of the events to make sure they work on mobile
LabinatorSolutions · Oct 28, 2019 · 05ebbc2 · 05ebbc2
2 parents c9c5825 + ddc2f21
commit 05ebbc2
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 19 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "eslint.enable": false
+}
diff --git a/css/board.css b/css/board.css
@@ -47,7 +47,7 @@
 #btn-take-back {
   background-image: url('../img/icons/takeback-enabled.svg');
 }
-#btn-take-back.disabled{
+#btn-take-back.disabled {
   background-image: url('../img/icons/takeback-disabled.svg');
 }
 
@@ -70,11 +70,15 @@
 }
 
 #btn-settings {
-  background-image: url('../img/icons/settings.svg');  
+  background-image: url('../img/icons/settings.svg');
 }
 
 /* main styles */
 
+.buttons > button {
+  background-color: #ffffff;
+}
+
 .chess-area {
   display: flex;
   display: -webkit-flex;
@@ -132,7 +136,7 @@
   text-decoration: underline;
 }
 .chess-area .board-table .promotion span.active {
-  background: #DCDCDC;
+  background: #dcdcdc;
 }
 .chess-area .board-table .promotion.hidden {
   display: none;
@@ -430,7 +434,7 @@
   padding: 5px;
   font: normal 13px Arial;
 }
-.chess-area .board-settings .turns-history ol li:nth-child(2n+2) {
+.chess-area .board-settings .turns-history ol li:nth-child(2n + 2) {
   background: #f3f3f3;
 }
 
@@ -545,7 +549,7 @@
   background-color: #f5f5f5;
 }
 
-.chess-area .board-settings .btn-new-game { 
+.chess-area .board-settings .btn-new-game {
   display: flex;
   display: -webkit-flex;
   align-items: center;
@@ -555,7 +559,7 @@
   margin: 0 3px 0 2px;
   border: none;
   border-radius: 3px;
-  background: #D41C3B;
+  background: #d41c3b;
   font-size: 14px;
   line-height: 100%;
   text-transform: none;
@@ -683,7 +687,6 @@
   opacity: 0.7;
 }
 .chess-area .board-settings .castling .opts input {
-
 }
 .chess-area .board-settings .buttons {
   width: 100%;
@@ -723,8 +726,7 @@
   padding: 10px 0 0 0;
 }
 
-@media (max-width: 810px)  {
-
+@media (max-width: 810px) {
   .chess-area {
     align-items: center;
     -webkit-align-items: center;
@@ -768,7 +770,6 @@
     font-weight: bold;
     color: #696868;
   }
-
 }
 
 @media (max-width: 768px) {
@@ -792,4 +793,4 @@
   max-width: 780px;
   margin: 30px auto 40px auto;
   font: normal 12px/18px Arial;
-}
+}
diff --git a/js/board-controls-bottom.js b/js/board-controls-bottom.js
@@ -2,7 +2,7 @@
 
 // Rotate board
 
-$('#btn-flip-board').click(function() {
+$('#btn-flip-board').on('click touchstart', function () {
   if (typeof board.flip == 'function') {
     board.flip();
   } else {
@@ -12,7 +12,7 @@ $('#btn-flip-board').click(function() {
 
 // Switch sides
 
-$('#btn-switch-sides').click(function() {
+$('#btn-switch-sides').on('click touchstart', function () {
   if (typeof board.flip == 'function') {
     board.flip();
   } else {
@@ -25,7 +25,7 @@ $('#btn-switch-sides').click(function() {
   }
 
   else if (playerSide == 'b') {
-    playerSide ='w';
+    playerSide = 'w';
     opponentSide = 'b';
   }
 
@@ -35,7 +35,7 @@ $('#btn-switch-sides').click(function() {
 
 // Save PGN string popup
 
-$('#btn-save-pgn').click(function() {
+$('#btn-save-pgn').on('click touchstart', function () {
   if ($('#board-save-pgn-area').hasClass('hidden')) {
     $('#board-load-fen-area, #board-load-pgn-area').addClass('hidden');
     $('#board-save-pgn-area').removeClass('hidden');
@@ -47,7 +47,7 @@ $('#btn-save-pgn').click(function() {
 
 // Disable engine
 
-$('#btn-engine-disable').click(function() {
+$('#btn-engine-disable').on('click touchstart', function () {
   if ($('#btn-engine-disable').hasClass('active')) {
     $('#btn-engine-disable').removeClass('active');
     $('#btn-engine-disable').text("AI");
@@ -64,7 +64,7 @@ $('#btn-engine-disable').click(function() {
 
 // Show hint where to make move
 
-$('#btn-show-hint').click(function() {
+$('#btn-show-hint').on('click touchstart', function () {
   if ($(this).hasClass('disabled')) {
     console.log('Cannot show hint in opponent turn.');
     return;
@@ -78,7 +78,7 @@ $('#btn-show-hint').click(function() {
 
 // Make one step back
 
-$('#btn-take-back').click(function() {
+$('#btn-take-back').on('click touchstart', function () {
   game.undo();
   board.position(game.fen());
   game.undo();
@@ -90,7 +90,7 @@ $('#btn-take-back').click(function() {
 
 // Promotion popup ui
 
-$('#game-promotion span').click(function() {
+$('#game-promotion span').on('click touchstart', function () {
 
   $('#game-promotion span').removeClass('active');
   $(this).addClass('active');