class BlackjackGame extends Phaser.Scene { constructor() { super(); this.GameState = { BETTING: 'betting', PLAYING: 'playing', DEALER_TURN: 'dealerTurn', GAME_OVER: 'gameover', BANKRUPT: 'bankrupt' }; this.initializeGameVariables(); this.canHit = true; // New property to track if hit can be performed this.playerName = 'Player'; this.highScores = []; this.gameId = 'blackjack_v1'; // Unique identifier for this game this.playerId = this.generatePlayerId(); this.totalPotText = null; // Initialize totalPotText property this.winEffectText = null; // New property to store win effect text } initializeGameVariables() { this.money = 1000; this.bet = 0; this.gameState = this.GameState.BETTING; this.playerCards = [ [] ]; this.dealerCards = [ [] ]; this.playerSums = [0]; this.dealerSums = [0]; this.currentHand = 0; this.currentSliderBet = 0; this.highScores = []; // Clear high scores when initializing game variables } formatCurrency(amount) { return `$${amount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}`; } preload() { this.load.image('table', 'https://play.rosebud.ai/assets/Untitled29_20240908133441.png?LeAW'); this.load.image('chip', 'https://play.rosebud.ai/assets/single poker chip.png?kYnk'); this.load.image('card', 'https://play.rosebud.ai/assets/ca8adc5c-eff2-4e75-b862-4add9851e835.png?8fr9'); this.load.image('cardBack', 'https://play.rosebud.ai/assets/697a5238-ae90-4fdd-bb77-2e12f5934bae.png?4cAW'); this.load.image('button', 'https://play.rosebud.ai/assets/button.png?xyz123'); this.load.script('webfont', 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js'); } create() { this.loadGameState(); this.add.image(400, 300, 'table').setDisplaySize(800, 600); this.loadFonts(() => { this.initializeUIElements(); this.initializeGameState(); this.setupEventListeners(); this.setElementDepths(); this.createHighScoreDisplay(); }); } createHighScoreDisplay() { this.highScoreText = this.add.text(10, 40, '', { fontFamily: 'Roboto', fontSize: '14px', color: '#ffffff', align: 'left' }).setOrigin(0, 0); this.updateHighScoreDisplay(); } setElementDepths() { [this.sliderTrack, this.sliderFill, this.sliderHandle, this.sliderHandleGlow, this.betButton, this.hitButton, this.stayButton, this.restartButton, this.messageText, this.betText, this.moneyText, this.totalPotText] .forEach((element, index) => element?.setDepth?.(3000 + index)); [this.playerCardSprites, this.dealerCardSprites].forEach(sprites => sprites?.forEach(sprite => sprite.setDepth(3100))); } initializeUIElements() { this.createExplanationText(); // line 140. this.createExplanationText1(); this.createGameTexts(); this.createButtons(); this.createBetSlider(); this.createTotalPotText(); this.createHandTexts(); this.createMoneyText(); this.updateGameState(this.GameState.BETTING); } createMoneyText() { this.moneyText = this.add.text(10, 10, '', { fontFamily: 'Roboto', fontSize: '24px', fontStyle: 'bold', color: '#ffd700', backgroundColor: 'rgba(0,0,0,0.7)', padding: { left: 10, right: 10, top: 5, bottom: 5 } }).setOrigin(0, 0); this.updateMoneyText(); } updateMoneyText() { this.safeSetText(this.moneyText, `Balance: ${this.formatCurrency(this.money)}`); } createHandTexts() { this.playerCardsText = []; this.dealerCardsText = []; this.playerHandSeparators = []; this.dealerHandSeparators = []; } createText(x, y, text, style) { return this.add.text(x, y, text, { fontFamily: 'Roboto', ...style, shadow: { offsetX: 2, offsetY: 2, color: '#000000', blur: 4, fill: true } }).setOrigin(0.5).setDepth(2000); } loadFonts(callback) { WebFont.load({ google: { families: ['Roboto'] }, active: callback }); } initializeGameState() { this.updateGameState(this.GameState.BETTING); this.updateAllDisplays(); } setupEventListeners() { this.time.addEvent({ delay: 1000, callback: this.updateTotalPotText, callbackScope: this, loop: true }); } createExplanationText() { this.totalPotText = this.add.text(580, 6, 'Goal: Get as close to 21 as possible. [21 with 2 cards pays 3:2]', { fontFamily: 'Roboto', fontSize: '14px', color: '#ffffff', stroke: '#000000', strokeThickness: 1 }).setOrigin(0.5, 0.5).setDepth(2000) } createExplanationText1() { this.totalPotText = this.add.text(647, 24, '[Dealer: Hits on 16, Stands on 17 always]', { fontFamily: 'Roboto', fontSize: '14px', color: '#ffffff', stroke: '#000000', strokeThickness: 1 }).setOrigin(0.5, 0.5).setDepth(2000) } createTotalPotText() { this.totalPotText = this.add.text(400, 300, '', { fontFamily: 'Roboto', fontSize: '28px', fontStyle: 'bold', color: '#00ff00', stroke: '#000000', strokeThickness: 3 }).setOrigin(0.5, 0.5).setDepth(2000); this.updateTotalPotText(); this.time.addEvent({ delay: 100, callback: this.updateTotalPotText, callbackScope: this, loop: true }); } updateTotalPotText() { const totalPot = this.gameState === this.GameState.BETTING ? this.currentSliderBet * 2 : this.bet * 2; if (this.totalPotText) { this.safeSetText(this.totalPotText, `Pot: $${this.formatNumberWithCommas(totalPot)}`); this.safeSetTextPosition(this.totalPotText, 400, 300); safeSetVisible(this.totalPotText, true); } } createBetSlider() { const [sliderWidth, sliderHeight, trackColor, fillColor] = [400, 20, 0x888888, 0x00ff00]; this.sliderTrack = this.add.rectangle(400, 530, sliderWidth, sliderHeight, trackColor).setOrigin(0.5).setDepth(2000); this.sliderFill = this.add.rectangle(400 - sliderWidth / 2, 530, 0, sliderHeight, fillColor).setOrigin(0, 0.5).setDepth(2001); this.sliderHandle = this.add.sprite(400 - sliderWidth / 2, 530, 'chip').setScale(0.06).setInteractive({ draggable: true, useHandCursor: true }).setDepth(2003); this.sliderHandleGlow = this.add.sprite(this.sliderHandle.x, this.sliderHandle.y, 'chip').setScale(0.08).setTint(0xffff00).setAlpha(0).setDepth(2002); this.createSliderTicks(sliderWidth); this.setupSliderEvents(sliderWidth); this.updateSliderValue(0); this.setupContinuousGlowUpdate(); } createSliderTicks(sliderWidth) { this.sliderTicks = []; const tickCount = Math.floor(this.money / 100) + 1; for (let i = 0; i < tickCount; i++) { const x = this.sliderTrack.x - sliderWidth / 2 + (i / (tickCount - 1)) * sliderWidth; const tick = this.add.rectangle(x, 530, 2, 10, 0xffffff).setOrigin(0.5).setAlpha(0.5).setDepth(2002); this.sliderTicks.push(tick); } } hideSliderTicks() { this.sliderTicks.forEach(tick => safeSetVisible(tick, false)); } showSliderTicks() { this.sliderTicks.forEach(tick => safeSetVisible(tick, true)); } setupSliderEvents(sliderWidth) { if (!this.sliderHandle || !this.sliderTrack || !this.sliderFill) return; let lastBet = 0; let isDragging = false; this.sliderHandle.on('dragstart', () => { isDragging = true; lastBet = this.currentSliderBet; }); this.sliderHandle.on('drag', (pointer, dragX) => { if (!isDragging) return; const minX = this.sliderTrack.x - sliderWidth / 2; const maxX = this.sliderTrack.x + sliderWidth / 2; const newX = Phaser.Math.Clamp(dragX, minX, maxX); this.sliderHandle.x = newX; this.updateSliderHandleGlow(); this.sliderFill.width = newX - minX; this.updateBetFromSlider(false); }); this.sliderHandle.on('dragend', () => { isDragging = false; this.snapSliderToNearestHundred(); const betChange = this.currentSliderBet - lastBet; if (betChange !== 0) { console.log(`Bet changed by ${betChange > 0 ? '+' : '-'}$${Math.abs(betChange)}`); } }); this.input.on('pointerup', () => { isDragging = false; }); this.sliderTrack.setInteractive().on('pointerdown', (pointer) => { const minX = this.sliderTrack.x - sliderWidth / 2; const maxX = this.sliderTrack.x + sliderWidth / 2; const newX = Phaser.Math.Clamp(pointer.x, minX, maxX); this.sliderHandle.x = newX; if (this.sliderHandleGlow) { this.sliderHandleGlow.x = newX; } this.sliderFill.width = newX - minX; this.snapSliderToNearestHundred(); }); this.sliderHandle.on('pointerover', () => { this.sliderHandle.setScale(0.065); if (this.sliderHandleGlow) { this.tweens.add({ targets: this.sliderHandleGlow, alpha: 0.5, duration: 200 }); } }); this.sliderHandle.on('pointerout', () => { if (!isDragging) { this.sliderHandle.setScale(0.06); if (this.sliderHandleGlow) { this.tweens.add({ targets: this.sliderHandleGlow, alpha: 0, duration: 200 }); } } }); } updateSliderHandleGlow() { if (this.sliderHandle && this.sliderHandleGlow) { requestAnimationFrame(() => { this.sliderHandleGlow.x = this.sliderHandle.x; this.sliderHandleGlow.y = this.sliderHandle.y; }); } if (this.sliderHandleText) { requestAnimationFrame(() => { this.sliderHandleText.x = this.sliderHandle.x; this.sliderHandleText.y = this.sliderHandle.y; }); } } setupContinuousGlowUpdate() { this.time.addEvent({ delay: 100, callback: this.updateSliderHandleGlow, callbackScope: this, loop: true }); } updateBetFromSlider(updateBet = false, isGameRestart = false) { if (!this.sliderTrack || !this.sliderHandle) return; const minX = this.sliderTrack.x - this.sliderTrack.width / 2; const maxX = this.sliderTrack.x + this.sliderTrack.width / 2; const percentage = Phaser.Math.Clamp((this.sliderHandle.x - minX) / (maxX - minX), 0, 1); const maxSliderBet = Math.max(this.money, 100); let newBet = Math.round(percentage * maxSliderBet / 100) * 100; newBet = Phaser.Math.Clamp(newBet, 0, Math.min(maxSliderBet, this.money)); if (this.currentSliderBet !== newBet || updateBet) { const oldBet = this.currentSliderBet; this.currentSliderBet = newBet; if (updateBet && !isGameRestart) { const betChange = this.currentSliderBet - oldBet; if (betChange !== 0) { console.log(`Bet changed by ${betChange > 0 ? '+' : '-'}$${Math.abs(betChange)}`); } this.adjustBet(this.currentSliderBet - this.bet); } this.updateBetDisplay(); this.updateTickMarks(percentage); this.updateBetButtonState(this.gameState); if (!isGameRestart && this.sliderHandleGlow) { this.tweens.add({ targets: this.sliderHandleGlow, alpha: { from: 0.8, to: 0 }, duration: 300, yoyo: true }); } if (this.sliderTrackText) { this.safeSetText(this.sliderTrackText, `$${this.formatNumberWithCommas(0)}`); } } } updateBetButtonState(newBet) { if (this.betButton && typeof this.betButton.setInteractive === 'function') { const canBet = this.gameState === this.GameState.BETTING && newBet > 0 && newBet <= this.money; this.betButton.setInteractive(canBet ? {} : false); this.betButton.setAlpha(canBet ? 1 : 0.5); } } updateTickMarks(percentage) { this.sliderTicks.forEach((tick, index) => { const tickPercentage = index / 10; tick.setAlpha(tickPercentage <= percentage ? 1 : 0.5); }); } updateSliderValue(bet) { const minX = this.sliderTrack.x - this.sliderTrack.width / 2; const maxX = this.sliderTrack.x + this.sliderTrack.width / 2; const maxSliderBet = Math.max(this.money, 100); const adjustedBet = Math.max(0, Math.min(bet, maxSliderBet)); const percentage = adjustedBet / maxSliderBet; const newX = minX + percentage * (maxX - minX); this.sliderHandle.x = newX; this.sliderFill.width = newX - minX; this.currentSliderBet = adjustedBet; this.updateBetDisplay(); this.updateSliderHandleGlow(); console.log(`Slider updated: Current bet $${this.currentSliderBet}, Percentage: ${percentage * 100}%`); } snapSliderToNearestHundred() { const minX = this.sliderTrack.x - this.sliderTrack.width / 2; const maxX = this.sliderTrack.x + this.sliderTrack.width / 2; const maxSliderBet = Math.max(this.money, 100); const percentage = (this.sliderHandle.x - minX) / (maxX - minX); const snappedBet = Math.round(percentage * maxSliderBet / 100) * 100; const snappedPercentage = snappedBet / maxSliderBet; const snappedX = minX + snappedPercentage * (maxX - minX); this.tweens.add({ targets: this.sliderHandle, x: snappedX, duration: 100, ease: 'Bounce.easeOut', onUpdate: () => { this.sliderHandleGlow.x = this.sliderHandle.x; this.sliderFill.width = this.sliderHandle.x - minX; }, onComplete: () => { this.updateSliderValue(snappedBet); this.updateBetFromSlider(true); } }); } hideSlider() { this.sliderTrack.setVisible(false); this.sliderFill.setVisible(false); this.sliderHandle.setVisible(false); } showSlider() { const sliderElements = [this.sliderTrack, this.sliderFill, this.sliderHandle]; sliderElements.forEach(element => { safeSetVisible(element, true); }); } showSliderHandle() { if (this.sliderHandle && typeof this.sliderHandle.setVisible === 'function') { this.sliderHandle.setVisible(true); } } updateSliderVisibility() { const shouldShowSlider = this.gameState === this.GameState.BETTING; const sliderElements = [this.sliderTrack, this.sliderFill, this.sliderHandle, this.sliderHandleGlow]; sliderElements.forEach(element => { safeSetVisible(element, shouldShowSlider); }); } createGameTexts() { const textStyle = { fontFamily: 'Roboto', fontSize: '28px', color: '#ffffff', shadow: { offsetX: 2, offsetY: 2, color: '#000000', blur: 4, fill: true } }; this.betText = this.createText(400, 580, '', { ...textStyle, color: '#00ff00', fontSize: '32px', }); this.moneyText = this.createText(10, 10, '', { ...textStyle, color: '#ffd700', fontSize: '24px', align: 'left' }); this.messageText = this.createText(400, 300, '', { ...textStyle, fontSize: '32px', color: '#ff0000', }); } createButtons() { const buttons = [{ x: 250, y: 520, text: 'HIT', callback: this.hit, icon: 'plus', color: 0x4CAF50 }, { x: 550, y: 520, text: 'STAY', callback: this.stay, icon: 'hand', color: 0xF44336 }, { x: 400, y: 440, // Changed from 520 to 440 (moved up by 80 pixels) text: 'BET', callback: this.placeBet }]; buttons.forEach(button => { this[`${button.text.toLowerCase()}Button`] = this.createButton(button.x, button.y, button.text, button.callback, button.icon, button.color); }); this.setupKeyboardControls(); this.input.on('pointerdown', this.handleTouchInput, this); this.input.on('pointermove', this.handleTouchInput, this); } handleTouchInput(pointer) { if (this.sliderHandle.input.dragState > 0) { const dragX = pointer.x; this.sliderHandle.emit('drag', pointer, dragX); } } createButton(x, y, text, callback, icon, color) { const buttonWidth = text === 'BET' ? 160 : 120; const buttonHeight = text === 'BET' ? 70 : 50; const button = this.add.container(x, y).setDepth(2000); const bgColor = text === 'BET' ? 0x00ff00 : (color || 0x4a4a4a); const bg = this.add.rectangle(0, 0, buttonWidth, buttonHeight, bgColor) .setStrokeStyle(4, 0xffffff) .setOrigin(0.5); const buttonText = this.add.text(0, 0, text, { fontFamily: 'Roboto', fontSize: text === 'BET' ? '32px' : '24px', fontStyle: 'bold', color: '#ffffff' }).setOrigin(0.5); button.add([bg, buttonText]); if (icon) { const iconSprite = this.createButtonIcon(icon); iconSprite.setPosition(-buttonWidth / 4, 0); buttonText.setPosition(buttonWidth / 6, 0); button.add(iconSprite); } button.setSize(buttonWidth, buttonHeight); button.setInteractive({ useHandCursor: true }) .on('pointerover', () => this.onButtonHover(button, bg, buttonText, text)) .on('pointerout', () => this.onButtonOut(button, bg, buttonText, text, bgColor)) .on('pointerdown', () => this.onButtonDown(button, bg, buttonText, text)) .on('pointerup', () => { this.onButtonOut(button, bg, buttonText, text, bgColor); callback.call(this); }); if (text === 'BET') { this.createButtonGlow(button); } return button; } onButtonHover(button, bg, buttonText, text) { const hoverColor = text === 'BET' ? 0x00dd00 : 0xdddddd; bg.setFillStyle(hoverColor); buttonText.setColor(text === 'BET' ? '#ffffff' : '#000000'); this.tweens.add({ targets: button, scaleX: 1.05, scaleY: 1.05, duration: 100 }); } onButtonOut(button, bg, buttonText, text, originalColor) { bg.setFillStyle(originalColor); buttonText.setColor('#ffffff'); this.tweens.add({ targets: button, scaleX: 1, scaleY: 1, duration: 100 }); } onButtonDown(button, bg, buttonText, text) { const pressColor = text === 'BET' ? 0x009900 : 0x333333; bg.setFillStyle(pressColor); this.tweens.add({ targets: button, scaleX: 0.95, scaleY: 0.95, duration: 50 }); } createButtonGlow(button) { const glow = this.add.rectangle(0, 0, button.width + 20, button.height + 20, 0xffff00, 0.3) .setOrigin(0.5) .setBlendMode(Phaser.BlendModes.ADD); button.add(glow); button.glow = glow; this.tweens.add({ targets: glow, alpha: 0.1, duration: 1500, yoyo: true, repeat: -1 }); } createButtonIcon(iconName) { const iconSize = 24; const graphics = this.add.graphics(); graphics.lineStyle(3, 0xffffff, 1); switch (iconName) { case 'plus': graphics.moveTo(-iconSize / 2, 0); graphics.lineTo(iconSize / 2, 0); graphics.moveTo(0, -iconSize / 2); graphics.lineTo(0, iconSize / 2); break; case 'hand': graphics.moveTo(-iconSize / 2, iconSize / 4); graphics.lineTo(-iconSize / 6, iconSize / 4); graphics.lineTo(-iconSize / 6, -iconSize / 2); graphics.lineTo(iconSize / 6, -iconSize / 2); graphics.lineTo(iconSize / 6, iconSize / 4); graphics.lineTo(iconSize / 2, iconSize / 4); graphics.lineTo(iconSize / 2, iconSize / 2); graphics.lineTo(-iconSize / 2, iconSize / 2); graphics.closePath(); break; } return graphics; } getButtonStyle(text) { const baseStyle = { fontFamily: 'Roboto', fontSize: '24px', fontStyle: 'bold', color: '#ffffff', backgroundColor: '#4a4a4a', padding: { left: 12, right: 12, top: 8, bottom: 8 }, shadow: { offsetX: 2, offsetY: 2, color: '#000000', blur: 4, fill: true } }; if (text === 'BET') { baseStyle.backgroundColor = '#008000'; // Green background for BET button baseStyle.fontSize = '28px'; // Slightly larger font for BET button } return baseStyle; } setupKeyboardControls() { const keyControls = [{ key: 'SPACE', callback: this.hit }, { key: 'S', callback: this.stay }, { key: 'P', callback: this.placeBet }]; keyControls.forEach(control => { this.input.keyboard.on(`keydown-${control.key}`, control.callback, this); }); // Add keyboard controls for the slider this.input.keyboard.on('keydown-LEFT', this.decreaseSliderBet, this); this.input.keyboard.on('keydown-RIGHT', this.increaseSliderBet, this); } decreaseSliderBet() { this.updateSliderValue(Math.max(0, this.currentSliderBet - 100)); } increaseSliderBet() { this.updateSliderValue(Math.min(this.money, this.currentSliderBet + 100)); } updateGameState(newState) { this.gameState = newState; this.updateTotalPotText(); this.updateUIElements(newState); this.updateBetButtonState(newState); this.updateCardVisibility(newState); this.updateSliderVisibility(); this.handleStateSpecificActions(newState); this.updateAllDisplays(); if (newState === this.GameState.BETTING) { this.resetSlider(true); this.updateBetDisplay(); this.clearCardTexts(); } // Update bet button state after all other updates this.updateBetButtonState(newState); } updateUIElements(newState) { const uiElements = [{ element: 'hitButton', condition: newState === BlackjackGame.GameState.PLAYING }, { element: 'stayButton', condition: newState === BlackjackGame.GameState.PLAYING }, { element: 'betButton', condition: newState === BlackjackGame.GameState.BETTING }, { element: 'messageText', condition: newState !== BlackjackGame.GameState.BETTING }]; uiElements.forEach(({ element, condition }) => { if (this[element]) { safeSetVisible(this[element], condition); } else { console.warn(`Element ${element} not found in this context`); } }); } updateUIElements(newState) { const uiElements = [{ element: 'hitButton', condition: newState === this.GameState.PLAYING && this.canHit }, { element: 'stayButton', condition: newState === this.GameState.PLAYING }, { element: 'betButton', condition: newState === this.GameState.BETTING }, { element: 'messageText', condition: newState !== this.GameState.BETTING }, {}]; uiElements.forEach(({ element, condition }) => { if (this[element]) { safeSetVisible(this[element], condition); if (element === 'hitButton') { this[element].setAlpha(condition ? 1 : 0.5); } } else { console.warn(`UI element ${element} not found`); } }); } updateBetButtonState(newState) { if (this.betButton && typeof this.betButton.setInteractive === 'function') { const canBet = newState === this.GameState.BETTING && this.currentSliderBet >= 100 && this.currentSliderBet <= this.money; this.betButton.setInteractive(canBet ? {} : false); this.betButton.setAlpha(canBet ? 1 : 0.5); if (canBet) { const buttonText = this.betButton.getByName('text'); const buttonBg = this.betButton.getByName('background'); if (buttonText) { buttonText.setFontSize(36).setColor('#ffffff'); } if (buttonBg) { buttonBg.setFillStyle(0x00ff00).setSize(160, 70); } if (!this.betButtonGlow) { this.betButtonGlow = this.add.graphics().setDepth(1999); } this.betButtonGlow.clear().lineStyle(6, 0xffff00, 0.8).strokeRoundedRect( this.betButton.x - 80, this.betButton.y - 35, 160, 70, 15 ); this.tweens.add({ targets: this.betButtonGlow, alpha: { from: 0.2, to: 0.8 }, duration: 1000, yoyo: true, repeat: -1 }); } else { if (this.betButtonGlow) { this.betButtonGlow.clear(); this.tweens.killTweensOf(this.betButtonGlow); } } } } updateCardVisibility(state) { const shouldShowCards = state !== this.GameState.BETTING && state !== this.GameState.BANKRUPT; const cardTextArrays = [this.playerCardsText, this.dealerCardsText]; cardTextArrays.forEach(cardTexts => { if (Array.isArray(cardTexts)) { cardTexts.forEach(text => { if (text) { safeSetVisible(text, shouldShowCards); } }); } else { console.warn('Expected an array for card texts, but got:', cardTexts); } }); } updateSliderVisibility() { const sliderElements = [this.sliderTrack, this.sliderFill, this.sliderHandle, this.sliderHandleGlow]; const shouldShowSlider = this.betButton && this.betButton.visible; sliderElements.forEach(element => { safeSetVisible(element, shouldShowSlider); }); } handleStateSpecificActions(state) { switch (state) { case this.GameState.BETTING: this.handleBettingState(); break; case this.GameState.PLAYING: this.handlePlayingState(); break; case this.GameState.DEALER_TURN: this.handleDealerTurnState(); break; case this.GameState.GAME_OVER: this.handleGameOverState(); break; case this.GameState.BANKRUPT: this.handleBankruptState(); break; } } handleBettingState() { this.updateBetDisplay(); if (this.messageText) { this.messageText.setText('Place your bet and press PLAY!'); this.messageText.setPosition(400, 250); this.messageText.setStyle({ fontSize: '24px', fill: '#ffffff' }); } this.clearCardTexts(); if (this.dealerTurnText) { this.dealerTurnText.setText(''); } this.updateBetDisplay(); } handlePlayingState() { if (this.messageText) { this.messageText.setText('Hit or Stay?'); this.messageText.setPosition(400, 520); this.messageText.setStyle({ fontSize: '24px', fill: '#ffffff', backgroundColor: 'rgba(0,0,0,0.7)', padding: { left: 10, right: 10, top: 5, bottom: 5 } }); } if (this.dealerTurnText) { this.dealerTurnText.setText(''); } } handleDealerTurnState() { if (this.messageText) { this.messageText.setText(''); } this.time.delayedCall(1000, this.dealerPlay, [], this); } handleGameOverState() { this.time.delayedCall(2000, () => { this.removeChips(); this.updateGameState(this.money <= 0 ? this.GameState.BANKRUPT : this.GameState.BETTING); }); } handleBankruptState() { if (this.messageText) { this.messageText.setText('YOU WENT BANKRUPT!'); this.messageText.setPosition(400, 250); this.messageText.setStyle({ fontSize: '36px', fill: '#ff0000' }); } this.hideGameButtons(); } clearCardTexts() { const cardTextArrays = [this.playerCardsText, this.dealerCardsText]; cardTextArrays.forEach(cardTexts => { if (cardTexts && Array.isArray(cardTexts)) { cardTexts.forEach(text => { if (text && typeof text.setText === 'function') { text.setText(''); } }); } }); } hideGameButtons() { ['hitButton', 'stayButton', 'allInButton'].forEach(button => { safeSetVisible(this[button], false); }); } adjustBet(amount) { if (this.gameState !== 'betting') return; const oldBet = this.bet; const newBet = Math.max(0, Math.min(this.money, this.bet + amount)); if (newBet !== oldBet) { this.bet = newBet; this.currentSliderBet = newBet; this.updateBetDisplay(); this.updateSliderValue(this.bet); } // Ensure slider position matches the bet amount const percentage = this.bet / Math.max(this.money, 1); const minX = this.sliderTrack.x - this.sliderTrack.width / 2; const maxX = this.sliderTrack.x + this.sliderTrack.width / 2; this.sliderHandle.x = minX + percentage * (maxX - minX); this.sliderFill.width = percentage * this.sliderTrack.width; } updateBetDisplay() { const displayBet = this.gameState === this.GameState.BETTING ? this.currentSliderBet : this.bet; this.safeSetText(this.betText, `Current Bet: $${this.formatNumberWithCommas(displayBet)}`); if (this.betText && typeof this.betText.setColor === 'function') { this.betText.setColor(this.gameState === this.GameState.BETTING ? '#00ff00' : '#ff9900'); } } updateBetDisplay() { const displayBet = this.gameState === this.GameState.BETTING ? this.currentSliderBet : this.bet; this.safeSetText(this.betText, `Current Bet: $${this.formatNumberWithCommas(displayBet)}`); if (this.betText && typeof this.betText.setColor === 'function') { this.betText.setColor(this.gameState === this.GameState.BETTING ? '#00ff00' : '#ff9900'); } } placeBet() { this.cleanupWinEffect(); // Clean up any existing win effect if (this.gameState !== this.GameState.BETTING) { console.log("Cannot place bet: game state is not BETTING"); return; } if (this.money < 100) { this.showMessage("You don't have enough money to place the minimum bet!"); return; } if (this.currentSliderBet < 100) { this.showMessage("Please place a bet of at least $100!"); return; } if (this.currentSliderBet > this.money) { this.showMessage("You don't have enough money for this bet!"); return; } this.bet = Math.min(this.currentSliderBet, this.money); this.updateSliderValue(this.bet); const oldMoney = this.money; this.money -= this.bet; // Deduct the bet amount immediately this.animateMoneyToPot(this.bet); // Animate the bet amount to the pot this.updateMoneyText(); // Update the money display immediately this.dealNewHand(); this.updateGameState(this.GameState.PLAYING); this.updateBetDisplay(); this.updateAllDisplays(); this.updateSliderValue(0); this.updateTotalPotText(); this.showMessage(''); console.log(`Bet placed: $${this.bet}, Remaining money: $${this.money}`); if (this.betButton && typeof this.betButton.setInteractive === 'function') { this.betButton.disableInteractive(); } this.time.removeAllEvents(); this.animateMoneyToPot(this.bet); // Animate the bet amount to the pot this.hideSliderTicks(); // Hide the tick marks when bet is placed } animateMoneyToPot(amount) { const startX = this.moneyText.x + this.moneyText.width / 2; const startY = this.moneyText.y; const endX = this.totalPotText.x; const endY = this.totalPotText.y; const moneyText = this.add.text(startX, startY, `$${this.formatNumberWithCommas(amount)}`, { fontFamily: 'Roboto', fontSize: '24px', fontStyle: 'bold', color: '#00ff00', stroke: '#000000', strokeThickness: 3 }).setOrigin(0.5).setDepth(3000); this.tweens.add({ targets: moneyText, x: endX, y: endY, scale: 1.5, duration: 1000, ease: 'Power2', onComplete: () => { moneyText.destroy(); this.updateTotalPotText(); // Update the pot text after animation // Create a "splash" effect when the money reaches the pot this.createPotSplashEffect(endX, endY); } }); } createPotSplashEffect(x, y) { const particles = this.add.particles('chip'); const emitter = particles.createEmitter({ x: x, y: y, speed: { min: 100, max: 200 }, angle: { min: 0, max: 360 }, scale: { start: 0.05, end: 0 }, lifespan: 800, quantity: 20, blendMode: 'ADD' }); this.time.delayedCall(800, () => { emitter.stop(); this.time.delayedCall(1000, () => { particles.destroy(); }); }); } showMessage(text) { this.safeSetText(this.messageText, text); this.updateTextVisibility(this.messageText, !!text); if (this.messageText) { this.safeSetTextPosition(this.messageText, 400, 300); this.tweens.add({ targets: this.messageText, alpha: { from: 0, to: 1 }, duration: 500, ease: 'Power2' }); } } dealNewHand() { this.clearCardSprites(); this.playerCards = [ [this.drawCard()] ]; this.dealerCards = [ [this.drawCard()] ]; this.playerSums = [this.calculateSum(this.playerCards[0])]; this.dealerSums = [this.calculateSum(this.dealerCards[0])]; this.currentHand = 0; // Safeguard checks before animating if (Array.isArray(this.playerCards) && this.playerCards.length > 0 && Array.isArray(this.playerCards[0]) && this.playerCards[0].length > 0) { this.time.delayedCall(500, () => this.animateCardDeal(this.playerCards[0][0], 'player', 0)); } else { console.warn('Invalid player cards data'); } if (Array.isArray(this.dealerCards) && this.dealerCards.length > 0 && Array.isArray(this.dealerCards[0]) && this.dealerCards[0].length > 0) { this.time.delayedCall(1000, () => this.animateCardDeal(this.dealerCards[0][0], 'dealer', 0)); } else { console.warn('Invalid dealer cards data'); } } repositionExistingCards(recipient, newIndex) { const cardSprites = recipient === 'player' ? this.playerCardSprites : this.dealerCardSprites; const moveDistance = 30; for (let i = 0; i < cardSprites.length; i++) { const cardContainer = cardSprites[i]; if (cardContainer) { this.tweens.add({ targets: cardContainer, x: `+=${moveDistance}`, duration: 200, ease: 'Power2' }); } } } animateCardDeal(cardValue, recipient, index) { if (cardValue === undefined || recipient === undefined || index === undefined) { console.warn('Invalid parameters for animateCardDeal'); return; } const startX = 400; const startY = 0; const baseEndX = 400; // Same for both player and dealer const endY = recipient === 'player' ? 380 : 210; const cardContainer = this.add.container(startX, startY); const cardSprite = this.add.image(0, 0, 'cardBack').setScale(0.1125); const cardFront = this.add.image(0, 0, 'card').setScale(0.1125).setVisible(false); const cardText = this.add.text(0, 0, cardValue.toString(), { fontFamily: 'Roboto', fontSize: '18px', color: '#ffffff', fontStyle: 'bold', stroke: '#000000', strokeThickness: 2 }).setOrigin(0.5).setVisible(false); cardContainer.add([cardSprite, cardFront, cardText]); cardContainer.setData('recipient', recipient); cardContainer.setData('index', index); cardContainer.setData('cardValue', cardValue); const cardSprites = recipient === 'player' ? (this.playerCardSprites || []) : (this.dealerCardSprites || []); const cardSpacing = 30; const endX = baseEndX - (cardSprites.length * cardSpacing); // Animate existing cards to make space for the new card cardSprites.forEach((existingCard, i) => { this.tweens.add({ targets: existingCard, x: baseEndX - (i * cardSpacing), duration: 200, ease: 'Power2' }); }); this.tweens.add({ targets: cardContainer, x: endX, y: endY, duration: 300, ease: 'Power2', onComplete: () => { this.flipCard(cardContainer, () => { if (recipient === 'player') { this.playerCardSprites = this.playerCardSprites || []; this.playerCardSprites.push(cardContainer); } else { this.dealerCardSprites = this.dealerCardSprites || []; this.dealerCardSprites.push(cardContainer); } this.updateHandDisplays(); }); } }); } flipCard(cardContainer, onComplete) { const cardBack = cardContainer.list[0]; const cardFront = cardContainer.list[1]; const cardText = cardContainer.list[2]; this.tweens.add({ targets: cardContainer, scaleX: 0, duration: 150, ease: 'Linear', onComplete: () => { cardBack.setVisible(false); cardFront.setVisible(true); cardText.setVisible(true); this.tweens.add({ targets: cardContainer, scaleX: 1, duration: 150, ease: 'Linear', onComplete: onComplete }); } }); } clearCardSprites() { if (this.playerCardSprites) { this.playerCardSprites.forEach(sprite => sprite.destroy()); this.playerCardSprites = []; } if (this.dealerCardSprites) { this.dealerCardSprites.forEach(sprite => sprite.destroy()); this.dealerCardSprites = []; } } drawCard() { return Phaser.Math.Between(1, 11); } calculateSum(cards) { return cards.reduce((sum, card) => sum + card, 0); } hit() { if (this.gameState !== this.GameState.PLAYING || !this.canHit) { console.warn('Cannot hit: game state is not PLAYING or hit is not allowed'); return; } this.canHit = false; // Disable hit this.updateUIElements(this.gameState); // Update UI to reflect disabled hit button if (this.currentHand < this.playerCards.length) { const newCard = this.drawCard(); this.playerCards[this.currentHand].push(newCard); this.playerSums[this.currentHand] = this.calculateSum(this.playerCards[this.currentHand]); this.animateCardDeal(newCard, 'player', this.playerCards[this.currentHand].length - 1); } else { console.warn('Invalid current hand index'); } if (this.playerSums[this.currentHand] > 21) { this.messageText.setText(`Hand ${this.currentHand + 1} BUST!`); if (this.currentHand < this.playerCards.length - 1) { this.currentHand++; this.time.delayedCall(1000, () => { this.messageText.setText('Next hand...'); this.updateAllDisplays(); }); } else { this.updateGameState('dealerTurn'); } } else if (this.playerSums[this.currentHand] === 21) { if (this.currentHand < this.playerCards.length - 1) { this.currentHand++; } else { this.stay(); } } this.updateAllDisplays(); // Check if all player hands are busted const allHandsBusted = this.playerSums.every(sum => sum > 21); if (allHandsBusted) { this.time.delayedCall(1000, () => { this.endGame(); }); } // Re-enable hit after 1000ms this.time.delayedCall(1500, () => { this.canHit = true; this.updateUIElements(this.gameState); }); } stay() { if (this.gameState !== 'playing') return; if (this.currentHand < this.playerCards.length - 1) { this.currentHand++; this.messageText.setText('Next hand...'); } else { this.updateGameState('dealerTurn'); } } dealerPlay() { let maxPlayerSum = Math.max(...this.playerSums.filter(sum => sum <= 21)); let currentDealerHand = 0; const playNextHand = () => { if (currentDealerHand < this.dealerCards.length) { if (this.dealerSums[currentDealerHand] < 17 && this.dealerSums[currentDealerHand] <= maxPlayerSum) { const newCard = this.drawCard(); this.dealerCards[currentDealerHand].push(newCard); this.dealerSums[currentDealerHand] = this.calculateSum(this.dealerCards[currentDealerHand]); // Animate the new card being dealt to the dealer this.animateCardDeal(newCard, 'dealer', this.dealerCards[currentDealerHand].length - 1); this.time.delayedCall(1000, () => { this.updateAllDisplays(); this.time.delayedCall(1000, playNextHand); }); } else { currentDealerHand++; playNextHand(); } } else { this.endGame(); } }; playNextHand(); } endGame() { this.dealerTurnText.setText(''); // Clear the dealer's turn text let message = ''; let totalWin = 0; const currentBet = this.bet; // Store the current bet before resetting it this.bet = 0; // Reset the bet to 0 this.updateTotalPotText(); // Reset the total pot text for (let i = 0; i < this.playerSums.length; i++) { let handResult = 0; // -1 for loss, 0 for tie, 1 for win let handMessage = ''; for (let j = 0; j < this.dealerSums.length; j++) { if (this.playerSums[i] > 21) { handResult = -1; handMessage = `Player Hand ${i+1} vs Dealer Hand ${j+1}: Bust. `; } else if (this.dealerSums[j] > 21) { handResult = 1; handMessage = `Player Hand ${i+1} vs Dealer Hand ${j+1}: Win! Dealer Bust. `; } else if (this.playerSums[i] > this.dealerSums[j]) { handResult = 1; handMessage = `Player Hand ${i+1} vs Dealer Hand ${j+1}: Win! `; } else if (this.playerSums[i] < this.dealerSums[j]) { handResult = -1; handMessage = `Player Hand ${i+1} vs Dealer Hand ${j+1}: Lose. `; } else { handResult = 0; handMessage = `Player Hand ${i+1} vs Dealer Hand ${j+1}: Tie. `; } message += handMessage; } if (handResult === 1) { let winAmount = currentBet * 2; // Player receives 2x the bet amount if (this.playerSums[i] === 21 && this.playerCards[i].length === 2) { message += 'Blackjack! '; winAmount = Math.floor(currentBet * 2.5); // Blackjack pays 3:2 } totalWin += winAmount; } else if (handResult === -1) { totalWin -= currentBet; } else { tieHands++; totalWin += currentBet; // Return the bet on tie } } this.money += totalWin; this.messageText.setText(message); this.messageText.setStyle({ fontSize: '20px', fill: '#ffffff' }); this.messageText.setPosition(400, 250); if (totalWin > 0) { this.showWinningEffect(totalWin); } else if (totalWin < 0) { this.showLosingEffect(Math.abs(totalWin)); } else if (totalWin === 0 && tieHands > 0) { this.showTieEffect(currentBet * tieHands); } if (this.money <= 0) { this.updateGameState('bankrupt'); } else { this.updateGameState('gameover'); } this.updateSliderVisibility(); this.updateHighScores(); // Update high scores before restarting this.time.delayedCall(5000, this.restartGame, [], this); } showTieEffect(amount) { const tieText = this.add.text(400, 300, 'Tie! Bet Returned', { fontFamily: 'Roboto', fontSize: '32px', fontStyle: 'bold', color: '#ffff00', stroke: '#000000', strokeThickness: 4, align: 'center' }).setOrigin(0.5).setDepth(5000); this.tweens.add({ targets: tieText, y: 250, alpha: 0, duration: 2000, ease: 'Power2', onComplete: () => tieText.destroy() }); // Show the amount returned const returnText = this.add.text(400, 350, `$${this.formatNumberWithCommas(amount)} Returned`, { fontFamily: 'Roboto', fontSize: '24px', fontStyle: 'bold', color: '#00ffff', stroke: '#000000', strokeThickness: 3, align: 'center' }).setOrigin(0.5).setDepth(5000); this.tweens.add({ targets: returnText, y: 300, alpha: 0, duration: 2000, ease: 'Power2', delay: 1000, onComplete: () => returnText.destroy() }); } endGame() { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot end game: scene is not active'); return; } let message = ''; let totalWin = 0; const currentBet = this.bet; this.bet = 0; this.removeChips(); this.updateTotalPotText(); this.updateHighScores(); this.clearCardSprites(); const dealerSum = this.dealerSums[0]; let dealerWins = true; for (let i = 0; i < this.playerSums.length; i++) { const playerSum = this.playerSums[i]; const handResult = this.getHandResult(playerSum, dealerSum); message += this.getHandMessage(i, handResult, playerSum, dealerSum); totalWin += this.calculateWinAmount(handResult, currentBet); if (handResult === 1) { dealerWins = false; } } this.money += totalWin; this.updateMessageText(message); if (totalWin > 0) { this.time.delayedCall(100, () => this.showWinningEffect(totalWin), [], this); } else if (dealerWins) { this.time.delayedCall(100, () => this.showDealerWinEffect(Math.abs(currentBet)), [], this); } else { this.time.delayedCall(100, () => this.showLosingEffect(Math.abs(currentBet)), [], this); } this.updateGameState(this.money < 100 ? this.GameState.BANKRUPT : this.GameState.GAME_OVER); this.resetSlider(); this.showSliderTicks(); this.updateAllDisplays(); this.time.delayedCall(5000, () => { if (this.scene && this.scene.isActive()) { this.restartGame(this.money < 100); } }, [], this); } showDealerWinEffect(amount) { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot show dealer win effect: scene is not active'); return; } // Create a dramatic text effect const winText = this.add.text(400, 100, 'Dealer Wins!', { fontFamily: 'Roboto', fontSize: '48px', fontStyle: 'bold', color: '#ff0000', stroke: '#000000', strokeThickness: 6, shadow: { offsetX: 2, offsetY: 2, color: '#000000', blur: 4, stroke: true, fill: true } }).setOrigin(0.5).setAlpha(0).setDepth(5000); // Create a dramatic chip effect const chipSprites = []; for (let i = 0; i < 20; i++) { const chip = this.add.image(400, 100, 'chip').setScale(0.05).setAlpha(0).setDepth(4999); chipSprites.push(chip); } // Animate the text this.tweens.add({ targets: winText, alpha: 1, scaleX: 1.2, scaleY: 1.2, ease: 'Bounce', duration: 1000, yoyo: true, repeat: 1, onComplete: () => { winText.destroy(); } }); // Animate the chips chipSprites.forEach((chip, index) => { this.tweens.add({ targets: chip, x: 400 + Phaser.Math.Between(-200, 200), y: 100 + Phaser.Math.Between(0, 150), alpha: 1, angle: Phaser.Math.Between(0, 360), scale: 0.1, ease: 'Sine.easeOut', duration: 1500, delay: index * 50, onComplete: () => { this.tweens.add({ targets: chip, x: 400, y: 50, alpha: 0, scale: 0.05, ease: 'Sine.easeIn', duration: 1000, onComplete: () => { chip.destroy(); } }); } }); }); } getHandResult(playerSum, dealerSum) { if (playerSum > 21) return -1; if (dealerSum > 21) return 1; return Math.sign(playerSum - dealerSum); } getHandMessage(handIndex, result, playerSum, dealerSum) { const outcomes = ['Tie', 'Win!', 'Lose', 'Bust', 'Win! Dealer Bust']; const resultIndex = result === 0 ? 0 : result === 1 ? (dealerSum > 21 ? 4 : 1) : (playerSum > 21 ? 3 : 2); return `Player Hand ${handIndex + 1}: ${outcomes[resultIndex]}. `; } calculateWinAmount(result, bet) { if (result === 1) return bet; // Win if (result === 0) return bet; // Tie, return the bet return 0; // Loss } updateMessageText(message) { if (this.messageText) { this.messageText.setText(message).setStyle({ fontSize: '20px', fill: '#ffffff' }).setPosition(400, 250); } } showWinningEffect(amount) { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot show winning effect: scene is not active'); return; } // Clean up any existing win effect this.cleanupWinEffect(); // Hide the total pot text if (this.totalPotText) { this.totalPotText.setVisible(false); } // Create a dramatic text effect const winText = this.add.text(400, 300, 'You Win!', { fontFamily: 'Roboto', fontSize: '48px', fontStyle: 'bold', color: '#00ff00', stroke: '#000000', strokeThickness: 6, shadow: { offsetX: 2, offsetY: 2, color: '#000000', blur: 4, stroke: true, fill: true } }).setOrigin(0.5).setAlpha(0).setDepth(4000); // Create a dramatic chip effect const chipSprites = []; for (let i = 0; i < 20; i++) { const chip = this.add.image(400, 300, 'chip').setScale(0.05).setAlpha(0).setDepth(4001); chipSprites.push(chip); } // Animate the text this.tweens.add({ targets: winText, alpha: 1, scaleX: 1.2, scaleY: 1.2, ease: 'Bounce', duration: 1000, yoyo: true, repeat: 1, onComplete: () => { winText.destroy(); } }); // Animate the chips chipSprites.forEach((chip, index) => { this.tweens.add({ targets: chip, x: 400 + Phaser.Math.Between(-200, 200), y: 300 + Phaser.Math.Between(-150, 150), alpha: 1, angle: Phaser.Math.Between(0, 360), scale: 0.1, ease: 'Sine.easeOut', duration: 1500, delay: index * 50, onComplete: () => { this.tweens.add({ targets: chip, x: this.moneyText.x, y: this.moneyText.y, alpha: 0, scale: 0.05, ease: 'Sine.easeIn', duration: 1000, onComplete: () => { chip.destroy(); } }); } }); }); // Show the amount won this.winEffectText = this.add.text(400, 400, `You won $${this.formatNumberWithCommas(amount)}!`, { fontFamily: 'Roboto', fontSize: '36px', fontStyle: 'bold', color: '#ffd700', stroke: '#000000', strokeThickness: 4, align: 'center', wordWrap: { width: 600, useAdvancedWrap: true } }).setOrigin(0.5).setAlpha(0).setDepth(4002); this.tweens.add({ targets: this.winEffectText, alpha: 1, y: 350, duration: 1000, ease: 'Power2', delay: 1000, onComplete: () => { this.time.delayedCall(3000, () => { this.tweens.add({ targets: this.winEffectText, alpha: 0, duration: 1000, onComplete: () => { if (this.winEffectText) { this.winEffectText.destroy(); this.winEffectText = null; } } }); }); } }); // Update the money display const currentBalance = this.money; const newBalance = currentBalance + amount; this.animateMoneyChange(currentBalance, newBalance); // Show the total pot text again after 6 seconds with a fade-in effect this.time.delayedCall(6000, () => { if (this.totalPotText) { this.totalPotText.setAlpha(0); this.totalPotText.setVisible(true); this.tweens.add({ targets: this.totalPotText, alpha: 1, duration: 500, ease: 'Power2' }); } }); } cleanupWinEffect() { if (this.winEffectText) { this.tweens.killTweensOf(this.winEffectText); this.winEffectText.destroy(); this.winEffectText = null; } } showLosingEffect(amount) { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot show losing effect: scene is not active'); return; } const currentBalance = parseInt(this.moneyText.text.replace(/[^0-9]/g, '')); const newBalance = currentBalance - amount; const loseText = this.add.text( this.moneyText.x + this.moneyText.width + 10, this.moneyText.y, `-$${this.formatNumberWithCommas(amount)}`, { fontSize: '24px', fontWeight: 'bold', fill: '#ff0000', stroke: '#000000', strokeThickness: 3 } ).setOrigin(0, 0.5).setDepth(3000); this.animateMoneyChange(currentBalance, newBalance); safeTween(this, { targets: loseText, x: this.moneyText.x + this.moneyText.width + 20, alpha: 0, duration: 2000, ease: 'Power2', onComplete: () => { if (loseText && !loseText.destroyed) { loseText.destroy(); } } }); } formatNumberWithCommas(number) { return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } safeSetText(textObject, content) { if (this.scene?.isActive() && textObject && !textObject.destroyed && typeof textObject.setText === 'function') { textObject.setText(content); } } safeGetText(textObject) { return (textObject && typeof textObject.text === 'string' && !textObject.destroyed) ? textObject.text : ''; } safeUpdateText(textObject, content, x, y, style) { if (!this.scene?.isActive() || !textObject || textObject.destroyed) return; this.safeSetText(textObject, content); if (typeof textObject.setPosition === 'function' && x !== undefined && y !== undefined) { textObject.setPosition(x, y); } if (typeof textObject.setStyle === 'function' && style) { textObject.setStyle(style); } } safeSetTextPosition(textObject, x, y) { textObject?.setPosition?.(x, y); } updateTextVisibility(textObject, isVisible) { safeSetVisible(textObject, isVisible); } clearAllTexts() { [this.messageText, this.betText, this.moneyText].forEach(text => { this.safeSetText(text, ''); }); this.clearCardTexts(); } updateAllDisplays() { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot update displays: scene is not active'); return; } try { this.clearAllTexts(); this.updateBetDisplay(); this.updateMoneyText(); this.updateHandDisplays(); this.updateMessageBasedOnState(); this.updateTotalPotText(); this.updateSliderVisibility(); this.updateHighScoreDisplay(); } catch (error) { console.error('Error in updateAllDisplays:', error); } } clearAllTexts() { const textObjects = [this.messageText, this.betText, this.moneyText]; textObjects.forEach(text => this.safeSetText(text, '')); this.clearCardTexts(); } clearCardTexts() { const cardTextArrays = [this.playerCardsText, this.dealerCardsText]; cardTextArrays.forEach(cardTexts => { if (cardTexts && Array.isArray(cardTexts)) { cardTexts.forEach(text => { if (text) { this.safeSetText(text, ''); } }); } }); } updateHandDisplays() { const shouldShowCards = this.gameState !== this.GameState.BETTING && this.gameState !== this.GameState.BANKRUPT; if (shouldShowCards) { this.updatePlayerHandDisplay(); this.updateDealerHandDisplay(); } } updatePlayerHandDisplay() { if (this.playerCards && Array.isArray(this.playerCards) && this.playerCards.length > 0 && this.playerSums && Array.isArray(this.playerSums) && this.playerSums.length > 0 && this.playerCardsText && Array.isArray(this.playerCardsText)) { this.updateHandDisplay(this.playerCards, this.playerSums, this.playerCardsText, 'Player', 400, 460); } else { console.warn('Invalid player hand data'); } } updateDealerHandDisplay() { if (this.dealerCards && Array.isArray(this.dealerCards) && this.dealerCards.length > 0 && this.dealerSums && Array.isArray(this.dealerSums) && this.dealerSums.length > 0 && this.dealerCardsText && Array.isArray(this.dealerCardsText)) { this.updateHandDisplay(this.dealerCards, this.dealerSums, this.dealerCardsText, 'Dealer', 600, 150); } else { console.warn('Invalid dealer hand data'); } } updateMessageBasedOnState() { switch (this.gameState) { case BlackjackGame.GameState.BETTING: this.showMessage('Place your bet and press PLAY!', 250); break; case BlackjackGame.GameState.PLAYING: this.showMessage('Hit or Stay?', 520); break; case BlackjackGame.GameState.DEALER_TURN: this.showMessage('Dealer\'s Turn', 50, 32, '#ff9900'); break; case BlackjackGame.GameState.GAME_OVER: // Game over message is handled in endGame method break; case BlackjackGame.GameState.BANKRUPT: this.showMessage('YOU WENT BANKRUPT!', 250, 36, '#ff0000'); break; } } showMessage(text, y = 300, fontSize = 24, color = '#ffffff') { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot show message: scene is not active'); return; } if (!this.messageText) { console.warn('Message text object is not initialized'); return; } const style = { fontFamily: 'Roboto', fontSize: `${fontSize}px`, fill: color, align: 'center', backgroundColor: 'rgba(0,0,0,0.7)', padding: { left: 10, right: 10, top: 5, bottom: 5 } }; try { this.safeUpdateText(this.messageText, text, 400, y, style); safeSetVisible(this.messageText, !!text); } catch (error) { console.error('Error showing message:', error); } } animateMoneyChange(oldValue, newValue) { if (this.moneyText) { this.tweens.addCounter({ from: oldValue, to: newValue, duration: 1000, ease: 'Power2', onUpdate: (tween) => { const value = Math.floor(tween.getValue()); this.money = value; // Update the actual money property this.moneyText.setText(`Balance: $${this.formatNumberWithCommas(value)}`); }, onComplete: () => { this.updateMoneyText(); } }); this.tweens.add({ targets: this.moneyText, scaleX: 1.2, scaleY: 1.2, duration: 200, yoyo: true, repeat: 1 }); } } updateHandDisplay(cards, sums, textObjects, prefix) { if (!cards || !sums || !textObjects || !Array.isArray(cards) || !Array.isArray(sums) || !Array.isArray(textObjects)) { console.warn('Invalid input for updateHandDisplay'); return; } cards = cards || []; sums = sums || []; textObjects = textObjects || []; if (cards.length === 0 || sums.length === 0) { console.warn('Empty cards or sums array in updateHandDisplay'); return; } const isDealer = prefix === 'Dealer'; const displayX = 400; // Center for both dealer and player const displayY = isDealer ? 30 : 480; // dealer's sum text for (let i = 0; i < cards.length; i++) { const handText = cards.length > 1 ? `${prefix} Hand ${i+1}:` : `${prefix} Hand:`; const sumText = `${i < sums.length ? sums[i] : 0}`; const fullText = `${handText}\n${sumText}`; const style = { fontFamily: 'Roboto', fontSize: '24px', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 3 }; if (i >= textObjects.length) { try { textObjects.push(this.createText(displayX, displayY + i * 40, '', style)); } catch (error) { console.error('Error creating text object:', error); continue; } } const textObject = textObjects[i]; this.safeUpdateText(textObject, fullText, displayX, displayY + i * 40, style); safeSetVisible(textObject, true); textObject.setOrigin(0.5, 0); if (textObject) { this.tweens.add({ targets: textObject, scaleX: { from: 0.95, to: 1 }, scaleY: { from: 0.95, to: 1 }, duration: 200, ease: 'Power2' }); } } for (let i = cards.length; i < textObjects.length; i++) { safeSetVisible(textObjects[i], false); } } updateHandSeparators() { // Remove existing separators safeForEach(this.playerHandSeparators, separator => separator.destroy()); safeForEach(this.dealerHandSeparators, separator => separator.destroy()); this.playerHandSeparators = []; this.dealerHandSeparators = []; // Add new separators for (let i = 0; i < this.playerCards.length - 1; i++) { this.playerHandSeparators.push( this.add.rectangle(400, 115 + i * 50, 400, 2, 0xffffff, 0.5).setDepth(1999) ); } for (let i = 0; i < this.dealerCards.length - 1; i++) { this.dealerHandSeparators.push( this.add.rectangle(400, 165 + i * 50, 400, 2, 0xffffff, 0.5).setDepth(1999) ); } } restartGame(fullRestart = false) { this.resetGameState(fullRestart); this.updateAllUIElements(); this.showSliderTicks(); // Show the tick marks when game restarts if (fullRestart || this.money < 100) { this.money = 1000; // Ensure player always has enough to play this.showNewGameMessage(); } this.updateMoneyText(); // Update money display after potential reset this.updateHighScores(); // Update high scores after restarting this.saveGameState(); // Save the game state after restarting } resetGameState(fullRestart = false) { const initialState = { bet: 0, playerSums: [0], dealerSums: [0], playerCards: [ [] ], dealerCards: [ [] ], currentHand: 0, gameState: this.GameState.BETTING }; if (fullRestart) { initialState.money = 1000; } Object.assign(this, initialState); this.resetSlider(); } resetSlider() { if (this.sliderTrack && this.sliderHandle && this.sliderFill) { const minX = this.sliderTrack.x - this.sliderTrack.width / 2; this.sliderHandle.x = minX; this.sliderFill.width = 0; this.currentSliderBet = 0; this.updateSliderHandleGlow(); this.updateBetFromSlider(true, true); } } updateAllUIElements() { const elementsToUpdate = [{ element: this.betButton, visible: true }, { element: this.sliderTrack, visible: true }, { element: this.sliderHandle, visible: true }, { element: this.sliderFill, visible: true }, { element: this.messageText, setText: '' }, { element: this.betText, update: () => this.updateBetDisplay() }, { element: this.moneyText, update: () => this.updateMoneyText() }, { element: this.totalPotText, update: () => this.updateTotalPotText() }]; elementsToUpdate.forEach(({ element, visible, setText, update }) => { if (element) { if (visible !== undefined) safeSetVisible(element, visible); if (setText !== undefined) this.safeSetText(element, setText); if (update) update(); } }); this.updateUIElements(this.gameState); this.clearPotArea(); } showNewGameMessage() { if (this.newGameMessageTween) { this.newGameMessageTween.stop(); if (this.newGameMessageText) this.newGameMessageText.destroy(); } this.newGameMessageText = this.add.text(400, 250, 'Money Restocked!', { fontFamily: 'Roboto', fontSize: '22px', fontStyle: 'bold', color: '#ffffff', stroke: '#000000', strokeThickness: 6, align: 'center' }).setOrigin(0.5); this.newGameMessageTween = this.tweens.add({ targets: this.newGameMessageText, alpha: 0, duration: 1000, delay: 2000, onComplete: () => { this.newGameMessageText.destroy(); this.newGameMessageTween = null; this.newGameMessageText = null; } }); } resetSlider(isGameRestart = false) { if (this.sliderTrack && this.sliderHandle && this.sliderFill) { const minX = this.sliderTrack.x - this.sliderTrack.width / 2; this.sliderHandle.x = minX; this.sliderFill.width = 0; this.currentSliderBet = 0; this.updateSliderHandleGlow(); this.updateSliderValue(0); this.updateBetFromSlider(true, isGameRestart); } } clearPotArea() { safeForEach(this.potChipSprites, chip => { if (chip && typeof chip.destroy === 'function') { chip.destroy(); } }); this.potChipSprites = []; this.updateTotalPotText(); } removeChips() { this.chipSprites = []; } showLosingMoneyEffect(amount) { if (!this.scene || !this.scene.isActive()) { console.warn('Cannot show losing money effect: scene is not active'); return; } const loseText = this.add.text( this.moneyText.x + this.moneyText.width + 10, this.moneyText.y, `-$${this.formatNumberWithCommas(amount)}`, { fontSize: '24px', fontWeight: 'bold', fill: '#ff0000', stroke: '#000000', strokeThickness: 3 } ).setOrigin(0, 0.5).setDepth(3000); safeTween(this, { targets: loseText, y: this.moneyText.y - 50, alpha: 0, duration: 2000, ease: 'Power2', onComplete: () => { if (loseText && !loseText.destroyed) { loseText.destroy(); } } }); } saveGameState() { const gameState = { money: this.money, playerName: this.playerName, playerId: this.playerId }; localStorage.setItem(`${this.gameId}_gameState`, JSON.stringify(gameState)); this.saveHighScores(); } loadGameState() { const savedState = localStorage.getItem(`${this.gameId}_gameState`); if (savedState) { const gameState = JSON.parse(savedState); this.money = gameState.money || 1000; this.playerName = gameState.playerName || 'Player'; this.playerId = gameState.playerId || this.generatePlayerId(); this.updatePlayerNameDisplay(); } else { this.money = 1000; this.playerName = 'Player'; this.playerId = this.generatePlayerId(); } this.loadHighScores(); this.updateHighScoreDisplay(); } generatePlayerId() { return `${this.playerName}_${Math.random().toString(36).substr(2, 9)}`; } saveHighScores() { const allHighScores = JSON.parse(localStorage.getItem(`${this.gameId}_allHighScores`) || '[]'); const playerScoreIndex = allHighScores.findIndex(score => score.id === this.playerId); if (playerScoreIndex !== -1) { allHighScores[playerScoreIndex].score = Math.max(allHighScores[playerScoreIndex].score, this.money); } else { allHighScores.push({ id: this.playerId, name: this.playerName, score: this.money }); } allHighScores.sort((a, b) => b.score - a.score); const top10Scores = allHighScores.slice(0, 10); localStorage.setItem(`${this.gameId}_allHighScores`, JSON.stringify(top10Scores)); } loadHighScores() { this.highScores = JSON.parse(localStorage.getItem(`${this.gameId}_allHighScores`) || '[]'); } clearHighScores() { localStorage.removeItem(`${this.gameId}_allHighScores`); this.highScores = []; this.updateHighScoreDisplay(); } updateHighScores() { this.saveHighScores(); this.loadHighScores(); this.updateHighScoreDisplay(); } changePlayerName(newName) { this.playerName = newName; this.saveGameState(); this.updatePlayerNameDisplay(); this.updateHighScoreDisplay(); // Update high scores to reflect the new name } updatePlayerNameDisplay() { if (this.playerNameText) { this.playerNameText.setText(`Player: ${this.playerName}`); } } updateHighScoreDisplay() { if (this.highScoreText) { let highScoreString = 'Top High Balances:\n'; if (this.highScores.length === 0) { highScoreString += 'No high balances yet!'; } else { this.highScores.forEach((score, index) => { const isCurrentPlayer = score.id === this.playerId; const playerName = isCurrentPlayer ? `${score.name} (You)` : score.name; highScoreString += `${index + 1}. ${playerName}: $${this.formatNumberWithCommas(score.score)}\n`; }); } this.highScoreText.setText(highScoreString); if (this.moneyText) { this.highScoreText.setPosition(this.moneyText.x, this.moneyText.y + this.moneyText.height + 10); } } } } const safeForEach = (array, callback) => Array.isArray(array) && array.forEach(callback); const safeSetVisible = (element, visibility) => element?.setVisible?.(visibility); const safeTween = (scene, config) => { if (!scene?.tweens) return null; const targets = Array.isArray(config.targets) ? config.targets : [config.targets]; const validTargets = targets.filter(target => target?.scene?.sys.displayList.exists(target)); return validTargets.length ? scene.tweens.add({ ...config, targets: validTargets }) : null; }; window.phaserGame = new Phaser.Game({ type: Phaser.Auto, parent: 'renderDiv', pixelArt: true, scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH }, width: 800, height: 600, scene: BlackjackGame });