\n \n \n \n\n",[],[157,203],"819256bc-5ccf-11f1-a7e5-1607ee4eb77e","favicon.svg","019e7d43-79e3-70dd-b64d-48783466c0f0",12,["D",1780218172673],"\n\n",[],[157,211],"5bc7e8f2-5ccf-11f1-9502-1607ee4eb77e","useBlackjack.ts","5bc7ea96-5ccf-11f1-9502-1607ee4eb77e","04158e38-64db-4ac4-9769-9ef2ea99be89",6,["D",1780218109293],"import { useCallback, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n buildShoe,\n type Card,\n handValue,\n isBlackjack,\n isBust,\n} from \"./blackjack.ts\";\n\nexport type Phase = \"betting\" | \"player\" | \"dealer\" | \"result\";\nexport type Outcome = \"win\" | \"lose\" | \"push\" | \"blackjack\" | null;\n\nconst BANK_KEY = \"casino-blackjack-bank\";\nconst STARTING_BANK = 1000;\n\nfunction loadBank(): number {\n const raw = localStorage.getItem(BANK_KEY);\n const n = raw ? parseInt(raw, 10) : NaN;\n return Number.isFinite(n) && n > 0 ? n : STARTING_BANK;\n}\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nexport interface BlackjackState {\n phase: Phase;\n bank: number;\n bet: number;\n player: Card[];\n dealer: Card[];\n outcome: Outcome;\n message: string;\n busy: boolean;\n}\n\nexport function useBlackjack() {\n const shoe = useRef(buildShoe());\n const [phase, setPhase] = useState(\"betting\");\n const [bank, setBank] = useState(loadBank);\n const [bet, setBet] = useState(0);\n const [player, setPlayer] = useState([]);\n const [dealer, setDealer] = useState([]);\n const [outcome, setOutcome] = useState(null);\n const [message, setMessage] = useState(\"チップを置いてベットしてください\");\n const [busy, setBusy] = useState(false);\n\n const persistBank = useCallback((value: number) => {\n setBank(value);\n localStorage.setItem(BANK_KEY, String(value));\n }, []);\n\n const draw = useCallback((): Card => {\n if (shoe.current.length < 15) shoe.current = buildShoe();\n return shoe.current.pop()!;\n }, []);\n\n const addChip = useCallback((value: number) => {\n if (phase !== \"betting\") return;\n if (value > bank - bet) return;\n setBet((b) => b + value);\n setMessage(`ベット: $${bet + value}`);\n }, [phase, bank, bet]);\n\n const clearBet = useCallback(() => {\n if (phase !== \"betting\") return;\n setBet(0);\n setMessage(\"チップを置いてベットしてください\");\n }, [phase]);\n\n const settle = useCallback(\n async (playerCards: Card[], dealerCards: Card[], currentBet: number) => {\n const pv = handValue(playerCards);\n const dv = handValue(dealerCards);\n let result: Outcome;\n let payout = 0; // net change to bank (bet already deducted at deal time)\n\n if (isBust(playerCards)) {\n result = \"lose\";\n } else if (isBlackjack(playerCards) && !isBlackjack(dealerCards)) {\n result = \"blackjack\";\n payout = currentBet + Math.floor(currentBet * 1.5); // 3:2\n } else if (isBust(dealerCards) || pv > dv) {\n result = \"win\";\n payout = currentBet * 2;\n } else if (pv < dv) {\n result = \"lose\";\n } else {\n result = \"push\";\n payout = currentBet; // return the bet\n }\n\n setOutcome(result);\n setPhase(\"result\");\n const msgs: Record, string> = {\n blackjack: `ブラックジャック！ +$${payout - currentBet} 🎉`,\n win: `あなたの勝ち！ +$${payout - currentBet} 🤑`,\n push: \"プッシュ（引き分け）。ベットは返却されます\",\n lose: `ディーラーの勝ち。 -$${currentBet} 😩`,\n };\n setMessage(msgs[result]);\n if (payout > 0) persistBank(bankRef.current + payout);\n },\n [persistBank],\n );\n\n // keep a live ref of bank for async settlement\n const bankRef = useRef(bank);\n bankRef.current = bank;\n\n const dealerPlay = useCallback(\n async (playerCards: Card[], startDealer: Card[], currentBet: number) => {\n setPhase(\"dealer\");\n let dealerCards = [...startDealer];\n setDealer([...dealerCards]);\n await sleep(550);\n // Dealer hits until 17 (stands on all 17)\n while (handValue(dealerCards) < 17) {\n dealerCards = [...dealerCards, draw()];\n setDealer([...dealerCards]);\n await sleep(650);\n }\n await sleep(350);\n await settle(playerCards, dealerCards, currentBet);\n },\n [draw, settle],\n );\n\n const deal = useCallback(async () => {\n if (phase !== \"betting\" || bet <= 0 || busy) return;\n setBusy(true);\n setOutcome(null);\n persistBank(bank - bet); // take the bet\n const currentBet = bet;\n\n const p: Card[] = [];\n const d: Card[] = [];\n setPlayer([]);\n setDealer([]);\n setPhase(\"player\");\n\n // deal in casino order: player, dealer, player, dealer\n p.push(draw());\n setPlayer([...p]);\n await sleep(300);\n d.push(draw());\n setDealer([...d]);\n await sleep(300);\n p.push(draw());\n setPlayer([...p]);\n await sleep(300);\n d.push(draw());\n setDealer([...d]);\n await sleep(450);\n\n setBusy(false);\n\n // Immediate blackjack check\n if (isBlackjack(p) || isBlackjack(d)) {\n await dealerPlay(p, d, currentBet);\n return;\n }\n setMessage(\"ヒット？それともスタンド？\");\n }, [phase, bet, busy, bank, draw, persistBank, dealerPlay]);\n\n const hit = useCallback(async () => {\n if (phase !== \"player\" || busy) return;\n setBusy(true);\n const next = [...player, draw()];\n setPlayer(next);\n await sleep(300);\n setBusy(false);\n if (isBust(next)) {\n await settle(next, dealer, bet);\n } else if (handValue(next) === 21) {\n await dealerPlay(next, dealer, bet);\n }\n }, [phase, busy, player, dealer, bet, draw, settle, dealerPlay]);\n\n const stand = useCallback(async () => {\n if (phase !== \"player\" || busy) return;\n await dealerPlay(player, dealer, bet);\n }, [phase, busy, player, dealer, bet, dealerPlay]);\n\n const nextRound = useCallback(() => {\n setPlayer([]);\n setDealer([]);\n setOutcome(null);\n setBet(0);\n setPhase(\"betting\");\n if (bankRef.current <= 0) {\n persistBank(STARTING_BANK);\n setMessage(`残高がなくなったので $${STARTING_BANK} 補充しました！`);\n } else {\n setMessage(\"チップを置いてベットしてください\");\n }\n }, [persistBank]);\n\n return {\n state: { phase, bank, bet, player, dealer, outcome, message, busy },\n actions: { addChip, clearBet, deal, hit, stand, nextRound },\n } as const;\n}\n",[],[157,227,219],"lib","37d6e092-5ccf-11f1-8c4a-1607ee4eb77e","blackjack.ts","37d6e16e-5ccf-11f1-8c4a-1607ee4eb77e",2,["D",1780218048990],"// Core Blackjack game logic — pure, framework-agnostic.\n\nexport type Suit = \"♠\" | \"♥\" | \"♦\" | \"♣\";\nexport type Rank =\n | \"A\"\n | \"2\"\n | \"3\"\n | \"4\"\n | \"5\"\n | \"6\"\n | \"7\"\n | \"8\"\n | \"9\"\n | \"10\"\n | \"J\"\n | \"Q\"\n | \"K\";\n\nexport interface Card {\n id: string;\n suit: Suit;\n rank: Rank;\n}\n\nexport const SUITS: Suit[] = [\"♠\", \"♥\", \"♦\", \"♣\"];\nexport const RANKS: Rank[] = [\n \"A\",\n \"2\",\n \"3\",\n \"4\",\n \"5\",\n \"6\",\n \"7\",\n \"8\",\n \"9\",\n \"10\",\n \"J\",\n \"Q\",\n \"K\",\n];\n\nexport function isRed(suit: Suit): boolean {\n return suit === \"♥\" || suit === \"♦\";\n}\n\n/** Build a fresh, shuffled multi-deck shoe (6 decks like a real casino). */\nexport function buildShoe(deckCount = 6): Card[] {\n const cards: Card[] = [];\n for (let d = 0; d < deckCount; d++) {\n for (const suit of SUITS) {\n for (const rank of RANKS) {\n cards.push({ id: `${d}-${suit}-${rank}-${Math.random().toString(36).slice(2)}`, suit, rank });\n }\n }\n }\n // Fisher–Yates shuffle\n for (let i = cards.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [cards[i], cards[j]] = [cards[j], cards[i]];\n }\n return cards;\n}\n\nfunction rankValue(rank: Rank): number {\n if (rank === \"A\") return 11;\n if (rank === \"K\" || rank === \"Q\" || rank === \"J\") return 10;\n return parseInt(rank, 10);\n}\n\n/** Compute the best (highest non-busting if possible) hand total. */\nexport function handValue(cards: Card[]): number {\n let total = 0;\n let aces = 0;\n for (const c of cards) {\n total += rankValue(c.rank);\n if (c.rank === \"A\") aces++;\n }\n // Demote aces from 11 to 1 while busting\n while (total > 21 && aces > 0) {\n total -= 10;\n aces--;\n }\n return total;\n}\n\nexport function isBlackjack(cards: Card[]): boolean {\n return cards.length === 2 && handValue(cards) === 21;\n}\n\nexport function isBust(cards: Card[]): boolean {\n return handValue(cards) > 21;\n}\n\n/** Whether a soft total exists (an ace still counted as 11). */\nexport function isSoft(cards: Card[]): boolean {\n let total = 0;\n let aces = 0;\n for (const c of cards) {\n total += rankValue(c.rank);\n if (c.rank === \"A\") aces++;\n }\n return aces > 0 && total <= 21;\n}\n",[],[157,227,229],"37d73bfa-5ccf-11f1-8c4a-1607ee4eb77e",["D",1780218048990],[180,181],[157,227],"400ec6a8-5ccf-11f1-8c4a-1607ee4eb77e","PlayingCard.tsx","400ec770-5ccf-11f1-8c4a-1607ee4eb77e","019e7d43-79e3-70dd-b64d-45d609e561df",3,["D",1780218062781],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { type Card, isRed } from \"../lib/blackjack.ts\";\n\ninterface Props {\n card?: Card;\n faceDown?: boolean;\n // index used to stagger the deal animation\n index?: number;\n}\n\nexport function PlayingCard({ card, faceDown, index = 0 }: Props) {\n const delay = `${index * 0.12}s`;\n\n if (faceDown || !card) {\n return (\n \n

\n \n

\n ♠\n

\n );\n }\n\n const red = isRed(card.suit);\n const color = red ? \"text-rose-600\" : \"text-gray-900\";\n\n return (\n \n {/* top-left corner */}\n

\n {card.rank}\n {card.suit}\n

\n {/* center pip */}\n

\n {card.suit}\n

\n {/* bottom-right corner (rotated) */}\n

\n {card.rank}\n {card.suit}\n

\n );\n}\n",[],[157,249,241],"components","4b87c642-5ccf-11f1-bacf-1607ee4eb77e","Hand.tsx","4b87c714-5ccf-11f1-bacf-1607ee4eb77e",5,["D",1780218082030],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { type Card, handValue } from \"../lib/blackjack.ts\";\nimport { PlayingCard } from \"./PlayingCard.tsx\";\n\ninterface Props {\n label: string;\n cards: Card[];\n // hide the dealer's hole card during the player's turn\n hideHole?: boolean;\n badge?: string | null;\n}\n\nexport function Hand({ label, cards, hideHole, badge }: Props) {\n const visibleCards = hideHole ? cards.slice(0, 1) : cards;\n const shownValue = hideHole ? handValue(cards.slice(0, 1)) : handValue(cards);\n\n return (\n

\n \n {label}\n \n {cards.length > 0 && (\n \n {hideHole ? `${shownValue} +?` : shownValue}\n \n )}\n {badge && (\n \n {badge}\n \n )}\n

\n {cards.length === 0\n ?

\n : cards.map((card, i) => (\n

\n \n

\n ))}\n

\n );\n}\n",[],[157,249,251],"45d17fe0-5ccf-11f1-80ac-1607ee4eb77e","Chip.tsx","45d18076-5ccf-11f1-80ac-1607ee4eb77e",4,["D",1780218072399],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface ChipStyle {\n body: string;\n ring: string;\n text: string;\n}\n\n// Classic casino chip color coding\nconst CHIP_STYLES: Record = {\n 5: { body: \"from-red-500 to-red-700\", ring: \"border-red-200\", text: \"text-white\" },\n 25: { body: \"from-green-500 to-green-700\", ring: \"border-green-200\", text: \"text-white\" },\n 100: { body: \"from-gray-800 to-black\", ring: \"border-gray-400\", text: \"text-amber-300\" },\n 500: { body: \"from-violet-500 to-violet-800\", ring: \"border-violet-200\", text: \"text-white\" },\n};\n\ninterface Props {\n value: number;\n onClick?: () => void;\n disabled?: boolean;\n size?: number;\n}\n\nexport function Chip({ value, onClick, disabled, size = 60 }: Props) {\n const style = CHIP_STYLES[value] ?? CHIP_STYLES[5];\n return (\n \n {/* dashed inner ring like real chips */}\n \n \n \n {value}\n \n \n );\n}\n",[],[157,249,259],"61699ddc-5ccf-11f1-a7e5-1607ee4eb77e","BetControls.tsx","61699eb8-5ccf-11f1-a7e5-1607ee4eb77e",7,["D",1780218118742],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Chip } from \"./Chip.tsx\";\n\ninterface Props {\n bank: number;\n bet: number;\n onAddChip: (value: number) => void;\n onClear: () => void;\n onDeal: () => void;\n}\n\nconst CHIP_VALUES = [5, 25, 100, 500];\n\nexport function BetControls({ bank, bet, onAddChip, onClear, onDeal }: Props) {\n return (\n

\n {CHIP_VALUES.map((v) => (\n onAddChip(v)}\n disabled={v > bank - bet}\n />\n ))}\n

\n \n クリア\n \n \n 配る ▸\n \n

\n );\n}\n",[],[157,249,267],"8fd8f5d2-5ccf-11f1-ac8b-1607ee4eb77e","App.tsx","019e7d43-79e3-70dd-b64d-3de5940817d5",14,["D",1780218196645],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useBlackjack } from \"../lib/useBlackjack.ts\";\nimport { Hand } from \"./Hand.tsx\";\nimport { BetControls } from \"./BetControls.tsx\";\nimport { ActionBar } from \"./ActionBar.tsx\";\n\nexport function App() {\n const { state, actions } = useBlackjack();\n const { phase, bank, bet, player, dealer, outcome, message } = state;\n\n const playerBadge = phase === \"result\" && outcome === \"blackjack\" ? \"BLACKJACK\" : null;\n\n const resultGlow = outcome === \"win\" || outcome === \"blackjack\"\n ? \"shadow-[0_0_60px_-5px_rgba(251,191,36,0.55)]\"\n : outcome === \"lose\"\n ? \"shadow-[0_0_60px_-5px_rgba(244,63,94,0.5)]\"\n : \"\";\n\n return (\n

\n {/* Header */}\n

\n ♠{\" \"}\n \n ROYAL BLACKJACK\n {\" \"}\n ♣\n

\n 残高\n ${bank.toLocaleString()}\n

\n\n {/* The felt table */}\n \n {/* gold inner trim */}\n

\n {/* arc text */}\n

\n Blackjack pays 3 to 2 · Dealer stands on 17\n

\n\n {/* Dealer */}\n \n\n {/* Message banner */}\n

\n \n {message}\n

\n\n {/* Player */}\n \n\n {/* Bet display */}\n {bet > 0 && (\n

\n ベット{\" \"}\n ${bet}\n

\n )}\n

\n\n {/* Controls */}\n

\n {phase === \"betting\"\n ? (\n \n )\n : (\n \n )}\n

\n\n \n

\n );\n}\n",[],[157,249,275],"68786e6e-5ccf-11f1-8c4a-1607ee4eb77e","ActionBar.tsx","68786f4a-5ccf-11f1-8c4a-1607ee4eb77e",8,["D",1780218130583],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport type { Phase } from \"../lib/useBlackjack.ts\";\n\ninterface Props {\n phase: Phase;\n busy: boolean;\n onHit: () => void;\n onStand: () => void;\n onNext: () => void;\n}\n\nexport function ActionBar({ phase, busy, onHit, onStand, onNext }: Props) {\n if (phase === \"player\") {\n return (\n

\n \n ヒット\n \n \n スタンド\n \n

\n );\n }\n\n if (phase === \"result\") {\n return (\n \n 次のゲーム ↻\n \n );\n }\n\n if (phase === \"dealer\") {\n return (\n

\n ディーラーがプレイ中…\n

\n );\n }\n\n return null;\n}\n",[],[157,249,283],"2f50ca00-5ccf-11f1-982a-1607ee4eb77e",["D",1780218034536],[173,174,175,176,177,178],[157,249],["D",1780218034536],[172,179,182,183,184],[157],["D",1780218034536],["D",1789529498250],{"_11":12,"_96":-5},{"_11":12,"_90":91,"_92":-5,"_48":49,"_93":94,"_95":40},{"_29":30,"_13":26,"_20":21,"_27":28,"_31":32,"_33":34,"_83":42,"_84":85,"_86":87,"_88":14,"_89":12},"ctx",{"_76":-5,"_120":335,"_336":337,"_338":339,"_340":40,"_341":40,"_342":40,"_343":53,"_344":-5,"_345":-7,"_346":-7,"_347":57,"_348":40,"_349":40,"_350":-5,"_351":40,"_352":40,"_353":40,"_354":-5},"ENV",{"_306":307,"_308":309,"_310":26,"_311":312,"_313":314,"_315":316,"_317":318,"_319":320,"_321":322,"_323":324,"_325":326,"_327":328,"_329":330,"_331":332,"_333":334},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Branches1

Branches
1