Feat : add most token effects

components/CardsGrouped.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import { delay } from "~/netcode/events";
-import type {
-  Card,
-  Container,
-  Effect,
-  PlayingTurn,
+import {
+  CardEffects,
+  CardType,
+  type Card,
+  type Container,
+  type Effect,
+  type PlayingTurn,
 } from "~/netcode/interfaces";
 import TokenComponent from "./tokens/TokenComponent.vue";
 
@@ -15,6 +17,7 @@ export interface Props {
   hidden?: boolean;
   noEffects?: boolean;
   tokens?: Effect[];
+  championsKillable?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -22,6 +25,7 @@ const props = withDefaults(defineProps<Props>(), {
   hidden: () => false,
   noEffects: () => false,
   tokens: () => [],
+  championsKillable: () => false,
 });
 
 const emit = defineEmits(["cardClick", "effectClick", "tokenClick"]);
@@ -110,6 +114,8 @@ const interval = ref<ReturnType<typeof setInterval>>();
 function tokenClick(token: Effect, card: Card) {
   emit("tokenClick", { token, card });
 }
+
+function damageChampion() {}
 </script>
 
 <template>
@@ -121,15 +127,15 @@ function tokenClick(token: Effect, card: Card) {
       <CardPreview
         @click="$emit('cardClick', c._id)"
         @effectClick="$emit('effectClick', c._id, $event)"
-        v-for="c in cards"
-        :card_id="c.cardId"
+        v-for="(c, i) in cards"
+        :card_id="c?.cardId"
         :wrapped="wrapped"
-        :key="c._id"
+        :key="c?._id || i"
         :card="c"
         :locked="
           !playingTurn || playingTurn?.cardsLocked.includes(c._id.toString())
         "
-        :used_effects_indexes="c.effects?.reduce( (prev,e, i)=>{
+        :used_effects_indexes="c?.effects?.reduce( (prev,e, i)=>{
           if(playingTurn?.lockedEffects.includes(e._id)){
             prev.push(i)
           }
@@ -141,8 +147,29 @@ function tokenClick(token: Effect, card: Card) {
           <TokenComponent
             :token="t"
             @useToken="tokenClick(t, c)"
+            v-if="
+              !(
+                t.effect == CardEffects.SACRIFICE &&
+                (!playingTurn ||
+                  playingTurn?.cardsLocked.includes(c._id.toString()))
+              ) &&
+              !(
+                t.effect == CardEffects.PREPARE &&
+                c.cardType == CardType.CHAMPION
+              ) &&
+              !(
+                t.effect == CardEffects.STACK_NEXT_ACTION_BOUGHT &&
+                c.cardType != CardType.ACTION
+              ) &&
+              t.effect == CardEffects.STUN &&
+              c.cardType == CardType.CHAMPION &&
+              championsKillable
+            "
           ></TokenComponent>
         </template>
+        <button v-if="championsKillable && c.cardType == CardType.CHAMPION">
+          Damage
+        </button>
       </CardPreview>
     </TransitionGroup>
     <!-- <img :class="`card_image`" :src="'/cards/background.png'" draggable="false"> -->