Stop user from playing ai turn #541

src/classes/ai/aiHelpers.js

@@ -105,7 +105,7 @@ function groupStacks (groupValue, stacks) {
   let group = new Set()
   let i = groupValue
   let j = stacks.length
-  while (true) {  // eslint-disable-line  FIX this
+  while (true) {  // eslint-disable-line
     let cell = dp[i][j]
     // add used elements to the group
     if (cell.used) {

src/components/game/MessageBox.vue

@@ -1,5 +1,5 @@
 <template>
-<div id="message-b" :key="message">
+<div id="message-box" :key="message">
   {{ message }}
 </div>
 </template>
@@ -31,8 +31,6 @@ export default {
     ])
   },
   created () {
-    // Somehow message box is being destroyed and created so there are two
-    // listeners for this.
     bus.$on('ai-action', ({move}) => {
       const name = move.player.name
       if (move.playType === 'startNewStack') {
@@ -41,7 +39,6 @@ export default {
 
       } else if (move.playType === 'playCardOnStack') {
         const newStack = this.stacks.find(s => s.stackId === move.target.stackId)
-        // Issue with newStack being undefined, probably related to the above issue
         if (newStack && newStack.isComplete()) {
           this.message = name + " completed a stack worth " + newStack.getScore()
               + " points"  
@@ -76,7 +73,7 @@ export default {
 
 
 <style scoped>
-#message-b {
+#message-box {
   position: relative;
   left: 0px;
   width: 100%;

src/components/game/TurnArea.vue

@@ -1,5 +1,5 @@
 <template>
-<div id="turn-area" v-bind:key="update">
+<div id="turn-area">
   <button class="btn btn-sm btn-info col-6" v-on:click="redrawHand"
       style="border-radius: 40px; margin-top: 1%;"
       title="Discard your hand and draw 5 new cards">
@@ -22,7 +22,7 @@
     </info-popup>
   </div>
 
-  <div id="cards">
+  <div id="cards" :key="update">
     <ul>
       <li v-for="card in getCurrentPlayerHand.cards" v-bind:key="card.id">
         <turn-area-card :card="card"></turn-area-card>
@@ -75,12 +75,14 @@ export default {
       'executeTurn',
     ]),
     redrawHand () {
-      this.executeTurn({
-        playType: "REDRAW",
-        card: undefined,
-        player: this.activePlayer,
-        target: this.activePlayer
-      })
+      if (!this.activePlayer.isAi) {
+        this.executeTurn({
+          playType: "REDRAW",
+          card: undefined,
+          player: this.activePlayer,
+          target: this.activePlayer
+        })
+      }
     }
   },
   created () {

src/components/game/TurnAreaCard.vue

@@ -1,20 +1,26 @@
 <template>
-<div id="turn-area-card" v-on:mouseover="select"
-    draggable v-on:dragstart="startDrag($event)" :ondragstart="ondragstart">
+<div id="turn-area-card">
 
-  <img v-if="activePlayer.isAi" src="static/cardImages/backOfCard.png" class="card">
-  <img v-else :src="card.image" class="card">
+  <div id="player-card" v-if="!activePlayer.isAi" v-on:mouseover="select"
+      draggable v-on:dragstart="startDrag($event)" :ondragstart="ondragstart">
 
-  <div v-if="isShowing" id="overlays" class="play">
-    <input type="image" id="discard-button"
-       title="Discard Card"
-       src="static/miscIcons/trash.png"
-       v-on:click="discard">
+    <img :src="card.image" class="card">
 
-    <effect-card-popup></effect-card-popup>
+    <div v-if="isShowing" id="overlays" class="play">
+      <input type="image" id="discard-button"
+         title="Discard Card"
+         src="static/miscIcons/trash.png"
+         v-on:click="discard">
 
+      <effect-card-popup></effect-card-popup>
+
+    </div>
+  </div> 
+
+  <div v-else ondragstart="return false;">
+    <img src="static/cardImages/backOfCard.png" class="card">
   </div>
-</div> 
+</div>
 </template>
 
 

src/store/actions.js

@@ -78,7 +78,11 @@ export default {
     }
 
     context.commit('addPlayedCard', payload)
-    context.dispatch('endTurn', {draw: draw})
+    if (context.state.activePlayer.isAi) {
+      setTimeout(() => {context.dispatch('endTurn', {draw: draw})}, 800)
+    } else {
+      context.dispatch('endTurn', {draw: draw})
+    }
   },
 
   /**
@@ -109,7 +113,7 @@ export default {
     // Change active player and take AI turn if needed
     context.commit('nextPlayer')
     if (context.state.activePlayer.isAi) {
-      context.dispatch('takeAiTurn') 
+      setTimeout(() => {context.dispatch('takeAiTurn')}, 700)
     }
   },