slanted-gamedev-toolz
Version:
A slanted mix of tools for your brilliant ideas in game design.
38 lines (37 loc) • 2.17 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { CardHand } from "../CardHand/CardHand";
import { useCatDeckHandScore } from "../../cardDecks/hooks/useCatDeckHandScore";
import { textOutline } from "../GameCard/GameCardSx";
import { numberWithCommas } from "../../util/numberWithComma";
export const DeckDealer = ({ deck, handSize }) => {
const [dealtCards, setDealtCards] = useState(0);
const [hand, setHand] = useState([]);
const [remainingDeck, setRemainingDeck] = useState([
...deck,
]);
const { score, outcomes, multiplier, baseScore, clearOutcomes } = useCatDeckHandScore(hand);
const style = {};
const isNeedShuffle = remainingDeck.length < handSize;
const dealCards = () => {
clearOutcomes();
if (isNeedShuffle) {
setRemainingDeck(deck);
setHand([]);
setDealtCards(0);
console.log("Not enough cards in the deck");
return;
}
const shuffledDeck = [...remainingDeck].sort(() => Math.random() - 0.5);
const newHand = shuffledDeck.slice(0, handSize);
const updatedRemainingDeck = [...remainingDeck.slice(handSize)];
setDealtCards(dealtCards + handSize);
setHand([...newHand]);
setRemainingDeck(updatedRemainingDeck);
};
return (_jsxs("div", { style: style, children: [_jsx("button", { onClick: dealCards, children: isNeedShuffle ? "Shuffle" : "Deal" }), _jsxs("div", { children: ["Dealt Cards: ", dealtCards] }), _jsxs("h1", { children: [`score: ${baseScore} x ${multiplier} = `, _jsx("span", { style: {
color: "green",
fontSize: "1.5em",
...textOutline.blackHalf,
}, children: numberWithCommas(score) })] }), _jsx("div", { children: _jsx(CardHand, { cards: outcomes, overlap: 0 }) }), _jsx("div", { children: "Hand" }), _jsx("div", { children: _jsx(CardHand, { cards: hand, overlap: 0 }) }), _jsxs("div", { children: ["Remaining Cards: ", remainingDeck.length] }), _jsx(CardHand, { cards: remainingDeck })] }));
};