improved trap cards rullings;

LucasLimaAZ · Oct 17, 2024 · 4b49512 · 4b49512
1 parent 526ed19
commit 4b49512
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 5 deletions.
diff --git a/src/components/card/card.jsx b/src/components/card/card.jsx
@@ -33,6 +33,7 @@ const Card = ({ card, type, position }) => {
     handleTribute,
     anchorEl,
     handleClose,
+    negateCard,
   } = useCard(position);
 
   return (
@@ -69,10 +70,16 @@ const Card = ({ card, type, position }) => {
             anchorEl,
             openContextMenu,
             handleClose,
+            negateCard,
           }}
         />
         {card && (
-          <Box sx={{ transform: card?.def_mode && "rotate(90deg)" }}>
+          <Box
+            sx={{
+              transform: card?.def_mode && "rotate(90deg)",
+              filter: card?.isNegated && "grayscale(100%)",
+            }}
+          >
             <Grow in>
               <Box
                 component="img"
@@ -93,6 +100,7 @@ const Card = ({ card, type, position }) => {
           openAttack={openAttackModal}
           handleCloseAttack={() => setOpenAttackModal(false)}
           handleDestroyCard={handleDestroy}
+          handleFlipCard={handleFlip}
           target={target}
         />
         <ChangeStatsModal

diff --git a/src/components/card/components/context-menu.jsx b/src/components/card/components/context-menu.jsx
@@ -7,6 +7,7 @@ import {
   AddCircleOutline,
   Search,
   ChangeCircle,
+  Delete,
   DoDisturb,
 } from "@mui/icons-material";
 
@@ -24,6 +25,7 @@ const CardContextMenu = ({
   anchorEl,
   openContextMenu,
   handleClose,
+  negateCard,
 }) => {
   return (
     <Menu
@@ -63,8 +65,11 @@ const CardContextMenu = ({
       <MenuItem onClick={handleFlip}>
         <ChangeCircle /> Flip
       </MenuItem>
+      <MenuItem onClick={negateCard}>
+        <DoDisturb /> Negate
+      </MenuItem>
       <MenuItem onClick={handleDestroy}>
-        <DoDisturb /> Destroy
+        <Delete /> Destroy
       </MenuItem>
     </Menu>
   );

diff --git a/src/components/card/use-card.js b/src/components/card/use-card.js
@@ -12,6 +12,7 @@ export const useCard = (position) => {
     destroyCard,
     selectCard,
     field,
+    updateCardZone,
   } = useField();
 
   const { sendToGraveyard } = useGraveyard();
@@ -86,6 +87,14 @@ export const useCard = (position) => {
     setOpenChangeStatsModal(false);
   };
 
+  const negateCard = () => {
+    const negatedCard = {
+      ...card,
+      isNegated: !card.isNegated,
+    };
+    updateCardZone(negatedCard, position);
+  };
+
   return {
     handleTribute,
     handleChangePosition,
@@ -109,5 +118,6 @@ export const useCard = (position) => {
     openContextMenu,
     anchorEl,
     handleClose,
+    negateCard,
   };
 };
diff --git a/src/components/modals/attack-card/use-attack-card.js b/src/components/modals/attack-card/use-attack-card.js
@@ -50,13 +50,13 @@ export const useAttackCard = (props) => {
     if (props.card?.def_mode) {
       if (defDif === 0) return;
 
-      defDif > 0 ? props.handleDestroyCard() : setPlayerLp(playerLp + defDif);
+      defDif > 0 ? handleDestroyCard() : setPlayerLp(playerLp + defDif);
 
       return;
     }
 
     if (atkDif >= 0) {
-      props.handleDestroyCard();
+      handleDestroyCard();
       if (atkDif > 0) setOpponentLp(opponentLp - atkDif);
     }
 
@@ -65,10 +65,20 @@ export const useAttackCard = (props) => {
     }
   };
 
+  const handleDestroyCard = () => {
+    if (props.card?.face_down) {
+      console.log("aueba? estoy aqui...");
+      props.handleFlipCard();
+      return;
+    }
+
+    props.handleDestroyCard();
+  };
+
   const searchForTrapCards = () => {
     let trapCards = field?.filter((card, index) => {
       if (card) card.fieldPosition = index;
-      return card?.type === "Trap Card";
+      return card?.type === "Trap Card" && !card?.isNegated;
     });
     return trapCards;
   };

diff --git a/src/shared/hooks/field.jsx b/src/shared/hooks/field.jsx
@@ -191,8 +191,17 @@ const useField = () => {
     generateMagicTrap(position);
   };
 
+  const updateCardZone = (card, position) => {
+    setField((prev) => {
+      const newField = [...prev];
+      newField[position] = card;
+      return newField;
+    });
+  };
+
   return {
     field,
+    updateCardZone,
     rotateBoard,
     setRotateBoard,
     generateCard,