heronfief/front
3
1
Fork 0
Code Issues 44 Pull Requests 1 Actions Packages Projects Releases 1 Activity

rename discard to make_discard; put all effects buttons inside their card

Browse Source
This commit is contained in:
legonzaur
2024-05-06 17:13:10 +02:00
parent c4b056b4b6
commit 62c00cba93
4 changed files with 44 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/CardPreview.vue
+6 -6
View File
@@ -38,16 +38,15 @@ watch(
</script>
<template>
<div :class="`card ${childCount > 0 ? 'active' : ''} ${wrapped ? 'wrapped' : ''}`" @contextmenu.prevent="false"
@click.left="cardClick" :style="`rotate:${rotation}deg;`">
<div :class="`card ${childCount > 0 ? 'active' : ''} ${wrapped ? 'wrapped' : ''} ${props.locked ? 'locked' : ''}`"
@contextmenu.prevent="false" @click.left="cardClick" :style="`rotate:${rotation}deg;`">
<div id="contextMenuButtons" :ref="(el) => { childCount = ((el as Element)?.childElementCount ?? 0) }">
<slot></slot>
</div>
<img :class="`card_image ${props.locked ? 'locked' : ''}`" v-if="props.data"
<img :class="`card_image`" v-if="props.data"
:src="'/cards/' + data?.card_id?.toString().padStart(3, '0') + '.png'" draggable="false">
<img :class="`card_image ${props.locked ? 'locked' : ''}`" v-if="!props.data" :src="'/cards/background.png'"
draggable="false">
<img :class="`card_image`" v-if="!props.data" :src="'/cards/background.png'" draggable="false">
</div>
@@ -84,7 +83,7 @@ watch(
outline-offset: -2px;
}
.card_image.locked {
.card.locked {
/* filter: brightness(0.5); */
filter: drop-shadow(5px 15px 2px rgba(0, 0, 0, .60));
}
@@ -111,5 +110,6 @@ watch(
#contextMenuButtons>* {
flex: 1;
border-radius: 10px;
min-height: 50px;
}
</style>
components/PlayerSlot.vue
+28 -29
View File
@@ -39,7 +39,7 @@ function run_effect(
}
const make_discard = (target: Player) =>
run_effect(CardEffects.DISCARD, target);
run_effect(CardEffects.MAKE_DISCARD, target);
const sacrifice = (target: Card) => run_effect(CardEffects.SACRIFICE, target);
const stun = (target: Card) => run_effect(CardEffects.STUN, target)
@@ -68,16 +68,9 @@ const stun = (target: Card) => run_effect(CardEffects.STUN, target)
Damage
</button>
<button v-if="isSelfTurn && isPlayerEnemy" @click="make_discard(props.player)"
:disabled="!goStore.self?.turn.find_effect(CardEffects.DISCARD)">
:disabled="!goStore.self?.turn.find_effect(CardEffects.MAKE_DISCARD)">
make Discard
</button>
<span>effects_availables =
<div v-for="e in props.player.turn.effects_availables">
<button v-if="e" @click="useEffect(e)" :disabled="!e.usable">
{{ e.effect + " " + e.effect_type }}
</button>
</div>
</span>
<br />
<div class="cards_container">
@@ -90,30 +83,36 @@ const stun = (target: Card) => run_effect(CardEffects.STUN, target)
<!-- BOARD -->
<CardPreview :data="c" v-for="c in props.player.board" @click="lockCard(c)"
:locked="c.uuid in props.player.turn.cards_locked">
<template v-if="c && isSelf && isPlayerTurn">
<button v-if="props.player.turn.discard_markers > 0" @click="discard(c)">
DISCARD
<template v-if="c.uuid in props.player.turn.cards_locked"
v-for="e in props.player.turn.effects_availables">
<button v-if="e.card == c" @click="useEffect(e)" :disabled="!e.usable">
EFFECT<br>
{{ e.effect + " " + (e.effect_type ?? '') }}
</button>
</template>
<template v-if="!(c.uuid in props.player.turn.cards_locked)">
<button v-if="props.player.turn.discard_markers > 0" @click="discard(c)">
DISCARD
</button>
<button v-if="goStore.self?.turn.find_effect(CardEffects.SACRIFICE)" @click="sacrifice(c)">
SACRIFICE
</button>
<button @click="lockCard(c)">
LOCK
</button>
</template>
</template>
<template v-if="isPlayerEnemy && isSelfTurn && (c.health_as_champion ?? 0) > 0">
<button :disabled="(goStore.self?.turn.damage_reserve ?? 0) <= 0" @click="damage_champion(c)">
DAMAGE
</button>
<button
v-if="goStore.self?.turn.find_effect(CardEffects.SACRIFICE) && !(c.uuid in props.player.turn.cards_locked)"
@click="sacrifice(c)">
SACRIFICE
</button>
<button
v-if="c && isSelf && isPlayerTurn && !(c.uuid in (goStore.self?.turn.cards_locked ?? []))"
@click="lockCard(c)">
LOCK
<button v-if="goStore.self?.turn.find_effect(CardEffects.STUN)" @click="stun(c)">
STUN
</button>
</template>
<button v-if="isPlayerEnemy && isSelfTurn && (c.health_as_champion ?? 0) > 0"
:disabled="(goStore.self?.turn.damage_reserve ?? 0) <= 0" @click="damage_champion(c)">
DAMAGE
</button>
<button
v-if="isPlayerEnemy && isSelfTurn && goStore.self?.turn.find_effect(CardEffects.STUN) && (c.health_as_champion ?? 0) > 0"
@click="stun(c)">
STUN
</button>
</CardPreview>
</div>
</div>
components/SelfView.vue
+2 -2
View File
@@ -9,8 +9,8 @@ const isTurn = computed(() => goStore.self?.team == goStore.game?.current_turn)
<template>
<div :class="'player ' + (isTurn ? 'turn' : '')">
<button v-if="goStore.self && goStore.self?.team != goStore.self?.team"
@click="useEffect(goStore.self!.turn.find_effect(CardEffects.DISCARD)!, goStore.self)"
:disabled="!goStore.self!.turn.find_effect(CardEffects.DISCARD)">
@click="useEffect(goStore.self!.turn.find_effect(CardEffects.MAKE_DISCARD)!, goStore.self)"
:disabled="!goStore.self!.turn.find_effect(CardEffects.MAKE_DISCARD)">
make Discard</button>
<div id="turn_data">
<button id="end_turn" v-if="isTurn" @click="endTurn">END TURN</button>
netcode/Effect.ts
+8 -2
View File
@@ -1,4 +1,5 @@
import { GameObjectRegister } from "."
import type { Card } from "./Card"
import type { GameObjectNetcode } from "./GameObject"
export enum CardEffects {
@@ -10,7 +11,7 @@ export enum CardEffects {
SACRIFICE = "sacrifice",
DRAW = "draw",
DRAW_AND_DISCARD = "draw_and_discard",
DISCARD = "discard",
MAKE_DISCARD = "make_discard",
RESTACK_DISCARDED_CHAMPION = "restack_discarded_champion",
RESTACK_DISCARDED_CARD = "restack_discarded_card",
STACK_NEXT_ACTION_BOUGHT = "stack_next_action_bought",
@@ -36,13 +37,15 @@ export interface EffectNetcode extends GameObjectNetcode {
amount: number
sub_effects: Array<EffectNetcode>
mutex: Array<string>
card: string
effect_type?: EffectType
times?: EffectTimes
}
export type Effect = Omit<EffectNetcode, 'sub_effects' | 'mutex'> & {
export type Effect = Omit<EffectNetcode, 'sub_effects' | 'mutex' | 'card' > & {
sub_effects: { [key: string]: Effect }
mutex: { [key: string]: Effect }
card: Card
usable: boolean
}
@@ -70,6 +73,9 @@ export function create_effect(input: EffectNetcode, register: GameObjectRegister
}
return true
}
if (prop == "card"){
return register.cards.get(target.card)
}
return Reflect.get(target, prop, reciever);
},
set(target, prop, val, receiver) {