class Jouster extends Phaser.Scene { constructor() { super({ key: 'Jouster' }); this.highScores = [0, 0, 0]; // Initialize high scores array this.hatchlingEggTimerDuration = 30000; // 30 seconds in milliseconds } init(data) { console.log('Jouster scene init called'); this.level = data.startLevel || 1; this.player = null; this.worldWidth = 1800; // Three times the screen width this.halfScreenWidth = 0; this.screenHeight = 0; this.score = 0; // Always start with 0 score for a new game this.scoreText = null; this.levelText = null; this.eggsCollected = 0; this.gameTimer = 0; this.hatchlingEggBaseTimer = 30000; // 30 seconds in milliseconds this.lastUpdateTime = 0; this.lives = 3; // Initialize game objects and groups as null this.eggs = null; this.dragons = null; this.platforms = null; this.ground = null; this.topBarrier = null; this.slimeParticles = null; // Reset physics world if (this.physics && this.physics.world) { this.physics.world.colliders.destroy(); } // Additional reset logic will be handled in create method // Initialize new UI adjustment variables this.UIyOffset = -10; // Initial vertical offset (adjust as needed) this.UIscaleFactor = 1.05; // Initial scale factor to counteract 5% zoom if (data && data.reset) { console.log('Resetting Jouster scene'); // Any additional reset logic can go here } // Remove this line as it's causing the scene to launch itself again // this.scene.launch('Jouster'); } preload() { this.load.image('red', `https://play.rosebud.ai/assets/red.png?H57G`); this.load.image('flash', `https://play.rosebud.ai/assets/red.png?H57G`); this.load.image('hatchlingEgg', 'https://play.rosebud.ai/assets/Hatchling Egg.png?CzKm'); this.load.image('dragonUp', 'https://play.rosebud.ai/assets/Dragon Up.png?K59D'); this.load.image('dragonDown', 'https://play.rosebud.ai/assets/Dragon Down.png?Wk3C'); this.load.image('dragonWalking', 'https://play.rosebud.ai/assets/Dragon Up.png?K59D'); this.load.image('particle1', 'https://play.rosebud.ai/assets/1000013756.png?MHnR'); this.load.image('particle2', 'https://play.rosebud.ai/assets/1000013757.png?DtWx'); this.load.image('groundTexture', 'https://play.rosebud.ai/assets/Dirt_02-256x256.png?7FJM'); this.load.image('platformTexture', 'https://play.rosebud.ai/assets/Stone_05-256x256.png?Ouc9'); this.load.image('newPlatformTexture', 'https://play.rosebud.ai/assets/Platform.png?8rrW'); this.load.image('player', 'https://play.rosebud.ai/assets/platformer_character.png?In9m'); this.load.image('playerFlying', 'https://play.rosebud.ai/assets/CharacterFlying.png?oPy6'); this.load.image('playerWalking', 'https://play.rosebud.ai/assets/CharacterWalking.png?QVil'); this.load.image('egg', 'https://play.rosebud.ai/assets/Egg.png?kcsS'); this.load.audio('gameMusic', 'https://play.rosebud.ai/assets/JousterGameMusic.mp3?okP6'); this.load.audio('flapSound', 'https://play.rosebud.ai/assets/flap_2024-11-02_135839626.wav?cl1C'); this.load.audio('crushSound', 'https://play.rosebud.ai/assets/CrushingSFX.mp3?I2kV'); this.load.audio('dragonSound', 'https://play.rosebud.ai/assets/Dragon.wav?sBLe'); } create() { console.log('Jouster scene create method called'); // Set up the game world this.cameras.main.setBackgroundColor('#000000'); // Cache frequently used values this.halfScreenWidth = this.sys.game.config.width / 2; this.screenHeight = this.sys.game.config.height; // Initialize game objects and groups this.slimeParticles = this.physics.add.group(); this.eggs = this.physics.add.group(); this.dragons = this.physics.add.group(); this.platforms = this.physics.add.staticGroup(); // Create all game objects this.createGameObjects(); // Prevent right-click context menu this.input.mouse.disableContextMenu(); // Set up input listeners for touch and mouse this.input.on('pointerdown', this.handlePointerDown, this); this.input.on('pointerup', this.handlePointerUp, this); // Update UI this.scoreText.setText('Score: ' + this.score); this.levelText.setText('Level: ' + this.level); this.updateEggCounter(); console.log('Jouster scene started'); this.adjustUIContainerSize(this.cameras.main.zoom); this.applyUIAdjustments(); // Set up the dragon sound this.dragonSound = this.sound.add('dragonSound', { volume: 0.5 }); } create() { console.log('Jouster scene create method called'); // Set up the game world this.cameras.main.setBackgroundColor('#000000'); // Cache frequently used values this.halfScreenWidth = this.sys.game.config.width / 2; this.screenHeight = this.sys.game.config.height; // Initialize game objects and groups this.slimeParticles = this.physics.add.group(); this.eggs = this.physics.add.group(); this.dragons = this.physics.add.group(); this.platforms = this.physics.add.staticGroup(); // Create all game objects this.createGameObjects(); // Initialize game state this.eggsCollected = 0; this.gameTimer = 0; this.lastUpdateTime = this.time.now; // Initialize game state this.score = 0; this.level = 1; this.eggsCollected = 0; this.gameTimer = 0; this.lastUpdateTime = this.time.now; // Update UI this.scoreText.setText('Score: ' + this.score); this.levelText.setText('Level: ' + this.level); this.updateEggCounter(); console.log('Jouster scene started'); this.adjustUIContainerSize(this.cameras.main.zoom); this.applyUIAdjustments(); // Set up the dragon sound this.dragonSound = this.sound.add('dragonSound', { volume: 0.5 }); } createGameObjects() { // Create the ground this.createGround(); // Create platforms this.createPlatforms(); // Create player this.createPlayer(); // Add breathing animation this.addBreathingAnimation(); // Create top barrier this.createTopBarrier(); // Spawn initial eggs this.spawnEggs(); // Remove these lines as they are redundant // Initialize acceleration timer this.accelerationTimer = null; // Initialize movement direction this.movementDirection = null; // Add colliders with custom collision handler this.physics.add.collider(this.player, this.platforms); this.physics.add.collider(this.player, this.ground); this.physics.add.collider(this.player, this.topBarrier); // Add background music this.gameMusic = this.sound.add('gameMusic', { loop: true, volume: 0.1 }); this.gameMusic.play(); // Add a key listener to toggle music on/off this.input.keyboard.on('keydown-M', () => { if (this.gameMusic.isPlaying) { this.gameMusic.pause(); } else { this.gameMusic.resume(); } }); // Add flap sound this.flapSound = this.sound.add('flapSound', { volume: 0.25 // Reduced by 50% from 0.5 to 0.25 }); // Add crush sound this.crushSound = this.sound.add('crushSound', { volume: 1.5 // Doubled from 0.75 to 1.5 (twice as loud) }); // Check if crushSound was successfully added if (!this.crushSound) { console.warn('Crush sound could not be initialized'); // Create a dummy sound object to prevent errors this.crushSound = { play: () => {} }; } // Spawn eggs this.spawnEggs(); // Set up the main camera this.cameras.main.setBounds(0, 0, this.worldWidth, this.sys.game.config.height); this.cameras.main.startFollow(this.player, true, 0.1, 0.1); this.cameras.main.setDeadzone(0, 0); this.cameras.main.setLerp(0.15, 0.15); // Create a container for UI elements this.uiContainer = this.add.container(this.sys.game.config.width / 2, 0); this.uiContainer.setScrollFactor(0); this.uiContainer.setDepth(10000); // Remove the setOrigin call as it's not applicable to containers // Add score text this.scoreText = this.add.text(16, 16, 'Score: 0', { fontSize: '24px', fontFamily: 'Arial, sans-serif', fill: '#ffff00', stroke: '#000000', strokeThickness: 4 }).setScrollFactor(0).setDepth(1001); // Add level text this.levelText = this.add.text(16, 48, 'Level: 1', { fontSize: '24px', fontFamily: 'Arial, sans-serif', fill: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setScrollFactor(0).setDepth(1001); // Add timer text this.timerText = this.add.text(this.sys.game.config.width - 16, 16, 'Time: 0', { fontSize: '24px', fontFamily: 'Arial, sans-serif', fill: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setOrigin(1, 0).setScrollFactor(0).setDepth(1001); // Add egg counter text this.eggCounterText = this.add.text(this.sys.game.config.width - 16, 48, '5', { fontSize: '24px', fontFamily: 'Arial, sans-serif', fill: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setOrigin(1, 0).setScrollFactor(0).setDepth(1001); // Add UI elements to the UI container this.uiContainer.add([this.scoreText, this.levelText, this.timerText, this.eggCounterText]); // Initialize Lives this.lives = 3; this.livesText = this.add.text(16, 80, 'Lives: 3', { fontSize: '24px', fontFamily: 'Arial, sans-serif', fill: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setScrollFactor(0).setDepth(1001); this.uiContainer.add(this.livesText); // Ensure UI is always on top this.children.bringToTop(this.uiContainer); // Initialize timer this.gameTimer = 0; this.lastUpdateTime = this.time.now; this.timerEvent = this.time.addEvent({ delay: 100, // Update more frequently callback: this.updateTimer, callbackScope: this, loop: true, paused: false }); } triggerLevelUpSequence() { if (this.player && this.player.body) { this.player.body.enable = false; } if (this.player && this.player.input) { this.player.input.enabled = false; } // Pause the breathing animation if (this.breathingTween) { this.breathingTween.pause(); } const originalScale = this.player ? { x: this.player.scaleX, y: this.player.scaleY } : { x: 1, y: 1 }; const spawnPosition = { x: this.worldWidth / 2, y: 50 }; const scaleFactor = 8; // Larger expansion const centerX = this.worldWidth / 2; const centerY = this.screenHeight * 0.4; // Position slightly above center if (this.player) { // Expand the player this.tweens.add({ targets: this.player, x: centerX, y: centerY, scaleX: originalScale.x * scaleFactor, scaleY: originalScale.y * scaleFactor, duration: 500, ease: 'Power2', onStart: () => { if (this.flapSound) { this.flapSound.play(); } }, onComplete: () => { // Reset level while player is at full size this.resetLevel(); // Pan the camera to the center of the arena this.cameras.main.pan( this.worldWidth / 2, this.screenHeight / 2, 1000, 'Power2', false, (camera, progress) => { if (progress === 1) { // Shrink player and move to spawn point this.tweens.add({ targets: this.player, x: spawnPosition.x, y: spawnPosition.y, scaleX: originalScale.x, scaleY: originalScale.y, duration: 500, ease: 'Power2', onStart: () => { if (this.flapSound) { this.flapSound.play(); } }, onComplete: () => { this.finalizeLevelTransition(); } }); } } ); } }); } } update() { const { body, isFlying } = this.player; const { touching, velocity } = body; // Check for and remove any lingering physics bodies const bodies = this.physics.world.bodies.getArray(); for (let i = 0; i < bodies.length; i++) { const body = bodies[i]; if (body && body.gameObject && !body.gameObject.active) { body.gameObject.destroy(); } } if (isFlying && touching.down) { this.enterWalkingMode(); } if (this.input.activePointer.isDown) { const direction = this.input.activePointer.x < this.halfScreenWidth ? 'left' : 'right'; this.acceleratePlayer(direction); isFlying && this.player.setVelocityY(-160); } // Update all dragons if (this.dragons && this.dragons.getChildren) { this.dragons.getChildren().forEach(dragon => { if (dragon && dragon.active && dragon.body) { this.updateDragon(dragon); } }); } // Prevent player from exiting the arena sides and reverse velocity const halfPlayerWidth = this.player.displayWidth / 2; const oldX = this.player.x; this.player.x = Phaser.Math.Clamp( this.player.x, halfPlayerWidth, this.worldWidth - halfPlayerWidth ); // Check if player hit the edge and reverse velocity if (this.player.x !== oldX) { this.player.body.velocity.x *= -0.5; // Reverse and reduce velocity } // Update camera position this.updateCamera(); } updateDragon(dragon) { if (!dragon.body || !dragon.active) return; const bounceVelocity = 100; // Adjust this value to control bounce strength const dragonHalfWidth = dragon.displayWidth / 2; const dragonHalfHeight = dragon.displayHeight / 2; // Check for left and right wall collisions if (dragon.x - dragonHalfWidth <= 0 || dragon.x + dragonHalfWidth >= this.worldWidth) { dragon.body.velocity.x = -dragon.body.velocity.x; // Reverse horizontal velocity // Ensure the dragon is within bounds dragon.x = Phaser.Math.Clamp(dragon.x, dragonHalfWidth, this.worldWidth - dragonHalfWidth); // Add a small vertical velocity for more interesting bounces dragon.body.velocity.y += Phaser.Math.Between(-50, 50); } // Check for top and bottom wall collisions if (dragon.y - dragonHalfHeight <= 0 || dragon.y + dragonHalfHeight >= this.sys.game.config.height) { dragon.body.velocity.y = -dragon.body.velocity.y; // Reverse vertical velocity // Ensure the dragon is within bounds dragon.y = Phaser.Math.Clamp(dragon.y, dragonHalfHeight, this.sys.game.config.height - dragonHalfHeight); // Add a small horizontal velocity for more interesting bounces dragon.body.velocity.x += Phaser.Math.Between(-50, 50); } // Ensure the dragon always has some velocity const minVelocity = 50; if (Math.abs(dragon.body.velocity.x) < minVelocity) { dragon.body.velocity.x = minVelocity * (dragon.body.velocity.x >= 0 ? 1 : -1); } if (Math.abs(dragon.body.velocity.y) < minVelocity) { dragon.body.velocity.y = minVelocity * (dragon.body.velocity.y >= 0 ? 1 : -1); } // Cap maximum velocity const maxVelocity = 200; dragon.body.velocity.x = Phaser.Math.Clamp(dragon.body.velocity.x, -maxVelocity, maxVelocity); dragon.body.velocity.y = Phaser.Math.Clamp(dragon.body.velocity.y, -maxVelocity, maxVelocity); } updateCamera() { const cam = this.cameras.main; const zoom = cam.zoom; const visibleWidth = cam.width / zoom; const visibleHeight = cam.height / zoom; // Calculate the target position for the camera let targetX = this.player.x - visibleWidth / 2; let targetY = this.player.y - visibleHeight / 2; // Clamp the target position to ensure it doesn't go beyond the world bounds targetX = Phaser.Math.Clamp(targetX, 0, this.worldWidth - visibleWidth); targetY = Phaser.Math.Clamp(targetY, 0, this.sys.game.config.height - visibleHeight); // Smoothly move the camera towards the target position cam.scrollX = Phaser.Math.Linear(cam.scrollX, targetX, 0.1); cam.scrollY = Phaser.Math.Linear(cam.scrollY, targetY, 0.1); } enterWalkingMode() { if (this.player.isFlying) { // Stop breathing animation if (this.breathingTween) { this.breathingTween.stop(); } this.player.isFlying = false; this.player.setTexture(this.player.textures.walking); this.player.body.setGravityY(600); this.player.body.setDragX(100); this.player.body.setDragY(0); this.player.body.setFriction(0.2, 0); // Add a small upward boost when transitioning to walking if (!this.player.body.touching.down) { this.player.setVelocityY(-100); } } } enterFlyingMode() { if (!this.player.isFlying) { this.player.isFlying = true; this.player.setTexture(this.player.textures.flying); this.player.body.setGravityY(100); // Reduced gravity while flying this.player.body.setDragX(20); this.player.body.setDragY(20); // Start breathing animation if not already running if (!this.breathingTween || !this.breathingTween.isPlaying()) { this.addBreathingAnimation(); } } } createGround() { const screenHeight = this.sys.game.config.height; const groundHeight = 25; // Height of the ground // Create a tiled sprite for the ground this.ground = this.add.tileSprite(0, screenHeight - groundHeight, this.worldWidth, groundHeight, 'groundTexture'); this.ground.setOrigin(0, 0); // Set the tileScale to 1 to keep the original size of the texture this.ground.tileScaleX = 1; this.ground.tileScaleY = 1; // Adjust the tilePosition to align the texture with the bottom of the ground this.ground.tilePositionY = this.ground.height - groundHeight; // Set nearest neighbor filtering for pixel-perfect rendering this.ground.texture.setFilter(Phaser.Textures.FilterMode.NEAREST); // Add physics to the ground this.physics.add.existing(this.ground, true); // Set world bounds this.physics.world.setBounds(0, 0, this.worldWidth, screenHeight); } createPlatforms() { // Ensure any existing platforms are properly destroyed if (this.platforms) { this.platforms.clear(true, true); } this.platforms = this.physics.add.staticGroup(); const platformWidth = 128; // Assuming the new platform image is 128x32 const platformHeight = 32; const scaleX = 0.225; const scaleY = 0.09; const centerX = this.worldWidth / 2; const createPlatform = (x, y) => { const platform = this.platforms.create(x, y, 'newPlatformTexture'); platform.setScale(scaleX, scaleY); platform.setOrigin(0.5, 0.5); // Calculate the scaled dimensions const scaledWidth = platformWidth * scaleX; const scaledHeight = platformHeight * scaleY; // Reduce hitbox height by 35% (15% from top and 20% from bottom) const hitboxHeight = scaledHeight * 0.65; // Set the hitbox size platform.body.setSize(scaledWidth, hitboxHeight); // Adjust the hitbox position (5% down from the top) const offsetY = (scaledHeight - hitboxHeight) * 0.2; platform.body.setOffset((platformWidth - scaledWidth) / 2, (platformHeight - scaledHeight) / 2 + offsetY); platform.setDepth(10); }; createPlatform(centerX - 200, 400); createPlatform(centerX + 200, 350); createPlatform(centerX, 250); createPlatform(centerX - 250, 150); createPlatform(centerX + 250, 180); // Random platforms on the sides (these change each level) for (let i = 0; i < 4; i++) { if (i < 2) { createPlatform(this.getRandomX(0, centerX - 300), this.getRandomY()); } else { createPlatform(this.getRandomX(centerX + 300, this.worldWidth), this.getRandomY()); } } // Set nearest neighbor filtering for pixel-perfect rendering this.platforms.children.entries.forEach(platform => { platform.texture.setFilter(Phaser.Textures.FilterMode.NEAREST); }); this.refreshPlatformPhysics(); } refreshPlatformPhysics() { this.platforms.children.entries.forEach(platform => { platform.body.enable = false; platform.body.enable = true; // Recalculate the scaled dimensions const scaledWidth = platform.width * platform.scaleX; const scaledHeight = platform.height * platform.scaleY; // Reduce hitbox height by 35% (15% from top and 20% from bottom) const hitboxHeight = scaledHeight * 0.65; // Set the hitbox size platform.body.setSize(scaledWidth, hitboxHeight); // Adjust the hitbox position (5% down from the top) const offsetY = (scaledHeight - hitboxHeight) * 0.2; platform.body.setOffset((platform.width - scaledWidth) / 2, (platform.height - scaledHeight) / 2 + offsetY); }); } getRandomX(min, max) { return Phaser.Math.Between(min, max); } getRandomY() { return Phaser.Math.Between(150, 450); } createPlayer() { // Create the player this.player = this.physics.add.sprite(this.worldWidth / 2, 50, 'playerFlying'); const newScale = (0.5 / 3) * 0.9; // 10% smaller this.player.setScale(newScale).setBounce(0); this.player.body.setGravityY(0).setDrag(20); this.player.setDepth(20); // Set player depth above platforms but below UI // Adjust hitbox size and offset const bodyScale = 0.722; // Additional 5% smaller (0.76 * 0.95) this.player.bodyWidth = this.player.width * bodyScale * 0.9; // Reduce width by an additional 10% this.player.bodyHeight = this.player.height * bodyScale * 0.9; // Reduce height by 10% this.player.bodyOffsetX = (this.player.width - this.player.bodyWidth) / 2 + (this.player.width * bodyScale * 0.1); // Move hitbox 10% more to the right this.player.bodyOffsetY = (this.player.height - this.player.bodyHeight) / 2 + (this.player.height * bodyScale * 0.1); // Move hitbox 10% down this.updatePlayerHitbox(); this.player.isFlying = true; this.player.textures = { flying: 'playerFlying', walking: 'playerWalking' }; // Camera setup is now handled in the create method } // This entire method has been removed updatePlayerHitbox() { const newBodyWidth = this.player.bodyWidth * 0.85; // Reduce width by 15% const shift = this.player.width * 0.05; // 5% of the player's width const offsetX = this.player.flipX ? this.player.width - newBodyWidth - this.player.bodyOffsetX + shift : this.player.bodyOffsetX - shift; const offsetY = this.player.bodyOffsetY - this.player.height * 0.05; // Move hitbox up by 5% this.player.body.setSize(newBodyWidth, this.player.bodyHeight); this.player.body.setOffset(offsetX, offsetY); } addBreathingAnimation() { this.breathingTween = this.tweens.add({ targets: this.player, scaleY: this.player.scaleY * 1.05, duration: 500, yoyo: true, repeat: -1, ease: 'Sine.easeInOut' }); } handlePointerDown(pointer) { if (!this.lastClickTime) { this.lastClickTime = 0; } const currentTime = this.time.now; const timeSinceLastClick = currentTime - this.lastClickTime; const direction = pointer.x < this.halfScreenWidth ? 'left' : 'right'; // Set movement direction and accelerate this.movementDirection = direction; this.acceleratePlayer(this.movementDirection); // Handle double-click (time window of 300ms) if (timeSinceLastClick < 300) { if (this.player.body.touching.down) { // On ground, start flying this.createRedGraphic(); this.player.setVelocityY(-300); this.enterFlyingMode(); this.flapSound.play(); this.addBreathingAnimation(); } else if (this.player.isFlying) { // In air, switch to walking this.enterWalkingMode(); } } else if (this.player.isFlying) { // Single click while flying - flap wings this.flapSound.play(); this.player.setVelocityY(-200); this.temporaryWalkingTexture(); } this.lastClickTime = currentTime; } handleDoubleClick() { if (this.player.body.touching.down) { if (!this.player.isFlying) { this.createRedGraphic(); this.jumpToFly(); } } else if (this.player.isFlying) { this.enterWalkingMode(); } } createRedGraphic() { // Use the player's current body size const playerBodyWidth = this.player.body.width; const playerBodyHeight = this.player.body.height; // Create the red graphic as a sprite with physics const redGraphic = this.physics.add.sprite(this.player.x, this.player.y, 'red'); redGraphic.setOrigin(0.5); // Calculate the scale to make the red graphic twice the size of the player's body const scaleX = (playerBodyWidth * 2) / redGraphic.width; const scaleY = (playerBodyHeight * 2) / redGraphic.height; redGraphic.setScale(scaleX, scaleY); redGraphic.setAlpha(0.5); redGraphic.setDepth(this.player.depth - 1); // Set up the physics body to match the scaled size redGraphic.body.setSize(playerBodyWidth * 2, playerBodyHeight * 2); redGraphic.body.setAllowGravity(false); // Create an overlap between the red graphic and eggs this.physics.add.overlap(redGraphic, this.eggs, (redGraphic, egg) => { this.collectEgg(this.player, egg); }, null, this); // Fade out the red graphic this.tweens.add({ targets: redGraphic, alpha: 0, duration: 100, onComplete: () => { redGraphic.destroy(); } }); } handlePointerUp() { this.stopAcceleration(); this.isAccelerating = false; if (this.decelerationTimer) { this.decelerationTimer.remove(); this.decelerationTimer = null; } } acceleratePlayer(direction) { const { isFlying, body, flipX } = this.player; const maxSpeed = isFlying ? 400 : 160; const acceleration = isFlying ? 10 : 20; const speed = direction === 'left' ? -acceleration : acceleration; let newVelocity = Phaser.Math.Clamp( body.velocity.x + speed, -maxSpeed, maxSpeed ); this.player.setVelocityX(newVelocity); const newFlipX = direction === 'right'; if (flipX !== newFlipX) { this.player.flipX = newFlipX; this.updatePlayerHitbox(); } } stopAcceleration() { // Remove setVelocityX(0) to allow coasting this.movementDirection = null; if (this.accelerationTimer) { this.accelerationTimer.remove(); this.accelerationTimer = null; } } jumpToFly() { if (!this.player.isFlying) { // Set initial upward velocity for jump this.player.setVelocityY(-300); // Enter flying mode this.enterFlyingMode(); // Play flap sound this.flapSound.play(); // Start breathing animation if (this.breathingTween) { this.breathingTween.stop(); } this.addBreathingAnimation(); } } handleCollision(player, barrier) { const bounceFactor = 0.8; const velocityThreshold = 50; const directions = { up: 'y', left: 'x', right: 'x' }; if (!player.body.touching.down) { for (const [direction, axis] of Object.entries(directions)) { if (player.body.touching[direction] && Math.abs(player.body.velocity[axis]) > velocityThreshold) { player.body.velocity[axis] *= -bounceFactor; } } } else if (player.body.velocity.y > 0) { player.setVelocityY(0); } // Prevent sticking to walls if (player.body.touching.left || player.body.touching.right) { player.body.velocity.y *= 0.8; } } startDeceleration() { if (!this.player.isFlying && this.input.activePointer.isDown) { const decelerationRate = 0.9; // Adjust this value to control deceleration speed this.player.setVelocityX(this.player.body.velocity.x * decelerationRate); } } temporaryWalkingTexture() { if (this.player.isFlying) { this.player.setTexture(this.player.textures.walking); this.time.delayedCall(125, () => { // 1/8 second = 125 ms this.player.setTexture(this.player.textures.flying); }); } } wrapPlayerWithCollisionCheck() { const width = this.sys.game.config.width; const playerWidth = this.player.displayWidth; const originalX = this.player.x; let newX = originalX; if (originalX < -playerWidth / 2) { // Player has completely exited the left side newX = width + playerWidth / 2; } else if (originalX > width + playerWidth / 2) { // Player has completely exited the right side newX = -playerWidth / 2; } if (newX !== originalX) { // Player is about to wrap const wrapDirection = newX > originalX ? 'left' : 'right'; const testX = wrapDirection === 'left' ? 0 : width - playerWidth; const bodies = this.physics.overlapRect(testX, this.player.y, playerWidth, this.player.displayHeight); const collidingBodies = bodies.filter(body => body !== this.player.body); if (collidingBodies.length > 0) { // Collision detected, reverse direction and push back const reverseFactor = 0.5; this.player.setVelocityX(-this.player.body.velocity.x * reverseFactor); // Push back from the edge const pushBackDistance = playerWidth / 2 + 1; this.player.x = wrapDirection === 'left' ? width + pushBackDistance : -pushBackDistance; } else { // No collision, allow wrapping this.player.x = newX; } } } createTopBarrier() { const barrierHeight = 10; // Height of the barrier const barrierYPosition = -barrierHeight / 2 - 20; // Move down by 30 pixels (50 - 30 = 20) // Create a static physics group for the top barrier this.topBarrier = this.physics.add.staticGroup(); // Create the barrier above the screen, extending across the entire arena width this.topBarrier.create(this.worldWidth / 2, barrierYPosition, 'red') .setScale(this.worldWidth / 32, barrierHeight / 32) .refreshBody(); // Add collider between player and top barrier this.physics.add.collider(this.player, this.topBarrier, this.handleCollision, null, this); } spawnEggs() { // Always clear existing eggs if (this.eggs) { this.eggs.clear(true, true); } this.eggs = this.physics.add.group(); const eggScale = 0.135; // Reduced by 10% from 0.15 to 0.135 const eggsToSpawn = 5 - this.eggs.getChildren().length; const hatchlingIndex = Phaser.Math.Between(0, eggsToSpawn - 1); const centerX = this.worldWidth / 2; const exclusionZone = 75; // 75 pixels on either side of the center for (let i = 0; i < eggsToSpawn; i++) { let x; do { x = Phaser.Math.Between(0, this.worldWidth); } while (Math.abs(x - centerX) < exclusionZone); const isHatchling = i === hatchlingIndex; const eggTexture = isHatchling ? 'hatchlingEgg' : 'egg'; const egg = this.eggs.create(x, 50, eggTexture) // Spawn at y=50 instead of y=0 .setBounce(0.3) .setCollideWorldBounds(true) .setVelocityY(50) .setDepth(15); // Set the egg's gravity to half of the default gravity egg.body.setGravityY(this.physics.config.gravity.y / 2); egg.isHatchling = isHatchling; const originalEgg = this.textures.get('egg'); const currentEggTexture = this.textures.get(eggTexture); if (isHatchling) { egg.setOrigin(0, 1); // Set origin to bottom left for hatchling egg // Calculate scale based on the height ratio to maintain proportions const scaleRatio = originalEgg.source[0].height / currentEggTexture.source[0].height; egg.setScale(eggScale * scaleRatio); // Set the hitbox size to match the original egg egg.body.setSize(originalEgg.source[0].width, originalEgg.source[0].height); // Adjust the hitbox offset to align with the bottom left origin egg.body.setOffset(0, egg.height - egg.body.height); // Start the hatchling egg timer this.startHatchlingEggTimer(egg); } else { egg.setOrigin(0.5, 0.5); // Keep center origin for normal eggs egg.setScale(eggScale); } } // Add colliders for eggs with ground and platforms this.physics.add.collider(this.eggs, this.ground); this.physics.add.collider(this.eggs, this.platforms); this.physics.add.overlap(this.player, this.eggs, this.collectEgg, null, this); console.log('Spawned', eggsToSpawn, 'eggs. Total eggs:', this.eggs.getChildren().length); } startHatchlingEggTimer(egg) { // Set up the timer event for hatching egg.timerEvent = this.time.delayedCall(this.hatchlingEggTimerDuration, () => { if (egg.active) { this.hatchEgg(egg); } }, [], this); } hatchEgg(egg) { if (!egg.active) return; // Calculate hatch duration based on the current level const baseDuration = 5000; // 5 seconds in milliseconds const durationReductionPerLevel = 250; // 1/4 second in milliseconds const hatchDuration = Math.max(1000, baseDuration - (this.level - 1) * durationReductionPerLevel); // Play the dragon sound at the start of hatching if (this.dragonSound) { this.dragonSound.play(); } // Get egg hitbox dimensions and position const eggHitbox = egg.body; const eggBottomCenterX = eggHitbox.x + eggHitbox.width / 2; const eggBottomCenterY = eggHitbox.y + eggHitbox.height; // Create the dragon sprite aligned with the egg's hitbox bottom center const dragon = this.add.sprite(eggBottomCenterX, eggBottomCenterY, 'dragonUp'); dragon.setOrigin(0.5, 1); // Set origin to bottom center dragon.setScale(0.01); // Start with a very small scale dragon.setDepth(egg.depth - 1); // Place dragon behind the egg // Associate the dragon with the egg egg.associatedDragon = dragon; // Store the egg's bottom center position for later use const eggBottomCenterPosition = { x: eggBottomCenterX, y: eggBottomCenterY }; // Flicker effect for the egg const flickerTween = this.tweens.add({ targets: egg, alpha: 0.5, yoyo: true, repeat: -1, duration: 200 }); // Tween to grow the dragon egg.hatchingTween = this.tweens.add({ targets: dragon, scale: 0.15, // Final scale matching the regular dragon size duration: hatchDuration, ease: 'Power1', onUpdate: () => { // Adjust the dragon's position to keep its bottom center aligned with the egg's bottom center dragon.y = eggBottomCenterPosition.y; }, onComplete: () => { // Stop the egg's flicker effect flickerTween.stop(); // Play the dragon sound again at the end of hatching if (this.dragonSound) { this.dragonSound.play(); } // Check if the egg is still active before completing the hatching process if (egg.active) { // Remove the egg egg.destroy(); // Convert dragon to a physics-enabled sprite const physicsDragon = this.physics.add.sprite(eggBottomCenterPosition.x, eggBottomCenterPosition.y, 'dragonUp'); physicsDragon.setScale(0.15); physicsDragon.setOrigin(0.5, 1); // Set origin to bottom center physicsDragon.setDepth(15); // Set up dragon properties physicsDragon.isFlying = true; physicsDragon.flapTimer = 0; physicsDragon.flapInterval = 500; // Adjust this value to change flapping speed // Set up physics properties physicsDragon.setBounce(0.2); physicsDragon.setCollideWorldBounds(true); // Adjust hitbox size and position const hitboxWidth = physicsDragon.width * 0.8; const hitboxHeight = physicsDragon.height * 0.5; const hitboxOffsetX = (physicsDragon.width - hitboxWidth) / 2; const hitboxOffsetY = physicsDragon.height - hitboxHeight; physicsDragon.body.setSize(hitboxWidth, hitboxHeight); physicsDragon.body.setOffset(hitboxOffsetX, hitboxOffsetY); // Set initial velocity physicsDragon.setVelocity( Phaser.Math.Between(-100, 100), Phaser.Math.Between(-50, 50) ); // Add collisions for the dragon this.physics.add.collider(physicsDragon, this.ground); this.physics.add.collider(physicsDragon, this.platforms); this.physics.add.collider( this.player, physicsDragon, this.handlePlayerDragonCollision, null, this ); // Add the dragon to the dragons group if (!this.dragons) { this.dragons = this.physics.add.group(); } this.dragons.add(physicsDragon); } // Always destroy the original dragon sprite dragon.destroy(); } }); // Add a safeguard to destroy the dragon sprite if the egg is destroyed prematurely egg.on('destroy', () => { if (dragon && dragon.active) { dragon.destroy(); } if (egg.hatchingTween) { egg.hatchingTween.stop(); } if (flickerTween) { flickerTween.stop(); } }); } collectEgg(player, egg) { if (!egg || !egg.active) return; // Safety check const points = 10; // Check if it's a hatchling egg if (egg.isHatchling) { // Deactivate the egg timer if it exists if (egg.timerEvent) { egg.timerEvent.remove(false); } // Remove the associated dragon if it exists if (egg.associatedDragon) { egg.associatedDragon.destroy(); } // Cancel the hatching process if (egg.hatchingTween) { egg.hatchingTween.stop(); } } // Disable the egg's physics body without destroying it egg.disableBody(true, false); // Hide the egg visually egg.setVisible(false); this.score += points; this.scoreText.setText('Score: ' + this.score); this.createFlashEffect(egg.x, egg.y); this.eggsCollected++; this.updateEggCounter(); // Play the crush sound if (this.crushSound && typeof this.crushSound.play === 'function') { this.crushSound.play(); } else { console.warn('Crush sound not available'); } // Trigger slime effect this.createSlimeEffect(egg.x, egg.y); // Remove the egg from its group immediately this.eggs.remove(egg, true, true); // Ensure all tweens related to this egg are stopped this.tweens.killTweensOf(egg); // Check for level completion if (this.eggsCollected === 5) { this.nextLevel(); } } createSlimeEffect(x, y) { const greenParticleCount = 15; const purpleParticleCount = 5; const particleSpeed = 3; const particleGravity = 300; // Increased from 150 to 300 const particleLifespan = 15000; const fadeOutTime = 3000; const eggHeight = 32 * 0.15; const emissionY = y - (eggHeight / 2); this.slimeBlob = this.add.group(); const createParticle = (particleType, count, tint) => { for (let i = 0; i < count; i++) { const particle = this.physics.add.image( x + Phaser.Math.Between(-5, 5), emissionY + Phaser.Math.Between(-5, 5), particleType ); particle.setScale(0.2); particle.setDepth(15); particle.setBounce(0.1); particle.setCollideWorldBounds(true); particle.setVelocity( Phaser.Math.Between(-particleSpeed, particleSpeed), Phaser.Math.Between(-particleSpeed, particleSpeed) ); particle.setGravityY(particleGravity); particle.setTint(tint); particle.setFriction(0.95); particle.setDamping(true); particle.setDrag(0.8); const radius = particle.width * particle.scaleX / 2; particle.body.setCircle(radius); this.slimeBlob.add(particle); this.tweens.add({ targets: particle, alpha: { from: 1, to: 0 }, ease: 'Linear', duration: fadeOutTime, delay: particleLifespan - fadeOutTime, onComplete: () => { particle.destroy(); } }); } }; // Create green particles createParticle('particle1', greenParticleCount, 0x00ff00); // Create purple particles createParticle('particle2', purpleParticleCount, 0x800080); // Remove the collider with platforms this.physics.add.collider(this.slimeBlob, this.ground, null, null, this); this.physics.add.collider(this.slimeBlob, this.slimeBlob, this.handleParticleCollision, null, this); // Start the update loop for fluid-like behavior this.time.addEvent({ delay: 16, // 60 fps callback: this.updateSlimeBlob, callbackScope: this, loop: true }); // Add separation behavior this.time.addEvent({ delay: 16, // 60 fps callback: this.separateParticles, callbackScope: this, loop: true }); } separateParticles() { const particles = this.slimeBlob.getChildren(); const separationDistance = 10; // Adjust this value to change how far apart particles try to stay const separationForce = 0.5; // Adjust this value to change how strongly particles separate for (let i = 0; i < particles.length; i++) { const particle1 = particles[i]; let dx = 0; let dy = 0; for (let j = 0; j < particles.length; j++) { if (i !== j) { const particle2 = particles[j]; const distance = Phaser.Math.Distance.Between(particle1.x, particle1.y, particle2.x, particle2.y); if (distance < separationDistance) { const angle = Phaser.Math.Angle.Between(particle2.x, particle2.y, particle1.x, particle1.y); dx += Math.cos(angle) * (separationDistance - distance) * separationForce; dy += Math.sin(angle) * (separationDistance - distance) * separationForce; } } } particle1.body.velocity.x += dx; particle1.body.velocity.y += dy; } } handleParticleCollision(particle1, particle2) { const dx = particle2.x - particle1.x; const dy = particle2.y - particle1.y; const distance = Math.sqrt(dx * dx + dy * dy); const minDistance = (particle1.displayWidth + particle2.displayWidth) / 2; if (distance < minDistance) { const angle = Math.atan2(dy, dx); const targetX = particle1.x + Math.cos(angle) * minDistance; const targetY = particle1.y + Math.sin(angle) * minDistance; const ax = (targetX - particle2.x) * 0.05; const ay = (targetY - particle2.y) * 0.05; particle1.body.velocity.x -= ax; particle1.body.velocity.y -= ay; particle2.body.velocity.x += ax; particle2.body.velocity.y += ay; } } updateSlimeBlob() { const particles = this.slimeBlob.getChildren(); const centerX = Phaser.Math.Average(particles.map(p => p.x)); const centerY = Phaser.Math.Average(particles.map(p => p.y)); particles.forEach(particle => { const dx = centerX - particle.x; const dy = centerY - particle.y; const distance = Math.sqrt(dx * dx + dy * dy); if (distance > 30) { particle.body.velocity.x += dx * 0.08; particle.body.velocity.y += dy * 0.08; } // Simulate surface tension particle.body.velocity.x *= 0.98; particle.body.velocity.y *= 0.98; // Add a slight downward force to simulate gravity and flowing particle.body.velocity.y += 0.5; // Check if the particle is inside a platform const platformsInside = this.platforms.getChildren().filter(platform => Phaser.Geom.Intersects.RectangleToRectangle(particle.getBounds(), platform.getBounds()) ); if (platformsInside.length > 0) { // Slowly push the particle upward if it's inside a platform particle.body.velocity.y -= 1; particle.y -= 0.5; } // Add a slight random movement for more organic behavior particle.body.velocity.x += Phaser.Math.Between(-1, 1); particle.body.velocity.y += Phaser.Math.Between(-1, 1); // Limit the maximum velocity to prevent particles from moving too fast particle.body.velocity.x = Phaser.Math.Clamp(particle.body.velocity.x, -50, 50); particle.body.velocity.y = Phaser.Math.Clamp(particle.body.velocity.y, -50, 50); }); // Call the separation function this.separateParticles(); } // Hatchling-related methods have been removed updateEggCounter() { const eggsRemaining = 5 - this.eggsCollected; this.eggCounterText.setText(`Eggs: ${eggsRemaining}`); } nextLevel() { this.level++; this.levelText.setText('Level: ' + this.level); this.eggsCollected = 0; this.updateEggCounter(); // Reset last update time to avoid large jumps this.lastUpdateTime = this.time.now; // Decrease the hatchling egg timer duration this.hatchlingEggTimerDuration = Math.max(5000, this.hatchlingEggTimerDuration - 5000); // Ensure UI stays fixed and on top this.children.bringToTop(this.uiContainer); // Refresh UI elements this.scoreText.setScrollFactor(0).setDepth(1001); this.levelText.setScrollFactor(0).setDepth(1001); this.timerText.setScrollFactor(0).setDepth(1001); this.eggCounterText.setScrollFactor(0).setDepth(1001); this.livesText.setScrollFactor(0).setDepth(1001); // Store UI elements before cleanup const uiElements = [this.scoreText, this.levelText, this.timerText, this.eggCounterText, this.livesText]; // Clean up existing game objects this.cleanupLevel(uiElements); // Perform the level transition effect this.performLevelTransition(); // Ensure UI elements are still in the scene and visible uiElements.forEach(element => { if (element && element.scene) { element.setVisible(true); this.children.bringToTop(element); } }); // Final check to ensure UI container is on top this.children.bringToTop(this.uiContainer); } cleanupLevel(uiElements) { // Destroy all existing platforms if (this.platforms) { this.platforms.clear(true, true); } // Destroy all existing eggs if (this.eggs) { this.eggs.clear(true, true); } // Destroy all slime particles if (this.slimeBlob) { this.slimeBlob.clear(true, true); } // Remove all existing physics bodies except the player and UI elements const bodies = this.physics.world.bodies.getArray(); for (let i = 0; i < bodies.length; i++) { const body = bodies[i]; if (body && body.gameObject && body.gameObject !== this.player && !uiElements.includes(body.gameObject)) { body.gameObject.destroy(); } } // Clear any remaining tweens except those for UI elements this.tweens.getAllTweens().forEach(tween => { if (!uiElements.includes(tween.targets[0])) { tween.stop(); } }); } performLevelTransition() { if (this.player && this.player.body) { this.player.body.enable = false; } if (this.player && this.player.input) { this.player.input.enabled = false; } // Pause the breathing animation if (this.breathingTween) { this.breathingTween.pause(); } const originalScale = this.player ? { x: this.player.scaleX, y: this.player.scaleY } : { x: 1, y: 1 }; const spawnPosition = { x: this.worldWidth / 2, y: 50 }; const scaleFactor = 4; const centerX = this.worldWidth / 2; const gameHeight = this.sys.game.config.height; const centerY = gameHeight * 0.4; // Position slightly above center // Temporarily disable zoom const currentZoom = 1; // Temporarily disable UI offset and scale factor adjustments this.UIyOffset = 0; this.UIscaleFactor = 1; if (this.player) { // Create red graphic behind the player this.redGraphic = this.add.image(centerX, centerY, 'red') .setScale(this.player.scaleX * scaleFactor * 2) // Doubled the scale .setAlpha(0) .setDepth(this.player.depth - 1); // Create level text this.levelTransitionText = this.add.text(centerX, centerY, `Level ${this.level}`, { fontFamily: 'Arial, sans-serif', fontSize: '48px', color: '#ffffff', stroke: '#000000', strokeThickness: 6, align: 'center' }).setOrigin(0.5).setAlpha(0).setDepth(this.player.depth + 1); // Ensure UI elements are visible and on top this.children.bringToTop(this.uiContainer); // Make sure UI elements are not affected by camera movement this.uiContainer.setScrollFactor(0); // Expand the player this.tweens.add({ targets: this.player, x: centerX, y: centerY, scaleX: originalScale.x * scaleFactor, scaleY: originalScale.y * scaleFactor, duration: 500, ease: 'Power2', onStart: () => { if (this.flapSound) { this.flapSound.play(); } }, onUpdate: (tween) => { // Update red graphic size and alpha const progress = tween.progress; this.redGraphic.setScale(this.player.scaleX * 2); // Doubled the scale this.redGraphic.setAlpha(progress); // Adjust red graphic position to bottom center of player this.redGraphic.setPosition( this.player.x, this.player.y + (this.player.displayHeight / 2) ); // Update level text position and alpha this.levelTransitionText.setPosition( this.player.x, this.player.y + (this.player.displayHeight / 2) ); this.levelTransitionText.setAlpha(progress); // Ensure UI stays on top and visible this.children.bringToTop(this.uiContainer); this.uiContainer.setAlpha(1); }, onComplete: () => { // Reset level while player is at full size this.resetLevel(); // Pan the camera to the center of the arena and zoom in this.cameras.main.pan( this.worldWidth / 2, gameHeight / 2, 1000, 'Power2', false, (camera, progress) => { // Ensure UI stays visible during camera pan this.children.bringToTop(this.uiContainer); this.uiContainer.setAlpha(1); if (progress === 1) { // Zoom in this.cameras.main.zoomTo(currentZoom, 500, 'Power2', true); // Wait for zoom to complete, then shrink player this.time.delayedCall(500, () => { // Shrink player and move to spawn point this.tweens.add({ targets: this.player, x: spawnPosition.x, y: spawnPosition.y, scaleX: originalScale.x, scaleY: originalScale.y, duration: 500, ease: 'Power2', onStart: () => { if (this.flapSound) { this.flapSound.play(); } }, onUpdate: (tween) => { // Update red graphic size and alpha const progress = 1 - tween.progress; this.redGraphic.setScale(this.player.scaleX * 2); // Doubled the scale this.redGraphic.setAlpha(progress); // Adjust red graphic position to bottom center of player this.redGraphic.setPosition( this.player.x, this.player.y + (this.player.displayHeight / 2) ); // Update level text position and alpha this.levelTransitionText.setPosition( this.player.x, this.player.y + (this.player.displayHeight / 2) ); this.levelTransitionText.setAlpha(progress); // Ensure UI stays on top and visible this.children.bringToTop(this.uiContainer); this.uiContainer.setAlpha(1); }, onComplete: () => { this.redGraphic.destroy(); this.levelTransitionText.destroy(); this.finalizeLevelTransition(); } }); }); } } ); } }); } } adjustUIContainerSize(zoom) { const camera = this.cameras.main; const visibleWidth = camera.width; const visibleHeight = camera.height; const adjustments = JSON.parse(localStorage.getItem('uiAdjustments') || '{}'); // Temporarily disable UI scaling and position adjustment const uiScale = 1; const uiPositionChange = 0; // Reset and adjust the UI container's position this.uiContainer.setPosition(0, uiPositionChange); this.uiContainer.setScale(uiScale); // Calculate the scaled padding const basePadding = 10; const scaledPadding = basePadding * uiScale; // Adjust positions of UI elements (no need to scale individually) const uiElements = [this.scoreText, this.levelText, this.livesText, this.timerText, this.eggCounterText]; uiElements.forEach(element => element.setScale(1)); // Reset scale as container is scaled this.scoreText.setPosition(scaledPadding, scaledPadding); this.levelText.setPosition(scaledPadding, this.scoreText.y + this.scoreText.height + scaledPadding); this.livesText.setPosition(scaledPadding, this.levelText.y + this.levelText.height + scaledPadding); this.timerText.setPosition(visibleWidth / uiScale - scaledPadding, scaledPadding).setOrigin(1, 0); this.eggCounterText.setPosition(visibleWidth / uiScale - scaledPadding, this.timerText.y + this.timerText.height + scaledPadding).setOrigin(1, 0); // Ensure UI container is on top this.children.bringToTop(this.uiContainer); } applyUIAdjustments() { const adjustments = JSON.parse(localStorage.getItem('uiAdjustments') || '{}'); if (adjustments.scaleMultiplier) { const originalScale = this.uiContainer.scale; this.uiContainer.setScale(originalScale * adjustments.scaleMultiplier); } if (adjustments.positionYOffset) { this.uiContainer.y += adjustments.positionYOffset; } } resetLevel() { // Clear existing platforms and recreate them if (this.platforms) { this.platforms.clear(true, true); } this.createPlatforms(); // Clear existing eggs if (this.eggs) { this.eggs.clear(true, true); } // Spawn new eggs for the new level this.spawnEggs(); // Re-add colliders this.physics.add.collider(this.eggs, this.platforms); } finalizeLevelTransition() { if (this.player && this.player.body) { this.player.body.enable = true; } if (this.player && this.player.input) { this.player.input.enabled = true; } // Resume the breathing animation if (this.breathingTween) { this.breathingTween.resume(); } // Re-add player colliders this.physics.add.collider(this.player, this.platforms); // Ensure camera is following the player this.cameras.main.startFollow(this.player, true, 0.08, 0.08); } resetLevel() { // Clear existing platforms and recreate them if (this.platforms) { this.platforms.clear(true, true); } this.createPlatforms(); // Clear existing eggs if (this.eggs) { this.eggs.clear(true, true); } // Spawn new eggs for the new level this.spawnEggs(); // Re-add colliders this.physics.add.collider(this.eggs, this.platforms); } finalizeLevelTransition() { if (this.player && this.player.body) { this.player.body.enable = true; } if (this.player && this.player.input) { this.player.input.enabled = true; } // Resume the breathing animation if (this.breathingTween) { this.breathingTween.resume(); } // Re-add player colliders this.physics.add.collider(this.player, this.platforms); // Ensure camera is following the player this.cameras.main.startFollow(this.player, true, 0.08, 0.08); // Ensure UI stays visible and on top this.children.bringToTop(this.uiContainer); this.uiContainer.setAlpha(1); // Update UI text this.scoreText.setText('Score: ' + this.score); this.levelText.setText('Level: ' + this.level); this.updateEggCounter(); this.updateLives(0); // Refresh lives display without changing the value } updateTimer() { const currentTime = this.time.now; const elapsedTime = currentTime - this.lastUpdateTime; this.gameTimer += elapsedTime; this.lastUpdateTime = currentTime; const totalSeconds = Math.floor(this.gameTimer / 1000); const minutes = Math.floor(totalSeconds / 60); const seconds = totalSeconds % 60; this.timerText.setText(`Time: ${minutes}:${seconds.toString().padStart(2, '0')}`); } updateLives(change) { this.lives += change; this.livesText.setText('Lives: ' + this.lives); if (this.lives <= 0) { this.gameOver(); } } gameOver() { console.log('Game Over'); // Stop the background music only when the game is over if (this.gameMusic && this.gameMusic.isPlaying) { this.gameMusic.stop(); } // Update high scores this.updateHighScores(this.score); // Stop any ongoing game processes this.scene.stop('Jouster'); // Clean up any remaining physics bodies this.cleanupPhysics(); // Start the Scoreboard scene and pass the final score and high scores this.scene.start('Scoreboard', { finalScore: this.score, highScores: this.highScores }); } updateHighScores(newScore) { this.highScores.push(newScore); this.highScores.sort((a, b) => b - a); // Sort in descending order this.highScores = this.highScores.slice(0, 3); // Keep only top 3 scores } cleanupPhysics() { // Destroy all existing game objects with physics bodies this.eggs && this.eggs.clear(true, true); this.dragons && this.dragons.clear(true, true); this.platforms && this.platforms.clear(true, true); this.ground && this.ground.destroy(); this.topBarrier && this.topBarrier.clear(true, true); this.slimeParticles && this.slimeParticles.clear(true, true); // Clear all colliders this.physics.world.colliders.destroy(); } handlePlayerDragonCollision(player, dragon) { if (!player.active || !dragon.active) return; // Calculate the vertical distance between the player's feet and the dragon's top const playerFeetY = player.y + player.displayHeight / 2; const dragonTopY = dragon.y - dragon.displayHeight / 2; const verticalDistance = playerFeetY - dragonTopY; // Define a threshold for considering it a top hit (e.g., 1/3 of the dragon's height) const topHitThreshold = dragon.displayHeight / 3; if (verticalDistance <= topHitThreshold) { // Player is on top of the dragon this.killDragon(dragon); // Bounce the player off the dragon player.setVelocityY(-300); } else { // Player is below or to the side of the dragon this.killPlayer(); } } killPlayer() { this.updateLives(-1); // Reset player position or implement respawn logic this.player.setPosition(this.worldWidth / 2, 50); // Check if game is over if (this.lives <= 0) { this.gameOver(); } } killDragon(dragon) { if (dragon && dragon.active && dragon.body) { if (dragon.isTransforming) { this.score += 20; // Score for killing a transforming dragon } else { this.score += 50; // Increase score for killing a fully transformed dragon } this.scoreText.setText('Score: ' + this.score); this.createFlashEffect(dragon.x, dragon.y); // Stop any ongoing tweens for this dragon if (dragon.transformTween && typeof dragon.transformTween.stop === 'function') { dragon.transformTween.stop(); } // Create dragon slime effect with dragon's velocity this.createDragonSlimeEffect(dragon.x, dragon.y, dragon.body.velocity); // Create a hatchling egg at the dragon's position const egg = this.physics.add.sprite(dragon.x, dragon.y, 'hatchlingEgg'); egg.setOrigin(0.5, 1); // Set origin to bottom center egg.setScale(0.15); // Slightly larger than the original scale // Set the hitbox to match the regular egg const regularEggTexture = this.textures.get('egg'); egg.body.setSize(regularEggTexture.getSourceImage().width, regularEggTexture.getSourceImage().height); egg.body.setOffset(0, 0); // Set the egg's velocity to match the dragon's egg.setVelocity(dragon.body.velocity.x, dragon.body.velocity.y); // Add the egg to the eggs group if (this.eggs) { this.eggs.add(egg); } // Add colliders for the new egg this.physics.add.collider(egg, this.ground); this.physics.add.collider(egg, this.platforms); this.physics.add.overlap(this.player, egg, this.collectEgg, null, this); // Start the hatchling egg timer this.startHatchlingEggTimer(egg); // Remove the dragon from the group and destroy it this.dragons.remove(dragon, true, true); } } createDragon(x, y) { const dragon = this.physics.add.sprite(x, y, 'dragonUp'); dragon.setScale(0.15); dragon.setOrigin(0.5, 1); dragon.setDepth(15); // Set up dragon properties dragon.isFlying = true; dragon.flapTimer = 0; dragon.flapInterval = 500; // Adjust this value to change flapping speed dragon.originalY = y; // Store the original Y position for walking animation // Calculate new hitbox dimensions (50% of the dragon's height) const hitboxHeight = dragon.displayHeight * 0.5; const hitboxWidth = dragon.displayWidth * 0.8; // 80% of the dragon's width for a tighter fit // Calculate the offset to keep the bottom center aligned and move the top down by 25% const offsetY = dragon.displayHeight * 0.75 - hitboxHeight; const offsetX = (dragon.displayWidth - hitboxWidth) / 2; // Set the hitbox size and offset dragon.body.setSize(hitboxWidth, hitboxHeight); dragon.body.setOffset(offsetX, offsetY); // Set up physics properties dragon.setBounce(0.2); dragon.setCollideWorldBounds(true); // Add collisions this.physics.add.collider(dragon, this.ground); this.physics.add.collider(dragon, this.platforms); this.physics.add.collider(this.player, dragon, this.handlePlayerDragonCollision, null, this); // Add to dragons group if (!this.dragons) { this.dragons = this.physics.add.group(); } this.dragons.add(dragon); return dragon; } updateDragon(dragon) { if (!dragon.active || !dragon.body) return; const distanceToPlayer = Phaser.Math.Distance.Between(dragon.x, dragon.y, this.player.x, this.player.y); const angleToPlayer = Phaser.Math.Angle.Between(dragon.x, dragon.y, this.player.x, this.player.y); // Update dragon's flying/walking state based on the player's state if (this.player.isFlying && !dragon.isFlying && distanceToPlayer > 100) { this.setDragonFlying(dragon, true); } else if (!this.player.isFlying && dragon.isFlying && distanceToPlayer < 50) { this.setDragonFlying(dragon, false); } // Pursue the player const speed = dragon.isFlying ? 100 : 50; const targetVelocityX = Math.cos(angleToPlayer) * speed; const targetVelocityY = Math.sin(angleToPlayer) * speed; // Smoothly adjust velocity dragon.body.velocity.x = Phaser.Math.Linear(dragon.body.velocity.x, targetVelocityX, 0.1); dragon.body.velocity.y = Phaser.Math.Linear(dragon.body.velocity.y, targetVelocityY, 0.1); // Handle flapping and walking animation if (dragon.isFlying) { dragon.flapTimer += this.game.loop.delta; if (dragon.flapTimer >= dragon.flapInterval) { dragon.setTexture(dragon.texture.key === 'dragonUp' ? 'dragonDown' : 'dragonUp'); dragon.flapTimer = 0; // Play flap sound if (this.flapSound) { this.flapSound.play({ volume: 0.5 }); // Reduced volume for dragon flaps } } // Simulate up and down movement while flying dragon.y += Math.sin(this.time.now / 200) * 0.5; } else { dragon.setTexture('dragonWalking'); // Simulate walking animation dragon.y = dragon.originalY + Math.sin(this.time.now / 150) * 2; } // Flip the dragon sprite based on its horizontal velocity dragon.flipX = dragon.body.velocity.x < 0; } setDragonFlying(dragon, isFlying) { dragon.isFlying = isFlying; if (isFlying) { dragon.setTexture('dragonUp'); dragon.body.setAllowGravity(false); dragon.body.setDrag(10, 10); // Less drag while flying } else { dragon.setTexture('dragonWalking'); dragon.body.setAllowGravity(true); dragon.body.setDrag(100, 0); // More horizontal drag while walking dragon.y = dragon.originalY; // Reset Y position when transitioning to walking } } createDragonSlimeEffect(x, y, dragonVelocity) { const greenParticleCount = 30; // Doubled from 15 const purpleParticleCount = 10; // Doubled from 5 const particleSpeedVariation = 50; // Variation in particle speed const upwardKick = 100; // Upward velocity boost const particleGravity = 300; const particleLifespan = 15000; const fadeOutTime = 3000; this.dragonSlimeBlob = this.add.group(); const createParticle = (particleType, count, tint) => { for (let i = 0; i < count; i++) { const particle = this.physics.add.image( x + Phaser.Math.Between(-10, 10), y + Phaser.Math.Between(-10, 10), particleType ); particle.setScale(0.2); particle.setDepth(15); particle.setBounce(0.5); particle.setCollideWorldBounds(true); particle.setVelocity( dragonVelocity.x + Phaser.Math.Between(-particleSpeedVariation, particleSpeedVariation), dragonVelocity.y - upwardKick + Phaser.Math.Between(-particleSpeedVariation, particleSpeedVariation) ); particle.setGravityY(particleGravity); particle.setTint(tint); particle.setFriction(0.95); particle.setDamping(true); particle.setDrag(0.8); const radius = particle.width * particle.scaleX / 2; particle.body.setCircle(radius); this.dragonSlimeBlob.add(particle); this.tweens.add({ targets: particle, alpha: { from: 1, to: 0 }, ease: 'Linear', duration: fadeOutTime, delay: particleLifespan - fadeOutTime, onComplete: () => { particle.destroy(); } }); // Add overlap with player this.physics.add.overlap(this.player, particle, () => { this.stickParticleToPlayer(particle); }, null, this); } }; // Create green particles createParticle('particle1', greenParticleCount, 0x00ff00); // Create purple particles createParticle('particle2', purpleParticleCount, 0x800080); this.physics.add.collider(this.dragonSlimeBlob, this.ground); this.physics.add.collider(this.dragonSlimeBlob, this.platforms); // Start the update loop for fluid-like behavior this.time.addEvent({ delay: 16, // 60 fps callback: this.updateDragonSlimeBlob, callbackScope: this, loop: true }); } stickParticleToPlayer(particle) { if (particle.isStuck) return; // Prevent multiple attachments particle.isStuck = true; particle.body.enable = false; // Disable physics const offsetX = particle.x - this.player.x; const offsetY = particle.y - this.player.y; this.time.addEvent({ delay: 16, callback: () => { if (particle.active) { particle.x = this.player.x + offsetX; particle.y = this.player.y + offsetY; } }, loop: true }); } updateDragonSlimeBlob() { const particles = this.dragonSlimeBlob.getChildren(); particles.forEach(particle => { if (!particle.isStuck) { // Add a slight random movement for more organic behavior particle.body.velocity.x += Phaser.Math.Between(-1, 1); particle.body.velocity.y += Phaser.Math.Between(-1, 1); // Limit the maximum velocity to prevent particles from moving too fast particle.body.velocity.x = Phaser.Math.Clamp(particle.body.velocity.x, -50, 50); particle.body.velocity.y = Phaser.Math.Clamp(particle.body.velocity.y, -50, 50); } }); // Apply separation behavior this.separateDragonSlimeParticles(); } separateDragonSlimeParticles() { const particles = this.dragonSlimeBlob.getChildren(); const separationDistance = 10; // Adjust this value to change how far apart particles try to stay const separationForce = 0.5; // Adjust this value to change how strongly particles separate for (let i = 0; i < particles.length; i++) { const particle1 = particles[i]; if (particle1.isStuck) continue; // Skip stuck particles let dx = 0; let dy = 0; for (let j = 0; j < particles.length; j++) { if (i !== j) { const particle2 = particles[j]; if (particle2.isStuck) continue; // Skip stuck particles const distance = Phaser.Math.Distance.Between(particle1.x, particle1.y, particle2.x, particle2.y); if (distance < separationDistance) { const angle = Phaser.Math.Angle.Between(particle2.x, particle2.y, particle1.x, particle1.y); dx += Math.cos(angle) * (separationDistance - distance) * separationForce; dy += Math.sin(angle) * (separationDistance - distance) * separationForce; } } } particle1.body.velocity.x += dx; particle1.body.velocity.y += dy; } } createFlashEffect(x, y) { this.tweens.add({ targets: this.add.image(x, y, 'flash').setScale(0.1), alpha: 0, scale: 0.3, duration: 200, onComplete: (tween) => tween.targets[0].destroy() }); } // Remove these lines completely } // CalibrationScene has been removed class StartScene extends Phaser.Scene { constructor() { super({ key: 'StartScene' }); this.videoUrl = 'https://play.rosebud.ai/assets/JousterStartScreen.mp4?ydYC'; } preload() { this.load.image('fallbackImage', 'https://play.rosebud.ai/assets/platformer_character.png?In9m'); this.load.audio('introMusic', 'https://play.rosebud.ai/assets/ClickToPlay.mp3?rYvK'); } create() { const { width, height } = this.scale; // Create a loading text this.loadingText = this.add.text(width / 2, height / 2, 'Loading video...', { fontSize: '24px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center' }).setOrigin(0.5); // Remove the final score display code // Initialize intro music this.introMusic = this.sound.add('introMusic', { loop: true, volume: 0.5 }); // Start playing intro music if (this.introMusic) { try { this.introMusic.play(); } catch (error) { console.warn('Audio play failed:', error); } } else { console.warn('Intro music could not be initialized'); } this.attemptVideoDownload(); } attemptVideoDownload() { fetch(this.videoUrl) .then(response => response.blob()) .then(blob => { const videoUrl = URL.createObjectURL(blob); this.setupVideoScene(videoUrl); }) .catch(error => { console.error('Error downloading video:', error); this.setupFallbackScene(); }); } setupVideoScene(videoUrl) { const { width, height } = this.scale; // Remove loading text if (this.loadingText) this.loadingText.destroy(); // Ensure the score text stays above everything if (this.scoreText) { this.scoreText.setDepth(1001); } // Create video element const videoElement = document.createElement('video'); videoElement.src = videoUrl; videoElement.autoplay = true; videoElement.loop = true; videoElement.muted = true; videoElement.playsInline = true; videoElement.style.zIndex = '0'; // Ensure video is at the bottom layer // Add event listener for when the video starts playing videoElement.addEventListener('play', () => { // Start playing the intro music when the video starts if (this.introMusic && !this.introMusic.isPlaying) { this.introMusic.play().catch(error => { console.warn('Audio play failed:', error); }); } }, { once: true }); // Calculate video dimensions to maintain 16:9 aspect ratio const videoWidth = width * 0.8; // 80% of game width const videoHeight = (videoWidth / 16) * 9; // maintain 16:9 aspect ratio videoElement.style.width = `${videoWidth}px`; videoElement.style.height = `${videoHeight}px`; videoElement.style.objectFit = 'contain'; videoElement.style.position = 'absolute'; videoElement.style.top = '50%'; videoElement.style.left = '50%'; videoElement.style.transform = 'translate(-50%, -50%)'; videoElement.style.zIndex = '0'; videoElement.style.maxWidth = '100%'; videoElement.style.maxHeight = '100%'; videoElement.style.pointerEvents = 'none'; // Prevent video from capturing clicks // Add video element to the game's parent container const parentContainer = this.game.canvas.parentNode; parentContainer.insertBefore(videoElement, this.game.canvas); // Ensure the video is playing videoElement.play().catch(e => console.error("Video playback failed:", e)); // Create a full-screen interactive zone const interactiveZone = this.add.zone(0, 0, width, height); interactiveZone.setOrigin(0); interactiveZone.setInteractive(); // Add text to indicate the game can be started const startText = this.add.text(width / 2, height * 0.9, 'Tap anywhere to start', { fontSize: '24px', fontFamily: 'Arial, sans-serif', color: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setOrigin(0.5).setDepth(999); // Add input listener to start the game interactiveZone.once('pointerdown', () => { if (this.introMusic && this.introMusic.isPlaying) { this.introMusic.stop(); } videoElement.remove(); URL.revokeObjectURL(videoUrl); this.scene.start('Jouster', { startLevel: 1, finalScore: 0, // Reset the final score when starting a new game reset: true // Add a flag to indicate a fresh start }); }, this); } setupFallbackScene() { const { width, height } = this.scale; // Remove loading text if (this.loadingText) this.loadingText.destroy(); // Display the final score if it's greater than 0 if (this.finalScore > 0) { this.scoreText = this.add.text(width / 2, height * 0.1, `Final Score: ${this.finalScore}`, { fontSize: '32px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 4 }).setOrigin(0.5).setDepth(1000); } // Use the fallback image const fallbackImage = this.add.image(width / 2, height / 2, 'fallbackImage'); fallbackImage.setOrigin(0.5); // Scale the image to cover the screen while maintaining aspect ratio const scaleX = width / fallbackImage.width; const scaleY = height / fallbackImage.height; const scale = Math.max(scaleX, scaleY); fallbackImage.setScale(scale); // Add text const text = this.add.text(width / 2, height * 0.8, 'Tap to Start', { fontSize: '48px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 6 }).setOrigin(0.5); // Make sure the text is on top of everything text.setDepth(999); // Add input listener to the entire scene this.input.once('pointerdown', () => { if (this.introMusic && this.introMusic.isPlaying) { this.introMusic.stop(); } // Removed playing of 'clickToPlay' sound this.scene.start('Jouster', { startLevel: 1, finalScore: 0 // Reset the final score when starting a new game }); }, this); } } class Scoreboard extends Phaser.Scene { constructor() { super({ key: 'Scoreboard' }); this.finalScore = 0; this.highScores = []; this.videoUrl = 'https://play.rosebud.ai/assets/JousterStartScreen.mp4?ydYC'; } init(data) { this.finalScore = data.finalScore || 0; this.highScores = data.highScores || []; this.updateHighScores(); } updateHighScores() { this.highScores.push(this.finalScore); this.highScores.sort((a, b) => b - a); this.highScores = this.highScores.slice(0, 3); } preload() { this.load.image('fallbackImage', 'https://play.rosebud.ai/assets/platformer_character.png?In9m'); this.load.audio('scoreboardMusic', 'https://play.rosebud.ai/assets/ClickToPlay.mp3?rYvK'); } create() { const { width, height } = this.scale; // Create a loading text this.loadingText = this.add.text(width / 2, height / 2, 'Loading video...', { fontSize: '24px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center' }).setOrigin(0.5); // Initialize scoreboard music this.scoreboardMusic = this.sound.add('scoreboardMusic', { loop: true, volume: 0.5 }); this.attemptVideoDownload(); } attemptVideoDownload() { fetch(this.videoUrl) .then(response => response.blob()) .then(blob => { const videoUrl = URL.createObjectURL(blob); this.setupVideoScene(videoUrl); }) .catch(error => { console.error('Error downloading video:', error); this.setupFallbackScene(); }); } setupVideoScene(videoUrl) { const { width, height } = this.scale; // Remove loading text if (this.loadingText) this.loadingText.destroy(); // Create video element const videoElement = document.createElement('video'); videoElement.src = videoUrl; videoElement.autoplay = true; videoElement.loop = true; videoElement.muted = true; videoElement.playsInline = true; videoElement.style.zIndex = '0'; // Set up video dimensions and styling const videoWidth = width * 0.8; const videoHeight = (videoWidth / 16) * 9; videoElement.style.width = `${videoWidth}px`; videoElement.style.height = `${videoHeight}px`; videoElement.style.objectFit = 'contain'; videoElement.style.position = 'absolute'; videoElement.style.top = '50%'; videoElement.style.left = '50%'; videoElement.style.transform = 'translate(-50%, -50%)'; videoElement.style.maxWidth = '100%'; videoElement.style.maxHeight = '100%'; videoElement.style.pointerEvents = 'none'; // Add video element to the game's parent container const parentContainer = this.game.canvas.parentNode; parentContainer.insertBefore(videoElement, this.game.canvas); // Ensure the video is playing videoElement.play().catch(e => console.error("Video playback failed:", e)); // Create a full-screen interactive zone const interactiveZone = this.add.zone(0, 0, width, height); interactiveZone.setOrigin(0); interactiveZone.setInteractive(); this.setupScoreboardElements(videoElement, videoUrl, interactiveZone); } setupFallbackScene() { const { width, height } = this.scale; // Remove loading text if (this.loadingText) this.loadingText.destroy(); // Use the fallback image const fallbackImage = this.add.image(width / 2, height / 2, 'fallbackImage'); fallbackImage.setOrigin(0.5); // Scale the image to cover the screen while maintaining aspect ratio const scaleX = width / fallbackImage.width; const scaleY = height / fallbackImage.height; const scale = Math.max(scaleX, scaleY); fallbackImage.setScale(scale); this.setupScoreboardElements(); } setupScoreboardElements(videoElement = null, videoUrl = null, interactiveZone = null) { const { width, height } = this.scale; // Display the final score above the video this.scoreText = this.add.text(width / 2, height * 0.1, `Final Score: ${this.finalScore}`, { fontSize: '48px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 6 }).setOrigin(0.5).setDepth(1000); // Add text to indicate the game can be started (moved up by 6 more pixels) const startText = this.add.text(width / 2, height * 0.2 - 6, 'Click anywhere to Play', { fontSize: '24px', fontFamily: 'Arial, sans-serif', color: '#ffffff', stroke: '#000000', strokeThickness: 4 }).setOrigin(0.5).setDepth(1000); this.showHighScores(); // Add input listener to start the game if (interactiveZone) { interactiveZone.once('pointerdown', this.startNewGame.bind(this, videoElement, videoUrl)); } else { this.input.once('pointerdown', this.startNewGame.bind(this, videoElement, videoUrl)); } // Start playing scoreboard music if (this.scoreboardMusic && !this.scoreboardMusic.isPlaying) { this.scoreboardMusic.play(); } } showHighScores() { const { width, height } = this.scale; const highScoreY = height * 0.88; // Moved further down to 88% of screen height // Create a semi-transparent background for better readability const bgWidth = 400; const bgHeight = 200; // Increased height to accommodate all scores const background = this.add.rectangle(width / 2, highScoreY, bgWidth, bgHeight, 0x000000, 0.7) .setOrigin(0.5) .setDepth(1999); this.add.text(width / 2, highScoreY - 80, 'High Scores:', { fontSize: '32px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 4 }).setOrigin(0.5).setDepth(2000); this.highScores.forEach((score, index) => { this.add.text(width / 2, highScoreY - 30 + (index * 35), `${index + 1}. ${score}`, { fontSize: '24px', fontFamily: 'Arial, sans-serif', color: '#ffffff', align: 'center', stroke: '#000000', strokeThickness: 3 }).setOrigin(0.5).setDepth(2000); }); } startNewGame(videoElement, videoUrl) { this.cleanupScene(videoElement, videoUrl); // Add a small delay before starting the new scene this.time.delayedCall(100, () => { // Start the Jouster scene this.scene.start('Jouster', { startLevel: 1, finalScore: 0, reset: true, highScores: this.highScores }); }); } cleanupScene(videoElement, videoUrl) { // Stop the scoreboard music if it's playing if (this.scoreboardMusic && this.scoreboardMusic.isPlaying) { this.scoreboardMusic.stop(); } // Remove video element if it exists if (videoElement) { videoElement.pause(); videoElement.removeAttribute('src'); videoElement.load(); videoElement.remove(); URL.revokeObjectURL(videoUrl); } // Remove any video elements that might be left in the DOM const videos = document.getElementsByTagName('video'); for (let i = videos.length - 1; i >= 0; i--) { videos[i].pause(); videos[i].removeAttribute('src'); videos[i].load(); videos[i].remove(); } // Destroy all text objects if (this.scoreText) this.scoreText.destroy(); if (this.startText) this.startText.destroy(); // Destroy any other graphical elements (if they exist) if (this.fallbackImage) this.fallbackImage.destroy(); // Remove any remaining tweens this.tweens.killAll(); // Remove any remaining event listeners this.input.off('pointerdown'); // Clear any remaining timers or events this.time.removeAllEvents(); // Ensure all created elements are destroyed this.children.removeAll(true); // Stop all sounds this.sound.stopAll(); } shutdown() { this.cleanupScene(); } } const container = document.getElementById('renderDiv'); const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 600, height: 600, pixelArt: true, crisp: true, physics: { default: 'arcade', arcade: { gravity: { y: 300 }, debug: true, // Set to true to show hitboxes tileBias: 8, overlapBias: 4 } }, scene: [StartScene, Jouster, Scoreboard], backgroundColor: '#000000' }; window.phaserGame = new Phaser.Game(config);