feat: implement right-click to add/remove card

1 files changed, 21 insertions, 0 deletions

diff --git a/src/components/card_thumb.svelte b/src/components/card_thumb.svelte
index 8b82241..52fd1f3 100644
--- a/src/components/card_thumb.svelte
+++ b/src/components/card_thumb.svelte
@@ -2,6 +2,8 @@
     import { setLeftPanelCard, showMobileInfo } from '../left_panel';
     import { cardImageUrl } from '../utils';
     import { currentTranslations } from '../language';
+    import { deckOps } from '../deck';
+    import { getCardDb } from '../card_db';
 
     let {id, area, idx, limitNum} = $props();
 
@@ -13,6 +15,24 @@
         e.dataTransfer.setData('text', JSON.stringify({id, area, idx}))
     }
 
+    function adjustCardCount(e) {
+      e.preventDefault();
+
+      if (area !== 'search') {
+        deckOps.deleteCard(area, idx)
+        return;
+      }
+
+      const cardDB = getCardDb();
+      const isExtra = cardDB[id]?.isExtra;
+
+      if (isExtra) {
+        deckOps.add2extra(id, -1);
+      } else {
+        deckOps.add2main(id, -1);
+      }
+    }
+
     function thumbImage(id) {
         let url = cardImageUrl(id)
         if (url.includes('ygopro-super-pre')) {
@@ -30,6 +50,7 @@
        onfocus={onhover}
        ondragstart={onDragStart}
        onclick={()=>{onhover();showMobileInfo();}}
+       oncontextmenu={adjustCardCount}
        height="100%"
        src={thumbImage(id)}
        alt="yugioh card {id}"