class StartScreen extends Phaser.Scene { constructor() { super({ key: 'StartScreen' }); this.playButton = null; } preload() { this.load.image('titleName', 'https://play.rosebud.ai/assets/Title_Name.png?s38O'); this.load.image('playButton', 'https://play.rosebud.ai/assets/Title_Play_button.jpg?nm39'); this.load.image('howtoButton', 'https://play.rosebud.ai/assets/Title_Howto_button.jpg?8jR6'); this.load.image('leaderboardButton', 'https://play.rosebud.ai/assets/Title_Leaderboard_button.jpg?dJ8o'); } create() { this.cameras.main.setBackgroundColor('#121212'); // Add background pattern for (let i = 0; i < 20; i++) { for (let j = 0; j < 15; j++) { const star = this.add.circle(i * 40 + 20, j * 40 + 20, 1, 0x121212, 0.2); } } // Load and add title image this.add.image(400, 200, 'titleName') .setOrigin(0.5) .setScale(1.5); // Play button // Add play button image this.playButton = this.add.image(400, 300, 'playButton'); // Add leaderboard button // Add How to Play button const howToPlayButton = this.add.image(400, 380, 'howtoButton'); howToPlayButton.setInteractive({ useHandCursor: true }); // Add leaderboard button below How to Play const leaderboardButton = this.add.image(400, 440, 'leaderboardButton'); leaderboardButton.setInteractive({ useHandCursor: true }); this.playButton.setInteractive({ useHandCursor: true }); howToPlayButton.setInteractive(); leaderboardButton.setInteractive(); // Create How to Play menu (initially hidden) this.howToPlayMenu = this.add.container(400, 300); const howToPlayBackground = this.add.rectangle(0, 0, 700, 500, 0x121212, 0.95); const howToPlayBorder = this.add.rectangle(0, 0, 710, 510, 0x121212, 0.3); // Add book spine effect const bookSpine = this.add.rectangle(0, 0, 16, 500, 0x121212, 0.2); // Left page title const leftTitleText = this.add.text(-175, -200, 'Game Rules', { fontSize: '32px', fill: '#ffffff', stroke: '#121212', strokeThickness: 2, fontFamily: 'Rubik' }).setOrigin(0.5); // Right page title const rightTitleText = this.add.text(175, -200, 'Stats Guide', { fontSize: '32px', fill: '#ffffff', stroke: '#121212', strokeThickness: 2, fontFamily: 'Rubik' }).setOrigin(0.5); // Left page content const leftPageText = this.add.text(-175, -140, [ 'How to Play:', '', '• Use WASD to move', '• Click to attack enemies', '• Stay alive as long as possible', '• Kill enemies to gain score', '• Level up to get stronger', '', 'Timer:', '• Start with 60 seconds', '• +60s each level', '• +180s for boss kills' ].join('\n'), { fontSize: '18px', fill: '#ffffff', lineSpacing: 8, fontFamily: 'LeagueSpartan-Bold', align: 'center' }).setOrigin(0.5, 0); // Right page content const rightPageText = this.add.text(175, -140, [ 'Progress:', '', '• Every 10 kills = Level Up', '• Every 5 levels = Boss', '• Boss kills = 3 upgrades', '', 'Tips:', '• Keep moving', '• Watch your health', '• Kill bosses for bonuses', '• Upgrade wisely' ].join('\n'), { fontSize: '18px', fill: '#ffffff', lineSpacing: 8, fontFamily: 'LeagueSpartan-Bold', align: 'center' }).setOrigin(0.5, 0); const closeButton = this.add.rectangle(320, -220, 30, 30, 0x121212); const closeText = this.add.text(320, -220, '×', { fontSize: '32px', fill: '#ffffff' }).setOrigin(0.5); // Add everything to the menu this.howToPlayMenu.add([howToPlayBackground, howToPlayBorder, bookSpine, leftTitleText, rightTitleText, leftPageText, rightPageText, closeButton, closeText]); this.howToPlayMenu.setVisible(false); closeButton.setInteractive(); closeButton.on('pointerdown', () => { this.howToPlayMenu.setVisible(false); }); this.playButton.on('pointerdown', () => { this.scene.start('GameScene'); }); howToPlayButton.on('pointerdown', () => { this.howToPlayMenu.setVisible(true); }); leaderboardButton.on('pointerdown', () => { this.scene.start('LeaderboardScene'); }); } } class GameScene extends Phaser.Scene { constructor() { super({ key: 'GameScene' }); this.defaultAimSize = 40; // Store default size this.aimSize = this.defaultAimSize; // Size of the aiming square this.gamepad = null; // Store gamepad reference } preload() { this.load.image('enemy', 'https://play.rosebud.ai/assets/Game_Enemy.png?irNx'); this.load.image('player', 'https://play.rosebud.ai/assets/Game_player.png?pA0I'); } init() { this.showingStats = false; this.bossExists = false; this.aimSize = this.defaultAimSize; // Reset aim size to default this.killCount = 0; this.waveSize = 10; // Initialize wave size // Reset all game variables this.score = 0; this.level = 1; this.multiplier = 1; this.canAttack = true; this.playerStats = { maxHealth: 100, currentHealth: 100 }; this.attackCooldown = 1000; this.multiplierEnabled = false; this.gameTime = 60; this.enemies = []; this.enemySpawnTime = 1000; this.isPaused = false; this.score = 0; this.level = 1; this.multiplier = 1; this.canAttack = true; this.playerStats = { maxHealth: 100, currentHealth: 100 }; this.attackCooldown = 1000; // 1000ms between attacks this.multiplierEnabled = false; // Flag to track if multiplier is active this.gameTime = 60; // 60 seconds this.enemies = []; // Array to store active enemies this.enemySpawnTime = 1000; // Time between enemy spawns in ms this.isPaused = false; } create() { // Initialize trail properties // Initialize gamepad support if (this.input.gamepad && this.input.gamepad.total === 0) { this.input.gamepad.once('connected', (pad) => { console.log('Gamepad connected:', pad.id); this.gamepad = pad; }); } // Initialize trail properties this.trail = []; this.trailUpdateTime = 0; this.trailMaxParticles = 15; // Create aiming square - centered by default this.aimSquare = this.add.rectangle(400, 300, this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); this.aimSquare.setOrigin(0.5, 0.5); this.aimSquare.setDepth(1000); // Ensure it's always on top this.aimSquare.isStroked = true; // Enable input tracking for cursor this.input.on('pointermove', (pointer) => { // Set position based on cursor position this.aimSquare.setPosition(pointer.x, pointer.y); // Ensure the cursor stays in the middle by adjusting pointer coordinates to center if (this.input.mouse.locked) { this.input.mouse.locked = false; } }); // Create stats button // Create UI container with highest depth this.uiContainer = this.add.container(0, 0).setDepth(2000); // Create stats button const statsButton = this.add.rectangle(700, 550, 80, 30, 0x121212) .setStrokeStyle(1, 0xc4c4c4); const statsButtonText = this.add.text(700, 550, 'Stats', { fontSize: '20px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); // Add buttons to UI container this.uiContainer.add([statsButton, statsButtonText]); // Make buttons interactive with specific hit areas statsButton.setInteractive({ useHandCursor: true }) .setDepth(2001); // Ensure hit area is above everything // Create stats menu (initially hidden) this.statsMenu = this.add.container(400, 300); const statsMenuBackground = this.add.rectangle(0, 0, 320, 420, 0x0a0a0a, 0.95); const statsMenuBorder = this.add.rectangle(0, 0, 330, 430, 0x0a0a0a, 0.95); const statsTitle = this.add.text(0, -160, 'Player Stats', { fontSize: '28px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); // Create labels text with more space on left this.statsText = this.add.text(-120, -120, '', { fontSize: '16px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', lineSpacing: 12, align: 'left' }); // Create values text with more space from labels this.statsValuesText = this.add.text(40, -120, '', { fontSize: '16px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', lineSpacing: 12, align: 'left' }); // Add all elements to the stats menu this.statsMenu.add([statsMenuBackground, statsMenuBorder, statsTitle, this.statsText, this.statsValuesText]); // Stats menu visibility and depth this.statsMenu.setDepth(1000); this.statsMenu.setVisible(false); // Make stats button interactive with hover effects statsButton.on('pointerover', () => { statsButton.setFillStyle(0x1a1a1a); }); statsButton.on('pointerout', () => { statsButton.setFillStyle(0x121212); }); statsButton.on('pointerdown', () => this.toggleStats()); // Set the background color to black this.cameras.main.setBackgroundColor('#0a0a0a'); // Add grid pattern background with depth -1 for (let i = 0; i < 20; i++) { for (let j = 0; j < 15; j++) { const dot = this.add.circle(i * 40 + 20, j * 40 + 20, 1, 0x121212, 0.2); dot.setDepth(-2); // Set background dots to lowest depth } } // Add particle emitter for player // Remove particle system since we don't have particle assets // Setup pause key this.input.keyboard.on('keydown-ESC', () => { this.togglePause(); }); // Create timer text this.timerText = this.add.text(700, 16, '60', { fontSize: '32px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }); // Start the countdown timer this.countdownTimer = this.time.addEvent({ delay: 1000, callback: this.updateTimer, callbackScope: this, loop: true }); // Create pause menu (initially hidden) this.pauseMenu = this.add.container(400, 300); const pauseMenuBackground = this.add.rectangle(0, 0, 300, 200, 0x000000, 0.8); const pauseText = this.add.text(0, -50, 'PAUSED', { fontSize: '32px', fill: '#ffffff', fontStyle: 'bold', stroke: '#ff69b4', strokeThickness: 3 }).setOrigin(0.5); const resumeButton = this.add.rectangle(0, 20, 200, 40, 0x121212) .setStrokeStyle(1, 0xc4c4c4); const resumeText = this.add.text(0, 20, 'Resume', { fontSize: '24px', fill: '#ffffff', stroke: '#ff0000', strokeThickness: 1 }).setOrigin(0.5); this.pauseMenu.add([pauseMenuBackground, pauseText, resumeButton, resumeText]); this.pauseMenu.setVisible(false); resumeButton.setInteractive(); resumeButton.on('pointerdown', () => { this.togglePause(); }); // Create player // Create player with gradient // Create player with sprite this.player = this.add.sprite(400, 300, 'player'); this.player.setDepth(10); // Set player above trail this.physics.add.existing(this.player); // Set player hitbox this.player.body.setSize(40, 40); this.player.body.offset.x = 5; this.player.body.offset.y = 5; // Setup controls this.cursors = this.input.keyboard.addKeys({ up: Phaser.Input.Keyboard.KeyCodes.W, down: Phaser.Input.Keyboard.KeyCodes.S, left: Phaser.Input.Keyboard.KeyCodes.A, right: Phaser.Input.Keyboard.KeyCodes.D }); // Create level text this.levelText = this.add.text(400, 50, 'Level 1', { fontSize: '32px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); // Create score text this.scoreText = this.add.text(16, 16, 'Score: 0', { fontSize: '32px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }); // Create health bar at bottom of screen this.healthBarBackground = this.add.rectangle(400, 570, 200, 20, 0x808080); this.healthBar = this.add.rectangle(400, 570, 200, 20, 0x00ff00); this.healthText = this.add.text(400, 570, '100/100', { fontSize: '16px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); // Create vertical attack cooldown bar on left side // Create vertical attack cooldown bar on left side this.attackCooldownBarBg = this.add.rectangle(30, 200, 10, 200, 0x808080); this.attackCooldownBar = this.add.rectangle(30, 200, 10, 0, 0x121212); // Set origin to top for both bars this.attackCooldownBarBg.setOrigin(0.5, 0); this.attackCooldownBar.setOrigin(0.5, 0); // Create enemy counter text this.enemyCountText = this.add.text(16, 550, 'Enemies left: 10', { fontSize: '24px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }); // Update score display this.updateScoreDisplay(); this.updateHealthBar(); // Start enemy spawn timer this.enemySpawnTimer = this.time.addEvent({ delay: this.enemySpawnTime, callback: this.spawnEnemy, callbackScope: this, loop: true }); // Enable physics body for player this.player.body.setCollideWorldBounds(true); } // Add cleanup method for attack cooldown cleanupAttackCooldown() { if (this.currentAttackTween) { this.currentAttackTween.stop(); this.currentAttackTween = null; } if (this.attackCooldownBar) { this.attackCooldownBar.height = 0; } this.canAttack = true; } update(time) { // Update trail if (time > this.trailUpdateTime) { // Create new trail particle at player position const particle = this.add.rectangle( this.player.x, this.player.y, Phaser.Math.Between(3, 6), Phaser.Math.Between(3, 6), 0xffffff ) .setDepth(5) // Set trail particles below player .setAlpha(0.8); // Add glow effect const glow = this.add.circle( particle.x, particle.y, particle.width * 1.5, 0xcccccc, 0.4 ).setDepth(4); // Set glow below particles this.trail.push({ particle, glow }); // Animate particle const angle = Phaser.Math.Between(60, 120); // Downward drift const distance = Phaser.Math.Between(20, 30); this.tweens.add({ targets: [particle, glow], x: particle.x + Math.cos(Phaser.Math.DegToRad(angle)) * distance, y: particle.y + Math.sin(Phaser.Math.DegToRad(angle)) * distance, scaleX: 0.1, scaleY: 0.1, alpha: 0, duration: 800, ease: 'Power2', onComplete: () => { particle.destroy(); glow.destroy(); this.trail = this.trail.filter(t => t.particle !== particle); } }); // Remove excess particles while (this.trail.length > this.trailMaxParticles) { const oldest = this.trail.shift(); oldest.particle.destroy(); oldest.glow.destroy(); } this.trailUpdateTime = time + 40; // Update more frequently } if (this.isPaused || this.showingStats) { // Ensure player velocity is 0 when paused if (this.player && this.player.body) { this.player.body.setVelocity(0, 0); } return; } // Handle both keyboard and gamepad input for player movement let moveX = 0; let moveY = 0; // Keyboard input if (this.cursors.left.isDown) moveX = -1; else if (this.cursors.right.isDown) moveX = 1; if (this.cursors.up.isDown) moveY = -1; else if (this.cursors.down.isDown) moveY = 1; // Gamepad input if (this.gamepad) { // Left stick movement (with deadzone) const leftStickX = this.gamepad.leftStick.x; const leftStickY = this.gamepad.leftStick.y; if (Math.abs(leftStickX) > 0.1) moveX = leftStickX; if (Math.abs(leftStickY) > 0.1) moveY = leftStickY; // Right stick aiming (with deadzone) const rightStickX = this.gamepad.rightStick.x; const rightStickY = this.gamepad.rightStick.y; if (Math.abs(rightStickX) > 0.1 || Math.abs(rightStickY) > 0.1) { // Update aim square position based on right stick const aimSpeed = 10; this.aimSquare.x = Phaser.Math.Clamp( this.aimSquare.x + rightStickX * aimSpeed, 0, 800 ); this.aimSquare.y = Phaser.Math.Clamp( this.aimSquare.y + rightStickY * aimSpeed, 0, 600 ); } // A button for attack if (this.gamepad.A && this.canAttack && !this.isPaused && !this.showingStats) { this.aimSquare.emit('pointerdown'); } } // Apply movement const speed = this.playerStats.speed || 160; if (moveX !== 0 || moveY !== 0) { // Normalize diagonal movement const length = Math.sqrt(moveX * moveX + moveY * moveY); moveX = (moveX / length) * speed; moveY = (moveY / length) * speed; } this.player.body.setVelocity(moveX, moveY); // Update enemies this.enemies = this.enemies.filter(enemy => enemy && enemy.body); // Filter out destroyed enemies this.enemies.forEach(enemy => { if (enemy && enemy.body) { // Additional check before updating // Update health bar position with enemy movement if (enemy.healthBar && enemy.healthBarBg) { enemy.healthBar.setX(enemy.x - (enemy.healthBarBg.width * (1 - enemy.currentHealth / enemy.health)) / 2); enemy.healthBar.setY(enemy.y - 20); enemy.healthBarBg.setX(enemy.x); enemy.healthBarBg.setY(enemy.y - 20); } // Move enemies towards player const angle = Phaser.Math.Angle.Between( enemy.x, enemy.y, this.player.x, this.player.y ); // Update enemy rotation to face player enemy.setRotation(angle + Math.PI * 0.75); // Adjusted angle to point cursor tip at player const enemySpeed = 155; // Player initial speed (160) - 5 enemy.body.setVelocity( Math.cos(angle) * enemySpeed, Math.sin(angle) * enemySpeed ); } }); } killEnemy(enemy) { if (!enemy) return; // Early return if enemy is null // First destroy all visual elements if (enemy.healthBar) enemy.healthBar.destroy(); if (enemy.healthBarBg) enemy.healthBarBg.destroy(); if (enemy.glow) enemy.glow.destroy(); // Then apply lifesteal if (this.playerStats.lifesteal && enemy.health) { const healAmount = Math.ceil((enemy.health * (this.playerStats.lifesteal / 100)) / 2); this.playerStats.currentHealth = Math.min( this.playerStats.maxHealth, this.playerStats.currentHealth + healAmount ); this.updateHealthBar(); } // Update boss tracking if a boss was killed if (enemy.isBoss) { this.bossExists = false; // Queue 3 level ups for boss kill this.pendingLevelUps = 3; } // Create particle effect based on enemy type const particleCount = enemy.isBoss ? 192 : 96; const particleDistance = enemy.isBoss ? 100 : 50; const particleColor = 0xff0000; const baseParticleSize = enemy.isBoss ? 4 : 2; for (let i = 0; i < particleCount; i++) { const angle = (i / particleCount) * Math.PI * 2; // Create triangle particles for explosion const particleSize = baseParticleSize * (0.5 + Math.random()); const particle = this.add.triangle( enemy.x, enemy.y, 0, -particleSize * 2, // top point -particleSize, particleSize * 2, // bottom left particleSize, particleSize * 2, // bottom right particleColor ); // Add rotation to the particles particle.rotation = angle; this.tweens.add({ targets: particle, x: enemy.x + Math.cos(angle) * (particleDistance * (1.2 + Math.random())), y: enemy.y + Math.sin(angle) * (particleDistance * (1.2 + Math.random())), rotation: angle + (Math.PI * 4) + (Math.random() * Math.PI * 8), // Random rotation alpha: 0, scale: 0.1 + (Math.random() * 0.2), // Random final scale duration: 800 + Math.random() * 400, // Random duration ease: 'Power2', onComplete: () => particle.destroy() }); } // Calculate base points (increases with level) // Calculate points only if enemy exists if (enemy) { const basePoints = 5; const levelBonus = this.level * 2; const points = basePoints + levelBonus; // Apply multiplier to the total points this.score += points * this.multiplier; } // Remove enemy from array and destroy it // Remove from array first this.enemies = this.enemies.filter(e => e !== enemy); // Destroy all associated elements if (enemy.healthBar) enemy.healthBar.destroy(); if (enemy.healthBarBg) enemy.healthBarBg.destroy(); if (enemy.glow) { enemy.glow.destroy(); enemy.glow = null; // Clear the reference } enemy.destroy(); // Initialize killCount in constructor if not exists if (typeof this.killCount === 'undefined') { this.killCount = 0; } // If this was a boss kill, trigger immediate level ups if (enemy.isBoss) { // When killing a boss, add 1 level (to complete current set of 5) // then add 1 more to start the next set this.level += 1; this.levelText.setText(`Level ${this.level}`); // Update level display after boss kill // Increase wave size by 5 after boss kill this.waveSize += 5; // Reset kill count for new level this.killCount = 0; // Update enemy counter for new level this.enemyCountText.setText(`Enemies left: ${this.waveSize}`); // Add 180 seconds to the timer (60 * 3) this.gameTime += 180; this.timerText.setText(this.gameTime); // Update enemy spawn rate for new level with boss bonus const regularReduction = this.level * 100; // Remove level increase here as it's redundant this.enemySpawnTimer.paused = true; // Pause the old timer this.enemySpawnTimer.destroy(); // Destroy the old timer // Create new timer with updated spawn rate this.enemySpawnTimer = this.time.addEvent({ delay: this.enemySpawnTime, callback: this.spawnEnemy, callbackScope: this, loop: true }); // Queue up 3 upgrade choices this.pendingLevelUps = 3; // Show first upgrade options this.showUpgradeOptions(); } else { // Increment kill count this.killCount++; // Update enemy counter display this.enemyCountText.setText(`Enemies left: ${this.waveSize - this.killCount}`); // Check if we've killed enough enemies for the wave if (this.killCount >= this.waveSize) { this.level++; this.killCount = 0; // Reset kill count this.levelText.setText(`Level ${this.level}`); // Update level display this.enemyCountText.setText('Enemies left: 10'); // Reset enemy counter // Add 60 seconds to the timer this.gameTime += 60; this.timerText.setText(this.gameTime); // Update spawn rate every level // Smooth level-based reduction (19.8ms per level to reach 10ms at level 50) this.enemySpawnTime = Math.max(10, 1000 - (this.level * 19.8)); // Reset spawn timer with new rate this.enemySpawnTimer.destroy(); this.enemySpawnTimer = this.time.addEvent({ delay: this.enemySpawnTime, callback: this.spawnEnemy, callbackScope: this, loop: true }); // Show upgrade options this.showUpgradeOptions(); } } // Update display this.updateScoreDisplay(); } updateScoreDisplay() { this.scoreText.setText('Score: ' + Math.floor(this.score)); } togglePause() { this.isPaused = !this.isPaused; this.pauseMenu.setVisible(this.isPaused); if (this.isPaused) { this.physics.pause(); this.countdownTimer.paused = true; } else { this.physics.resume(); this.countdownTimer.paused = false; } } updateTimer() { this.gameTime--; this.timerText.setText(this.gameTime); if (this.gameTime <= 0) { // Game Over this.countdownTimer.remove(); this.enemies.forEach(enemy => { if (enemy && enemy.body) { enemy.destroy(); } }); this.enemies = []; // Game over will handle saving the score this.scene.start('StartScreen', { finalScore: this.score }); } } spawnEnemy() { // Check if it's a boss level (every 5th level) and no boss exists const isBossLevel = this.level % 5 === 0 && !this.bossExists; if (isBossLevel) this.bossExists = true; // Spawn enemy at random edge of screen let x, y; const offset = isBossLevel ? 100 : 20; // Larger offset for bosses if (Math.random() < 0.5) { x = Math.random() < 0.5 ? -offset : 800 + offset; y = Phaser.Math.Between(0, 600); } else { x = Phaser.Math.Between(0, 800); y = Math.random() < 0.5 ? -offset : 600 + offset; } // Create enemy sprite with proper depth const enemy = this.add.sprite(x, y, 'enemy'); enemy.setOrigin(0.5, 0.5); enemy.setScale(isBossLevel ? 2 : 1); enemy.setDepth(100); // Set enemies to very high depth to ensure visibility // Apply a lighter gray tint for better visibility enemy.setTint(0xcccccc); // Set higher alpha for better contrast enemy.setAlpha(1); // Set enemy sprite depth to ensure visibility enemy.setDepth(100); const enemyGlow = this.add.circle(x, y, isBossLevel ? 16 : 7, 0x121212, 0.3); enemy.glow = enemyGlow; // Store reference to glow effect enemy.isAlive = true; // Add isAlive flag enemy.glow.setDepth(99); // Glow effect just below enemy but above other elements // Create health bar container - wider for boss const healthBarWidth = isBossLevel ? 150 : 30; const healthBarHeight = isBossLevel ? 8 : 4; const healthBarY = isBossLevel ? -60 : -20; const healthBarBg = this.add.rectangle(x, y + healthBarY, healthBarWidth, healthBarHeight, 0x808080); const healthBar = this.add.rectangle(x, y + healthBarY, healthBarWidth, healthBarHeight, 0x00ff00); healthBarBg.setDepth(101); // Set health bar background above enemy healthBar.setDepth(102); // Set health bar above its background enemy.healthBar = healthBar; enemy.healthBarBg = healthBarBg; this.tweens.add({ targets: enemyGlow, alpha: 0.1, duration: 1000, yoyo: true, repeat: -1 }); this.physics.add.existing(enemy); // Set precise hitbox for enemy sprites if (isBossLevel) { // Boss hitbox (2x scale) enemy.setOrigin(0.5, 0.5); enemy.setScale(2); enemy.body.setCircle(16); // Larger hitbox for bosses enemy.body.offset.set(16, 16); // Adjusted offset for larger size enemy.body.setAllowRotation(true); } else { // Regular enemy hitbox enemy.setOrigin(0.5, 0.5); enemy.setScale(1); enemy.body.setCircle(4); // Smaller hitbox at cursor tip enemy.body.offset.set(12, 12); // Offset to cursor tip position enemy.body.setAllowRotation(true); } enemy.body.setCollideWorldBounds(true); enemy.body.setBounce(1); // Enemy properties enemy.isEnemy = true; enemy.isBoss = isBossLevel; // Ensure boss scaling is applied if (isBossLevel) { enemy.setScale(2); } if (isBossLevel) { // Boss health is 3x the current level enemy.health = this.level * 3; const baseDamage = 2; const levelScale = Math.min(10, Math.log1p(this.level)); enemy.damage = Math.min(12, Math.max(2, Math.floor(baseDamage + levelScale))); } else { // Normal enemy health equals current level enemy.health = this.level; const baseDamage = 1; const levelScale = Math.min(5, Math.log1p(this.level) * 0.3); enemy.damage = Math.min(6, Math.max(1, Math.floor(baseDamage + levelScale))); } enemy.currentHealth = enemy.health; // Current health for tracking damage // Add to enemies array this.enemies.push(enemy); // Add collision with player and other enemies this.physics.add.collider(enemy, this.enemies); this.physics.add.overlap(this.player, enemy, this.hitPlayer, null, this); // Click/tap handler for killing enemies // Instead of making enemy interactive, make the aiming square interactive this.aimSquare.setInteractive(); this.aimSquare.on('pointerdown', () => { if (!this.canAttack || this.isPaused || this.showingStats) return; // Cancel if on cooldown or game is paused // Get bounds based on center position const bounds = new Phaser.Geom.Rectangle( this.aimSquare.x - this.aimSize / 2, this.aimSquare.y - this.aimSize / 2, this.aimSize, this.aimSize ); let hitAny = false; // Check all enemies that overlap with the aim square this.enemies.forEach(enemy => { if (enemy && enemy.isAlive && enemy.currentHealth > 0) { const enemyBounds = enemy.getBounds(); if (Phaser.Geom.Rectangle.Overlaps(bounds, enemyBounds)) { hitAny = true; enemy.currentHealth -= (this.playerStats.damage || 1); // Update health bar const healthPercent = enemy.currentHealth / enemy.health; enemy.healthBar.setScale(healthPercent, 1); enemy.healthBar.setX(enemy.x - (enemy.healthBarBg.width * (1 - healthPercent)) / 2); enemy.healthBarBg.setX(enemy.x); enemy.healthBar.setY(enemy.y - 20); enemy.healthBarBg.setY(enemy.y - 20); // Update health bar color based on percentage const green = Math.floor(255 * healthPercent); const red = Math.floor(255 * (1 - healthPercent)); const color = (red << 16) | (green << 8); enemy.healthBar.setFillStyle(color); // Flash enemy glow when hit if (enemy.glow) { this.tweens.add({ targets: enemy.glow, alpha: 0.8, scale: 1.2, duration: 100, yoyo: true, onComplete: () => { if (enemy.glow) { enemy.glow.setAlpha(0.3); enemy.glow.setScale(1); } } }); } if (enemy.currentHealth <= 0 && enemy.isAlive) { enemy.isAlive = false; this.killEnemy(enemy); } } } }); // Only trigger cooldown if we hit at least one enemy if (hitAny) { this.canAttack = false; // Stop any existing tweens on the cooldown bar this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); // Reset cooldown bar state this.attackCooldownBar.height = 0; this.attackCooldownBar.y = 200; // Create and store the tween reference this.currentAttackTween = this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; this.currentAttackTween = null; }, onStop: () => { this.attackCooldownBar.height = 0; this.currentAttackTween = null; } }); } // Remove duplicate flash effect as it's already handled above if (enemy.currentHealth <= 0 && enemy.isAlive) { enemy.isAlive = false; // Mark enemy as dead if (enemy.healthBar) enemy.healthBar.destroy(); if (enemy.healthBarBg) enemy.healthBarBg.destroy(); if (enemy.glow) enemy.glow.destroy(); this.killEnemy(enemy); } }); } hitPlayer() { if (this.isPaused) return; // Get the enemy that hit the player const enemy = arguments[1]; const damage = enemy ? enemy.damage : 10; this.playerStats.currentHealth = Math.max(0, this.playerStats.currentHealth - damage); // Update health bar this.updateHealthBar(); // Check if player died if (this.playerStats.currentHealth <= 0) { this.gameOver(); } } updateHealthBar() { const healthPercent = this.playerStats.currentHealth / this.playerStats.maxHealth; this.healthBar.setScale(healthPercent, 1); this.healthBar.setX(400 - (200 * (1 - healthPercent)) / 2); // Calculate health bar color gradient from red to green const red = Math.floor(255 * (1 - healthPercent)); const green = Math.floor(255 * healthPercent); const color = (red << 16) | (green << 8); this.healthBar.setFillStyle(color); this.healthText.setText(`${this.playerStats.currentHealth}/${this.playerStats.maxHealth}`); } gameOver() { // Clean up trail this.trail.forEach(({ particle, glow }) => { particle.destroy(); glow.destroy(); }); this.trail = []; this.isPaused = true; this.physics.pause(); this.cleanupAttackCooldown(); // Reset aim size this.aimSize = this.defaultAimSize; if (this.aimSquare) { this.aimSquare.setSize(this.aimSize, this.aimSize); } // Disable all enemy interactions this.enemies.forEach(enemy => { if (enemy && enemy.body) { enemy.removeInteractive(); } }); // Disable player movement and interactions this.player.body.setVelocity(0, 0); this.canAttack = false; // Pause all timers this.countdownTimer.paused = true; this.enemySpawnTimer.paused = true; // Create game over menu with high depth to ensure it's above everything const gameOverMenu = this.add.container(400, 300).setDepth(1000); const gameOverBackground = this.add.rectangle(0, 0, 400, 400, 0x000000, 0.9) .setInteractive(); // Make background interactive to block lower elements const gameOverText = this.add.text(0, -120, 'GAME OVER', { fontSize: '48px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', stroke: '#ff0000', strokeThickness: 4, shadow: { blur: 10, color: '#ff0000', fill: true } }).setOrigin(0.5); const finalScoreText = this.add.text(0, -50, `Final Score: ${Math.floor(this.score)}`, { fontSize: '32px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', stroke: '#121212', strokeThickness: 2 }).setOrigin(0.5); // Name input field const nameInput = document.createElement('input'); nameInput.type = 'text'; nameInput.placeholder = 'Enter your name'; nameInput.style.padding = '8px'; nameInput.style.width = '200px'; nameInput.style.textAlign = 'center'; nameInput.style.border = '2px solid #121212'; nameInput.style.borderRadius = '4px'; nameInput.style.backgroundColor = '#0a0a0a'; nameInput.style.color = '#ffffff'; nameInput.maxLength = 15; // Prevent WASD from moving the game nameInput.addEventListener('keydown', (e) => { if (['w', 'a', 's', 'd', 'W', 'A', 'S', 'D'].includes(e.key)) { e.stopPropagation(); } }); // Auto-focus the input field nameInput.focus(); const nameElement = this.add.dom(0, 0, nameInput); const submitButton = this.add.rectangle(0, 50, 200, 40, 0x121212) .setStrokeStyle(1, 0xc4c4c4) .setInteractive({ useHandCursor: true }); // Enable interaction with cursor const submitText = this.add.text(0, 50, 'Submit Score', { fontSize: '24px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', stroke: '#121212', strokeThickness: 2 }).setOrigin(0.5); const restartButton = this.add.rectangle(0, 120, 200, 40, 0x121212) .setStrokeStyle(1, 0xc4c4c4) .setInteractive({ useHandCursor: true }); // Enable interaction with cursor const restartText = this.add.text(0, 120, 'Restart', { fontSize: '24px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold', stroke: '#121212', strokeThickness: 2 }).setOrigin(0.5); gameOverMenu.add([gameOverBackground, gameOverText, finalScoreText, nameElement, submitButton, submitText, restartButton, restartText]); // Add hover effects for submit button submitButton.on('pointerover', () => { submitButton.setFillStyle(0x1a1a1a); }); submitButton.on('pointerout', () => { submitButton.setFillStyle(0x121212); }); submitButton.on('pointerdown', () => { const playerName = nameInput.value.trim() || 'Anonymous'; // Save score to local storage with player name const highScores = JSON.parse(localStorage.getItem('highScores') || '[]'); highScores.push({ name: playerName, score: Math.floor(this.score), date: new Date().toISOString() }); highScores.sort((a, b) => b.score - a.score); localStorage.setItem('highScores', JSON.stringify(highScores.slice(0, 10))); // Clean up DOM element nameElement.destroy(); this.scene.start('LeaderboardScene'); }); // Add hover effects for restart button restartButton.on('pointerover', () => { restartButton.setFillStyle(0x1a1a1a); }); restartButton.on('pointerout', () => { restartButton.setFillStyle(0x121212); }); restartButton.on('pointerdown', () => { // Clean up DOM element nameElement.destroy(); this.enemies.forEach(enemy => { if (enemy && enemy.body) { enemy.destroy(); } }); this.enemies = []; this.scene.start('StartScreen'); }); } toggleStats() { this.showingStats = !this.showingStats; this.statsMenu.setVisible(this.showingStats); // Store the previous pause state when opening stats if (this.showingStats) { this.previousPauseState = this.isPaused; // Pause everything when showing stats this.isPaused = true; this.physics.pause(); this.countdownTimer.paused = true; this.enemySpawnTimer.paused = true; // Stop all enemy movement and disable interactions this.enemies.forEach(enemy => { if (enemy && enemy.body) { enemy.body.setVelocity(0, 0); enemy.disableInteractive(); } }); // Stop player movement if (this.player && this.player.body) { this.player.body.setVelocity(0, 0); } // Update stats text with separate labels and values const statsLabels = [ 'Health', 'Area Size', 'Multiplier', 'Attack Speed', 'Damage', 'Speed', 'Armor', 'Lifesteal', 'Spawn Rate' ]; const statsValues = [ `${this.playerStats.currentHealth}/${this.playerStats.maxHealth}`, `${Math.floor(this.aimSize)}`, `${this.multiplier.toFixed(1)}x`, `${this.attackCooldown}ms`, `${this.playerStats.damage || 1}`, `${this.playerStats.speed || 160}`, `${this.playerStats.armor || 0}%`, `${this.playerStats.lifesteal || 0}%`, `${this.enemySpawnTime}ms` ]; // Update stats texts this.statsText.setText(statsLabels.join('\n')); this.statsValuesText.setText(statsValues.join('\n')); // Ensure both text objects are visible and in the container if (!this.statsMenu.list.includes(this.statsValuesText)) { this.statsMenu.add(this.statsValuesText); } } else { // Restore the previous pause state when closing stats this.isPaused = this.previousPauseState || false; // Only resume if we weren't previously paused if (!this.isPaused) { this.physics.resume(); this.countdownTimer.paused = false; this.enemySpawnTimer.paused = false; this.canAttack = true; // Reset attack state } // Ensure attack is immediately available if (this.attackCooldownTimer) { this.attackCooldownTimer.remove(); } // Re-enable enemy interactions this.enemies.forEach(enemy => { if (enemy && enemy.body) { enemy.setInteractive(); } }); } } showUpgradeOptions() { this.isPaused = true; this.physics.pause(); this.countdownTimer.paused = true; this.enemySpawnTimer.paused = true; // Disable aiming square interactivity if (this.aimSquare) { this.aimSquare.disableInteractive(); } // Create upgrade menu const upgradeMenu = this.add.container(400, 300).setDepth(1000); const upgradeMenuBackground = this.add.rectangle(0, 0, 520, 420, 0x0a0a0a, 0.95); const upgradeMenuBorder = this.add.rectangle(0, 0, 530, 430, 0x121212, 0.3); const titleText = this.add.text(0, -180, 'LEVEL UP!', { fontSize: '36px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5).setDepth(1001); upgradeMenu.add([upgradeMenuBackground, upgradeMenuBorder, titleText]); // Define rarity colors and weights const rarities = { common: { color: '#ffffff', weight: 40, label: 'Common' }, uncommon: { color: '#00ff00', weight: 25, label: 'Uncommon' }, rare: { color: '#0066ff', weight: 15, label: 'Rare' }, epic: { color: '#9933ff', weight: 12, label: 'Epic' }, legendary: { color: '#ffaa33', weight: 8, label: 'Legendary' } }; // Define possible upgrades with rarity variations const possibleUpgrades = [{ id: 'spawnRate', variants: { common: { name: 'Enemy Spawn Rate +50ms', effect: () => { this.enemySpawnTime = Math.max(10, this.enemySpawnTime + 50); } }, uncommon: { name: 'Enemy Spawn Rate +75ms', effect: () => { this.enemySpawnTime = Math.max(10, this.enemySpawnTime + 75); } }, rare: { name: 'Enemy Spawn Rate +100ms', effect: () => { this.enemySpawnTime = Math.max(10, this.enemySpawnTime + 100); } }, epic: { name: 'Enemy Spawn Rate +150ms', effect: () => { this.enemySpawnTime = Math.max(10, this.enemySpawnTime + 150); } }, legendary: { name: 'Enemy Spawn Rate +200ms', effect: () => { this.enemySpawnTime = Math.max(10, this.enemySpawnTime + 200); } } } }, { id: 'health', variants: { common: { name: 'Max Health +25', effect: () => { this.playerStats.maxHealth += 25; this.playerStats.currentHealth += 25; this.updateHealthBar(); } }, uncommon: { name: 'Max Health +35', effect: () => { this.playerStats.maxHealth += 35; this.playerStats.currentHealth += 35; this.updateHealthBar(); } }, rare: { name: 'Max Health +50', effect: () => { this.playerStats.maxHealth += 50; this.playerStats.currentHealth += 50; this.updateHealthBar(); } }, epic: { name: 'Max Health +75', effect: () => { this.playerStats.maxHealth += 75; this.playerStats.currentHealth += 75; this.updateHealthBar(); } }, legendary: { name: 'Max Health +100', effect: () => { this.playerStats.maxHealth += 100; this.playerStats.currentHealth += 100; this.updateHealthBar(); } } } }, { id: 'damage', variants: { common: { name: 'Player Damage +1', effect: () => this.playerStats.damage = (this.playerStats.damage || 1) + 1 }, uncommon: { name: 'Player Damage +2', effect: () => this.playerStats.damage = (this.playerStats.damage || 1) + 2 }, rare: { name: 'Player Damage +3', effect: () => this.playerStats.damage = (this.playerStats.damage || 1) + 3 }, epic: { name: 'Player Damage +4', effect: () => this.playerStats.damage = (this.playerStats.damage || 1) + 4 }, legendary: { name: 'Player Damage +5', effect: () => this.playerStats.damage = (this.playerStats.damage || 1) + 5 } } }, { id: 'speed', variants: { common: { name: 'Player Speed +20', effect: () => this.playerStats.speed = (this.playerStats.speed || 160) + 20 }, uncommon: { name: 'Player Speed +30', effect: () => this.playerStats.speed = (this.playerStats.speed || 160) + 30 }, rare: { name: 'Player Speed +40', effect: () => this.playerStats.speed = (this.playerStats.speed || 160) + 40 }, epic: { name: 'Player Speed +50', effect: () => this.playerStats.speed = (this.playerStats.speed || 160) + 50 }, legendary: { name: 'Player Speed +60', effect: () => this.playerStats.speed = (this.playerStats.speed || 160) + 60 } } }, { id: 'armor', variants: { common: { name: 'Armor +3%', effect: () => this.playerStats.armor = Math.min(50, (this.playerStats.armor || 0) + 3) }, uncommon: { name: 'Armor +5%', effect: () => this.playerStats.armor = Math.min(50, (this.playerStats.armor || 0) + 5) }, rare: { name: 'Armor +7%', effect: () => this.playerStats.armor = Math.min(50, (this.playerStats.armor || 0) + 7) }, epic: { name: 'Armor +9%', effect: () => this.playerStats.armor = Math.min(50, (this.playerStats.armor || 0) + 9) }, legendary: { name: 'Armor +12%', effect: () => this.playerStats.armor = Math.min(50, (this.playerStats.armor || 0) + 12) } } }, { id: 'lifesteal', variants: { common: { name: 'Lifesteal +3%', effect: () => this.playerStats.lifesteal = Math.min(50, (this.playerStats.lifesteal || 0) + 3) }, uncommon: { name: 'Lifesteal +5%', effect: () => this.playerStats.lifesteal = Math.min(50, (this.playerStats.lifesteal || 0) + 5) }, rare: { name: 'Lifesteal +7%', effect: () => this.playerStats.lifesteal = Math.min(50, (this.playerStats.lifesteal || 0) + 7) }, epic: { name: 'Lifesteal +9%', effect: () => this.playerStats.lifesteal = Math.min(50, (this.playerStats.lifesteal || 0) + 9) }, legendary: { name: 'Lifesteal +12%', effect: () => this.playerStats.lifesteal = Math.min(50, (this.playerStats.lifesteal || 0) + 12) } } }, { id: 'income', variants: { common: { name: 'Score Bonus +10%', effect: () => { this.multiplier += 0.10; } }, uncommon: { name: 'Score Bonus +15%', effect: () => { this.multiplier += 0.15; } }, rare: { name: 'Score Bonus +20%', effect: () => { this.multiplier += 0.20; } }, epic: { name: 'Score Bonus +25%', effect: () => { this.multiplier += 0.25; } }, legendary: { name: 'Score Bonus +30%', effect: () => { this.multiplier += 0.30; } } } }, { id: 'attackRate', variants: { common: { name: 'Attack Rate +50ms', effect: () => { this.attackCooldown = Math.max(50, this.attackCooldown - 50); // Update cooldown bar tween duration if (this.attackCooldownBar && this.attackCooldownBar.active) { this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); this.attackCooldownBar.height = 0; this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; } }); } } }, uncommon: { name: 'Attack Rate +100ms', effect: () => { this.attackCooldown = Math.max(50, this.attackCooldown - 100); // Update cooldown bar tween duration if (this.attackCooldownBar && this.attackCooldownBar.active) { this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); this.attackCooldownBar.height = 0; this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; } }); } } }, rare: { name: 'Attack Rate +150ms', effect: () => { this.attackCooldown = Math.max(50, this.attackCooldown - 150); // Update cooldown bar tween duration if (this.attackCooldownBar && this.attackCooldownBar.active) { this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); this.attackCooldownBar.height = 0; this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; } }); } } }, epic: { name: 'Attack Rate +200ms', effect: () => { this.attackCooldown = Math.max(50, this.attackCooldown - 200); // Update cooldown bar tween duration if (this.attackCooldownBar && this.attackCooldownBar.active) { this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); this.attackCooldownBar.height = 0; this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; } }); } } }, legendary: { name: 'Attack Rate +250ms', effect: () => { this.attackCooldown = Math.max(50, this.attackCooldown - 250); // Update cooldown bar tween duration if (this.attackCooldownBar && this.attackCooldownBar.active) { this.tweens.getTweensOf(this.attackCooldownBar).forEach(tween => tween.stop()); this.attackCooldownBar.height = 0; this.tweens.add({ targets: this.attackCooldownBar, height: 200, duration: this.attackCooldown, ease: 'Linear', onComplete: () => { this.canAttack = true; this.attackCooldownBar.height = 0; } }); } } } } }, { id: 'aimArea', variants: { common: { name: 'Aim Area +20%', effect: () => { this.aimSize = Math.min(100, this.aimSize * 1.20); this.aimSquare.setDisplaySize(this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); } }, uncommon: { name: 'Aim Area +30%', effect: () => { this.aimSize = Math.min(100, this.aimSize * 1.30); this.aimSquare.setDisplaySize(this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); } }, rare: { name: 'Aim Area +40%', effect: () => { this.aimSize = Math.min(100, this.aimSize * 1.40); this.aimSquare.setDisplaySize(this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); } }, epic: { name: 'Aim Area +50%', effect: () => { this.aimSize = Math.min(100, this.aimSize * 1.50); this.aimSquare.setDisplaySize(this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); } }, legendary: { name: 'Aim Area +60%', effect: () => { this.aimSize = Math.min(100, this.aimSize * 1.60); this.aimSquare.setDisplaySize(this.aimSize, this.aimSize); this.aimSquare.setStrokeStyle(2, 0xc4c4c4); this.aimSquare.setFillStyle(0xc4c4c4, 0.1); } } } }]; // Function to select a random rarity based on weights const selectRarity = () => { const total = Object.values(rarities).reduce((sum, r) => sum + r.weight, 0); let rand = Math.random() * total; for (const [rarity, data] of Object.entries(rarities)) { rand -= data.weight; if (rand <= 0) return rarity; } return 'common'; // fallback }; // Randomly select 3 unique upgrades with random rarities // Filter out capped upgrades before shuffling const availableUpgrades = possibleUpgrades.filter(upgrade => { // Check armor cap if (upgrade.id === 'armor' && (this.playerStats.armor || 0) >= 50) { return false; } // Check lifesteal cap if (upgrade.id === 'lifesteal' && (this.playerStats.lifesteal || 0) >= 50) { return false; } // Check aim area cap if (upgrade.id === 'aimArea' && this.aimSize >= 100) { return false; } return true; }); const shuffled = Phaser.Utils.Array.Shuffle([...availableUpgrades]); const selectedUpgrades = shuffled.slice(0, 3).map(upgrade => { const rarity = selectRarity(); return { ...upgrade, selectedRarity: rarity, name: upgrade.variants[rarity].name, effect: upgrade.variants[rarity].effect, color: rarities[rarity].color, rarityLabel: rarities[rarity].label }; }); // Create buttons for each upgrade selectedUpgrades.forEach((upgrade, index) => { const xPos = (index - 1) * 180; // Create card container const card = this.add.container(xPos, 0); // Card background const cardBg = this.add.rectangle(0, 0, 140, 200, 0x1a1a1a); const cardBorder = this.add.rectangle(0, 0, 144, 204, 0x121212); cardBorder.setStrokeStyle(2, 0x121212); // Symbol background (circle) const symbolBg = this.add.circle(0, -40, 40, 0x121212, 0.2); // Create upgrade-specific symbol using the same symbols from stats let symbolText; switch (upgrade.id) { case 'aimArea': symbolText = '◎'; break; case 'spawnRate': symbolText = '○'; break; case 'health': symbolText = '♥'; break; case 'damage': symbolText = '⚔'; break; case 'speed': symbolText = '➤'; break; case 'armor': symbolText = '❖'; break; case 'lifesteal': symbolText = '❤'; break; case 'income': symbolText = '★'; break; case 'attackRate': symbolText = '↯'; break; } const symbol = this.add.text(0, -40, symbolText, { fontSize: '48px', fill: '#c4c4c4', stroke: '#808080', strokeThickness: 2, color: '#c4c4c4', tint: 0xc4c4c4, setTint: 0xc4c4c4, styleBackgroundColor: '#000000', styleColor: '#c4c4c4' }).setOrigin(0.5); // Card title // Add rarity label const rarityLabel = this.add.text(0, -90, upgrade.rarityLabel, { fontSize: '14px', fill: upgrade.color, stroke: '#000000', strokeThickness: 1, align: 'center', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); const title = this.add.text(0, 30, upgrade.name, { fontSize: '16px', fill: upgrade.color, stroke: '#000000', strokeThickness: 1, align: 'center', fontFamily: 'LeagueSpartan-Bold', wordWrap: { width: 130 } }).setOrigin(0.5); // Add glow effect on hover cardBg.setInteractive(); cardBg.on('pointerover', () => { cardBg.setFillStyle(0x2a2a2a); cardBorder.setStrokeStyle(2, upgrade.color); this.tweens.add({ targets: [cardBg, symbol], scaleX: 1.05, scaleY: 1.05, duration: 100 }); }); cardBg.on('pointerout', () => { cardBg.setFillStyle(0x1a1a1a); cardBorder.setStrokeStyle(2, 0x121212); this.tweens.add({ targets: [cardBg, symbol], scaleX: 1, scaleY: 1, duration: 100 }); }); // Move card selection to shared state cardBg.on('pointerdown', () => { // Reset all cards to default state selectedUpgrades.forEach((_, i) => { const currentCard = upgradeMenu.list[i + 3]; if (currentCard && currentCard.getAt) { currentCard.getAt(0).setFillStyle(0x808080); } }); // Select this card cardBg.setFillStyle(0x202020); upgradeMenu.selectedUpgrade = { card: card, upgrade: upgrade }; // Create confirm button if it doesn't exist if (!upgradeMenu.confirmButton) { const buttonBg = this.add.rectangle(0, 150, 200, 40, 0x121212) .setStrokeStyle(1, 0xc4c4c4); const buttonText = this.add.text(0, 150, 'Confirm Upgrade', { fontSize: '20px', fill: '#ffffff', fontFamily: 'LeagueSpartan-Bold' }).setOrigin(0.5); upgradeMenu.confirmButton = this.add.container(0, 0, [buttonBg, buttonText]); upgradeMenu.add(upgradeMenu.confirmButton); buttonBg.setInteractive(); buttonBg.on('pointerdown', () => { const selected = upgradeMenu.selectedUpgrade; if (selected && selected.upgrade && selected.card) { this.tweens.add({ targets: upgradeMenu.selectedUpgrade.card, scaleX: 1.2, scaleY: 1.2, alpha: 0, duration: 200, onComplete: () => { selected.upgrade.effect(); upgradeMenu.destroy(); // Check if we have pending level ups from boss kill if (this.pendingLevelUps && this.pendingLevelUps > 1) { this.pendingLevelUps--; // Show next upgrade options this.showUpgradeOptions(); } else { this.pendingLevelUps = 0; this.cleanupAttackCooldown(); this.isPaused = false; this.physics.resume(); this.countdownTimer.paused = false; this.enemySpawnTimer.paused = false; this.canAttack = true; // Re-enable aiming square interactivity if (this.aimSquare) { this.aimSquare.setInteractive(); } // Ensure attack is immediately available if (this.attackCooldownTimer) { this.attackCooldownTimer.remove(); } } } }); } }); } }); // Add all elements to the card container card.add([cardBg, cardBorder, symbolBg, symbol, title, rarityLabel]); upgradeMenu.add(card); }); } } class LeaderboardScene extends Phaser.Scene { constructor() { super({ key: 'LeaderboardScene' }); } create() { this.cameras.main.setBackgroundColor('#0a0a0a'); // Add background pattern for (let i = 0; i < 20; i++) { for (let j = 0; j < 15; j++) { this.add.circle(i * 40 + 20, j * 40 + 20, 1, 0x121212, 0.2); } } // Title this.add.text(400, 50, 'HIGH SCORES', { fontSize: '48px', fill: '#ffffff', fontFamily: 'Rubik', stroke: '#121212', strokeThickness: 4 }).setOrigin(0.5); // Get high scores and generate fake entries const storedScores = JSON.parse(localStorage.getItem('highScores') || '[]'); // Generate fake gamer names const fakeNames = [ 'Ninja_Storm', 'ProGamer42', 'PixelWarrior', 'CursorKing', 'DarkPhoenix', 'EpicSniper', 'ChaosHunter', 'ShadowBlade', 'MasterCursor', 'LegendaryAim', 'StealthMode', 'QuickScope', 'ArcadeHero', 'CyberNinja', 'PixelPro', 'EliteGamer', 'CursorQueen', 'SpeedDemon', 'AimMaster', 'GameWizard' ]; // Get player's best score const playerBestScore = storedScores.length > 0 ? Math.max(...storedScores.map(s => s.score)) : 1000; // Default score if no player score exists // Shuffle the fake names array const shuffledNames = Phaser.Utils.Array.Shuffle([...fakeNames]); // Generate fake scores with unique names const fakeScores = Array.from({ length: Math.min(15, shuffledNames.length) }, (_, index) => { const name = shuffledNames[index]; // Use each name only once const scoreVariation = Math.random() * 0.5 + 0.75; // Random between 75% and 125% const score = Math.floor(playerBestScore * scoreVariation); const daysAgo = Math.floor(Math.random() * 30); // Random date within last 30 days const date = new Date(); date.setDate(date.getDate() - daysAgo); return { name: name, score: score, date: date.toISOString() }; }); // Combine real and fake scores const highScores = [...storedScores, ...fakeScores]; highScores.sort((a, b) => b.score - a.score); // Display scores const startY = 150; const spacing = 40; highScores.slice(0, 10).forEach((score, index) => { // Determine if this is a player score const isPlayerScore = storedScores.some(s => s.name === score.name && s.score === score.score ); // Format the date const scoreDate = new Date(score.date); const daysAgo = Math.floor((new Date() - scoreDate) / (1000 * 60 * 60 * 24)); const dateText = daysAgo === 0 ? 'today' : `${daysAgo}d ago`; // Create the score text with date const scoreText = this.add.text(400, startY + (spacing * index), `${index + 1}. ${score.name} - ${score.score.toLocaleString()} (${dateText})`, { fontSize: '24px', fill: index < 3 ? '#ffd700' : '#ffffff', fontFamily: 'Rubik', stroke: '#121212', strokeThickness: 1 }).setOrigin(0.5); // Add a small crown icon for top 3 if (index < 3) { this.add.text(scoreText.x - scoreText.width / 2 - 20, scoreText.y, '👑', { fontSize: '20px' }).setOrigin(0.5); } }); // Back button const backButton = this.add.rectangle(400, 550, 200, 50, 0x121212) .setStrokeStyle(1, 0xc4c4c4); const backText = this.add.text(400, 550, 'BACK', { fontSize: '24px', fill: '#ffffff', fontFamily: 'Rubik', stroke: '#121212', strokeThickness: 2 }).setOrigin(0.5); backButton.setInteractive(); backButton.on('pointerdown', () => { this.scene.start('StartScreen'); }); } } // Add CSS font-face declaration const fontStyle = document.createElement('style'); fontStyle.textContent = ` @font-face { font-family: 'LeagueSpartan-Bold'; src: url('https://play.rosebud.ai/assets/LeagueSpartan-Bold.otf?Aoqr') format('opentype'); font-weight: bold; font-style: normal; } `; document.head.appendChild(fontStyle); const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 800, height: 600, scene: [StartScreen, GameScene, LeaderboardScene], dom: { createContainer: true }, physics: { default: 'arcade', arcade: { gravity: { y: 0 }, debug: false } } }; window.phaserGame = new Phaser.Game(config);