);\n }\n return dots;\n };\n\n return (\n

\n {renderDots()}\n

\n );\n};\n\n// Main game component\nconst Game: React.FC = () => {\n const [gameState, setGameState] = useState({\n balance: 1000,\n currentBet: null,\n betAmount: 100,\n lastResult: null,\n isRolling: false,\n autoMode: false,\n countdown: 15,\n autoRollInterval: null\n });\n\n const [diceValues, setDiceValues] = useState({ dice1: 1, dice2: 1, dice3: 1, sum: 3 });\n const [showResult, setShowResult] = useState(false);\n\n // Auto-roll countdown effect\n useEffect(() => {\n let countdownInterval: number;\n \n if (gameState.autoMode && gameState.currentBet && !gameState.isRolling && gameState.balance >= gameState.betAmount) {\n countdownInterval = setInterval(() => {\n setGameState(prev => {\n if (prev.countdown <= 1) {\n // Time's up, roll the dice\n rollDiceHandler();\n return { ...prev, countdown: 15 };\n }\n return { ...prev, countdown: prev.countdown - 1 };\n });\n }, 1000);\n } else if (!gameState.autoMode) {\n // Reset countdown when auto mode is off\n setGameState(prev => ({ ...prev, countdown: 15 }));\n }\n\n return () => {\n if (countdownInterval) {\n clearInterval(countdownInterval);\n }\n };\n }, [gameState.autoMode, gameState.currentBet, gameState.isRolling, gameState.balance, gameState.betAmount]);\n\n // Auto number change effect (changes dice display every second when in auto mode)\n useEffect(() => {\n let numberChangeInterval: number;\n \n if (gameState.autoMode && !gameState.isRolling) {\n numberChangeInterval = setInterval(() => {\n setDiceValues(rollDice());\n }, 1000);\n }\n\n return () => {\n if (numberChangeInterval) {\n clearInterval(numberChangeInterval);\n }\n };\n }, [gameState.autoMode, gameState.isRolling]);\n\n const placeBet = (betType: BetType) => {\n if (gameState.isRolling || gameState.balance < gameState.betAmount) return;\n \n setGameState(prev => ({\n ...prev,\n currentBet: betType,\n balance: prev.balance - prev.betAmount,\n countdown: 15 // Reset countdown when placing bet\n }));\n };\n\n const rollDiceHandler = async () => {\n if (!gameState.currentBet || gameState.isRolling) return;\n\n setGameState(prev => ({ ...prev, isRolling: true }));\n setShowResult(false);\n\n // Animate dice rolling\n const rollDuration = 1000;\n const rollInterval = setInterval(() => {\n setDiceValues(rollDice());\n }, 100);\n\n setTimeout(() => {\n clearInterval(rollInterval);\n \n // Final roll\n const finalRoll = rollDice();\n setDiceValues(finalRoll);\n \n // Calculate result\n const won = checkWin(finalRoll.sum, gameState.currentBet!);\n const payout = calculatePayout(gameState.betAmount, gameState.currentBet!, won);\n \n const result: GameResult = {\n roll: finalRoll,\n bet: gameState.currentBet!,\n won,\n payout\n };\n\n setGameState(prev => ({\n ...prev,\n isRolling: false,\n balance: prev.balance + payout,\n lastResult: result,\n currentBet: gameState.autoMode ? prev.currentBet : null, // Keep bet in auto mode\n countdown: 15 // Reset countdown after roll\n }));\n\n setShowResult(true);\n }, rollDuration);\n };\n\n const resetGame = () => {\n setGameState({\n balance: 1000,\n currentBet: null,\n betAmount: 100,\n lastResult: null,\n isRolling: false,\n autoMode: false,\n countdown: 15,\n autoRollInterval: null\n });\n setDiceValues({ dice1: 1, dice2: 1, dice3: 1, sum: 3 });\n setShowResult(false);\n };\n\n const adjustBetAmount = (amount: number) => {\n setGameState(prev => ({\n ...prev,\n betAmount: Math.max(10, Math.min(prev.balance, amount))\n }));\n };\n\n const toggleAutoMode = () => {\n setGameState(prev => ({\n ...prev,\n autoMode: !prev.autoMode,\n countdown: 15,\n currentBet: prev.autoMode ? null : prev.currentBet // Clear bet when turning off auto mode\n }));\n };\n\n return (\n

\n {/* Header */}\n

🎲 3 Die 7 Up 7 Down 🎲

Predict the sum of three dice!

\n\n {/* Balance and Bet Amount */}\n

\n Balance: \n ${gameState.balance}\n

\n Bet Amount:\n

\n \n \n ${gameState.betAmount}\n \n \n

\n\n {/* Dice Display */}\n

\n \n \n \n

\n\n {/* Sum Display */}\n

Sum: \n \n {diceValues.sum}\n \n

\n \n {/* Auto Mode Status and Countdown */}\n {gameState.autoMode && (\n

\n 🤖 Auto Mode Active - Numbers changing every second!\n

\n {gameState.currentBet && !gameState.isRolling && (\n

\n Next auto-roll in: \n \n {gameState.countdown}s\n \n

\n )}\n {!gameState.currentBet && (\n

\n Place a bet to start auto-rolling!\n

\n )}\n

\n\n {/* Betting Options */}\n

\n {(['7-down', 'lucky-7', '7-up'] as BetType[]).map((betType) => (\n placeBet(betType)}\n disabled={gameState.isRolling || gameState.balance < gameState.betAmount}\n className={`bet-button p-6 rounded-xl text-white font-bold text-lg transition-all ${\n gameState.currentBet === betType \n ? 'selected bg-blue-600 border-2 border-blue-400' \n : 'bg-white/10 hover:bg-white/20 border-2 border-transparent'\n } ${\n gameState.isRolling || gameState.balance < gameState.betAmount \n ? 'disabled' \n : ''\n }`}\n >\n

{getBetDisplayName(betType)}

Pays {getBetOdds(betType)}

\n \n ))}\n

\n\n {/* Roll Button and Auto Mode Toggle */}\n

\n {/* Manual Roll Button */}\n \n {gameState.isRolling ? '🎲 Rolling...' : '🎲 Roll Dice!'}\n \n\n {/* Auto Mode Toggle */}\n

\n \n {gameState.autoMode ? '⏹️ Stop Auto Run' : '▶️ Start Auto Run (15s)'}\n \n

\n\n {/* Result Display */}\n {showResult && gameState.lastResult && (\n

\n {gameState.lastResult.won ? '🎉 You Won! 🎉' : '😔 You Lost 😔'}\n

\n You bet on {getBetDisplayName(gameState.lastResult.bet)}\n

\n Dice sum was {gameState.lastResult.roll.sum}\n

\n {gameState.lastResult.won && (\n

\n Won ${gameState.lastResult.payout}!\n

\n )}\n

\n )}\n\n {/* Game Over / Reset */}\n {gameState.balance < 10 && (\n

Game Over!

\n \n Start New Game\n \n

\n )}\n\n {/* Game Rules */}\n

Game Rules:

• 7 Down (3-6): Sum is less than 7 - Pays 1:1
• Lucky 7: Sum is exactly 7 - Pays 4:1
• 7 Up (8-18): Sum is greater than 7 - Pays 1:1

\n );\n};\n\n// Initialize the app\nconst root = createRoot(document.getElementById('root')!);\nroot.render();","deleted","label",[168,149],"frontend","permalink","https://www.val.town/x/Ral/Paresh/code/frontend/index.tsx","extension","actionData","errors"]