// Settings: const GAME_SETTINGS = { gameSpeed: 0.75 }; // Objects: class Ball extends Phaser.Physics.Arcade.Image { constructor(scene, x, y, isExtraBall = false) { super(scene, x, y, 'ball'); scene.add.existing(this); scene.physics.add.existing(this); this.setScale(0.05 * 0.8); this.setBounce(1); this.setCollideWorldBounds(true); this.setFriction(0); this.setDamping(false); this.BALL_START_SPEED = 500; this.ballSpeed = this.BALL_START_SPEED; this.slowSpeed = this.BALL_START_SPEED * 0.2; this.isSlowed = false; this.isExtraBall = isExtraBall; this.bounceCount = 0; const angle = Phaser.Math.Between(0, 360); this.setVelocity( Math.cos(angle) * this.ballSpeed, Math.sin(angle) * this.ballSpeed ); this.setCircle(this.width / 2); // Set circular hitbox this.body.setMaxSpeed(1000); // Set maximum speed if (this.isExtraBall) { this.bounceText = scene.add.text(x, y - 20, '25', { fontSize: '16px', fill: '#fff' }); this.bounceText.setOrigin(0.5); } } reset() { this.setPosition(400, 100); this.setVelocity(100, 200); this.isSlowed = false; } update(delta) { const currentVelocity = this.body.velocity; const currentSpeed = currentVelocity.length(); const targetSpeed = (this.isSlowed ? this.slowSpeed : this.ballSpeed) * (delta / 16.67); if (currentSpeed !== targetSpeed) { const newVelocity = currentVelocity.normalize().scale(targetSpeed); this.setVelocity(newVelocity.x, newVelocity.y); } this.x = this.body.x + this.body.width / 2; this.y = this.body.y + this.body.height / 2; if (this.isExtraBall) { if (this.bounceCount >= 25) { if (this.bounceText) { this.bounceText.destroy(); } this.destroy(); } else { this.bounceText.setPosition(this.x, this.y - 20); this.bounceText.setText(`${25 - this.bounceCount}`); } } } slow() { this.isSlowed = true; } normal() { this.isSlowed = false; } } class PowerUp extends Phaser.Physics.Arcade.Image { constructor(scene, x, y, type) { super(scene, x, y, 'powerup'); scene.add.existing(this); scene.physics.add.existing(this); this.setVelocity(0, 200); // Increase downward velocity this.setCollideWorldBounds(false); this.body.setAllowGravity(false); // Ensure gravity doesn't affect the power-up this.type = type; // Store the power-up type } isOutOfBounds() { return this.y > this.scene.sys.game.config.height; } } class Paddle extends Phaser.Physics.Arcade.Image { constructor(scene, x, y) { super(scene, x, y, 'paddle'); scene.add.existing(this); scene.physics.add.existing(this); // Adjust the scale to make the paddle half as wide and half as tall this.setScale(0.15, 0.075); this.setImmovable(true); this.body.allowGravity = false; // Set up a proper hitbox, making it slightly wider this.body.setSize(this.width * 0.9, this.height * 0.8); this.body.setOffset(this.width * 0.05, this.height * 0.1); // Add rotation properties this.rotationSpeed = 0.1; this.maxRotation = Phaser.Math.DegToRad(45); this.currentRotation = 0; // Store original dimensions this.originalWidth = this.displayWidth; this.originalHeight = this.displayHeight; // Add isMovable property this.isMovable = true; } resetSize() { this.setDisplaySize(this.originalWidth, this.originalHeight); } move(x) { if (this.isMovable) { this.x = Phaser.Math.Clamp(x, this.displayWidth / 2, this.scene.game.config.width - this.displayWidth / 2); } } rotate(direction) { // direction should be 1 for clockwise, -1 for counter-clockwise this.currentRotation += this.rotationSpeed * direction; this.currentRotation = Phaser.Math.Clamp(this.currentRotation, -this.maxRotation, this.maxRotation); this.setRotation(this.currentRotation); } resetRotation() { this.currentRotation = 0; this.setRotation(0); } } class Brick extends Phaser.GameObjects.Rectangle { constructor(scene, x, y, width, height, fillColor, type = 'normal', hitPoints = 1) { super(scene, x, y, width, height, fillColor); this.setStrokeStyle(1, 0x000000); this.type = type; this.hitPoints = hitPoints; scene.add.existing(this); scene.physics.add.existing(this, true); } hit() { this.hitPoints--; if (this.hitPoints <= 0) { this.destroy(); return true; } this.setFillStyle(0xffff00); // Change color to indicate damage return false; } } class ParallaxBackground { constructor(scene) { this.scene = scene; this.container = this.scene.add.container(0, 0); this.layers = { space: [], foreground: [] }; this.parallaxSpeeds = { space: [0.3, 0.4, 0.5], foreground: [0.6, 0.7, 0.8, 0.9, 1] }; this.width = scene.sys.game.config.width; this.height = scene.sys.game.config.height; this.maxOffset = 100; // Maximum pixel offset for parallax effect } preload() { console.log('All parallax images loaded individually'); } create() { // Add static background this.addImageLayer('static', 'BG'); console.log('Added static background'); // Add space layers this.addImageLayer('space', 'space1'); this.addImageLayer('space', 'space2'); this.addImageLayer('space', 'space3'); // Add foreground layers this.addImageLayer('foreground', 'foreground1'); this.addImageLayer('foreground', 'foreground2'); this.addImageLayer('foreground', 'foreground3'); this.addImageLayer('foreground', 'foreground4'); this.addImageLayer('foreground', 'foreground5'); } addImageLayer(group, key) { let layer = this.scene.add.image(0, 0, key); layer.setOrigin(0.5, 0.5); if (group !== 'static') { // Calculate scale to cover the entire screen const scaleX = this.width / layer.width; const scaleY = this.height / layer.height; const scale = Math.max(scaleX, scaleY); layer.setScale(scale); // Center the layer layer.setPosition(this.width / 2, this.height / 2); } else { // Keep the static background as is layer.setDisplaySize(this.width, this.height); layer.setPosition(this.width / 2, this.height / 2); } this.container.add(layer); if (group !== 'static') { const index = this.layers[group].length; layer.parallaxSpeed = this.parallaxSpeeds[group][index]; this.layers[group].push(layer); console.log(`Added layer: ${key} to group: ${group} with speed: ${layer.parallaxSpeed}`); } } update(paddleX) { const offset = this.calculateOffset(paddleX); Object.keys(this.layers).forEach(group => { this.layers[group].forEach(layer => { const layerOffset = offset * layer.parallaxSpeed; layer.x = this.width / 2 + layerOffset; // Wrap the layer horizontally if it goes off-screen const halfLayerWidth = layer.displayWidth / 2; if (layer.x - halfLayerWidth > this.width) { layer.x -= layer.displayWidth; } else if (layer.x + halfLayerWidth < 0) { layer.x += layer.displayWidth; } }); }); } calculateOffset(paddleX) { const centerX = this.width / 2; const distanceFromCenter = paddleX - centerX; const normalizedDistance = distanceFromCenter / centerX; // Range: -1 to 1 return normalizedDistance * this.maxOffset; } } // Managers: class BrickManager { constructor(scene, isStatic = false) { this.scene = scene; this.bricks = scene.physics.add.staticGroup(); this.totalBricks = 0; this.isStatic = isStatic; this.currentLevel = 1; if (!this.isStatic) { this.brickStartSpeed = 0.25; this.brickMaxSpeed = 5; this.brickSpeed = this.brickStartSpeed; this.moveDownDistance = 20; // Initial move down distance this.moveDownReductionFactor = 0.95; // Reduction factor for each move down this.isMovingLeft = false; this.isMovingDown = false; this.remainingDistance = 0; } } createBricks() { const brickWidth = 50; const brickHeight = 20; const rows = this.currentLevel === 1 ? 5 : 6; const totalColumns = Math.floor(this.scene.game.config.width / brickWidth); const columnsToRemove = 3; const columns = totalColumns - 2 * columnsToRemove; const offsetX = (this.scene.game.config.width - (columns * brickWidth)) / 2; const offsetY = 50; for (let row = 0; row < rows; row++) { for (let col = 0; col < columns; col++) { let type = 'normal'; let hitPoints = 1; let fillColor = 0xff0000; if (this.currentLevel > 1) { const rand = Math.random(); if (rand < 0.1) { type = 'beat'; fillColor = 0x00ff00; } else if (rand < 0.2) { type = 'offbeat'; fillColor = 0x0000ff; } else if (rand < 0.3) { type = 'normal'; hitPoints = 2; fillColor = 0xff00ff; } else if (rand < 0.4) { type = 'teal'; fillColor = 0x00ffff; } else if (rand < 0.5) { type = 'orange'; fillColor = 0xffa500; } } const brick = new Brick( this.scene, offsetX + col * brickWidth + brickWidth / 2, offsetY + row * (brickHeight + 2), brickWidth - 1, brickHeight - 1, fillColor, type, hitPoints ); this.bricks.add(brick); } } this.totalBricks = rows * columns; } spawnPowerUp(x, y) { if (Math.random() < 0.075) { // 7.5% chance to spawn a power-up const powerUpTypes = ['extraLife', 'multiball', 'enlargePaddle', 'catchBall', 'safetyPaddles', 'phaseshift']; const randomType = Phaser.Utils.Array.GetRandom(powerUpTypes); const powerUp = new PowerUp(this.scene, x, y, randomType); this.scene.powerUps.add(powerUp); this.scene.physics.add.overlap(this.scene.paddle, powerUp, this.scene.collectPowerUp, null, this.scene); } } nextLevel() { this.currentLevel++; this.reset(); } update(delta) { if (this.isStatic) return; // Skip movement logic for static bricks const deltaSpeed = this.brickSpeed * (delta / 16.67); if (!this.isMovingDown) { let reachedEdge = false; this.bricks.getChildren().forEach((brick) => { if (!this.isMovingLeft) { brick.x += deltaSpeed; if (brick.x + brick.width / 2 >= this.scene.game.config.width) { reachedEdge = true; } } else { brick.x -= deltaSpeed; if (brick.x - brick.width / 2 <= 0) { reachedEdge = true; } } }); if (reachedEdge) { this.isMovingDown = true; this.remainingDistance = this.moveDownDistance; this.isMovingLeft = !this.isMovingLeft; this.moveDownDistance *= this.moveDownReductionFactor; } } else { const moveDistance = Math.min(deltaSpeed, this.remainingDistance); this.bricks.getChildren().forEach((brick) => { brick.y += moveDistance; }); this.remainingDistance -= moveDistance; if (this.remainingDistance <= 0) { this.isMovingDown = false; } } // Update physics bodies this.bricks.getChildren().forEach((brick) => { brick.body.x = brick.x - brick.width / 2; brick.body.y = brick.y - brick.height / 2; }); } increaseBrickSpeed() { const remainingBricks = this.bricks.countActive(); if (remainingBricks > 0) { const speedIncrease = (this.brickMaxSpeed - this.brickStartSpeed) / this.totalBricks; this.brickSpeed = Math.min(this.brickMaxSpeed, this.brickSpeed + speedIncrease); } } reset() { this.bricks.clear(true, true); this.brickSpeed = this.brickStartSpeed; this.createBricks(); } resetBricksPosition() { const bricks = this.bricks.getChildren(); const rows = 5; const columns = Math.floor(this.scene.game.config.width / 50) - 6; // 50 is brick width, 6 is total columns to remove const offsetX = (this.scene.game.config.width - (columns * 50)) / 2; const offsetY = 50; bricks.forEach((brick, index) => { const row = Math.floor(index / columns); const col = index % columns; brick.x = offsetX + col * 50 + 25; // 25 is half of brick width brick.y = offsetY + row * 22; // 22 is brick height + 2 for spacing brick.body.x = brick.x - brick.width / 2; brick.body.y = brick.y - brick.height / 2; }); // Reset brick movement properties this.isMovingDown = false; this.isMovingLeft = false; this.brickSpeed = this.brickStartSpeed; this.moveDownDistance = 20; } } class MusicManager { constructor() { this.bgMusics = {}; this.currentBgMusic = null; this.sounds = {}; this.masterVolume = 0.5; this.musicVolume = 0.5; this.sfxVolume = 1; } preload(scene) { scene.load.audio('bgMusic', 'https://play.rosebud.ai/assets/Neon-Nights.mp3?873B'); scene.load.audio('balkanBrass', 'https://play.rosebud.ai/assets/Balkan Brass Band.mp3?cyih'); scene.load.audio('bounce', 'https://play.rosebud.ai/assets/click-for-game-menu-131903.mp3?EXzJ'); } create(scene) { if (!this.bgMusics.bgMusic) { this.bgMusics.bgMusic = scene.sound.add('bgMusic', { loop: true, volume: this.masterVolume * this.musicVolume }); } if (!this.bgMusics.balkanBrass) { this.bgMusics.balkanBrass = scene.sound.add('balkanBrass', { loop: true, volume: this.masterVolume * this.musicVolume }); } if (!this.sounds.bounce) { this.sounds.bounce = scene.sound.add('bounce'); } this.currentBgMusic = this.bgMusics.bgMusic; } playBgMusic(key = 'bgMusic') { if (this.currentBgMusic && this.currentBgMusic.isPlaying) { this.currentBgMusic.stop(); } this.currentBgMusic = this.bgMusics[key]; if (this.currentBgMusic) { this.currentBgMusic.play(); } } stopBgMusic() { if (this.bgMusic && this.bgMusic.isPlaying) { this.bgMusic.stop(); } } playSound(key) { if (this.sounds[key]) { this.sounds[key].play({ volume: this.masterVolume * this.sfxVolume }); } } setVolume(type, value) { switch (type) { case 'masterVolume': this.masterVolume = value; break; case 'musicVolume': this.musicVolume = value; break; case 'sfxVolume': this.sfxVolume = value; break; } this.updateVolumes(); } getVolume(type) { switch (type) { case 'masterVolume': return this.masterVolume; case 'musicVolume': return this.musicVolume; case 'sfxVolume': return this.sfxVolume; } } updateVolumes() { if (this.bgMusic) { this.bgMusic.setVolume(this.masterVolume * this.musicVolume); } for (let key in this.sounds) { this.sounds[key].setVolume(this.masterVolume * this.sfxVolume); } } } class ParticleManager { constructor(scene) { this.scene = scene; this.createParticles(); } createParticles() { const particles = this.scene.add.particles('red'); this.emitter = particles.createEmitter({ speed: 100, scale: { start: 0.25, end: 0 }, blendMode: 'ADD', tint: 0x42e0f5 }); this.particleEmitter = this.scene.add.particles('cool white round glowing particle').createEmitter({ x: 400, y: 300, speed: { min: -100, max: 100 }, scale: { start: 0.1, end: 0 }, blendMode: 'ADD', lifespan: 1000, quantity: 5, on: false }); } startFollowing(gameObject) { this.emitter.startFollow(gameObject); } emitBeatParticles() { this.particleEmitter.explode(10, Phaser.Math.Between(0, 800), Phaser.Math.Between(0, 600)); } } // Scenes: class HighScoresScene extends Phaser.Scene { constructor() { super('HighScoresScene'); } create() { const { width, height } = this.scale; // Add an invisible, interactive rectangle that covers the entire scene this.add.rectangle(0, 0, width, height, 0x000000, 0) .setOrigin(0) .setInteractive(); // Create a transparent black background with rounded corners const graphics = this.add.graphics(); graphics.fillStyle(0x000000, 0.9); graphics.fillRoundedRect(width * 0.1, height * 0.1, width * 0.8, height * 0.8, 20); const highScores = JSON.parse(localStorage.getItem('highScores')) || []; this.add.text(width / 2, 100, 'High Scores', { fontSize: '36px', fill: '#fff' }).setOrigin(0.5); highScores.forEach((score, index) => { this.add.text(width / 2, 180 + index * 40, `${index + 1}. ${score}`, { fontSize: '28px', fill: '#fff' }).setOrigin(0.5); }); // If there are fewer than 5 scores, add empty slots for (let i = highScores.length; i < 5; i++) { this.add.text(width / 2, 180 + i * 40, `${i + 1}. ---`, { fontSize: '28px', fill: '#fff' }).setOrigin(0.5); } // Add Reset High Scores button const resetScoresButton = this.add.text(width / 2, height - 160, 'Reset High Scores', { fontSize: '24px', fill: '#fff', backgroundColor: '#000', padding: { x: 10, y: 5 } }).setOrigin(0.5).setInteractive(); resetScoresButton.on('pointerdown', () => { localStorage.setItem('highScores', JSON.stringify([0, 0, 0, 0, 0])); this.scene.restart(); // Restart the current scene to reflect changes }); // Add close button const closeButton = this.add.text(width / 2, height - 100, 'Close', { fontSize: '28px', fill: '#fff', backgroundColor: '#000', padding: { x: 10, y: 5 } }).setOrigin(0.5).setInteractive(); closeButton.on('pointerdown', () => { this.scene.stop(); }); } } class StartScene extends Phaser.Scene { constructor() { super('StartScene'); } preload() { this.load.image('ball', 'https://play.rosebud.ai/assets/ball (1).png?RkCN'); this.load.image('powerup', 'https://play.rosebud.ai/assets/Mouse-Left.png?Ys4E'); this.load.image('planet', 'https://play.rosebud.ai/assets/floatingspace.png?embH'); console.log('Power-up image loaded'); // Debug log // Only preload if the music hasn't been loaded yet if (!globalMusicManager.bgMusic) { globalMusicManager.preload(this); } } create() { const { width, height } = this.scale; // Create background const background = this.add.image(width / 2, height / 2, 'planet'); const scaleX = width / background.width; const scaleY = height / background.height; const scale = Math.max(scaleX, scaleY); background.setScale(scale).setScrollFactor(0); // Only create if the music hasn't been created yet if (!globalMusicManager.bgMusic) { globalMusicManager.create(this); } // Play music if it's not already playing // Remove music playback from Start scene globalMusicManager.stopBgMusic(); // Create static bricks for the Start scene this.brickManager = new BrickManager(this, true); this.createBricks(); this.createBall(); // Set up collisions this.physics.add.collider(this.ball, this.brickManager.bricks, this.hitBrick, null, this); // Add title (on top of bricks) this.add.text(width / 2, height / 4, 'Bonkout', { fontSize: '64px', fill: '#fff', stroke: '#000', strokeThickness: 6 }).setOrigin(0.5).setDepth(1); // Enable world bounds collision for the ball this.physics.world.setBoundsCollision(true, true, true, true); // Add Start Game button const startButton = this.add.text(width / 2, height * 2 / 3, 'Start Game', { fontSize: '32px', fill: '#fff', padding: { x: 20, y: 10 } }).setOrigin(0.5).setInteractive(); this.addButtonStyle(startButton); startButton.on('pointerdown', () => { this.scene.start('Game'); }); // Add Settings button const settingsButton = this.add.text(width / 2, height * 3 / 4 + 60, 'Settings', { fontSize: '32px', fill: '#fff', padding: { x: 20, y: 10 } }).setOrigin(0.5).setInteractive(); this.addButtonStyle(settingsButton); settingsButton.on('pointerdown', () => { this.scene.launch('Settings', { fromScene: 'Start' }); }); // Add High Scores button const highScoresButton = this.add.text(width / 2, height * 3 / 4 + 120, 'High Scores', { fontSize: '32px', fill: '#fff', padding: { x: 20, y: 10 } }).setOrigin(0.5).setInteractive(); this.addButtonStyle(highScoresButton); highScoresButton.on('pointerdown', () => { this.scene.launch('HighScoresScene'); }); } addButtonStyle(button) { button.setStyle({ backgroundColor: 'rgba(0,0,0,0.7)', padding: { left: 20, right: 20, top: 10, bottom: 10 }, borderRadius: 15 }); button.on('pointerover', () => { button.setStyle({ backgroundColor: 'rgba(0,0,0,0.8)', padding: { left: 20, right: 20, top: 10, bottom: 10 }, borderRadius: 15 }); }); button.on('pointerout', () => { button.setStyle({ backgroundColor: 'rgba(0,0,0,0.7)', padding: { left: 20, right: 20, top: 10, bottom: 10 }, borderRadius: 15 }); }); } createBricks() { const { width, height } = this.scale; const brickWidth = 40; const brickHeight = 20; for (let y = 0; y < height; y += brickHeight) { for (let x = 0; x < width; x += brickWidth) { const brick = new Brick( this, x + brickWidth / 2, y + brickHeight / 2, brickWidth - 1, brickHeight - 1, Phaser.Math.RND.pick([0xff0000, 0x00ff00, 0x0000ff, 0xffff00, 0xff00ff, 0x00ffff]) ); this.brickManager.bricks.add(brick); } } } createBall() { const { width, height } = this.scale; this.ball = new Ball(this, width / 2, height / 2); this.ball.setVelocity(200, -200); // Give initial velocity this.ball.setCollideWorldBounds(true); this.ball.setBounce(1); } hitBrick(ball, brick) { brick.destroy(); // Optionally, increase score or play a sound effect here } update(time, delta) { if (this.ball) { this.ball.update(delta); } // No need to update bricks in the Start scene as they are static } } class Game extends Phaser.Scene { constructor() { super('Game'); this.score = 0; this.lives = 3; // Start with 3 lives (2 extra) this.isPaused = false; this.debugMode = false; this.hud = null; // Initialize HUD reference this.lastBallPosition = new Phaser.Math.Vector2(); this.currentLevel = 1; this.hudInitialized = false; this.powerUpActive = false; this.powerUpTimer = null; this.powerUps = null; this.ParticleManager = null; this.safetyPaddles = []; this.activePowerUps = {}; // Initialize as an empty object } updateHighScores(score) { let highScores = JSON.parse(localStorage.getItem('highScores')) || []; highScores.push(score); highScores.sort((a, b) => b - a); highScores = highScores.slice(0, 5); localStorage.setItem('highScores', JSON.stringify(highScores)); return highScores; } preload() { this.load.image('background', 'https://play.rosebud.ai/assets/planet environment in pixel art style.png?GHnt'); this.load.image('ball', 'https://play.rosebud.ai/assets/ball.png?fCn4'); this.load.image('red', 'https://play.rosebud.ai/assets/red.png?0sHA'); this.load.image('paddle', 'https://play.rosebud.ai/assets/rounded long rectangle dark orange color.png?u1XO'); this.load.image('pauseButton', 'https://play.rosebud.ai/assets/simple pause symbole against a green background.png?Bmyj'); this.load.image('cool white round glowing particle', 'https://play.rosebud.ai/assets/cool white round glowing particle.png?SNPT'); this.load.image('neon glowing green orb particle', 'https://play.rosebud.ai/assets/bubble.png?6tT1'); // Load space layers this.load.image('space1', 'https://play.rosebud.ai/assets/Space1.png?B1eQ'); this.load.image('space2', 'https://play.rosebud.ai/assets/Space2.png?mkyd'); this.load.image('space3', 'https://play.rosebud.ai/assets/Space3.png?OhJx'); // Load foreground layers this.load.image('foreground1', 'https://play.rosebud.ai/assets/Foreground1.png?z7zA'); this.load.image('foreground2', 'https://play.rosebud.ai/assets/Foreground2.png?vMJl'); this.load.image('foreground3', 'https://play.rosebud.ai/assets/Foreground3.png?SmJl'); this.load.image('foreground4', 'https://play.rosebud.ai/assets/Foreground4.png?oRuW'); this.load.image('foreground5', 'https://play.rosebud.ai/assets/Foreground5.png?UMCQ'); // Load static background this.load.image('BG', 'https://play.rosebud.ai/assets/BG.png?gUuD'); globalMusicManager.preload(this); } create() { this.parallaxBackground = new ParallaxBackground(this); this.parallaxBackground.create(); this.ParticleManager = new ParticleManager(this); this.createGameObjects(); this.resetGameState(); this.powerUps = this.physics.add.group(); this.createUI(); this.catchBallPowerUpActive = false; this.caughtBall = null; this.setUpCollisions(); this.setUpInput(); this.createPauseButton(); // Set up world bounds collision for the ball this.physics.world.setBoundsCollision(true, true, true, false); // Create collision object at the bottom for extra balls this.bottomCollider = this.add.rectangle(400, 598, 800, 5, 0x00ff00) .setAlpha(0.8); this.physics.add.existing(this.bottomCollider, true); this.bottomCollider.body.immovable = true; this.bottomCollider.setVisible(false); // Disable context menu this.input.mouse.disableContextMenu(); globalMusicManager.create(this); // Always start the music from the beginning globalMusicManager.stopBgMusic(); this.updateBackgroundMusic(); // Use the new method to play the correct music // Create countdown circle and text this.countdownCircle = this.add.circle(400, 300, 50, 0xffffff) .setOrigin(0.5) .setDepth(999) .setAlpha(0) .setVisible(false); this.countdownText = this.add.text(400, 300, '', { fontSize: '64px', fill: '#000000', fontStyle: 'bold' }) .setOrigin(0.5) .setDepth(1000) .setVisible(false); // Set up click-to-slow mechanic this.input.on('pointerdown', this.slowBall, this); this.input.on('pointerup', this.normalBall, this); // Create vignette this.vignette = this.add.graphics() .fillStyle(0xffffff, 0.5) .fillCircle(400, 300, 600) .setBlendMode(Phaser.BlendModes.OVERLAY) .setDepth(1000) .setAlpha(0); // Create particle emitter this.particleEmitter = this.add.particles('cool white round glowing particle').createEmitter({ x: 400, y: 300, speed: { min: -100, max: 100 }, scale: { start: 0.1, end: 0 }, blendMode: 'ADD', lifespan: 1000, quantity: 5, on: false }); // Initialize beat timing this.nextBeatTime = this.time.now + this.beatStartTime; // Start the countdown to begin the game this.startCountdown(); } startCountdown() { this.isPaused = true; let count = 3; // Reset visibility and alpha for countdown elements this.countdownCircle.setVisible(true).setAlpha(0.5); this.countdownText.setVisible(true).setAlpha(1); // Disable pause button at start of countdown this.pauseButton.input.enabled = false; this.pauseButton.setAlpha(0.5); this.updateCountdownDisplay(count); // Store the ball's velocity this.ballVelocity = this.ball.body.velocity.clone(); // Stop the ball this.ball.setVelocity(0, 0); const countdownTimer = this.time.addEvent({ delay: 1000, repeat: 3, callback: () => { count--; if (count > 0) { this.updateCountdownDisplay(count); } else if (count === 0) { this.updateCountdownDisplay('GO!'); } else { this.countdownText.setText(''); this.countdownCircle.setAlpha(0); this.isPaused = false; // Restore the ball's velocity this.ball.setVelocity(this.ballVelocity.x, this.ballVelocity.y); } } }); } updateCountdownDisplay(value) { this.countdownText.setText(value.toString()); this.countdownCircle.setAlpha(0.5); // Pulsate effect this.tweens.add({ targets: [this.countdownText, this.countdownCircle], scale: { from: 1, to: 1.2 }, duration: 200, yoyo: true, ease: 'Cubic.easeOut' }); // Hide countdown elements when 'GO!' is displayed if (value === 'GO!') { this.tweens.add({ targets: [this.countdownText, this.countdownCircle], alpha: 0, duration: 500, onComplete: () => { this.countdownText.setVisible(false); this.countdownCircle.setVisible(false); } }); } } createGameObjects() { this.ball = new Ball(this, 400, 200); this.paddle = new Paddle(this, 400, 500); this.brickManager = new BrickManager(this); this.brickManager.createBricks(); this.ParticleManager.startFollowing(this.ball); // Create HUD this.hud = new HUD(this, 0, 0); this.hudInitialized = true; } createUI() { this.bounceText = this.add.text(400, 200, 'Bounce!', { fontSize: '48px', fill: '#ff0' }).setOrigin(0.5).setVisible(false); } setUpCollisions() { this.ball.body.onWorldBounds = true; this.physics.world.on('worldbounds', this.onWorldBounds, this); this.physics.add.collider(this.ball, this.paddle, this.hitPad, null, this); this.physics.add.collider(this.ball, this.brickManager.bricks, this.hitBrick, null, this); this.physics.add.collider(this.paddle, this.physics.world.staticGroup, this.collectPowerUp, null, this); } onWorldBounds(body, up, down, left, right) { if (body.gameObject === this.ball) { if (down) { this.gameOverHandler(); } else { globalMusicManager.playSound('bounce'); this.addCameraEffects(); // Adjust velocity for ceiling collision if (up) { const minVerticalVelocity = 60; // Minimum vertical velocity after bounce if (Math.abs(body.velocity.y) < minVerticalVelocity) { body.setVelocityY(minVerticalVelocity); } } // Ensure minimum horizontal velocity const minHorizontalVelocity = 50; if (Math.abs(body.velocity.x) < minHorizontalVelocity) { body.setVelocityX(body.velocity.x > 0 ? minHorizontalVelocity : -minHorizontalVelocity); } } } } collectPowerUp(paddle, powerUp) { console.log(`Power-up collected: ${powerUp.type}`); // Debug log powerUp.destroy(); this.activatePowerUp(powerUp.type); } activatePowerUp(type) { switch (type) { case 'extraLife': this.lives++; this.hud.updateLives(this.lives); break; case 'multiball': this.spawnExtraBall(); break; case 'enlargePaddle': this.paddle.setScale(this.paddle.scaleX * 1.5, this.paddle.scaleY); this.activePowerUps.enlargePaddle = 10000; // 10 seconds break; case 'catchBall': this.catchBallPowerUpActive = true; this.activePowerUps.catchBall = 6000; // 6 seconds break; case 'safetyPaddles': if (!this.activePowerUps.safetyPaddles) { this.activateSafetyPaddles(); } this.activePowerUps.safetyPaddles = (this.activePowerUps.safetyPaddles || 0) + 10000; // Add 10 seconds break; case 'phaseshift': this.activePowerUps.phaseshift = 6000; // 6 seconds break; } this.hud.updatePowerUps(this.activePowerUps); } activateSafetyPaddles() { if (this.safetyPaddles.length === 0) { const safetyPaddle1 = new Paddle(this, 100, 550); const safetyPaddle2 = new Paddle(this, 700, 575); safetyPaddle1.setScale(0.375, 0.075); // Half the x width safetyPaddle2.setScale(0.375, 0.075); // Half the x width this.physics.add.collider(this.ball, safetyPaddle1, this.hitPad, null, this); this.physics.add.collider(this.ball, safetyPaddle2, this.hitPad, null, this); this.safetyPaddles.push(safetyPaddle1, safetyPaddle2); const movePaddle = (paddle, speed) => { this.tweens.add({ targets: paddle, x: paddle.x === 100 ? 700 : 100, duration: 4000 / speed, ease: 'Linear', yoyo: true, repeat: -1 }); }; movePaddle(safetyPaddle1, 1); movePaddle(safetyPaddle2, 1.5); } this.safetyPaddlesTime += 10000; // Add 10 seconds if (this.safetyPaddlesTimer) { this.safetyPaddlesTimer.remove(); } this.safetyPaddlesTimer = this.time.addEvent({ delay: this.safetyPaddlesTime, callback: this.deactivateSafetyPaddles, callbackScope: this }); } deactivateSafetyPaddles() { this.safetyPaddles.forEach(paddle => paddle.destroy()); this.safetyPaddles = []; this.safetyPaddlesTime = 0; if (this.safetyPaddlesTimer) { this.safetyPaddlesTimer.remove(); this.safetyPaddlesTimer = null; } } spawnExtraBall() { const newBall = new Ball(this, this.ball.x, this.ball.y, true); this.physics.add.collider(newBall, this.paddle, this.hitPadExtraBall, null, this); this.physics.add.collider(newBall, this.brickManager.bricks, this.hitBrickExtraBall, null, this); this.physics.add.collider(newBall, this.bottomCollider, this.hitBottomExtraBall, null, this); this.physics.world.on('worldbounds', this.onWorldBoundsExtraBall, this); const angle = Phaser.Math.Between(-60, 60); newBall.setVelocity( Math.cos(angle) * newBall.ballSpeed, Math.sin(angle) * newBall.ballSpeed ); newBall.setCollideWorldBounds(true); // Ensure the bounce text is on top of other game objects if (newBall.bounceText) { this.children.bringToTop(newBall.bounceText); } } hitBottomExtraBall(ball, bottomCollider) { // Bounce the extra ball off the bottom collider ball.setVelocityY(-Math.abs(ball.body.velocity.y)); ball.bounceCount++; globalMusicManager.playSound('bounce'); } hitPadExtraBall(ball, pad) { ball.bounceCount++; this.hitPad(ball, pad); } hitBrickExtraBall(ball, brick) { ball.bounceCount++; this.hitBrick(ball, brick); } onWorldBoundsExtraBall(body, up, down, left, right) { if (body.gameObject instanceof Ball && body.gameObject.isExtraBall) { body.gameObject.bounceCount++; } } deactivatePowerUp() { this.powerUpActive = false; if (this.ball.body.velocity.x === 0 && this.ball.body.velocity.y === 0) { // Ball hasn't been launched, so launch it automatically this.launchBall(); } this.input.off('pointerdown', this.releaseBall, this); } releaseBall() { if (this.powerUpActive) { this.launchBall(); if (this.powerUpTimer) this.powerUpTimer.remove(); this.deactivatePowerUp(); } } launchBall() { this.ball.body.enable = true; // Re-enable physics for the ball // Calculate a random angle between -60 and 60 degrees const angle = Phaser.Math.Between(-60, 60); const speed = this.ball.BALL_START_SPEED; const velocityX = speed * Math.sin(Phaser.Math.DegToRad(angle)); const velocityY = -speed * Math.cos(Phaser.Math.DegToRad(angle)); // Negative to go upwards this.ball.setVelocity(velocityX, velocityY); } setUpInput() { this.input.on('pointermove', (pointer) => { if (!this.godMode) { this.paddle.move(pointer.x); } }); this.input.on('pointerdown', (pointer) => { if (pointer.rightButtonDown()) { this.sendBallBack(); } }); // Add keyboard input for sending the ball back this.input.keyboard.on('keydown-SPACE', () => { this.sendBallBack(); }); } isBallAtPaddle() { const paddleTop = this.paddle.y - this.paddle.displayHeight / 2; const ballBottom = this.ball.y + this.ball.displayHeight / 2; const paddleLeft = this.paddle.x - this.paddle.displayWidth / 2; const paddleRight = this.paddle.x + this.paddle.displayWidth / 2; return ( ballBottom >= paddleTop && this.ball.x >= paddleLeft && this.ball.x <= paddleRight && this.ball.body.velocity.y > 0 ); } sendBallBack() { const angle = Phaser.Math.Between(-60, 60); const speed = this.ball.body.velocity.length(); const velocityX = speed * Math.sin(Phaser.Math.DegToRad(angle)); const velocityY = -Math.abs(speed * Math.cos(Phaser.Math.DegToRad(angle))); // Ensure upward movement this.ball.setVelocity(velocityX, velocityY); globalMusicManager.playSound('bounce'); } update(time, delta) { const adjustedDelta = delta * GAME_SETTINGS.gameSpeed; if (!this.isPaused) { if (this.powerUpActive) { // Position the ball 10px above the paddle and centered on its x-axis const ballY = this.paddle.y - this.paddle.displayHeight / 2 - this.ball.displayHeight / 2 - 10; this.ball.setPosition(this.paddle.x, ballY); } else if (this.ball.body.enable) { this.ball.update(adjustedDelta); // Check if the main ball is below the screen if (this.ball.y > this.sys.game.config.height) { if (this.activePowerUps.phaseshift) { // Teleport the ball to the top of the screen this.ball.setPosition(this.ball.x, 0); // Ensure the ball is moving downwards if (this.ball.body.velocity.y < 0) { this.ball.body.velocity.y *= -1; } } else { this.gameOverHandler(); } } } // Update all extra balls this.physics.world.bodies.entries.forEach(body => { if (body.gameObject instanceof Ball && body.gameObject.isExtraBall) { body.enable = true; // Ensure physics is enabled for extra balls if (body.gameObject.savedVelocity) { body.setVelocity(body.gameObject.savedVelocity.x, body.gameObject.savedVelocity.y); body.gameObject.savedVelocity = null; } body.gameObject.update(adjustedDelta); // Check if the extra ball is below the screen if (body.gameObject.y > this.sys.game.config.height) { body.gameObject.destroy(); } } }); this.brickManager.update(adjustedDelta); this.parallaxBackground.update(this.paddle.x); if (this.brickManager.bricks.countActive() === 0) { this.nextLevel(); } // Update and check for out-of-bounds power-ups this.powerUps.getChildren().forEach((powerUp) => { powerUp.y += adjustedDelta * 0.2; // Adjust fall speed here if (powerUp.isOutOfBounds()) { powerUp.destroy(); } }); // Update safety paddles this.safetyPaddles.forEach(paddle => paddle.update(adjustedDelta)); // Update safety paddles timer if (this.safetyPaddlesTime > 0) { this.safetyPaddlesTime -= adjustedDelta; if (this.safetyPaddlesTime <= 0) { this.deactivateSafetyPaddles(); } } // Reset paddle rotation when not slowing time this.paddle.resetRotation(); // Continuous collision detection this.checkContinuousCollision(); // Check if the ball is at the paddle if (this.isBallAtPaddle()) { this.paddle.setTint(0x00ff00); // Green tint to indicate the ball can be sent back } else { this.paddle.clearTint(); } // Update active power-ups and handle deactivation for (const [type, time] of Object.entries(this.activePowerUps)) { this.activePowerUps[type] -= adjustedDelta; if (this.activePowerUps[type] <= 0) { this.deactivatePowerUp(type); delete this.activePowerUps[type]; } } this.hud.updatePowerUps(this.activePowerUps); } else { // Ensure all balls stay in place when paused this.ball.setVelocity(0, 0); this.physics.world.bodies.entries.forEach(body => { if (body.gameObject instanceof Ball) { if (body.gameObject.isExtraBall) { body.gameObject.savedVelocity = { x: body.velocity.x, y: body.velocity.y }; } body.gameObject.setVelocity(0, 0); } }); } // Allow paddle movement even when paused if (this.input.activePointer.isDown) { this.paddle.move(this.input.activePointer.x); } // Enable pause button after countdown if (!this.isPaused && !this.pauseButton.input.enabled) { this.pauseButton.input.enabled = true; this.pauseButton.setAlpha(1); // Full opacity when enabled } // Update last ball position this.lastBallPosition.set(this.ball.x, this.ball.y); } deactivatePowerUp(type) { switch (type) { case 'enlargePaddle': this.paddle.setScale(this.paddle.scaleX / 1.5, this.paddle.scaleY); break; case 'catchBall': this.catchBallPowerUpActive = false; if (this.caughtBall) { this.launchCaughtBall(); } break; case 'safetyPaddles': this.deactivateSafetyPaddles(); break; case 'phaseshift': // No specific deactivation needed break; } delete this.activePowerUps[type]; } checkContinuousCollision() { const ray = new Phaser.Geom.Line( this.lastBallPosition.x, this.lastBallPosition.y, this.ball.x, this.ball.y ); const paddlePoints = [ new Phaser.Geom.Point(-this.paddle.displayWidth / 2, -this.paddle.displayHeight / 2), new Phaser.Geom.Point(this.paddle.displayWidth / 2, -this.paddle.displayHeight / 2), new Phaser.Geom.Point(this.paddle.displayWidth / 2, this.paddle.displayHeight / 2), new Phaser.Geom.Point(-this.paddle.displayWidth / 2, this.paddle.displayHeight / 2) ]; const rotatedPoints = paddlePoints.map(point => { const rotated = Phaser.Math.Rotate(point, this.paddle.rotation); return new Phaser.Geom.Point( rotated.x + this.paddle.x, rotated.y + this.paddle.y ); }); // Check intersection with each edge of the paddle for (let i = 0; i < rotatedPoints.length; i++) { const start = rotatedPoints[i]; const end = rotatedPoints[(i + 1) % rotatedPoints.length]; const edge = new Phaser.Geom.Line(start.x, start.y, end.x, end.y); if (Phaser.Geom.Intersects.LineToLine(ray, edge)) { this.hitPad(this.ball, this.paddle); break; } } } hitPad(ball, pad) { this.score += 1; this.hud.updateScore(this.score); globalMusicManager.playSound('bounce'); if (this.catchBallPowerUpActive) { this.catchBall(ball); } else { // Calculate the hit position relative to the paddle's center const relativeX = ball.x - pad.x; const relativeY = ball.y - pad.y; // Rotate the hit position based on the paddle's rotation const rotatedX = relativeX * Math.cos(-pad.rotation) - relativeY * Math.sin(-pad.rotation); const rotatedY = relativeX * Math.sin(-pad.rotation) + relativeY * Math.cos(-pad.rotation); // Calculate the hit position as a fraction of the paddle's width const hitPosition = rotatedX / (pad.displayWidth / 2); // Calculate the base angle const baseAngle = hitPosition * (Math.PI / 4); // Calculate the final angle, incorporating the paddle's rotation const finalAngle = baseAngle + pad.rotation; const speed = ball.body.velocity.length(); ball.setVelocity( Math.sin(finalAngle) * speed, -Math.cos(finalAngle) * speed ); } this.addCameraEffects(); this.showBounceText(); } catchBall(ball) { if (!ball.isExtraBall) { this.caughtBall = ball; ball.setVelocity(0, 0); this.input.on('pointermove', this.moveCaughtBall, this); this.input.on('pointerdown', this.launchCaughtBall, this); } } moveCaughtBall(pointer) { if (this.caughtBall) { this.caughtBall.x = Phaser.Math.Clamp(pointer.x, this.paddle.x - this.paddle.displayWidth / 2, this.paddle.x + this.paddle.displayWidth / 2); this.caughtBall.y = this.paddle.y - this.paddle.displayHeight / 2 - this.caughtBall.displayHeight / 2; } } launchCaughtBall() { if (this.caughtBall) { const speed = this.caughtBall.ballSpeed; this.caughtBall.setVelocity(0, -speed); this.caughtBall = null; this.input.off('pointermove', this.moveCaughtBall, this); this.input.off('pointerdown', this.launchCaughtBall, this); } } hitBrick(ball, brick) { if (brick.hit()) { this.score += 10; this.hud.updateScore(this.score); this.addCameraEffects(); this.brickManager.increaseBrickSpeed(); this.brickManager.spawnPowerUp(brick.x, brick.y); console.log('Attempting to spawn power-up at:', brick.x, brick.y); // Debug log globalMusicManager.playSound('bounce'); if (brick.type === 'teal') { const magentaBrick = new Brick( this, brick.x, brick.y, brick.width, brick.height, 0xff00ff, 'normal', 2 ); this.brickManager.bricks.add(magentaBrick); const existingBrick = this.getRandomExistingBlock(); if (existingBrick) { magentaBrick.isMovingLeft = existingBrick.isMovingLeft; magentaBrick.isMovingDown = existingBrick.isMovingDown; magentaBrick.remainingDistance = existingBrick.remainingDistance; } } if (brick.type === 'orange') { const magentaTealBrick = new Brick( this, brick.x, brick.y, brick.width, brick.height, 0x00ffff, 'teal', 1 ); this.brickManager.bricks.add(magentaTealBrick); this.copyMovementProperties(magentaTealBrick); } if (this.brickManager.bricks.countActive() === 0) { this.nextLevel(); } } } copyMovementProperties(newBrick) { const existingBrick = this.getRandomExistingBlock(); if (existingBrick) { newBrick.isMovingLeft = existingBrick.isMovingLeft; newBrick.isMovingDown = existingBrick.isMovingDown; newBrick.remainingDistance = existingBrick.remainingDistance; } } nextLevel() { this.currentLevel++; this.brickManager.nextLevel(); this.ball.reset(); this.paddle.x = 400; this.paddle.y = 500; this.updateBackgroundMusic(); // New method to update background music this.startCountdown(); } updateBackgroundMusic() { if (this.currentLevel === 3) { globalMusicManager.playBgMusic('balkanBrass'); } else { globalMusicManager.playBgMusic('bgMusic'); } } slowBall() { this.ball.slow(); } normalBall() { this.ball.normal(); } gameOverHandler() { this.lives--; this.hud.updateLives(this.lives); if (this.lives > 0) { // Reset ball position this.ball.reset(); // Reset paddle position this.paddle.x = 400; this.paddle.y = 500; // Reset bricks to the top this.brickManager.resetBricksPosition(); // Start countdown this.startCountdown(); } else { // Game over globalMusicManager.playSound('gameOver'); this.scene.pause(); this.scene.launch('GameOverScene', { score: this.score, gameSpeed: GAME_SETTINGS.gameSpeed }); } } addCameraEffects() { this.cameras.main.zoom = 1.05; this.cameras.main.rotation = Phaser.Math.DegToRad(Phaser.Math.Between(-2, 2)); this.tweens.add({ targets: this.cameras.main, zoom: 1, rotation: 0, duration: 200, ease: 'Sine.easeOut' }); } showBounceText() { this.bounceText.setVisible(true); this.tweens.add({ targets: this.bounceText, y: 150, alpha: 0, duration: 1000, ease: 'Power2', onComplete: () => { this.bounceText.setVisible(false); this.bounceText.setPosition(400, 200); this.bounceText.setAlpha(1); } }); } createPauseButton() { this.pauseButton = this.add.image(750, 50, 'pauseButton') .setScale(0.1) .setInteractive() .setAlpha(0.5); // Start with a dimmed appearance this.pauseButton.on('pointerdown', () => { if (!this.isPaused) { this.isPaused = true; this.scene.pause(); this.scene.launch('Settings', { fromScene: 'Game' }); } }); this.pauseButton.input.enabled = false; // Disable interaction initially } // Portal-related methods have been removed getRandomExistingBlock() { const existingBlocks = this.brickManager.bricks.getChildren(); if (existingBlocks.length > 0) { return Phaser.Utils.Array.GetRandom(existingBlocks); } return null; } resetGameState() { this.score = 0; this.lives = 3; this.currentLevel = 1; this.isPaused = false; if (this.hudInitialized && this.hud) { this.hud.updateScore(this.score); this.hud.updateLives(this.lives); } } } class ActivePowerupDisplay extends Phaser.GameObjects.Container { constructor(scene, x, y) { super(scene, x, y); // Create background this.background = scene.add.graphics(); this.background.fillStyle(0x000000, 0.7); this.background.fillRoundedRect(0, 0, 180, 110, 10); this.add(this.background); // Add title this.title = scene.add.text(90, 10, 'Active Power-ups', { fontSize: '16px', fill: '#FFD700', // Changed to gold color fontStyle: 'bold' }).setOrigin(0.5, 0); this.add(this.title); this.powerUpTexts = {}; scene.add.existing(this); } updatePowerUps(activePowerUps) { // Remove old texts Object.values(this.powerUpTexts).forEach(text => text.destroy()); this.powerUpTexts = {}; // Add new texts for active power-ups let index = 0; for (const [type, time] of Object.entries(activePowerUps)) { const yPosition = 30 + index * 25; let displayName = type; switch (type) { case 'safetyPaddles': displayName = 'safety'; break; case 'catchBall': displayName = 'catch'; break; case 'enlargePaddle': displayName = 'enlarge'; break; } this.powerUpTexts[type] = this.scene.add.text(8, yPosition, `${displayName}: ${(time / 1000).toFixed(1)}s`, { fontSize: '18px', fill: '#fff' }); this.add(this.powerUpTexts[type]); index++; } } } class HUD extends Phaser.GameObjects.Container { constructor(scene, x, y) { super(scene, x, y); this.scoreText = scene.add.text(16, 16, 'Score: 0', { fontSize: '32px', fill: '#FFD700' // Gold color }); this.livesText = scene.add.text(16, 56, 'Lives: 3', { fontSize: '32px', fill: '#FFD700' // Gold color }); this.activePowerupDisplay = new ActivePowerupDisplay(scene, 600, 316); this.add([this.scoreText, this.livesText, this.activePowerupDisplay]); scene.add.existing(this); } updateScore(score) { this.scoreText.setText('Score: ' + score); this.scoreText.setFill('#FFD700'); // Ensure it remains gold } updateLives(lives) { this.livesText.setText('Lives: ' + lives); this.livesText.setFill('#FFD700'); // Ensure it remains gold } updatePowerUps(activePowerUps) { this.activePowerupDisplay.updatePowerUps(activePowerUps); } } class GameOverScene extends Phaser.Scene { constructor() { super('GameOverScene'); } init(data) { this.score = data.score; this.gameSpeed = data.gameSpeed; } create() { const { width, height } = this.scale; this.add.rectangle(0, 0, width, height, 0x000000, 0.7).setOrigin(0); this.add.text(width / 2, height / 2 - 100, 'Game Over', { fontSize: '64px', fill: '#fff' }).setOrigin(0.5); // Calculate the speed multiplier (1x at 0.25 speed, 4x at 1.5 speed) const speedMultiplier = 1 + (this.gameSpeed - 0.25) * (3 / 1.25); const finalScore = Math.round(this.score * speedMultiplier); this.add.text(width / 2, height / 2 - 20, `Base Score: ${this.score}`, { fontSize: '32px', fill: '#fff' }).setOrigin(0.5); this.add.text(width / 2, height / 2 + 20, `Speed Multiplier: ${speedMultiplier.toFixed(2)}x`, { fontSize: '32px', fill: '#fff' }).setOrigin(0.5); this.add.text(width / 2, height / 2 + 60, `Final Score: ${finalScore}`, { fontSize: '32px', fill: '#fff' }).setOrigin(0.5); // Update high scores with the final score this.scene.get('Game').updateHighScores(finalScore); // Launch the HighScoresScene this.scene.launch('HighScoresScene'); const restartButton = this.add.text(width / 2, height / 2 + 200, 'Main Menu', { fontSize: '32px', fill: '#fff', backgroundColor: '#000', padding: { x: 10, y: 5 } }).setOrigin(0.5).setInteractive(); restartButton.on('pointerdown', () => { this.scene.stop('GameOverScene'); this.scene.stop('Game'); this.scene.stop('HighScoresScene'); globalMusicManager.stopBgMusic(); // Stop the music when returning to the menu this.scene.start('StartScene'); }); } } class Settings extends Phaser.Scene { constructor() { super('Settings'); } init(data) { this.fromScene = data.fromScene || 'Start'; } create() { const { width, height } = this.scale; // Create a black window with rounded corners const graphics = this.add.graphics(); graphics.fillStyle(0x000000, 0.9); graphics.fillRoundedRect(width * 0.1, height * 0.1, width * 0.8, height * 0.8, 20); // Title (unchanged position) this.add.text(width / 2, height / 6, 'Settings', { fontSize: '64px', fill: '#fff' }).setOrigin(0.5); // Master Volume Slider (moved up by 20px from previous position) this.createSlider(width / 2, height / 4 + 60, 'Master Volume', 'masterVolume'); // Music Volume Slider (moved up by 20px from previous position) this.createSlider(width / 2, height * 3 / 8 + 60, 'Music Volume', 'musicVolume'); // Sound Effects Volume Slider (moved up by 20px from previous position) this.createSlider(width / 2, height / 2 + 60, 'Sound Effects Volume', 'sfxVolume'); // Game Speed Slider (moved up by 20px from previous position) this.createSlider(width / 2, height * 5 / 8 + 60, 'Game Speed', 'gameSpeed', 0.25, 1.5); // Back button (unchanged position) const backButton = this.add.text(width / 2, height * 5 / 6, 'Back', { fontSize: '32px', fill: '#fff', backgroundColor: '#333', padding: { x: 10, y: 5 } }).setOrigin(0.5).setInteractive(); backButton.on('pointerdown', () => { if (this.fromScene === 'Game') { this.scene.stop(); const gameScene = this.scene.get('Game'); this.scene.resume('Game'); gameScene.startCountdown(); } else { this.scene.stop(); this.scene.resume('StartScene'); } }); } createSlider(x, y, label, settingType, min = 0, max = 1) { this.add.text(x, y - 40, label, { fontSize: '24px', fill: '#fff' }).setOrigin(0.5); const track = this.add.rectangle(x, y, 200, 10, 0x808080).setOrigin(0.5); const thumb = this.add.rectangle(x, y, 20, 20, 0xffffff).setOrigin(0.5).setInteractive(); let initialValue; let multiplierText; if (settingType === 'gameSpeed') { initialValue = (GAME_SETTINGS.gameSpeed - min) / (max - min); multiplierText = this.add.text(x - 140, y, '', { fontSize: '20px', fill: '#fff' }).setOrigin(1, 0.5); this.updateMultiplierText(multiplierText, GAME_SETTINGS.gameSpeed); } else { initialValue = globalMusicManager.getVolume(settingType); } thumb.x = track.x - track.width / 2 + (track.width * initialValue); this.input.setDraggable(thumb); thumb.on('drag', (pointer, dragX) => { thumb.x = Phaser.Math.Clamp(dragX, track.x - track.width / 2, track.x + track.width / 2); const value = (thumb.x - (track.x - track.width / 2)) / track.width; if (settingType === 'gameSpeed') { GAME_SETTINGS.gameSpeed = min + (max - min) * value; this.updateMultiplierText(multiplierText, GAME_SETTINGS.gameSpeed); } else { globalMusicManager.setVolume(settingType, value); } }); } updateMultiplierText(textObject, gameSpeed) { const multiplier = 1 + (gameSpeed - 0.25) * (3 / 1.25); textObject.setText(`${multiplier.toFixed(2)}x`); } } const container = document.getElementById('renderDiv'); const config = { type: Phaser.AUTO, parent: 'renderDiv', pixelArt: true, scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 800, height: 600, physics: { default: 'arcade', arcade: { gravity: { y: 0 }, debug: false } }, scene: [StartScene, Game, GameOverScene, Settings, HighScoresScene], global: { gameSpeed: 1 } }; // Initialize global game data // Create a global MusicManager const globalMusicManager = new MusicManager(); window.phaserGame = new Phaser.Game(config);