zuma/brawlset
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity

Feat: Add ability to ban cards and display it

Browse source
This commit is contained in:
zuma 2025-04-24 15:55:07 +02:00
parent 899bdd4714
commit 2d1b64fdd3
7 changed files with 42 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

32
frontend/src/lib/components/Card.svelte
View file

@ -1,17 +1,31 @@
<script>
let { name = "", url = "#", sanitizedName = "", smallImage = "", normalImage="", price = 0, cardmarketUri = "", numberOfDecks = 0, numberOfPossibleDecks = undefined, synergy = undefined } = $props()
let { card, showUrl = false, isCommander = false, showSynergy = false } = $props()
</script>
<div class="flex flex-col w-full gap-0">
<a class="w-full" href={url}><img src={normalImage} alt={"Scan de carte pour " + name} class="w-full rounded-md aspect-[488/680]" loading="lazy"/></a>
<a href={cardmarketUri} target="_blank" class="text-xs w-full text-center mt-2">{price}€</a>
<span class="w-full text-center text-xs">{name}</span>
{#if numberOfPossibleDecks == undefined}
<span class="w-full text-center">{numberOfDecks} Decks</span>
{#if showUrl}
<a class="w-full relative" href={card.Url}>
{#if card.Banned}
<img class="absolute w-full top-60 md:top-20 rotate-30" src="/assets/banned.png" alt="banned card icon"/>
{/if}
<img src={card.NormalImage} alt={"Scan de carte pour " + card.Name} class="w-full rounded-md aspect-[488/680]" loading="lazy"/>
</a>
{:else}
<span class="w-full text-center">{numberOfDecks} Decks sur {numberOfPossibleDecks} ({numberOfPossibleDecks != 0 ? Math.round(100 * (numberOfDecks / numberOfPossibleDecks)) : 0}%)</span>
<div class="w-full relative">
{#if card.Banned}
<img class="absolute w-full top-60 md:top-20 rotate-30" src="/assets/banned.png" alt="banned card icon"/>
{/if}
<img src={card.NormalImage} alt={"Scan de carte pour " + card.Name} class="w-full rounded-md aspect-[488/680]" loading="lazy"/>
</div>
{/if}
{#if synergy != undefined}
<span class="w-full text-center">Synergy {synergy > 0 ? "+" + Math.round(100*synergy).toString() : Math.round(100*synergy).toString()}%</span>
<a href={card.CardmarketUri} target="_blank" class="text-xs w-full text-center mt-2">{card.Price}€</a>
<span class="w-full text-center text-xs">{card.Name}</span>
{#if isCommander}
<span class="w-full text-center">{card.NumberOfDecks} Decks</span>
{:else}
<span class="w-full text-center">{card.NumberOfDecks} Decks sur {card.NumberOfPossibleDecks} ({card.NumberOfPossibleDecks != 0 ? Math.round(100 * (card.NumberOfDecks / card.NumberOfPossibleDecks)) : 0}%)</span>
{/if}
{#if showSynergy}
<span class="w-full text-center">Synergy {card.Synergy > 0 ? "+" + Math.round(100*card.Synergy).toString() : Math.round(100*card.Synergy).toString()}%</span>
{/if}
</div>