Merge pull request #44 from JollyGrin/feat/add-bottom-deck-from-scry

Feat/add bottom deck from scry
JollyGrin · Oct 3, 2024 · 0b9bee6 · 0b9bee6
2 parents 34278ab + 5544bcb
commit 0b9bee6
Show file tree

Hide file tree

Showing 3 changed files with 74 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -14,12 +14,9 @@ Find instructions if you wish to setup your own game server.
 
 ## Todo 
 - [ ] keypress listener for mana/life increase
-- [x] view enemy graveyard
-- [x] add four cores deck import https://fourcores.xyz/api/tts/T33jdoAJy8PGY9Agq1fo
 - [ ] add hand drawing mode (for mobile, just deck and hand)
-- [x] add setting to flip enemy card upside down
-- [x] add precon decks to default load
-- [ ] banish cards from cemetary
+- [x] command: scry -> add bottom deck in addition to top deck
+
 
 ## Feature ideas
 - [ ] support 4players
@@ -39,6 +36,11 @@ Find instructions if you wish to setup your own game server.
 
 
 ## Recently finished
+- [x] view enemy graveyard
+- [x] add four cores deck import https://fourcores.xyz/api/tts/T33jdoAJy8PGY9Agq1fo
+- [x] add setting to flip enemy card upside down
+- [x] add precon decks to default load
+- [x] banish cards from cemetary
 - [x] roll dice (d6/d20)
 - [x] spawn card/token modal
     - cache the sorcery api data on cards.army

diff --git a/src/components/molecules/CommandModal/Commands.tsx b/src/components/molecules/CommandModal/Commands.tsx
@@ -8,6 +8,7 @@ import {
 import { Button } from "@/components/ui/button";
 import { PlayerDataProps } from "@/types/card";
 import {
+  actDeckMoveToBottom,
   actDeckMoveToTop,
   actDrawDeck,
   actDrawDeckBottom,
@@ -72,12 +73,12 @@ export const ActUntapAll = () => {
   return (
     <Box>
       <p>
-        You can untap all your tapped cards by pressed{" "}
+        You can untap all your tapped cards by pressing{" "}
         <span
           style={{
             borderRadius: "0.25rem",
             background: "rgba(0,0,0,0.2)",
-            padding: "2px 4px",
+            padding: "2px 6px",
             fontFamily: "monospace",
             borderBottom: "solid 1px black",
           }}
@@ -173,28 +174,60 @@ export const ActScryX = ({
     props.setGridItems(state);
   }
 
+  function moveCardToBottomOfDeck(cardIndex: number) {
+    const state = actDeckMoveToBottom(props.gridItems, deckType, cardIndex);
+    props.setGridItems(state);
+  }
+
   return (
     <VStack alignItems="start">
       <p>Look at the top X cards of your spellbook</p>
+      <p style={{ fontSize: "0.85rem", opacity: 0.5 }}>
+        Select input and use arrow keys on keyboard to go up and down
+      </p>
       <input
         className={input()}
         type="number"
         onChange={(e) => setScry(+e.target.value)}
         value={scry.toString()}
       />
+
+      {scry > 0 && (
+        <p style={{ fontSize: "0.85rem", opacity: 0.5 }}>
+          You can move individual cards to the top or bottom of your deck
+        </p>
+      )}
       <Flex flexWrap="wrap" maxW="500px" maxH="600px" overflowY="auto" gap={2}>
         {scry > 0 &&
           deck
             ?.reverse() // top of deck is last item in array
             ?.slice(0, scry)
             .map((card, cardIndex) => (
-              <Box
-                key={card.id + cardIndex}
-                onClick={() => moveCardToTopOfDeck(deck.length - cardIndex - 1)}
-              >
-                <Button fontSize="0.65rem" paddingBlock={0} h="1rem">
-                  Move to top
-                </Button>
+              <Box key={card.id + cardIndex}>
+                <HStack py="2px">
+                  <Button
+                    w="fit-content"
+                    fontSize="0.65rem"
+                    paddingBlock={0}
+                    h="1rem"
+                    onClick={() =>
+                      moveCardToTopOfDeck(deck.length - cardIndex - 1)
+                    }
+                  >
+                    {"<-"} Top
+                  </Button>
+
+                  <Button
+                    fontSize="0.65rem"
+                    paddingBlock={0}
+                    h="1rem"
+                    onClick={() =>
+                      moveCardToBottomOfDeck(deck.length - cardIndex - 1)
+                    }
+                  >
+                    Bottom {"->"}
+                  </Button>
+                </HStack>
                 <img
                   key={card.id + card.img}
                   src={getCardImage(card.img)}

diff --git a/src/utils/actions/deck.ts b/src/utils/actions/deck.ts
@@ -119,3 +119,28 @@ export function actDeckMoveToTop(
 
   return newState;
 }
+
+/**
+ * Move a card within a deck to the bottom of the deck
+ * */
+export function actDeckMoveToBottom(
+  state: GameState,
+  deckType: "deck" | "atlas",
+  cardIndex: number,
+) {
+  const newState = [...state];
+  const GRID_DECK_TYPE = deckType === "deck" ? GRIDS.DECK : GRIDS.ATLAS_DECK;
+  const newDeck = [...newState[GRID_DECK_TYPE]];
+
+  // Ensure the cardIndex is within bounds
+  if (cardIndex >= 0 && cardIndex < newDeck.length) {
+    // Remove the card at the specified index from the deck
+    const [card] = newDeck.splice(cardIndex, 1);
+    // Push the card to the hand if it exists
+    if (card) newDeck.unshift(card);
+  }
+
+  newState[GRID_DECK_TYPE] = newDeck;
+
+  return newState;
+}