diff --git a/src/components/CrapsGame.tsx b/src/components/CrapsGame.tsx index d44e16f..2cf1767 100644 --- a/src/components/CrapsGame.tsx +++ b/src/components/CrapsGame.tsx @@ -8,36 +8,42 @@ import { Switch } from '@/components/ui/switch'; import { Slider } from '@/components/ui/slider'; import { Dice1, Dice2, Dice3, Dice4, Dice5, Dice6, RotateCcw, Settings, Play } from 'lucide-react'; import SocialShare from '@/components/SocialShare'; - interface CrapsGameProps { showSocialShare?: boolean; } - const getDiceIcon = (value: number) => { switch (value) { - case 1: return ; - case 2: return ; - case 3: return ; - case 4: return ; - case 5: return ; - case 6: return ; - default: return ; + case 1: + return ; + case 2: + return ; + case 3: + return ; + case 4: + return ; + case 5: + return ; + case 6: + return ; + default: + return ; } }; - -const CrapsGame: React.FC = ({ showSocialShare = false }) => { +const CrapsGame: React.FC = ({ + showSocialShare = false +}) => { const [dice1, setDice1] = useState(null); const [dice2, setDice2] = useState(null); const [isRolling, setIsRolling] = useState(false); const [gameResult, setGameResult] = useState<'win' | 'lose' | 'continue' | null>(null); const [rollCount, setRollCount] = useState(0); - + // Custom rules state const [customWinSums, setCustomWinSums] = useState([7, 11]); const [customLoseSums, setCustomLoseSums] = useState([2, 3, 12]); const [isCustomRules, setIsCustomRules] = useState(false); const [isRulesModalOpen, setIsRulesModalOpen] = useState(false); - + // Simulation state const [simulationRounds, setSimulationRounds] = useState([10]); const [isSimulating, setIsSimulating] = useState(false); @@ -55,25 +61,22 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { totalTurns: number; completedGames: number; } | null>(null); - const rollDice = () => { setIsRolling(true); setGameResult(null); - + // Simulate rolling animation setTimeout(() => { const newDice1 = Math.floor(Math.random() * 6) + 1; const newDice2 = Math.floor(Math.random() * 6) + 1; const sum = newDice1 + newDice2; - setDice1(newDice1); setDice2(newDice2); setRollCount(prev => prev + 1); - + // Determine game result based on current rules const winSums = isCustomRules ? customWinSums : [7, 11]; const loseSums = isCustomRules ? customLoseSums : [2, 3, 12]; - if (loseSums.includes(sum)) { setGameResult('lose'); } else if (winSums.includes(sum)) { @@ -81,29 +84,36 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { } else { setGameResult('continue'); } - setIsRolling(false); }, 1000); }; - const simulateGame = () => { const winSums = isCustomRules ? customWinSums : [7, 11]; const loseSums = isCustomRules ? customLoseSums : [2, 3, 12]; - let turns = 1; let point: number | null = null; - while (true) { const die1 = Math.floor(Math.random() * 6) + 1; const die2 = Math.floor(Math.random() * 6) + 1; const sum = die1 + die2; - if (point === null) { // First roll (come out roll) if (loseSums.includes(sum)) { - return { result: 'lose', turns, die1, die2, sum }; + return { + result: 'lose', + turns, + die1, + die2, + sum + }; } else if (winSums.includes(sum)) { - return { result: 'win', turns, die1, die2, sum }; + return { + result: 'win', + turns, + die1, + die2, + sum + }; } else { point = sum; turns++; @@ -111,50 +121,63 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { } else { // Subsequent rolls if (sum === point) { - return { result: 'win', turns, die1, die2, sum }; + return { + result: 'win', + turns, + die1, + die2, + sum + }; } else if (sum === 7) { - return { result: 'lose', turns, die1, die2, sum }; + return { + result: 'lose', + turns, + die1, + die2, + sum + }; } else { turns++; } } } }; - const simulateGameSlow = async (gameNumber: number) => { const winSums = isCustomRules ? customWinSums : [7, 11]; const loseSums = isCustomRules ? customLoseSums : [2, 3, 12]; - let turns = 1; let point: number | null = null; - while (true) { // Show rolling animation setIsRolling(true); await new Promise(resolve => setTimeout(resolve, 500)); - const die1 = Math.floor(Math.random() * 6) + 1; const die2 = Math.floor(Math.random() * 6) + 1; const sum = die1 + die2; - + // Update dice display setDice1(die1); setDice2(die2); setIsRolling(false); - + // Wait to show the result await new Promise(resolve => setTimeout(resolve, 800)); - if (point === null) { // First roll (come out roll) if (loseSums.includes(sum)) { setGameResult('lose'); await new Promise(resolve => setTimeout(resolve, 1000)); - return { result: 'lose', turns }; + return { + result: 'lose', + turns + }; } else if (winSums.includes(sum)) { setGameResult('win'); await new Promise(resolve => setTimeout(resolve, 1000)); - return { result: 'win', turns }; + return { + result: 'win', + turns + }; } else { setGameResult('continue'); point = sum; @@ -166,11 +189,17 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { if (sum === point) { setGameResult('win'); await new Promise(resolve => setTimeout(resolve, 1000)); - return { result: 'win', turns }; + return { + result: 'win', + turns + }; } else if (sum === 7) { setGameResult('lose'); await new Promise(resolve => setTimeout(resolve, 1000)); - return { result: 'lose', turns }; + return { + result: 'lose', + turns + }; } else { setGameResult('continue'); turns++; @@ -179,7 +208,6 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { } } }; - const runSimulation = async () => { setIsSimulating(true); setCurrentSimulationGame(0); @@ -188,20 +216,23 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { let wins = 0; let losses = 0; let totalTurns = 0; - if (slowMode) { // Initialize live stats for slow mode - setLiveSimulationStats({ wins: 0, losses: 0, totalTurns: 0, completedGames: 0 }); - + setLiveSimulationStats({ + wins: 0, + losses: 0, + totalTurns: 0, + completedGames: 0 + }); + // Slow mode: simulate visually for (let i = 0; i < numGames; i++) { setCurrentSimulationGame(i + 1); setGameResult(null); const game = await simulateGameSlow(i + 1); - if (game.result === 'win') wins++; - else losses++; + if (game.result === 'win') wins++;else losses++; totalTurns += game.turns; - + // Update live stats setLiveSimulationStats({ wins, @@ -209,7 +240,7 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { totalTurns, completedGames: i + 1 }); - + // Brief pause between games await new Promise(resolve => setTimeout(resolve, 500)); } @@ -217,10 +248,9 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { // Fast mode: simulate in background for (let i = 0; i < numGames; i++) { const game = simulateGame(); - if (game.result === 'win') wins++; - else losses++; + if (game.result === 'win') wins++;else losses++; totalTurns += game.turns; - + // Add a small delay every 10 games to show progress if (i % 10 === 0) { setCurrentSimulationGame(i + 1); @@ -228,7 +258,6 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { } } } - setSimulationResults({ wins, losses, @@ -239,66 +268,52 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { setLiveSimulationStats(null); setIsSimulating(false); }; - const resetGame = () => { setDice1(null); setDice2(null); setGameResult(null); setSimulationResults(null); }; - const sum = dice1 && dice2 ? dice1 + dice2 : null; - const getResultMessage = () => { if (!gameResult) return null; - switch (gameResult) { case 'win': - return ( -
+ return
🎉 You Win! 🎉

Rolling {sum} on the first throw wins immediately!

-
- ); +
; case 'lose': - return ( -
+ return
💸 You Lose! 💸

Rolling {sum} on the first throw loses immediately!

-
- ); +
; case 'continue': - return ( -
+ return
🎲 Game Continues 🎲

Your point is {sum}. Keep playing to win or lose!

-
- ); +
; default: return null; } }; - - return ( -
+ return
Craps: An Exploration - - Roll two dice and see what happens on the opening throw of craps! - + In the game of Craps, we roll two dice, and note the sum S. In the traditional game, if S is 2, 3, or 12, you lose immediately; if the S is 7 or 11, you win immediately, and the game continues otherwise. {/* Simulation Controls */} @@ -312,52 +327,27 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => {
- +
- +
- - {(simulationResults || liveSimulationStats) && ( -
+ {(simulationResults || liveSimulationStats) &&
{liveSimulationStats ? liveSimulationStats.wins : simulationResults!.wins}
Wins
- {liveSimulationStats - ? `(${((liveSimulationStats.wins / Math.max(liveSimulationStats.completedGames, 1)) * 100).toFixed(1)}%)` - : `(${((simulationResults!.wins / simulationResults!.totalGames) * 100).toFixed(1)}%)` - } + {liveSimulationStats ? `(${(liveSimulationStats.wins / Math.max(liveSimulationStats.completedGames, 1) * 100).toFixed(1)}%)` : `(${(simulationResults!.wins / simulationResults!.totalGames * 100).toFixed(1)}%)`}
@@ -366,26 +356,19 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => {
Losses
- {liveSimulationStats - ? `(${((liveSimulationStats.losses / Math.max(liveSimulationStats.completedGames, 1)) * 100).toFixed(1)}%)` - : `(${((simulationResults!.losses / simulationResults!.totalGames) * 100).toFixed(1)}%)` - } + {liveSimulationStats ? `(${(liveSimulationStats.losses / Math.max(liveSimulationStats.completedGames, 1) * 100).toFixed(1)}%)` : `(${(simulationResults!.losses / simulationResults!.totalGames * 100).toFixed(1)}%)`}
- {liveSimulationStats - ? (liveSimulationStats.totalTurns / Math.max(liveSimulationStats.completedGames, 1)).toFixed(1) - : simulationResults!.averageTurns.toFixed(1) - } + {liveSimulationStats ? (liveSimulationStats.totalTurns / Math.max(liveSimulationStats.completedGames, 1)).toFixed(1) : simulationResults!.averageTurns.toFixed(1)}
Avg Turns
{liveSimulationStats ? `(${liveSimulationStats.completedGames} games)` : 'per game'}
-
- )} +
} @@ -413,66 +396,53 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => {

Loss Sums

- {Array.from({ length: 11 }, (_, i) => i + 2).map((sum) => ( -
- { - if (checked) { - setCustomLoseSums([...customLoseSums.filter(s => s !== sum), sum]); - setCustomWinSums(customWinSums.filter(s => s !== sum)); - } else { - setCustomLoseSums(customLoseSums.filter(s => s !== sum)); - } - }} - /> + {Array.from({ + length: 11 + }, (_, i) => i + 2).map(sum =>
+ { + if (checked) { + setCustomLoseSums([...customLoseSums.filter(s => s !== sum), sum]); + setCustomWinSums(customWinSums.filter(s => s !== sum)); + } else { + setCustomLoseSums(customLoseSums.filter(s => s !== sum)); + } + }} /> -
- ))} +
)}

Win Sums

- {Array.from({ length: 11 }, (_, i) => i + 2).map((sum) => ( -
- { - if (checked) { - setCustomWinSums([...customWinSums.filter(s => s !== sum), sum]); - setCustomLoseSums(customLoseSums.filter(s => s !== sum)); - } else { - setCustomWinSums(customWinSums.filter(s => s !== sum)); - } - }} - /> + {Array.from({ + length: 11 + }, (_, i) => i + 2).map(sum =>
+ { + if (checked) { + setCustomWinSums([...customWinSums.filter(s => s !== sum), sum]); + setCustomLoseSums(customLoseSums.filter(s => s !== sum)); + } else { + setCustomWinSums(customWinSums.filter(s => s !== sum)); + } + }} /> -
- ))} +
)}
- -
@@ -483,11 +453,11 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => {
Immediate Loss -

{isCustomRules ? (customLoseSums.length > 0 ? customLoseSums.join(', ') : 'None') : 'Rolling 2, 3, or 12'}

+

{isCustomRules ? customLoseSums.length > 0 ? customLoseSums.join(', ') : 'None' : 'Rolling 2, 3, or 12'}

Immediate Win -

{isCustomRules ? (customWinSums.length > 0 ? customWinSums.join(', ') : 'None') : 'Rolling 7 or 11'}

+

{isCustomRules ? customWinSums.length > 0 ? customWinSums.join(', ') : 'None' : 'Rolling 7 or 11'}

Game Continues @@ -525,11 +495,7 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => {
- {sum ? ( -
{sum}
- ) : ( -
- )} + {sum ?
{sum}
:
}

Total

@@ -545,18 +511,10 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { {/* Controls */}
- - @@ -599,17 +557,9 @@ const CrapsGame: React.FC = ({ showSocialShare = false }) => { - {showSocialShare && ( -
- -
- )} -
- ); + {showSocialShare &&
+ +
} +
; }; - export default CrapsGame; \ No newline at end of file