Val Town Greeting Example

\n \n

\n Enter your name:\n \n

\n \n \n \n

\n\n

\n \n View Source\n \n

\n\n \n\n",[],[220],"7653a0fc-0718-11f0-9b9a-569c3dd06744","README.md","f723adff-14ed-42df-b89a-db191e75e9e5",["D",1742646209400],"foo foo foo foo foo foo foo foo foo foo",[],[227],"76539a30-0718-11f0-9b9a-569c3dd06744","index.tsx","9e7aefb5-ca73-48d7-b2dc-5763b560c67b","2c3f6969-28cd-4634-8b8a-fc35ef6dfe4d",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport App from \"./components/App.tsx\";\n\nif (typeof document !== \"undefined\") {\n const root = document.getElementById(\"root\");\n if (!root) {\n throw new Error(\"No root element found\");\n }\n createRoot(root).render();\n}",[],[241,234],"frontend","76539904-0718-11f0-9b9a-569c3dd06744","index.html","4fac70ee-c91f-49ec-bc05-e197e6ebebf4",["D",1742646209400],"\n\n \n \n Blackjack with React + Hono\n \n \n \n \n

\n \n \n \n",[],[241,243],"765396de-0718-11f0-9b9a-569c3dd06744","Scoreboard.tsx","029aad11-fa27-4fbf-80f6-8fb7f4b7e821","64ec1b25-5141-4fe1-b9bf-a41a2c70fb06",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface ScoreboardProps {\n bet: number;\n profit: number;\n bank: number;\n}\n\nconst Scoreboard: React.FC = ({ bet, profit, bank }) => {\n return (\n

Scoreboard

Bet: ${bet}

Profit: ${profit}

Bank: ${bank}

\n );\n};\n\nexport default Scoreboard;",[],[241,257,250],"components","7653959e-0718-11f0-9b9a-569c3dd06744","BoozeMeter.tsx","131469b8-9eb9-4ce7-b6c2-f7bf5c448785",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface BoozeMeterProps {\n level: number;\n}\n\nconst BoozeMeter: React.FC = ({ level }) => {\n const meterWidth = Math.min(level * 10, 100);\n return (\n

Booze Meter

\n \n

Level: {level}

\n \n );\n};\n\nexport default BoozeMeter;",[],[241,257,259],"76539440-0718-11f0-9b9a-569c3dd06744","BoozeButton.tsx","75b0eabd-a957-4056-86e1-85cdbad2ba2f",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface BoozeButtonProps {\n onBooze: () => void;\n disabled: boolean;\n}\n\nconst BoozeButton: React.FC = ({ onBooze, disabled }) => {\n return (\n

\n \n

\n Warning: Boozing may cause unexpected play decisions!\n

\n );\n};\n\nexport default BoozeButton;",[],[241,257,266],"76538ebe-0718-11f0-9b9a-569c3dd06744","BlackjackTable.tsx","6653525b-345f-47a0-815c-cc114a6a50de",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface Card {\n suit: string;\n value: string;\n}\n\ninterface BlackjackTableProps {\n playerHand: Card[];\n dealerHand: Card[];\n playerScore: number;\n dealerScore: number;\n gameOver: boolean;\n loading: boolean;\n onStart: () => void;\n onHit: () => void;\n onStand: () => void;\n}\n\n// Helper function to get card color\nconst getCardColor = (suit: string): string => {\n return ['Hearts', 'Diamonds'].includes(suit) ? 'red' : 'black';\n};\n\n// Helper function to get suit symbol\nconst getSuitSymbol = (suit: string): string => {\n switch (suit) {\n case 'Hearts': return '♥';\n case 'Diamonds': return '♦';\n case 'Clubs': return '♣';\n case 'Spades': return '♠';\n default: return '';\n }\n};\n\n// Component to display a single card\nconst Card: React.FC<{ card: Card, hidden?: boolean }> = ({ card, hidden = false }) => {\n if (hidden) {\n return (\n

\n ?\n

\n );\n }\n\n const color = getCardColor(card.suit);\n const symbol = getSuitSymbol(card.suit);\n\n return (\n

\n {card.value}\n

\n {symbol}\n

\n {card.value}\n

\n );\n};\n\nconst BlackjackTable: React.FC = ({\n playerHand,\n dealerHand,\n playerScore,\n dealerScore,\n gameOver,\n loading,\n onStart,\n onHit,\n onStand,\n}) => {\n return (\n

Blackjack Table

\n \n

Dealer's Hand {gameOver && `(Score: ${dealerScore})`}

\n {dealerHand.length > 0 ? (\n

\n {dealerHand.map((card, index) => (\n

\n ) : (\n

No cards dealt yet

\n )}\n

\n\n

Your Hand (Score: {playerScore})

\n {playerHand.length > 0 ? (\n

\n {playerHand.map((card, index) => (\n \n ))}\n

\n ) : (\n

No cards dealt yet

\n )}\n

\n\n

\n \n \n \n \n \n

\n );\n};\n\nexport default BlackjackTable;",[],[241,257,273],"76538216-0718-11f0-9b9a-569c3dd06744","App.tsx","60ff2054-6f82-410a-a834-9d53774202c2",["D",1742646209400],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport BlackjackTable from \"./BlackjackTable.tsx\";\nimport BoozeButton from \"./BoozeButton.tsx\";\nimport BoozeMeter from \"./BoozeMeter.tsx\";\nimport Scoreboard from \"./Scoreboard.tsx\";\n\n// Define types for our game state\ninterface Card {\n suit: string;\n value: string;\n}\n\ninterface Player {\n id: number;\n name: string;\n hand: Card[];\n score: number;\n isBusted: boolean;\n}\n\ninterface GameState {\n deck: Card[];\n player: Player;\n dealer: Player;\n boozeLevel: number;\n bet: number;\n bank: number;\n profit: number;\n}\n\nconst App: React.FC = () => {\n const [gameState, setGameState] = useState(null);\n const [message, setMessage] = useState(\"No game in progress yet. Click Start!\");\n const [loading, setLoading] = useState(false);\n const [gameOver, setGameOver] = useState(false);\n const [result, setResult] = useState(\"\");\n\n // Fetch the current game state\n const fetchGameState = async () => {\n try {\n const res = await fetch(\"/api/state\");\n const data = await res.json();\n \n if (data.error) {\n setGameState(null);\n setMessage(\"No game in progress yet. Click Start!\");\n setGameOver(false);\n } else {\n setGameState(data);\n setMessage(\"Game in progress...\");\n \n // Check if the game is over\n if (data.player.isBusted) {\n setGameOver(true);\n setResult(\"You busted! Dealer wins.\");\n } else if (data.dealer.isBusted) {\n setGameOver(true);\n setResult(\"Dealer busted! You win!\");\n } else if (data.dealer.score >= 17 && data.player.score > data.dealer.score) {\n setGameOver(true);\n setResult(\"You win!\");\n } else if (data.dealer.score >= 17 && data.player.score < data.dealer.score) {\n setGameOver(true);\n setResult(\"Dealer wins.\");\n } else if (data.dealer.score >= 17 && data.player.score === data.dealer.score) {\n setGameOver(true);\n setResult(\"Push! It's a tie.\");\n }\n }\n } catch (error) {\n setMessage(\"Error contacting the server.\");\n }\n };\n\n // Start a new game\n const startGame = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/start\", { method: \"POST\" });\n const data = await res.json();\n setGameState(data);\n setMessage(\"Game started! Your move.\");\n setGameOver(false);\n setResult(\"\");\n } catch (error) {\n setMessage(\"Error starting the game.\");\n } finally {\n setLoading(false);\n }\n };\n\n // Player hits\n const hit = async () => {\n if (gameOver) return;\n \n setLoading(true);\n try {\n const res = await fetch(\"/api/hit\", { method: \"POST\" });\n const data = await res.json();\n setGameState(data);\n \n if (data.player.isBusted) {\n setGameOver(true);\n setResult(\"You busted! Dealer wins.\");\n }\n } catch (error) {\n setMessage(\"Error hitting.\");\n } finally {\n setLoading(false);\n }\n };\n\n // Player stands\n const stand = async () => {\n if (gameOver) return;\n \n setLoading(true);\n try {\n const res = await fetch(\"/api/stand\", { method: \"POST\" });\n const data = await res.json();\n setGameState(data);\n \n // Determine result\n if (data.dealer.isBusted) {\n setResult(\"Dealer busted! You win!\");\n } else if (data.player.score > data.dealer.score) {\n setResult(\"You win!\");\n } else if (data.player.score < data.dealer.score) {\n setResult(\"Dealer wins.\");\n } else {\n setResult(\"Push! It's a tie.\");\n }\n \n setGameOver(true);\n } catch (error) {\n setMessage(\"Error standing.\");\n } finally {\n setLoading(false);\n }\n };\n\n // Booze up function\n const boozeUp = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/booze\", { method: \"POST\" });\n const data = await res.json();\n setGameState(data);\n \n // If game state changed significantly (like an auto-hit due to booze), check status\n if (data.player.isBusted) {\n setGameOver(true);\n setResult(\"You booze'd too much and busted! Dealer wins.\");\n }\n } catch (error) {\n setMessage(\"Error boozing up.\");\n } finally {\n setLoading(false);\n }\n };\n\n // Initial load\n useEffect(() => {\n fetchGameState();\n }, []);\n\n return (\n

Blackjack with React + Hono

{message}

\n {result &&

{result}

}\n \n \n \n \n \n \n \n \n \n

Booze level increases your bet and risk-taking. Be careful!

\n \n View source\n \n

\n );\n};\n\nexport default App;",[],[241,257,280],"76539814-0718-11f0-9b9a-569c3dd06744",["D",1742646209400],[201,202,203,204,205],[241,257],"76539b70-0718-11f0-9b9a-569c3dd06744",["D",1742646209400],[200,206,207],[241],"76537c44-0718-11f0-9b9a-569c3dd06744","b7d6f4bb-809a-44c9-b3ec-98dac17ddc2c",["D",1742646209400],"http","import { serveFile } from \"https://esm.town/v/std/utils@64-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport gameRouter from \"./controllers/gameController.ts\";\n\nconst app = new Hono();\n\n// Serve static files from frontend/\napp.get(\"/\", async c => {\n return serveFile(\"../frontend/index.html\", import.meta.url);\n});\n\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\n\napp.onError((err, c) => {\n throw err;\n});\n\n// Attach Blackjack routes under /api\napp.route(\"/api\", gameRouter);\n\n// Fire up the server. By default, \"hono run\" listens on port 8787\napp.fire();\n\nexport default app.fetch;",[],[170,212],"76536aec-0718-11f0-9b9a-569c3dd06744","gameEngine.ts","46f71afb-17c8-45e4-8a8d-03fa64bbc5c3",["D",1742646209400],"import { GameState } from \"./models/GameState.ts\";\nimport { Card } from \"./models/Card.ts\";\nimport { createDeck, shuffleDeck } from \"./utils/deckUtils.ts\";\n\nlet currentGame: GameState | null = null;\n\n// Calculate the score of a hand, handling Aces appropriately\nconst calculateScore = (hand: Card[]): number => {\n let score = 0;\n let aces = 0;\n\n for (const card of hand) {\n if (card.value === \"A\") {\n aces++;\n score += 11;\n } else if ([\"K\", \"Q\", \"J\"].includes(card.value)) {\n score += 10;\n } else {\n score += parseInt(card.value);\n }\n }\n\n // Adjust aces from 11 to 1 as needed to avoid busting\n while (score > 21 && aces > 0) {\n score -= 10;\n aces--;\n }\n\n return score;\n};\n\n// Draw a card from the deck\nconst drawCard = (deck: Card[]): Card => {\n if (deck.length === 0) {\n throw new Error(\"Deck is empty!\");\n }\n return deck.pop()!;\n};\n\nexport const startGame = (): GameState => {\n const deck = shuffleDeck(createDeck());\n \n // Initialize game state\n currentGame = {\n deck,\n player: {\n id: 1,\n name: \"Player\",\n hand: [],\n score: 0,\n isBusted: false,\n },\n dealer: {\n id: 0,\n name: \"Dealer\",\n hand: [],\n score: 0,\n isBusted: false,\n },\n boozeLevel: 0,\n bet: 10,\n bank: 1000,\n profit: 0,\n };\n\n // Deal two cards each\n currentGame.player.hand.push(drawCard(deck));\n currentGame.dealer.hand.push(drawCard(deck));\n currentGame.player.hand.push(drawCard(deck));\n currentGame.dealer.hand.push(drawCard(deck));\n\n // Calculate initial scores\n currentGame.player.score = calculateScore(currentGame.player.hand);\n currentGame.dealer.score = calculateScore(currentGame.dealer.hand);\n\n return currentGame;\n};\n\nexport const hit = (): GameState | null => {\n if (!currentGame) return null;\n \n // Draw card for player\n const card = drawCard(currentGame.deck);\n currentGame.player.hand.push(card);\n \n // Recalculate score\n currentGame.player.score = calculateScore(currentGame.player.hand);\n \n // Check if player busted\n if (currentGame.player.score > 21) {\n currentGame.player.isBusted = true;\n \n // Player loses bet\n currentGame.bank -= currentGame.bet;\n currentGame.profit -= currentGame.bet;\n }\n \n return currentGame;\n};\n\nexport const stand = (): GameState | null => {\n if (!currentGame) return null;\n \n // Dealer draws until score is 17 or higher\n while (currentGame.dealer.score < 17) {\n const card = drawCard(currentGame.deck);\n currentGame.dealer.hand.push(card);\n currentGame.dealer.score = calculateScore(currentGame.dealer.hand);\n }\n \n // Check if dealer busted\n if (currentGame.dealer.score > 21) {\n currentGame.dealer.isBusted = true;\n }\n \n // Determine winner and update bank/profit\n if (currentGame.player.isBusted) {\n // Player already lost (handled in hit)\n } else if (currentGame.dealer.isBusted) {\n // Dealer busted, player wins\n currentGame.bank += currentGame.bet;\n currentGame.profit += currentGame.bet;\n } else if (currentGame.player.score > currentGame.dealer.score) {\n // Player wins with higher score\n currentGame.bank += currentGame.bet;\n currentGame.profit += currentGame.bet;\n } else if (currentGame.player.score < currentGame.dealer.score) {\n // Dealer wins with higher score\n currentGame.bank -= currentGame.bet;\n currentGame.profit -= currentGame.bet;\n }\n // Else it's a tie, no money changes hands\n \n return currentGame;\n};\n\n// Get a card's probability of busting (affected by booze level)\nconst getBustProbability = (score: number, boozeLevel: number): number => {\n // Basic probability calculation based on score\n const baseProbability = Math.max(0, (score - 11) / 10);\n \n // Booze increases the probability\n return Math.min(1, baseProbability + (boozeLevel * 0.05));\n};\n\n// Booze up\nexport const boozeUp = (): GameState | null => {\n if (!currentGame) return null;\n \n // Increase booze level\n currentGame.boozeLevel++;\n \n // When booze level increases, there's a chance of a random move\n // Like automatically hitting regardless of the score\n const bustProb = getBustProbability(currentGame.player.score, currentGame.boozeLevel);\n \n // If booze level is high and we have a risky score, maybe auto-hit\n if (currentGame.boozeLevel > 3 && Math.random() < bustProb && currentGame.player.score >= 15) {\n return hit();\n }\n \n return currentGame;\n};\n\n// Return current state\nexport const getState = (): GameState | null => currentGame;",[],[170,302],"7653651a-0718-11f0-9b9a-569c3dd06744","deckUtils.ts","b2ed4cdf-6bf0-4a9c-9270-f3277b089dcc","53ed828f-0cdb-49a0-b913-5172b93e3281",["D",1742646209400],"import { Card } from \"../models/Card.ts\";\n\nconst suits = [\"Hearts\", \"Diamonds\", \"Clubs\", \"Spades\"];\nconst values = [\"A\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\", \"10\", \"J\", \"Q\", \"K\"];\n\nexport const createDeck = (): Card[] => {\n const deck: Card[] = [];\n for (const suit of suits) {\n for (const value of values) {\n deck.push({ suit, value });\n }\n }\n return deck;\n};\n\nexport const shuffleDeck = (deck: Card[]): Card[] => {\n for (let i = deck.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [deck[i], deck[j]] = [deck[j], deck[i]];\n }\n return deck;\n};",[],[170,316,309],"utils","76536858-0718-11f0-9b9a-569c3dd06744",["D",1742646209400],[196],[170,316],"7652e518-0718-11f0-9b9a-569c3dd06744","Player.ts","33b2b650-b939-4b05-a66e-d92237d6b13f","cb00c209-90fc-45bf-87f6-c79c8ab0c6cc",["D",1742646209400],"import { Card } from \"./Card.ts\";\n\nexport interface Player {\n id: number;\n name: string;\n hand: Card[];\n score: number;\n isBusted: boolean;\n}",[],[170,329,322],"models","7652dfa0-0718-11f0-9b9a-569c3dd06744","GameState.ts","87962a73-f426-4c44-bd09-d4b5b23ae4c5",["D",1742646209400],"import { Card } from \"./Card.ts\";\nimport { Player } from \"./Player.ts\";\n\nexport interface GameState {\n deck: Card[];\n player: Player;\n dealer: Player;\n boozeLevel: number;\n bet: number;\n bank: number;\n profit: number;\n}",[],[170,329,331],"7652de4c-0718-11f0-9b9a-569c3dd06744","Card.ts","36f9be6a-40ec-4c3e-a141-37e69862cdd3",["D",1742646209400],"export interface Card {\n suit: string;\n value: string;\n}",[],[170,329,338],"7652e63a-0718-11f0-9b9a-569c3dd06744",["D",1742646209400],[192,193,194],[170,329],["D",1742646209400],[],[170,77,69],["D",1742646209400],[190],[170,77],"76537f5a-0718-11f0-9b9a-569c3dd06744",["D",1742646209400],[189,191,195,197,198],[170],["D",1742472925516],{"_11":12,"_126":75},{"_11":12,"_122":-5,"_74":75,"_31":73,"_123":124,"_125":30},{"_39":40,"_13":16,"_33":36,"_113":80,"_114":63,"_115":116,"_117":84,"_118":80,"_119":42,"_120":14,"_121":12},"ctx",{"_52":-5,"_147":395,"_396":397,"_398":399,"_400":30,"_401":30,"_402":30,"_403":24,"_404":-5,"_405":-7,"_406":-7,"_407":26,"_408":30,"_409":30,"_410":-5,"_411":30,"_412":30,"_413":30,"_414":-5},"ENV",{"_366":367,"_368":369,"_370":64,"_371":372,"_373":374,"_375":376,"_377":378,"_379":380,"_381":382,"_383":384,"_385":386,"_387":388,"_389":390,"_391":392,"_393":394},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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"]

History · controllers