card is replaced on purchase

This commit is contained in:
Mikayla Dobson
2022-07-30 07:51:27 -05:00
parent b6df8714aa
commit 3ba8dedcfa
5 changed files with 1038 additions and 918 deletions

View File

@@ -8,7 +8,7 @@ const { validateChips } = getChipsActions;
// components
import Nobles from './Nobles';
import initializeBoard from '../../util/initializeBoard';
import initializeBoard, { setCardRows } from '../../util/initializeBoard';
import AvailableChips from '../Resources/AvailableChips';
import AllPlayers from '../Player/AllPlayers';
import CardRow from '../Card/CardRow';
@@ -44,7 +44,7 @@ export default function Gameboard({ state, setState }: StateProps) {
})
}, [state]);
const setActionState = useCallback((value: SetActionType, player: PlayerData) => {
const setActionState = useCallback((value: SetActionType, player?: PlayerData) => {
if (!player?.turnActive) return;
switch (value) {
@@ -67,6 +67,10 @@ export default function Gameboard({ state, setState }: StateProps) {
initializeBoard(state, setState);
}, [])
useEffect(() => {
setCardRows(state);
}, [state])
// displays state of board if data is populated
useEffect(() => {
if (!state.players.length) {
@@ -86,7 +90,6 @@ export default function Gameboard({ state, setState }: StateProps) {
<CardRow tier={1} state={state} setState={setState} />
<SelectionView state={state} setState={setState} />
<AvailableChips state={state} setState={setState} liftSelection={liftSelection} />
{/* @ts-ignore */}
<AllPlayers state={state} setState={setState} setActionState={setActionState} />
</div>
)

View File

@@ -1,5 +1,5 @@
import { turnOrderUtil } from "../../../util/turnOrderUtil";
import { AppState, CardData, PlayerData, ResourceCost, setStateType } from "../../../util/types";
import { AppState, CardData, FullDeck, PlayerData, ResourceCost, setStateType } from "../../../util/types";
import { useCurrentPlayer } from "../../../util/useCurrentPlayer";
export const tooExpensive = (card: CardData, state: AppState): boolean => {
@@ -27,7 +27,7 @@ export const buyCard = (card: CardData, state: AppState, setState: setStateType)
*/
let currentPlayer = useCurrentPlayer(state);
console.log(currentPlayer);
console.log(card);
setState((prev: AppState) => {
if (!currentPlayer) return prev;
@@ -75,14 +75,37 @@ export const buyCard = (card: CardData, state: AppState, setState: setStateType)
const idx = newPlayers.findIndex((one: PlayerData) => one.id === currentPlayer?.id);
newPlayers[idx] = updatedPlayer;
let updatedRows = { ...prev.gameboard.cardRows }
if (card.tier) {
let tierKey;
switch (card.tier) {
case 1:
tierKey = "tierOne"
break;
case 2:
tierKey = "tierTwo"
break;
case 3:
tierKey = "tierThree"
break;
default:
break;
}
updatedRows[tierKey as keyof FullDeck] =
prev.gameboard.cardRows[tierKey as keyof FullDeck].filter((found: CardData) => found.resourceCost !== card.resourceCost);
}
return {
...prev,
round: (roundIncrement ? prev.round + 1 : prev.round),
players: newPlayers,
gameboard: {
...prev.gameboard,
tradingResources: prev.gameboard.tradingResources
},
round: (roundIncrement ? prev.round + 1 : prev.round),
players: newPlayers
tradingResources: prev.gameboard.tradingResources,
cardRows: updatedRows
}
}
})
}

View File

@@ -58,7 +58,7 @@ export default function Player({ player, state, setState, setActionState }: Play
<p>Cards:</p>
{ dynamic && dynamic.cards.length > 0 && dynamic.cards.map((data: CardData) => {
return (
<div className="mini-card" style={{backgroundColor: 'white'}}>
<div key={v4()} className="mini-card" style={{backgroundColor: 'white'}}>
<p>{data.gemValue} card</p>
<p>{data.points || null}</p>
</div>

View File

@@ -9,7 +9,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -20,7 +21,8 @@
"diamond": 1
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -31,7 +33,8 @@
"diamond": 1
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -42,7 +45,8 @@
"diamond": 1
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -53,7 +57,8 @@
"diamond": 1
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -64,7 +69,8 @@
"diamond": 2
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -75,7 +81,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -86,7 +93,8 @@
"diamond": 1
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -97,7 +105,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -108,7 +117,8 @@
"diamond": 1
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -119,7 +129,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -130,7 +141,8 @@
"diamond": 2
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -141,7 +153,8 @@
"diamond": 2
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -152,7 +165,8 @@
"diamond": 1
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -163,7 +177,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -174,7 +189,8 @@
"diamond": 1
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -185,7 +201,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -196,7 +213,8 @@
"diamond": 1
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -207,7 +225,8 @@
"diamond": 3
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -218,7 +237,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -229,7 +249,8 @@
"diamond": 2
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -240,7 +261,8 @@
"diamond": 1
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -251,7 +273,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -262,7 +285,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -273,7 +297,8 @@
"diamond": 1
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -284,7 +309,8 @@
"diamond": 2
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -295,7 +321,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -306,7 +333,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -317,7 +345,8 @@
"diamond": 2
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -328,7 +357,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -339,7 +369,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -350,7 +381,8 @@
"diamond": 3
},
"gemValue": "ruby",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -361,7 +393,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -372,7 +405,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -383,7 +417,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 0
"points": 0,
"tier": 1
},
{
"resourceCost": {
@@ -394,7 +429,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 1
"points": 1,
"tier": 1
},
{
"resourceCost": {
@@ -405,7 +441,8 @@
"diamond": 4
},
"gemValue": "ruby",
"points": 1
"points": 1,
"tier": 1
},
{
"resourceCost": {
@@ -416,7 +453,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 1
"points": 1,
"tier": 1
},
{
"resourceCost": {
@@ -427,7 +465,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 1
"points": 1,
"tier": 1
},
{
"resourceCost": {
@@ -438,7 +477,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 1
"points": 1,
"tier": 1
}
],
"tierTwo": [
@@ -451,7 +491,8 @@
"diamond": 3
},
"gemValue": "ruby",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -462,7 +503,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -473,7 +515,8 @@
"diamond": 2
},
"gemValue": "emerald",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -484,7 +527,8 @@
"diamond": 5
},
"gemValue": "onyx",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -495,7 +539,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -506,7 +551,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -517,7 +563,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -528,7 +575,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -539,7 +587,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -550,7 +599,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -561,7 +611,8 @@
"diamond": 2
},
"gemValue": "diamond",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -572,7 +623,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -583,7 +635,8 @@
"diamond": 2
},
"gemValue": "sapphire",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -594,7 +647,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 3
"points": 3,
"tier": 2
},
{
"resourceCost": {
@@ -605,7 +659,8 @@
"diamond": 4
},
"gemValue": "emerald",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -616,7 +671,8 @@
"diamond": 6
},
"gemValue": "diamond",
"points": 3
"points": 3,
"tier": 2
},
{
"resourceCost": {
@@ -627,7 +683,8 @@
"diamond": 1
},
"gemValue": "ruby",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -638,7 +695,8 @@
"diamond": 3
},
"gemValue": "onyx",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -649,7 +707,8 @@
"diamond": 3
},
"gemValue": "onyx",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -660,7 +719,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 3
"points": 3,
"tier": 2
},
{
"resourceCost": {
@@ -671,7 +731,8 @@
"diamond": 2
},
"gemValue": "ruby",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -682,7 +743,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -693,7 +755,8 @@
"diamond": 3
},
"gemValue": "emerald",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -704,7 +767,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -715,7 +779,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -726,7 +791,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 1
"points": 1,
"tier": 2
},
{
"resourceCost": {
@@ -737,7 +803,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 3
"points": 3,
"tier": 2
},
{
"resourceCost": {
@@ -748,7 +815,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 3
"points": 3,
"tier": 2
},
{
"resourceCost": {
@@ -759,7 +827,8 @@
"diamond": 5
},
"gemValue": "sapphire",
"points": 2
"points": 2,
"tier": 2
},
{
"resourceCost": {
@@ -770,7 +839,8 @@
"diamond": 0
},
"gemValue": "sapphire",
"points": 1
"points": 1,
"tier": 2
}
],
"tierThree": [
@@ -783,7 +853,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -794,7 +865,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -805,7 +877,8 @@
"diamond": 3
},
"gemValue": "diamond",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -816,7 +889,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -827,7 +901,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -838,7 +913,8 @@
"diamond": 6
},
"gemValue": "sapphire",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -849,7 +925,8 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -860,7 +937,8 @@
"diamond": 7
},
"gemValue": "sapphire",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -871,7 +949,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -882,7 +961,8 @@
"diamond": 3
},
"gemValue": "emerald",
"points": 4
"points": 4,
"tier": 3
},
{
"resourceCost": {
@@ -893,7 +973,8 @@
"diamond": 3
},
"gemValue": "ruby",
"points": 3
"points": 3,
"tier": 3
},
{
"resourceCost": {
@@ -904,7 +985,8 @@
"diamond": 5
},
"gemValue": "emerald",
"points": 3
"points": 3,
"tier": 3
},
{
"resourceCost": {
@@ -915,7 +997,8 @@
"diamond": 0
},
"gemValue": "diamond",
"points": 3
"points": 3,
"tier": 3
},
{
"resourceCost": {
@@ -926,7 +1009,8 @@
"diamond": 3
},
"gemValue": "onyx",
"points": 3
"points": 3,
"tier": 3
},
{
"resourceCost": {
@@ -937,7 +1021,8 @@
"diamond": 3
},
"gemValue": "sapphire",
"points": 3
"points": 3,
"tier": 3
},
{
"resourceCost": {
@@ -948,7 +1033,8 @@
"diamond": 7
},
"gemValue": "sapphire",
"points": 5
"points": 5,
"tier": 3
},
{
"resourceCost": {
@@ -959,7 +1045,8 @@
"diamond": 3
},
"gemValue": "diamond",
"points": 5
"points": 5,
"tier": 3
},
{
"resourceCost": {
@@ -970,7 +1057,8 @@
"diamond": 0
},
"gemValue": "ruby",
"points": 5
"points": 5,
"tier": 3
},
{
"resourceCost": {
@@ -981,7 +1069,8 @@
"diamond": 0
},
"gemValue": "emerald",
"points": 5
"points": 5,
"tier": 3
},
{
"resourceCost": {
@@ -992,7 +1081,9 @@
"diamond": 0
},
"gemValue": "onyx",
"points": 5
"points": 5,
"tier": 3
}
]
}
}

View File

@@ -30,18 +30,21 @@ const setNobles = (state: AppState, setState: setStateType) => {
setState({ ...state, gameboard: { ...state.gameboard, nobles: shuffledNobles }})
}
export default function initializeBoard(state: AppState, setState: setStateType) {
shuffleDeck(state, setState);
export const setCardRows = (state: AppState) => {
console.log('set cards');
let newDeck = state.gameboard.cardRows;
for (const [key, value] of Object.entries(state.gameboard.deck)) {
while (newDeck[key as keyof FullDeck].length < 4) {
// @ts-ignore
const nextCard = value.shift();
newDeck[key as keyof FullDeck].push(nextCard);
}
}
return newDeck;
}
export default function initializeBoard(state: AppState, setState: setStateType) {
shuffleDeck(state, setState);
const newDeck = setCardRows(state);
setState({ ...state, gameboard: { ...state.gameboard, cardRows: newDeck } })
setNobles(state, setState);
}