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.isMovingLeft = false; this.isMovingDown = false; this.remainingDistance = 0; this.type = type; this.hitPoints = hitPoints; this.initialHitPoints = hitPoints; this.initialFillColor = fillColor; scene.add.existing(this); scene.physics.add.existing(this, true); if (this.type === 'beat' || this.type === 'offbeat') { this.pulseEffect = scene.tweens.add({ targets: this, scaleX: 1.1, scaleY: 1.1, duration: 500, yoyo: true, repeat: -1 }); } } hit() { this.hitPoints--; if (this.hitPoints <= 0) { this.destroy(); return true; } if (this.type === 'strong-3') { if (this.hitPoints === 2) { this.setFillStyle(0xff00ff); // Change to magenta after first hit } else if (this.hitPoints === 1) { this.setFillStyle(0xffff00); // Change to yellow after second hit } } else if (this.type === 'strong-4') { if (this.hitPoints === 3) { this.setFillStyle(0xffa500); // Change to orange after first hit } else if (this.hitPoints === 2) { this.setFillStyle(0xff00ff); // Change to magenta after second hit } else if (this.hitPoints === 1) { this.setFillStyle(0xffff00); // Change to yellow after third hit } } else { this.setFillStyle(0xffff00); // Change color to indicate damage for other types } return false; } } 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 } } 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 = 'strong-3'; hitPoints = 3; fillColor = 0xffa500; // Orange color } else if (rand < 0.5) { type = 'strong-4'; hitPoints = 4; fillColor = 0x800080; // Purple color } } 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.05) { // 5% chance to spawn a power-up const powerUp = new PowerUp(this.scene, x, y); 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(); } nextLevel() { this.currentLevel++; this.reset(); } update(delta) { if (this.isStatic) return; // Skip movement logic for static bricks let reachedRightEdge = false; let reachedLeftEdge = false; const deltaSpeed = this.brickSpeed * (delta / 16.67); this.bricks.getChildren().forEach((brick) => { if (!brick.isMovingDown) { if (!brick.isMovingLeft) { brick.x += deltaSpeed; brick.body.x += deltaSpeed; if (brick.x + brick.width / 2 >= this.scene.game.config.width) { reachedRightEdge = true; } } else { brick.x -= deltaSpeed; brick.body.x -= deltaSpeed; if (brick.x - brick.width / 2 <= 0) { reachedLeftEdge = true; } } } }); if (reachedRightEdge || reachedLeftEdge) { this.bricks.getChildren().forEach((brick) => { brick.isMovingDown = true; brick.remainingDistance = this.moveDownDistance; brick.isMovingLeft = reachedRightEdge; }); // Reduce the move down distance for the next time this.moveDownDistance *= this.moveDownReductionFactor; } this.bricks.getChildren().forEach((brick) => { if (brick.isMovingDown && brick.remainingDistance > 0) { const moveDistance = Math.min(deltaSpeed, brick.remainingDistance); brick.y += moveDistance; brick.body.y += moveDistance; brick.remainingDistance -= moveDistance; if (brick.remainingDistance <= 0) { brick.isMovingDown = false; } } }); } 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; brick.isMovingDown = false; brick.isMovingLeft = false; }); // Reset brick speed and move down distance this.brickSpeed = this.brickStartSpeed; this.moveDownDistance = 20; } } class Ball extends Phaser.Physics.Arcade.Image { constructor(scene, x, y) { 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; // Snail's pace this.isSlowed = false; 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 } 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; } slow() { this.isSlowed = true; } normal() { this.isSlowed = false; } } class PowerUp extends Phaser.Physics.Arcade.Image { constructor(scene, x, y) { 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 } 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; } move(x) { 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 Start extends Phaser.Scene { constructor() { super('Start'); } preload() { this.load.image('ball', 'https://play.rosebud.ai/assets/ball (1).png?h9U7'); this.load.image('powerup', 'https://play.rosebud.ai/assets/Mouse-Left.png?1trH'); this.load.image('cyberCity', 'https://play.rosebud.ai/assets/Cyber City.png?GKfN'); 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; // Add a more grey background this.add.rectangle(0, 0, width, height, 0xd0d0d0).setOrigin(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(); // Create ball 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); // Create a transparent window for high scores const scoreWindow = this.add.graphics(); scoreWindow.fillStyle(0x000000, 0.5); scoreWindow.fillRoundedRect(width / 2 - 150, height / 2 - 100, 300, 180, 20); // Display high scores const highScores = JSON.parse(localStorage.getItem('highScores')) || []; this.add.text(width / 2, height / 2 - 80, 'High Scores', { fontSize: '28px', fill: '#fff' }).setOrigin(0.5).setDepth(1); highScores.forEach((score, index) => { this.add.text(width / 2, height / 2 - 30 + index * 35, `${index + 1}. ${score}`, { fontSize: '24px', fill: '#fff' }).setOrigin(0.5).setDepth(1); }); // Enable world bounds collision for the ball this.physics.world.setBoundsCollision(true, true, true, true); // Add Game Speed Slider this.createSlider(width / 2, height * 2 / 3, 'Game Speed', 'gameSpeed', 0.25, 1.5); // Add Start Game button const startButton = this.add.text(width / 3, height * 4 / 5, 'Start Game', { fontSize: '32px', fill: '#fff', backgroundColor: '#000', padding: { x: 15, y: 10 }, borderRadius: 10 }).setOrigin(0.5).setInteractive(); startButton.on('pointerdown', () => { this.scene.start('Game'); }); // Add Settings button const settingsButton = this.add.text(width * 2 / 3, height * 4 / 5, 'Settings', { fontSize: '32px', fill: '#fff', backgroundColor: '#000', padding: { x: 15, y: 10 }, borderRadius: 10 }).setOrigin(0.5).setInteractive(); settingsButton.on('pointerdown', () => { this.scene.launch('Settings', { fromScene: 'Start' }); }); // Add Reset High Scores button const resetScoresButton = this.add.text(width / 2, height - 50, '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])); this.scene.restart(); // Restart the scene to reflect the changes }); } 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 = (gameData.gameSpeed - min) / (max - min); 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; gameData.gameSpeed = min + (max - min) * value; }); } 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.rhythmMeter = 0; this.maxRhythmMeter = 100; this.lastHitTime = 0; this.rhythmWindow = 500; // 500ms window for rhythm hits this.bpm = 76; // Set this to the actual BPM of your song this.beatStartTime = 6121; // Set this to the time (in ms) when the beats start in the song this.msPerBeat = 60000 / this.bpm; this.nextBeatTime = 0; this.lastBallPosition = new Phaser.Math.Vector2(); this.currentLevel = 1; this.isOnBeat = false; this.powerUpActive = false; this.powerUpTimer = null; this.powerUps = null; this.specialModeActive = false; // New flag for special mode } updateHighScores(score) { let highScores = JSON.parse(localStorage.getItem('highScores')) || []; highScores.push(score); highScores.sort((a, b) => b - a); highScores = highScores.slice(0, 3); localStorage.setItem('highScores', JSON.stringify(highScores)); return highScores; } preload() { this.load.image('planet', `https://play.rosebud.ai/assets/planet environment in pixel art style.png?sEHQ`); this.load.image('forest', `https://play.rosebud.ai/assets/Forest.jpg?Qj17`); this.load.image('elevator', `https://play.rosebud.ai/assets/Elevator.jpg?NlgS`); this.load.image('space', `https://play.rosebud.ai/assets/Space Battle.jpg?QQpM`); this.load.image('imagination', `https://play.rosebud.ai/assets/Imagination.jpg?lfHa`); this.load.image('spaceBattle', `https://play.rosebud.ai/assets/Space.jpg?eSIx`); this.load.image('dinner', `https://play.rosebud.ai/assets/Dinner.jpg?O0o7`); this.load.image('mountains', `https://play.rosebud.ai/assets/Mountains.jpg?DCsF`); this.load.image('store', `https://play.rosebud.ai/assets/Store.jpg?ZL8k`); this.load.image('paradice', `https://play.rosebud.ai/assets/Paradice.jpg?o8uJ`); this.load.image('ball', `https://play.rosebud.ai/assets/ball.png?LkFW`); this.load.image('red', `https://play.rosebud.ai/assets/red.png?yICi`); this.load.image('paddle', `https://play.rosebud.ai/assets/rounded long rectangle dark orange color.png?PW6t`); this.load.image('pauseButton', `https://play.rosebud.ai/assets/simple pause symbole against a green background.png?KgLg`); 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?Zj0k`); globalMusicManager.preload(this); } create() { this.lives = 3; // Reset lives when starting a new game this.currentLevel = 1; // Ensure we start at level 1 this.createBackground(); this.createParticles(); this.createGameObjects(); this.powerUps = this.physics.add.group(); this.createUI(); this.setUpCollisions(); this.setUpInput(); this.createPauseButton(); // Set up key input for cheat codes this.input.keyboard.on('keydown', (event) => { if (event.shiftKey) { if (event.key.toLowerCase() === 'y') { this.specialModeActive = !this.specialModeActive; console.log('Special mode ' + (this.specialModeActive ? 'activated' : 'deactivated')); } else if (event.key.toLowerCase() === 't') { this.destroyRandomBlocks(10); } } }); // Create new particle emitter for rhythm hits this.rhythmEmitter = this.add.particles(0, 0, 'neon glowing green orb particle', { speed: { min: 50, max: 100 }, scale: { start: 0.2, end: 0 }, blendMode: 'ADD', lifespan: 1000, gravityY: 200, quantity: 1, emitting: false }); // Disable context menu this.input.mouse.disableContextMenu(); // Add mouse wheel event listener this.input.on('wheel', (pointer, gameObjects, deltaX, deltaY, deltaZ) => { if (this.ball.isSlowed && this.rhythmMeter > 0) { const direction = deltaY > 0 ? 1 : -1; this.paddle.rotate(direction); } }); globalMusicManager.create(this); // Always start the music from the beginning globalMusicManager.stopBgMusic(); globalMusicManager.playBgMusic(); // 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); // Create rhythm meter this.rhythmMeterGraphics = this.add.graphics(); this.updateRhythmMeter(); // 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); } }); } } createBackground() { if (this.background) { this.background.destroy(); } const bgKeys = ['planet', 'forest', 'elevator', 'space', 'imagination', 'dinner', 'mountains', 'store', 'cyberCity', 'paradice']; let bgKey; if (this.currentLevel <= 10) { bgKey = bgKeys[this.currentLevel - 1]; } else { const index = (this.currentLevel - 11) % bgKeys.length; bgKey = bgKeys[index]; } this.background = this.add.image(400, 300, bgKey); const scaleX = 800 / this.background.width; const scaleY = 600 / this.background.height; const scale = Math.max(scaleX, scaleY); this.background.setScale(scale); this.background.setDepth(-1); } createParticles() { const particles = this.add.particles('red'); this.emitter = particles.createEmitter({ speed: 100, scale: { start: 0.25, end: 0 }, blendMode: 'ADD', tint: 0x42e0f5 }); } createGameObjects() { this.ball = new Ball(this, 400, 200); this.paddle = new Paddle(this, 400, 500); this.brickManager = new BrickManager(this); this.brickManager.createBricks(); this.emitter.startFollow(this.ball); this.deathLine = this.add.rectangle(400, 575, 800, 4, 0xff0000); this.physics.add.existing(this.deathLine, true); // Make it a static physics object } createUI() { this.scoreText = this.add.text(16, 16, 'Score: 0', { fontSize: '32px', fill: '#000' }); this.livesText = this.add.text(16, 56, 'Lives: 3', { fontSize: '32px', fill: '#000' }); 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.deathLine, this.gameOverHandler, null, 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) { globalMusicManager.playSound('bounce'); this.addCameraEffects(); this.checkRhythmHit(); // 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!'); // Debug log powerUp.destroy(); this.activatePowerUp(); } activatePowerUp() { this.powerUpActive = true; this.ballVelocity = this.ball.body.velocity.clone(); this.ball.setVelocity(0, 0); this.powerUpTimer = this.time.delayedCall(10000, this.deactivatePowerUp, [], this); this.input.on('pointerdown', this.releaseBall, this); } deactivatePowerUp() { this.powerUpActive = false; this.releaseBall(); this.input.off('pointerdown', this.releaseBall, this); } releaseBall() { if (this.powerUpActive) { this.ball.setVelocity(this.ballVelocity.x, this.ballVelocity.y); if (this.powerUpTimer) this.powerUpTimer.remove(); this.deactivatePowerUp(); } } setUpInput() { this.input.on('pointermove', (pointer) => { 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() { if (this.rhythmMeter >= this.maxRhythmMeter / 4) { 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); this.rhythmMeter -= this.maxRhythmMeter / 4; this.updateRhythmMeter(); this.emitRhythmParticles(); globalMusicManager.playSound('bounce'); } } update(time, delta) { const adjustedDelta = delta * gameData.gameSpeed; if (!this.isPaused) { if (this.powerUpActive) { this.ball.setPosition(this.input.activePointer.x, this.input.activePointer.y); } else { this.ball.update(adjustedDelta); } this.brickManager.update(adjustedDelta); if (this.brickManager.bricks.countActive() === 0) { this.gameOverHandler(); } // Special mode ball teleportation if (this.specialModeActive && this.ball.y > this.sys.game.config.height - 100) { this.ball.setPosition(this.ball.x, this.ball.y - 100); const angle = Phaser.Math.Between(-60, 60); const speed = this.ball.body.velocity.length(); this.ball.setVelocity( speed * Math.sin(Phaser.Math.DegToRad(angle)), -Math.abs(speed * Math.cos(Phaser.Math.DegToRad(angle))) ); } // 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(); } }); if (this.ball.isSlowed && this.rhythmMeter > 0) { this.rhythmMeter = Math.max(0, this.rhythmMeter - 0.1); this.updateRhythmMeter(); // Check if rhythm meter is depleted if (this.rhythmMeter <= 0) { this.normalBall(); } } else { // Reset paddle rotation when not slowing time this.paddle.resetRotation(); } // Handle beat effects if (time >= this.nextBeatTime) { this.onBeat(); this.nextBeatTime += this.msPerBeat; } // 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(); } } else { // Ensure the ball stays in place during the countdown this.ball.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); } checkPortalTeleportation() { if (Phaser.Geom.Intersects.RectangleToRectangle(this.ball.getBounds(), this.topPortal.getBounds())) { this.ball.setPosition(this.bottomPortal.x, this.bottomPortal.y - this.bottomPortal.displayHeight / 2 - this.ball.displayHeight / 2); this.ball.setVelocityY(Math.abs(this.ball.body.velocity.y)); } else if (Phaser.Geom.Intersects.RectangleToRectangle(this.ball.getBounds(), this.bottomPortal.getBounds())) { this.ball.setPosition(this.topPortal.x, this.topPortal.y + this.topPortal.displayHeight / 2 + this.ball.displayHeight / 2); this.ball.setVelocityY(-Math.abs(this.ball.body.velocity.y)); } } 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; } } } onBeat() { this.isOnBeat = true; // Flash vignette this.tweens.add({ targets: this.vignette, alpha: { from: 0.5, to: 0 }, duration: 200, ease: 'Power2' }); // Emit particles this.particleEmitter.explode(10, Phaser.Math.Between(0, 800), Phaser.Math.Between(0, 600)); // Pulse beat/offbeat bricks this.brickManager.bricks.getChildren().forEach(brick => { if (brick.type === 'beat') { brick.setScale(1.1); this.tweens.add({ targets: brick, scaleX: 1, scaleY: 1, duration: this.msPerBeat / 2, ease: 'Bounce.easeOut' }); } else if (brick.type === 'offbeat') { brick.setScale(0.9); this.tweens.add({ targets: brick, scaleX: 1, scaleY: 1, duration: this.msPerBeat / 2, ease: 'Bounce.easeOut' }); } }); this.time.delayedCall(this.msPerBeat / 2, () => { this.isOnBeat = false; }); } hitPad(ball, pad) { this.score += 1; this.scoreText.setText('Score: ' + this.score); globalMusicManager.playSound('bounce'); // 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(); this.checkRhythmHit(); } hitBrick(ball, brick) { const currentTime = this.time.now; const timeSinceLastBeat = (currentTime - this.nextBeatTime + this.msPerBeat) % this.msPerBeat; const isOnBeat = timeSinceLastBeat < this.rhythmWindow || timeSinceLastBeat > this.msPerBeat - this.rhythmWindow; if ((brick.type === 'beat' && !isOnBeat) || (brick.type === 'offbeat' && isOnBeat)) { return; // Brick can't be destroyed if hit at the wrong time } if (brick.hit()) { this.score += 10; this.scoreText.setText('Score: ' + 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'); this.checkRhythmHit(); if (this.brickManager.bricks.countActive() === 0) { this.nextLevel(); } } } nextLevel() { this.currentLevel++; this.brickManager.nextLevel(); this.ball.reset(); this.paddle.x = 400; this.paddle.y = 500; this.createBackground(); this.startCountdown(); } checkRhythmHit() { const currentTime = this.time.now; if (currentTime - this.lastHitTime <= this.rhythmWindow) { this.rhythmMeter = Math.min(this.maxRhythmMeter, this.rhythmMeter + 10); this.emitRhythmParticles(); } else { this.rhythmMeter = Math.max(0, this.rhythmMeter - 5); } this.lastHitTime = currentTime; this.updateRhythmMeter(); } emitRhythmParticles() { const emitDuration = 500; // Duration of particle emission in milliseconds const emitInterval = 50; // Interval between particle emissions in milliseconds const particlesPerEmission = 2; // Number of particles to emit each time const emitter = this.rhythmEmitter; emitter.setPosition(this.ball.x, this.ball.y); const emitTimer = this.time.addEvent({ delay: emitInterval, repeat: emitDuration / emitInterval - 1, callback: () => { for (let i = 0; i < particlesPerEmission; i++) { const angle = Phaser.Math.Between(0, 360); const speed = Phaser.Math.Between(50, 100); emitter.emitParticle(1, this.ball.x, this.ball.y, { speed, angle }); } } }); this.time.delayedCall(emitDuration, () => this.animateParticlesToMeter()); } animateParticlesToMeter() { const meterCenterX = 400; const meterCenterY = 575; const particlesToAnimate = 10; let animatedCount = 0; for (let i = 0; i < particlesToAnimate; i++) { const particle = this.rhythmEmitter.emitParticle(1, this.ball.x, this.ball.y); if (particle) { this.tweens.add({ targets: particle, x: meterCenterX, y: meterCenterY, duration: 500, ease: 'Cubic.easeIn', onComplete: () => { particle.destroy(); animatedCount++; if (animatedCount === particlesToAnimate) { this.growRhythmMeter(); } } }); } } } growRhythmMeter() { const growAmount = 10; const originalWidth = (this.rhythmMeter / this.maxRhythmMeter) * 780; const newWidth = ((this.rhythmMeter + growAmount) / this.maxRhythmMeter) * 780; this.tweens.add({ targets: this.rhythmMeterGraphics, scaleX: newWidth / originalWidth, duration: 200, ease: 'Bounce.easeOut', onComplete: () => { this.rhythmMeterGraphics.scaleX = 1; this.updateRhythmMeter(); } }); } updateRhythmMeter() { this.rhythmMeterGraphics.clear(); this.rhythmMeterGraphics.fillStyle(0x00ff00, 1); this.rhythmMeterGraphics.fillRect(10, 560, (this.rhythmMeter / this.maxRhythmMeter) * 780, 30); this.rhythmMeterGraphics.lineStyle(2, 0xffffff); this.rhythmMeterGraphics.strokeRect(10, 560, 780, 30); // Add markers for 25%, 50%, and 75% this.rhythmMeterGraphics.lineStyle(2, 0xff0000); [0.25, 0.5, 0.75].forEach(percentage => { const x = 10 + percentage * 780; this.rhythmMeterGraphics.moveTo(x, 560); this.rhythmMeterGraphics.lineTo(x, 590); }); } slowBall() { if (this.rhythmMeter > 0) { this.ball.slow(); } else { this.ball.normal(); } } normalBall() { this.ball.normal(); } gameOverHandler() { this.lives--; this.livesText.setText('Lives: ' + 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(); // Reset background (in case we're on level 2) this.currentLevel = 1; this.createBackground(); // Start countdown this.startCountdown(); } else { // Game over globalMusicManager.playSound('gameOver'); this.scene.pause(); this.scene.launch('GameOver', { score: this.score }); } } 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 destroyRandomBlocks(count) { const activeBricks = this.brickManager.bricks.getChildren().filter(brick => brick.active); const destroyCount = Math.min(count, activeBricks.length); for (let i = 0; i < destroyCount; i++) { const randomIndex = Phaser.Math.Between(0, activeBricks.length - 1); const brickToDestroy = activeBricks.splice(randomIndex, 1)[0]; brickToDestroy.destroy(); this.score += 10; // Add score for destroying a brick this.scoreText.setText('Score: ' + this.score); this.brickManager.spawnPowerUp(brickToDestroy.x, brickToDestroy.y); } // Check if all bricks are destroyed after this action if (this.brickManager.bricks.countActive() === 0) { this.nextLevel(); } } } class GameOver extends Phaser.Scene { constructor() { super('GameOver'); } init(data) { this.score = data.score; } 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); this.add.text(width / 2, height / 2 - 20, `Score: ${this.score}`, { fontSize: '32px', fill: '#fff' }).setOrigin(0.5); const highScores = this.scene.get('Game').updateHighScores(this.score); this.add.text(width / 2, height / 2 + 40, 'High Scores:', { fontSize: '24px', fill: '#fff' }).setOrigin(0.5); highScores.forEach((score, index) => { this.add.text(width / 2, height / 2 + 80 + index * 30, `${index + 1}. ${score}`, { fontSize: '20px', fill: '#fff' }).setOrigin(0.5); }); const restartButton = this.add.text(width / 2, height / 2 + 200, 'Restart', { fontSize: '32px', fill: '#fff', backgroundColor: '#000', padding: { x: 10, y: 5 } }).setOrigin(0.5).setInteractive(); restartButton.on('pointerdown', () => { this.scene.stop('GameOver'); this.scene.stop('Game'); globalMusicManager.stopBgMusic(); // Stop the music when returning to the menu this.scene.start('Start'); }); } } 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.8); graphics.fillRoundedRect(width * 0.1, height * 0.1, width * 0.8, height * 0.8, 20); this.add.text(width / 2, height / 6, 'Settings', { fontSize: '64px', fill: '#fff' }).setOrigin(0.5); // Master Volume Slider this.createSlider(width / 2, height / 4, 'Master Volume', 'masterVolume'); // Music Volume Slider this.createSlider(width / 2, height * 3 / 8, 'Music Volume', 'musicVolume'); // Sound Effects Volume Slider this.createSlider(width / 2, height / 2, 'Sound Effects Volume', 'sfxVolume'); // Game Speed Slider this.createSlider(width / 2, height * 5 / 8, 'Game Speed', 'gameSpeed', 0.25, 1.5); 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('Start'); } }); } 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; if (settingType === 'gameSpeed') { initialValue = (gameData.gameSpeed - min) / (max - min); } 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') { gameData.gameSpeed = min + (max - min) * value; } else { globalMusicManager.setVolume(settingType, value); } }); } } class MusicManager { constructor() { this.bgMusic = null; this.sounds = {}; this.masterVolume = 0.5; // Changed from 1 to 0.5 this.musicVolume = 0.5; this.sfxVolume = 1; } preload(scene) { scene.load.audio('bgMusic', 'https://play.rosebud.ai/assets/Neon-Nights.mp3?uuKf'); scene.load.audio('bounce', 'https://play.rosebud.ai/assets/click-for-game-menu-131903.mp3?UMsx'); } create(scene) { if (!this.bgMusic) { this.bgMusic = scene.sound.add('bgMusic', { loop: true, volume: this.masterVolume * this.musicVolume }); } if (!this.sounds.bounce) { this.sounds.bounce = scene.sound.add('bounce'); } } playBgMusic() { if (this.bgMusic) { this.bgMusic.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); } } } 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: [Start, Game, GameOver, Settings], global: { gameSpeed: 1 } }; // Initialize global game data const gameData = { gameSpeed: 0.75 // Set to the middle of the new range (0.25 to 1.5) }; // Create a global MusicManager const globalMusicManager = new MusicManager(); window.phaserGame = new Phaser.Game(config);