From 7eb942e7735a72a26dbc535917c55dbaaa442b40 Mon Sep 17 00:00:00 2001
From: Zutatensuppe <oo.para@gmail.com>
Date: Wed, 5 May 2021 22:22:34 +0200
Subject: [PATCH] only allow to start game when image and tiles are given

---
 public/views/Index.vue.js | 20 +++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/public/views/Index.vue.js b/public/views/Index.vue.js
index 581f9c1..6d4796c 100644
--- a/public/views/Index.vue.js
+++ b/public/views/Index.vue.js
@@ -47,7 +47,7 @@ export default {
     </tr>
     <tr>
       <td colspan="2">
-        <span class="btn" :class="" @click="onNewGameClick">Start new game</span>
+        <button class="btn" :disabled="!canStartNewGame" :class="" @click="onNewGameClick">Start new game</button>
       </td>
     </tr>
   </table>
@@ -80,6 +80,20 @@ export default {
     this.gamesFinished = json.gamesFinished
     this.images = json.images
   },
+  computed: {
+    scoreModeInt () {
+      return parseInt(this.scoreMode, 10)
+    },
+    tilesInt () {
+      return parseInt(this.tiles, 10)
+    },
+    canStartNewGame () {
+      if (!this.tilesInt || !this.image || ![0, 1].includes(this.scoreModeInt)) {
+        return false
+      }
+      return true
+    },
+  },
   methods: {
     time(start, end) {
       const icon = end ? '🏁' : '⏳'
@@ -99,9 +113,9 @@ export default {
           'Content-Type': 'application/json'
         },
         body: JSON.stringify({
-          tiles: this.tiles,
+          tiles: this.tilesInt,
           image: this.image,
-          scoreMode: parseInt(this.scoreMode, 10),
+          scoreMode: this.scoreModeInt,
         }),
       })
       if (res.status === 200) {