From b902958012577266eda19d4a43371fe443d1920a Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 01:15:43 +0200 Subject: [PATCH 01/10] meh not working but farther? --- notes/2024-09-12.md | 3 +++ src/components/organisms/GameBoard/Footer/Grave/index.tsx | 5 ++++- src/utils/actions/grid.ts | 5 ++++- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/notes/2024-09-12.md b/notes/2024-09-12.md index c18210f..09ece25 100644 --- a/notes/2024-09-12.md +++ b/notes/2024-09-12.md @@ -13,3 +13,6 @@ #### 03:28 - we have a bug, the graveyard is being shared + +#### 01:15 +- right when i thjought i had it, fixing grave, aura 12 is messed up when swapping back and forth. ugh diff --git a/src/components/organisms/GameBoard/Footer/Grave/index.tsx b/src/components/organisms/GameBoard/Footer/Grave/index.tsx index c734a16..62494de 100644 --- a/src/components/organisms/GameBoard/Footer/Grave/index.tsx +++ b/src/components/organisms/GameBoard/Footer/Grave/index.tsx @@ -10,6 +10,9 @@ import { GameStateActions } from "@/components/organisms/GameBoard"; import { DiscardModalBody } from "./DiscardModal"; export const GraveTray = (props: GameStateActions) => { + console.log("length", props.gridItems.length); + console.log("hand", props.gridItems[GRIDS.HAND]); + console.log("grave", props.gridItems[GRIDS.GRAVE]); const graveCards = props.gridItems[GRIDS.GRAVE]; const graveAmount = graveCards?.length ?? 0; const hasCards = graveCards?.length > 0; @@ -33,7 +36,7 @@ export const GraveTray = (props: GameStateActions) => { content={} /> )} - + {hasCards && ( [...arr]); const [movedCard] = updatedGrid[originIndex].splice( event.active?.data?.current?.index, 1, @@ -65,6 +67,7 @@ export function actMoveCard(state: GameState, event: DragEndEvent) { if (over) { const originIndex = parseInt(active.data.current?.gridIndex, 10); const destinationIndex = over?.data?.current?.gridIndex; + console.log(destinationIndex); if (originIndex === destinationIndex) { return actMoveCardInCell(state, event); From 193e30f8eb3c3da4cf3fd8bec033dbecdda1164d Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 17:28:10 +0200 Subject: [PATCH 02/10] note --- notes/2024-09-12.md | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/notes/2024-09-12.md b/notes/2024-09-12.md index 09ece25..8b2c992 100644 --- a/notes/2024-09-12.md +++ b/notes/2024-09-12.md @@ -16,3 +16,10 @@ #### 01:15 - right when i thjought i had it, fixing grave, aura 12 is messed up when swapping back and forth. ugh + +#### 01:16 +- +- seems like the lengths or something are off. will try this again tomorrow. Might need to ditch the gridindexes for values for personal + +#### 01:17 +- i forget, i added gridindex id to grave and also tried deep cloning in grid.ts on actmovecard From d730a6a58ef3e8c06cbdeb46241f2caa45b87f35 Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 17:50:59 +0200 Subject: [PATCH 03/10] remove logs --- src/utils/actions/grid.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/utils/actions/grid.ts b/src/utils/actions/grid.ts index c327824..3fe69e2 100644 --- a/src/utils/actions/grid.ts +++ b/src/utils/actions/grid.ts @@ -33,8 +33,6 @@ export function actMoveCardOutsideCell(state: GameState, event: DragEndEvent) { const originIndex = parseInt(event.active.data.current?.gridIndex, 10); const destinationIndex = event.over?.data?.current?.gridIndex; - console.log("aaaa", originIndex, destinationIndex); - // Remove the active card from its original position const updatedGrid = state.map((arr) => [...arr]); const [movedCard] = updatedGrid[originIndex].splice( @@ -67,7 +65,6 @@ export function actMoveCard(state: GameState, event: DragEndEvent) { if (over) { const originIndex = parseInt(active.data.current?.gridIndex, 10); const destinationIndex = over?.data?.current?.gridIndex; - console.log(destinationIndex); if (originIndex === destinationIndex) { return actMoveCardInCell(state, event); From 7edc5675c9963f7e5675ed5f730993dbaaf308e2 Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 17:51:05 +0200 Subject: [PATCH 04/10] remove logs --- src/components/organisms/GameBoard/Footer/Grave/index.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/components/organisms/GameBoard/Footer/Grave/index.tsx b/src/components/organisms/GameBoard/Footer/Grave/index.tsx index 62494de..264fb0c 100644 --- a/src/components/organisms/GameBoard/Footer/Grave/index.tsx +++ b/src/components/organisms/GameBoard/Footer/Grave/index.tsx @@ -10,9 +10,6 @@ import { GameStateActions } from "@/components/organisms/GameBoard"; import { DiscardModalBody } from "./DiscardModal"; export const GraveTray = (props: GameStateActions) => { - console.log("length", props.gridItems.length); - console.log("hand", props.gridItems[GRIDS.HAND]); - console.log("grave", props.gridItems[GRIDS.GRAVE]); const graveCards = props.gridItems[GRIDS.GRAVE]; const graveAmount = graveCards?.length ?? 0; const hasCards = graveCards?.length > 0; From 54ebb641f772495532d34255e6f230f0dd881ccd Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 17:51:14 +0200 Subject: [PATCH 05/10] add heavy duty dbeugging --- src/pages/game.tsx | 32 ++++++++++++++++++++++++++------ 1 file changed, 26 insertions(+), 6 deletions(-) diff --git a/src/pages/game.tsx b/src/pages/game.tsx index 293f126..60adf03 100644 --- a/src/pages/game.tsx +++ b/src/pages/game.tsx @@ -21,11 +21,13 @@ export default function GamePage() { function setPlayer(playerName: keyof typeof players) { return (state: GameState) => { const newState = [...state]; // make a copy of state - const GLOBAL = newState.splice(0, GRIDS.AURA_12 + 1); // GLOBAL takes game grid + const GLOBAL = newState.slice(0, GRIDS.AURA_12 + 1); // GLOBAL takes game grid const GLOBAL_EMPTY = Array.from({ length: 4 }, () => []); // empties player data + const newGlobal = [...GLOBAL, ...GLOBAL_EMPTY]; + console.log("newGlobal", newGlobal); setPlayers((prev) => ({ ...prev, - GLOBAL: [...GLOBAL, ...GLOBAL_EMPTY], + GLOBAL: newGlobal, [playerName]: state, })); }; @@ -34,14 +36,32 @@ export default function GamePage() { const state = useMemo( () => [ ...players.GLOBAL.slice(0, GRIDS.AURA_12), - ...players[name as keyof typeof players].slice( - GRIDS.AURA_12, - GRIDS.AURA_12 + 5, - ), + ...players[name as keyof typeof players].slice(GRIDS.AURA_12), ], [players, name], ); + // const arrayOfObjects = state.map((row) => { + // return row.reduce((acc, obj, index) => { + // acc[`Column ${index}`] = obj.id; // Extract the `id` property from each object + // return acc; + // }, {}); + // }); + + // Transform each row into an object that includes the `id` from each object + const arrayOfObjects = state.map((row, rowIndex) => { + // Start with the row name from the enum + const rowObject = { "Row Name": GRIDS[rowIndex] }; + + // Add the id from each object in the row + row.forEach((obj, colIndex) => { + rowObject[`Card Index ${colIndex}`] = obj.id; + }); + + return rowObject; + }); + console.table(arrayOfObjects); + if (needsDeck(players["p1"])) return (
From c63f5cc16dc2c295573b6460fbd8ae2ec68459fd Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 18:03:12 +0200 Subject: [PATCH 06/10] omg i think its working --- src/pages/game.tsx | 21 +++++++++++++-------- 1 file changed, 13 insertions(+), 8 deletions(-) diff --git a/src/pages/game.tsx b/src/pages/game.tsx index 60adf03..8215b22 100644 --- a/src/pages/game.tsx +++ b/src/pages/game.tsx @@ -22,9 +22,10 @@ export default function GamePage() { return (state: GameState) => { const newState = [...state]; // make a copy of state const GLOBAL = newState.slice(0, GRIDS.AURA_12 + 1); // GLOBAL takes game grid + console.log("lastGlobal", GLOBAL[GLOBAL.length - 1]); const GLOBAL_EMPTY = Array.from({ length: 4 }, () => []); // empties player data const newGlobal = [...GLOBAL, ...GLOBAL_EMPTY]; - console.log("newGlobal", newGlobal); + console.log("newGlobal", newGlobal, newGlobal.length); setPlayers((prev) => ({ ...prev, GLOBAL: newGlobal, @@ -33,13 +34,17 @@ export default function GamePage() { }; } - const state = useMemo( - () => [ - ...players.GLOBAL.slice(0, GRIDS.AURA_12), - ...players[name as keyof typeof players].slice(GRIDS.AURA_12), - ], - [players, name], - ); + const state = useMemo(() => { + console.log("global", players.GLOBAL.slice(0, GRIDS.AURA_12)); + console.log( + "perosnal", + players[name as keyof typeof players].slice(GRIDS.AURA_12), + ); + return [ + ...players.GLOBAL.slice(0, GRIDS.HAND), + ...players[name as keyof typeof players].slice(GRIDS.HAND), + ]; + }, [players, name]); // const arrayOfObjects = state.map((row) => { // return row.reduce((acc, obj, index) => { From d6c5113b35ee78ef24bcdc4cbfc7eefdd8395ab4 Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 18:13:29 +0200 Subject: [PATCH 07/10] debugger tool --- src/utils/helpers/debugState.ts | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 src/utils/helpers/debugState.ts diff --git a/src/utils/helpers/debugState.ts b/src/utils/helpers/debugState.ts new file mode 100644 index 0000000..88c2ee4 --- /dev/null +++ b/src/utils/helpers/debugState.ts @@ -0,0 +1,23 @@ +import { GRIDS } from "@/components/organisms/GameBoard/constants"; +import { GameState } from "@/types/card"; + +/** + * Having trouble understanding the state? + * Throw this around state anywhere to see a table in the console logs + * */ +function debugState(state: GameState) { + // Transform each row into an object that includes the `id` from each object + const arrayOfObjects = state.map((row, rowIndex) => { + // Start with the row name from the enum + const rowObject = { "Row Name": GRIDS[rowIndex] }; + + // Add the id from each object in the row + row.forEach((obj, colIndex) => { + //@ts-ignore: do not care, it works + rowObject[`Card Index ${colIndex}`] = obj.id; + }); + + return rowObject; + }); + console.table(arrayOfObjects); +} From 48ee86fdaf3ba153bba316aba8d40c41eee4e698 Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 18:13:33 +0200 Subject: [PATCH 08/10] add notes --- README.md | 7 +++++++ notes/2024-09-13.md | 3 +++ 2 files changed, 10 insertions(+) create mode 100644 notes/2024-09-13.md diff --git a/README.md b/README.md index b421d33..65b238b 100644 --- a/README.md +++ b/README.md @@ -7,3 +7,10 @@ Playtest Sorcery TCG in the browser - [ ] add solo turn rotator (play against yourself) - use top header for info - [ ] add websocket + +## Feature ideas +- [ ] support 4players +- [ ] support battlebox (shared deck) + +## Bugs +- [ ] graveyard sorting. Ensure that in the handle drag it ignores ordering conditions diff --git a/notes/2024-09-13.md b/notes/2024-09-13.md new file mode 100644 index 0000000..578c011 --- /dev/null +++ b/notes/2024-09-13.md @@ -0,0 +1,3 @@ + +#### 18:03 +- i think i finally got it working. i made a huge debugger and was finding where things were not hitting. just logged personal and global and found a mismatch From d5f6bc949ae35a989dbf7da47bca0fae22a838bc Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 18:13:36 +0200 Subject: [PATCH 09/10] remove logs --- src/pages/game.tsx | 28 ---------------------------- 1 file changed, 28 deletions(-) diff --git a/src/pages/game.tsx b/src/pages/game.tsx index 8215b22..e6693ba 100644 --- a/src/pages/game.tsx +++ b/src/pages/game.tsx @@ -22,10 +22,8 @@ export default function GamePage() { return (state: GameState) => { const newState = [...state]; // make a copy of state const GLOBAL = newState.slice(0, GRIDS.AURA_12 + 1); // GLOBAL takes game grid - console.log("lastGlobal", GLOBAL[GLOBAL.length - 1]); const GLOBAL_EMPTY = Array.from({ length: 4 }, () => []); // empties player data const newGlobal = [...GLOBAL, ...GLOBAL_EMPTY]; - console.log("newGlobal", newGlobal, newGlobal.length); setPlayers((prev) => ({ ...prev, GLOBAL: newGlobal, @@ -35,38 +33,12 @@ export default function GamePage() { } const state = useMemo(() => { - console.log("global", players.GLOBAL.slice(0, GRIDS.AURA_12)); - console.log( - "perosnal", - players[name as keyof typeof players].slice(GRIDS.AURA_12), - ); return [ ...players.GLOBAL.slice(0, GRIDS.HAND), ...players[name as keyof typeof players].slice(GRIDS.HAND), ]; }, [players, name]); - // const arrayOfObjects = state.map((row) => { - // return row.reduce((acc, obj, index) => { - // acc[`Column ${index}`] = obj.id; // Extract the `id` property from each object - // return acc; - // }, {}); - // }); - - // Transform each row into an object that includes the `id` from each object - const arrayOfObjects = state.map((row, rowIndex) => { - // Start with the row name from the enum - const rowObject = { "Row Name": GRIDS[rowIndex] }; - - // Add the id from each object in the row - row.forEach((obj, colIndex) => { - rowObject[`Card Index ${colIndex}`] = obj.id; - }); - - return rowObject; - }); - console.table(arrayOfObjects); - if (needsDeck(players["p1"])) return (
From 479eab75e672fa238d3875f79b0edd1de91b1823 Mon Sep 17 00:00:00 2001 From: jollygrin Date: Fri, 13 Sep 2024 18:15:35 +0200 Subject: [PATCH 10/10] update debugstate --- src/utils/helpers/debugState.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/utils/helpers/debugState.ts b/src/utils/helpers/debugState.ts index 88c2ee4..fe9b0ce 100644 --- a/src/utils/helpers/debugState.ts +++ b/src/utils/helpers/debugState.ts @@ -5,7 +5,7 @@ import { GameState } from "@/types/card"; * Having trouble understanding the state? * Throw this around state anywhere to see a table in the console logs * */ -function debugState(state: GameState) { +export function debugState(state: GameState) { // Transform each row into an object that includes the `id` from each object const arrayOfObjects = state.map((row, rowIndex) => { // Start with the row name from the enum @@ -13,7 +13,7 @@ function debugState(state: GameState) { // Add the id from each object in the row row.forEach((obj, colIndex) => { - //@ts-ignore: do not care, it works + //@ts-expect-error: do not care, it works rowObject[`Card Index ${colIndex}`] = obj.id; });