aded Tarokka deck
This commit is contained in:
@@ -41,10 +41,10 @@ export default function GamePage() {
|
||||
} : undefined;
|
||||
}, [gameID]);
|
||||
|
||||
const flipCard = (cardID: string) => {
|
||||
const flipCard = (cardIndex: number) => {
|
||||
const flip: ClientUpdate = {
|
||||
gameID,
|
||||
cardID,
|
||||
cardIndex,
|
||||
};
|
||||
|
||||
socket.emit('flip-card', flip);
|
||||
@@ -54,22 +54,16 @@ export default function GamePage() {
|
||||
<main className="min-h-screen flex flex-col items-center justify-center gap-4">
|
||||
<h1 className="text-2xl font-bold">Game ID: {gameID}</h1>
|
||||
|
||||
<div className="grid grid-cols-3 gap-4">
|
||||
<div className="col-start-2">
|
||||
<Card id={cards[0].id} flipped={cards[0].flipped} onFlip={flipCard} />
|
||||
</div>
|
||||
<div className="col-start-1">
|
||||
<Card id={cards[1].id} flipped={cards[1].flipped} onFlip={flipCard} />
|
||||
</div>
|
||||
<div>
|
||||
<Card id={cards[2].id} flipped={cards[2].flipped} onFlip={flipCard} />
|
||||
</div>
|
||||
<div>
|
||||
<Card id={cards[3].id} flipped={cards[3].flipped} onFlip={flipCard} />
|
||||
</div>
|
||||
<div className="col-start-2">
|
||||
<Card id={cards[4].id} flipped={cards[4].flipped} onFlip={flipCard} />
|
||||
</div>
|
||||
<div className="grid grid-cols-3 grid-rows-3 gap-4 w-fit mx-auto">
|
||||
{Array.from({ length: 9 }).map((_, i) => {
|
||||
const cardIndex = [1, 3, 4, 5, 7].indexOf(i);
|
||||
|
||||
return (
|
||||
<div key={i} className="aspect-[2/3] w-24}">
|
||||
{cardIndex !== -1 && <Card card={cards[cardIndex]} flipAction={() => flipCard(cardIndex)} />}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</main>
|
||||
) : null;
|
||||
|
||||
Reference in New Issue
Block a user