Chore : various fixes

components/CardPreview.vue

@@ -10,6 +10,7 @@ export interface Props {
   interactible?: boolean;
   noEffects?: boolean;
   used_effects_indexes?: number[];
+  discardable?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -18,6 +19,7 @@ const props = withDefaults(defineProps<Props>(), {
   locked: () => true,
   interactible: () => true,
   noEffects: () => false,
+  discardable: () => false,
 });
 
 const emit = defineEmits([
@@ -225,6 +227,7 @@ onUnmounted(() => {
       unlocked: !props.locked,
       zoom: isZooming,
       no_effects: noEffects || !props.locked,
+      discardable,
     }"
     @contextmenu.prevent="false"
     @mousedown.right="rightClickDown"
@@ -281,43 +284,6 @@ onUnmounted(() => {
 </template>
 
 <style scoped>
-.card {
-  --max-height: 250px;
-  --max-width: 179px;
-  --margin-bottom: calc(var(--max-height) * 0.05);
-  position: relative;
-  display: flex;
-  justify-content: center;
-  margin-bottom: 0px;
-  margin-top: var(--margin-bottom);
-  transition: all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-  pointer-events: all;
-  max-height: var(--max-height);
-  max-width: var(--max-width);
-  /* cursor: grab; */
-}
-
-#overlay {
-  position: absolute;
-  top: 20%;
-  width: calc(100% - 8%);
-  height: 49%;
-}
-
-.card.unlocked {
-  margin-top: 0px;
-  margin-bottom: var(--margin-bottom);
-  transform: translateY(calc(var(--margin-bottom) * -0.25));
-  filter: drop-shadow(
-    calc(var(--margin-bottom) * 0.3) var(--margin-bottom) 1px rgba(0, 0, 0, 0.6)
-  );
-  cursor: pointer;
-}
-
-.card:not(svg) {
-  cursor: grab;
-}
-
 .card.dragging {
   transform: translateX(v-bind("translateX + 'px'"))
     translateY(v-bind("translateY + 'px'"));
@@ -421,4 +387,49 @@ onUnmounted(() => {
 .svg_effect text {
   cursor: pointer;
 }
+
+.card {
+  --max-height: 250px;
+  --max-width: 179px;
+  --margin-bottom: calc(var(--max-height) * 0.05);
+  position: relative;
+  display: flex;
+  justify-content: center;
+  margin-bottom: 0px;
+  margin-top: var(--margin-bottom);
+  transition: all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  pointer-events: all;
+  max-height: var(--max-height);
+  max-width: var(--max-width);
+  /* cursor: grab; */
+}
+
+.card:not(svg) {
+  cursor: grab;
+}
+
+#overlay {
+  position: absolute;
+  top: 20%;
+  width: calc(100% - 8%);
+  height: 49%;
+}
+
+.card.unlocked {
+  margin-top: 0px;
+  margin-bottom: var(--margin-bottom);
+  transform: translateY(calc(var(--margin-bottom) * -0.25));
+  filter: drop-shadow(
+    calc(var(--margin-bottom) * 0.3) var(--margin-bottom) 1px rgba(0, 0, 0, 0.6)
+  );
+  cursor: pointer;
+}
+
+.card.discardable {
+  cursor: not-allowed;
+}
+
+.card.discardable svg {
+  pointer-events: none;
+}
 </style>

components/CardsGrouped.vue

@@ -18,6 +18,7 @@ export interface Props {
   noEffects?: boolean;
   tokens?: Effect[];
   championsKillable?: boolean;
+  discardable?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -26,6 +27,7 @@ const props = withDefaults(defineProps<Props>(), {
   noEffects: () => false,
   tokens: () => [],
   championsKillable: () => false,
+  discardable: () => false,
 });
 
 const emit = defineEmits([
@@ -33,6 +35,7 @@ const emit = defineEmits([
   "effectClick",
   "tokenClick",
   "damageChampionClick",
+  "discardCardClick",
 ]);
 
 const settingsStore = useSettingsStore();
@@ -123,6 +126,10 @@ function tokenClick(token: Effect, card: Card) {
 function damageChampionClick(card: Card) {
   emit("damageChampionClick", card);
 }
+
+function discardCardClick(card: Card) {
+  emit("discardCardClick", card);
+}
 </script>
 
 <template>
@@ -149,28 +156,24 @@ function damageChampionClick(card: Card) {
           return prev
         },[] as number[])"
         :noEffects="noEffects"
+        :discardable="discardable"
       >
         <template v-for="t in tokens">
           <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
+              (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) ||
+              t.effect == CardEffects.PLAY_NEXT_CARD_BOUGHT
             "
           ></TokenComponent>
         </template>
@@ -181,6 +184,15 @@ function damageChampionClick(card: Card) {
         >
           Damage
         </button>
+        <button
+          v-if="
+            discardable && !playingTurn?.cardsLocked.includes(c._id.toString())
+          "
+          @mousedown.left.stop=""
+          @click.stop="discardCardClick(c)"
+        >
+          Discard
+        </button>
       </CardPreview>
     </TransitionGroup>
     <!-- <img :class="`card_image`" :src="'/cards/background.png'" draggable="false"> -->

components/PlayerSlot.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import {
   damageChampion,
+  discardCard,
   endTurn,
   joinGame,
   lockCard,
@@ -142,6 +143,9 @@ function tokenClick({ card, token }: { card: Card; token: Effect }) {
 function damageChampionClick(card: Card) {
   damageChampion(props.game._id, props.player._id, card._id);
 }
+function discardCardClick(card: Card) {
+  discardCard(props.game._id, card._id);
+}
 </script>
 
 <template>
@@ -203,7 +207,11 @@ function damageChampionClick(card: Card) {
         :tokens="cardTokens"
         @tokenClick="tokenClick"
         :championsKillable="!isSelf && isSelfTurn.value"
+        :discardable="
+          (player.fuckUMarkers > 0 || player.discardMarkers > 0) && isSelf
+        "
         @damageChampionClick="damageChampionClick"
+        @discardCardClick="discardCardClick"
       >
       </CardsGrouped>