class ContraVehicle extends Phaser.Scene { constructor() { super(); // JsonBin configuration this.jsonbinUrl = 'https://api.jsonbin.io/v3/b/'; this.binId = '67ec55f58960c979a57c89ba'; this.jsonbinKey = '$2a$10$CwO5X9Ozt5f7RhRZU6QUQ.yHXmwdC664tpHT7wCkymIj23k1CDsA.'; this.globalScores = []; this.scrollSpeed = 8; this.autoFireTimer = 0; this.autoFireInterval = 500; // 500ms = 0.5 seconds this.mountainTimer = 0; this.mountainInterval = 2000; // Spawn mountains every 2 seconds this.lastHealthSpawn = 0; // Track score at last health spawn // Power-up states this.hasPowerUp = false; this.hasDozerPowerUp = false; this.hasDeathLinkPowerUp = false; this.hasParticleSprayPowerUp = false; // Power-up charge times and states this.powerUpCharge = 0; this.powerUpChargeTime = 30000; // 30 seconds to charge this.dozerCharge = 0; this.dozerChargeTime = 45000; // 45 seconds to charge this.deathLinkCharge = 0; this.deathLinkChargeTime = 60000; // 60 seconds to charge this.particleSprayCharge = 0; this.particleSprayChargeTime = 70000; // 70 seconds to charge this.dozerBull = null; // Reference to the bull sprite during Dozer mode this.playerHealth = 100; // Initialize player health at 100% this.highScore = parseInt(localStorage.getItem('contraHighScore')) || 0; this.enemySpawnTimer = 0; this.enemySpawnInterval = 2000; this.score = 0; this.updateScore = (points) => { this.score += points; this.scoreText.setText('Score: ' + this.score); // High score tracking still continues in background if (this.score > this.highScore) { this.highScore = this.score; localStorage.setItem('contraHighScore', this.highScore); } // Update game difficulty based on score this.maxEnemies = 4 + Math.floor(this.score / 100); // Check for health spawn if (this.score >= this.lastHealthSpawn + 1200) { this.spawnHealthItem(); this.lastHealthSpawn = this.score; } }; this.gameOver = false; this.minSpawnInterval = 300; // Fastest spawn rate this.enemySpeed = 0.3 * (this.scrollSpeed + 4); // Increased to 0.3 from 0.2 for 50% faster movement this.maxEnemies = 2; // Starting max concurrent enemies this.backgroundObjectTimer = 0; this.backgroundObjectInterval = 5000; // Spawn background objects every 5 seconds this.firstKill = false; // Track if first enemy has been killed this.titleText = null; // Reference to store title text // Mobile control properties this.isMobile = false; this.mobileControls = { up: false, down: false, left: false, right: false }; } preload() { // Load music this.load.audio('music', 'https://play.rosebud.ai/assets/music.mp3?Htsz'); // Load environment assets this.load.image('mountain', 'https://play.rosebud.ai/assets/mountain.png?1te9'); this.load.image('cloud1', 'https://play.rosebud.ai/assets/cloud1.png?POVr'); this.load.image('cloud2', 'https://play.rosebud.ai/assets/cloud2.png?EH96'); this.load.image('tree', 'https://play.rosebud.ai/assets/tree.png?Zi3i'); // Load building assets this.load.image('store', 'https://play.rosebud.ai/assets/store.png?1bdf'); this.load.image('dealership', 'https://play.rosebud.ai/assets/dealership.png?wbRh'); this.load.image('restaurant', 'https://play.rosebud.ai/assets/restaurant.png?GKD5'); // Load character and enemy assets this.load.image('cybertruck', 'https://play.rosebud.ai/assets/cybertruck.png?cw77'); this.load.image('zombie', 'https://play.rosebud.ai/assets/zombie.png?MRId'); this.load.image('zombie2', 'https://play.rosebud.ai/assets/zombie2.png?Fi6F'); this.load.image('zombie2e', 'https://play.rosebud.ai/assets/zombie2e.png?1qvL'); this.load.image('zombie3', 'https://play.rosebud.ai/assets/zombie3.png?covJ'); // Load power-ups and effects this.load.image('health', 'https://play.rosebud.ai/assets/health.png?Ncq9'); this.load.image('rocket', 'https://play.rosebud.ai/assets/rocket.png?6iZR'); this.load.image('explosion', 'https://play.rosebud.ai/assets/explosion.png?dBLs'); this.load.image('molotov', 'https://play.rosebud.ai/assets/molotov.png?Zcr0'); // Load obstacles and hazards this.load.image('roadBarrier', 'https://play.rosebud.ai/assets/roadBarrier.png?dflb'); this.load.image('broken', 'https://play.rosebud.ai/assets/broken.png?US26'); // Set texture filtering for road this.load.on('complete', () => { this.textures.get('road').setFilter(Phaser.Textures.LINEAR); }); } create() { // Detect mobile device this.isMobile = this.sys.game.device.os.android || this.sys.game.device.os.iOS || this.sys.game.device.os.iPad || this.sys.game.device.os.iPhone; // Start background music this.backgroundMusic = this.sound.add('music', { loop: true }); this.backgroundMusic.play(); // Create mountain group this.mountains = this.add.group(); // Create scrolling background const bgWidth = this.sys.game.config.width; const bgHeight = this.sys.game.config.height; // Create sky background (light blue) only for the upper portion const roadHeight = this.sys.game.config.height * 0.7; const roadY = this.sys.game.config.height - roadHeight; const skyHeight = roadY; // Height of sky is exactly up to the road const skyColor = 0x87CEEB; // Light blue color this.background = this.add.rectangle(0, 0, bgWidth, skyHeight, skyColor); this.background.setOrigin(0, 0); this.background.setDepth(-2); // Sky at the very back // Create light grey background for the road area this.roadBackground = this.add.rectangle(0, roadY, bgWidth, roadHeight, 0xCCCCCC); this.roadBackground.setOrigin(0, 0); // Create gradient road this.road = this.add.graphics(); this.road.setDepth(0); // Set depth to 0 to place behind other assets // Create gradient from dark grey to lighter grey const gradientSteps = 20; // Number of gradient steps const startColor = 0x333333; // Dark grey const endColor = 0x555555; // Lighter grey for (let i = 0; i < gradientSteps; i++) { const t = i / (gradientSteps - 1); const r = Phaser.Math.Linear((startColor >> 16) & 0xff, (endColor >> 16) & 0xff, t); const g = Phaser.Math.Linear((startColor >> 8) & 0xff, (endColor >> 8) & 0xff, t); const b = Phaser.Math.Linear(startColor & 0xff, endColor & 0xff, t); const color = (r << 16) | (g << 8) | b; this.road.fillStyle(color); this.road.fillRect( 0, roadY + (i * (roadHeight / gradientSteps)), bgWidth, roadHeight / gradientSteps + 1 ); } // Add road texture pattern const patternGraphics = this.add.graphics(); patternGraphics.setDepth(0.5); // Above road but below other elements // Create a grid pattern const gridSize = 40; const lineColor = 0x444444; // Slightly lighter than darkest road color const lineWidth = 2; // Draw vertical lines for (let x = gridSize; x < bgWidth; x += gridSize) { patternGraphics.lineStyle(lineWidth, lineColor, 0.3); patternGraphics.beginPath(); patternGraphics.moveTo(x, roadY); patternGraphics.lineTo(x, this.sys.game.config.height); patternGraphics.strokePath(); } // Draw horizontal lines for (let y = roadY + gridSize; y < this.sys.game.config.height; y += gridSize) { patternGraphics.lineStyle(lineWidth, lineColor, 0.3); patternGraphics.beginPath(); patternGraphics.moveTo(0, y); patternGraphics.lineTo(bgWidth, y); patternGraphics.strokePath(); } // Create player vehicle (scaled down from original size) const playerScale = 0.1215; // Reduced by 10% from 0.135 this.player = this.add.sprite(200, this.sys.game.config.height / 2, 'cybertruck'); this.player.setScale(playerScale); this.player.setDepth(3); // Set player depth higher than background objects this.physics.add.existing(this.player); this.player.body.setCollideWorldBounds(true); // Adjust player hitbox for larger cybertruck this.player.body.setSize(this.player.width * 0.8, this.player.height * 0.4); // Create cloud groups this.clouds1 = this.add.group(); this.clouds2 = this.add.group(); // Spawn multiple initial clouds at different positions this.spawnCloud(1, this.sys.game.config.width * 0.25); this.spawnCloud(1, this.sys.game.config.width * 0.75); this.spawnCloud(2, this.sys.game.config.width * 0.5); this.spawnCloud(2, this.sys.game.config.width); // Set cloud spawn timers this.cloudSpawnInterval = 4000; // Spawn new clouds every 4 seconds this.cloud1Timer = this.cloudSpawnInterval * 0.75; // Start timer at 75% to spawn next cloud sooner this.cloud2Timer = this.cloudSpawnInterval * 0.5; // Start timer at 50% to stagger spawns // Create groups for bullets and enemies this.bullets = this.physics.add.group(); this.enemies = this.physics.add.group(); this.projectiles = this.physics.add.group(); this.powerUps = this.physics.add.group(); this.roadHazards = this.physics.add.group(); this.healthItems = this.physics.add.group(); // Add collision detection for power-ups and hazards // Power-ups and effects collision detection this.physics.add.overlap(this.player, this.powerUps, this.collectPowerUp, null, this); this.physics.add.overlap(this.player, this.roadHazards, this.hitHazard, null, this); this.physics.add.overlap(this.player, this.healthItems, this.collectHealth, null, this); this.physics.add.overlap(this.player, this.projectiles, this.hitProjectile, null, this); this.physics.add.overlap(this.bullets, this.projectiles, this.destroyProjectile, null, this); this.physics.add.overlap(this.player, this.explosions, this.hitExplosion, null, this); // Setup controls this.cursors = this.input.keyboard.createCursorKeys(); this.spaceKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE); this.shiftKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SHIFT); this.xKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.X); this.zKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Z); // Add score text // Create health bar const healthBarWidth = 160; // Reduced from 200 (20% smaller) const healthBarHeight = 16; // Reduced from 20 (20% smaller) const healthBarX = this.sys.game.config.width - healthBarWidth - 16; // 16px from right edge const healthBarY = 16; // Same distance from top as score // Add score text below health bar this.scoreText = this.add.text( healthBarX, healthBarY + healthBarHeight + 5, 'Score: 0', { fontSize: '26px', fill: '#fff', stroke: '#000', strokeThickness: 4 } ).setDepth(1000); // Health bar background (grey) this.healthBarBackground = this.add.rectangle( healthBarX, healthBarY, healthBarWidth, healthBarHeight, 0x333333 ).setOrigin(0, 0).setDepth(1000); // Health bar fill (green) this.healthBar = this.add.rectangle( healthBarX, healthBarY, healthBarWidth, healthBarHeight, 0x00ff00 ).setOrigin(0, 0).setDepth(1000); // Add border around health bar this.add.rectangle( healthBarX, healthBarY, healthBarWidth, healthBarHeight, 0xffffff, 0 ).setOrigin(0, 0) .setStrokeStyle(2, 0xffffff) .setDepth(1000); // Add title text this.titleText = this.add.text( this.sys.game.config.width / 2, this.sys.game.config.height - 60, // Position 40 pixels above the Aircade Games text 'TESLA ZOMBIE DEFENSE', { fontSize: '48px', fill: '#fff', stroke: '#000', strokeThickness: 6, align: 'center' } ).setOrigin(0.5).setDepth(1000); // Create power-up charge meter const chargeBarWidth = 200; const chargeBarHeight = 24; const chargeBarX = 16; // Keep charge bar on the left const chargeBarY = healthBarY; // Align with health bar // Charge bar background (grey) - make interactive this.chargeBarBackground = this.add.rectangle( chargeBarX, chargeBarY, chargeBarWidth, chargeBarHeight, 0x333333 ).setOrigin(0, 0).setDepth(1000) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => { if (this.powerUpCharge >= this.powerUpChargeTime) { this.hasPowerUp = true; this.chargeBar.width = 200; this.powerUpCharge = 0; this.time.delayedCall(10000, () => { this.hasPowerUp = false; }); } }); // Charge bar fill (blue) this.chargeBar = this.add.rectangle( chargeBarX, chargeBarY, 0, // Start with 0 width chargeBarHeight, 0x0066ff ).setOrigin(0, 0).setDepth(1000); // Add "SPACE BAR" text inside charge bar this.add.text( chargeBarX + (chargeBarWidth / 2), chargeBarY + (chargeBarHeight / 2), 'ROCKET - SPACE', { fontSize: '14px', fill: '#fff', stroke: '#000', strokeThickness: 2 } ).setOrigin(0.5, 0.5).setDepth(1001); // Add border around charge bar this.add.rectangle( chargeBarX, chargeBarY, chargeBarWidth, chargeBarHeight, 0xffffff, 0 ).setOrigin(0, 0) .setStrokeStyle(2, 0xffffff) .setDepth(1000); // Add "ROCKET" text below charge bar this.add.text( chargeBarX, chargeBarY + chargeBarHeight + 5, 'ROCKET', { fontSize: '18px', fill: '#fff', stroke: '#000', strokeThickness: 2 } ).setDepth(1000); // Create dozer charge meter below rocket meter const dozerBarX = chargeBarX; const dozerBarY = chargeBarY + chargeBarHeight + 5; // 5 pixels below rocket meter // Dozer bar background (grey) this.dozerBarBackground = this.add.rectangle( dozerBarX, dozerBarY, chargeBarWidth, chargeBarHeight, 0x333333 ).setOrigin(0, 0).setDepth(1000) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => { if (this.dozerCharge >= this.dozerChargeTime) { this.activateDozerPowerUp(); } }); // Dozer bar fill (yellow) this.dozerBar = this.add.rectangle( dozerBarX, dozerBarY, 0, // Start with 0 width chargeBarHeight, 0xffff00 ).setOrigin(0, 0).setDepth(1000); // Add "SHIFT" text inside dozer bar this.add.text( dozerBarX + (chargeBarWidth / 2), dozerBarY + (chargeBarHeight / 2), 'DOZER - SHIFT', { fontSize: '14px', fill: '#fff', stroke: '#000', strokeThickness: 2 } ).setOrigin(0.5, 0.5).setDepth(1001); // Create deathlink charge meter below dozer meter const deathLinkBarX = dozerBarX; const deathLinkBarY = dozerBarY + chargeBarHeight + 5; // DeathLink bar background (grey) this.deathLinkBarBackground = this.add.rectangle( deathLinkBarX, deathLinkBarY, chargeBarWidth, chargeBarHeight, 0x333333 ).setOrigin(0, 0).setDepth(1000) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => { if (this.deathLinkCharge >= this.deathLinkChargeTime) { this.activateDeathLinkPowerUp(); } }); // DeathLink bar fill (orange) this.deathLinkBar = this.add.rectangle( deathLinkBarX, deathLinkBarY, 0, chargeBarHeight, 0xff6600 ).setOrigin(0, 0).setDepth(1000); // Add "DEATHLINK - X" text inside deathlink bar this.add.text( deathLinkBarX + (chargeBarWidth / 2), deathLinkBarY + (chargeBarHeight / 2), 'DEATHLINK - X', { fontSize: '14px', fill: '#fff', stroke: '#000', strokeThickness: 2 } ).setOrigin(0.5, 0.5).setDepth(1001); // Add border around deathlink bar this.add.rectangle( deathLinkBarX, deathLinkBarY, chargeBarWidth, chargeBarHeight, 0xffffff, 0 ).setOrigin(0, 0) .setStrokeStyle(2, 0xffffff) .setDepth(1000); // Create particle spray charge meter below deathlink meter const particleSprayBarX = deathLinkBarX; const particleSprayBarY = deathLinkBarY + chargeBarHeight + 5; // Particle spray bar background (grey) this.particleSprayBarBackground = this.add.rectangle( particleSprayBarX, particleSprayBarY, chargeBarWidth, chargeBarHeight, 0x333333 ).setOrigin(0, 0).setDepth(1000) .setInteractive({ useHandCursor: true }) .on('pointerdown', () => { if (this.particleSprayCharge >= this.particleSprayChargeTime) { this.activateParticleSprayPowerUp(); } }); // Particle spray bar fill (purple) this.particleSprayBar = this.add.rectangle( particleSprayBarX, particleSprayBarY, 0, chargeBarHeight, 0x800080 ).setOrigin(0, 0).setDepth(1000); // Add "PARTICLE SPRAY - Z" text inside particle spray bar this.add.text( particleSprayBarX + (chargeBarWidth / 2), particleSprayBarY + (chargeBarHeight / 2), 'PARTICLE SPRAY - Z', { fontSize: '14px', fill: '#fff', stroke: '#000', strokeThickness: 2 } ).setOrigin(0.5, 0.5).setDepth(1001); // Add border around particle spray bar this.add.rectangle( particleSprayBarX, particleSprayBarY, chargeBarWidth, chargeBarHeight, 0xffffff, 0 ).setOrigin(0, 0) .setStrokeStyle(2, 0xffffff) .setDepth(1000); // Add border around dozer bar this.add.rectangle( dozerBarX, dozerBarY, chargeBarWidth, chargeBarHeight, 0xffffff, 0 ).setOrigin(0, 0) .setStrokeStyle(2, 0xffffff) .setDepth(1000); // Collision detection this.physics.add.overlap(this.bullets, this.enemies, this.hitEnemy, (bullet, enemy) => { // Ensure both objects exist and have physics bodies before checking enable return bullet && enemy && bullet.body && enemy.body && bullet.body.enable && enemy.body.enable; }, this); // Add constant collision detection for enemies during Dozer power-up this.physics.add.overlap(this.player, this.enemies, (player, enemy) => { if (this.hasDozerPowerUp && enemy.active) { this.createExplosion(enemy.x, enemy.y); enemy.destroy(); this.score += 10; this.scoreText.setText('Score: ' + this.score); } }, null, this); // Add collision for bullets and projectiles this.physics.add.overlap(this.bullets, this.projectiles, this.hitEnemy, (bullet, projectile) => { return bullet && projectile && bullet.body && projectile.body && bullet.body.enable && projectile.body.enable; }, this); this.physics.add.overlap(this.player, this.enemies, this.gameOverHandler, (player, enemy) => { // Only trigger collision if player is not invulnerable and not in Dozer mode return !this.isInvulnerable && !this.hasDozerPowerUp; }, this); // Add collision for molotov projectiles this.physics.add.overlap(this.player, this.projectiles, (player, projectile) => { if (!this.isInvulnerable) { projectile.destroy(); this.gameOverHandler(player, null); } }, null, this); // Set world bounds to match new road position this.physics.world.setBounds(0, roadY, this.sys.game.config.width, roadHeight); // Adjust initial player position to be within new road bounds this.player.y = roadY + (roadHeight / 2); // Create group for background objects this.backgroundObjects = this.add.group(); // Initialize hazard spawn timer this.hazardSpawnTimer = 0; this.hazardSpawnInterval = 3000; // Spawn hazards every 3 seconds // Add Aircade Games text at the bottom // Create clickable wallet address const walletText = this.add.text( this.sys.game.config.width / 2, this.sys.game.config.height - 20, 'AIRCADE GAMES: 0x083De6B54b55FC423E3ea5FdE924D9024376f80C', { fontSize: '16px', fill: '#fff', fontFamily: 'monospace', backgroundColor: '#000000', padding: { left: 10, right: 10, top: 5, bottom: 5 } } ).setOrigin(0.5, 1).setDepth(1000) .setInteractive({ useHandCursor: true }) .on('pointerover', () => { walletText.setStyle({ fill: '#ffff00' }); }) .on('pointerout', () => { walletText.setStyle({ fill: '#ffffff' }); }) .on('pointerdown', () => { const address = '0x083De6B54b55FC423E3ea5FdE924D9024376f80C'; navigator.clipboard.writeText(address) .then(() => { // Visual feedback walletText.setStyle({ fill: '#00ff00' }); this.time.delayedCall(200, () => { walletText.setStyle({ fill: '#ffffff' }); }); }) .catch(err => console.error('Failed to copy text: ', err)); }); // Add mobile controls if on mobile device if (this.isMobile) { this.createMobileControls(); } } spawnBackgroundObject() { const roadY = this.sys.game.config.height - (this.sys.game.config.height * 0.7); // Original background object spawning logic (no mountain handling here) // Original background object spawning logic let objectKey, scale; const rand = Math.random(); // Adjusted percentages for remaining 60% if (rand < 0.4) { // 40% chance for tree (reduced from 80%) objectKey = 'tree'; scale = 0.15; } else if (rand < 0.47) { // 7% for store objectKey = 'store'; scale = 0.143; } else if (rand < 0.54) { // 7% for dealership objectKey = 'dealership'; scale = 0.121; } else { // 6% for restaurant objectKey = 'restaurant'; scale = 0.135; } console.log(`Spawning background object: ${objectKey}`); // Debug log // If it's a tree, 85% chance to spawn another tree immediately. If it's a store, 75% chance if ((objectKey === 'tree' && Math.random() < 0.85) || (objectKey === 'store' && Math.random() < 0.75)) { const offsetX = Phaser.Math.Between(100, 300); const treeExtra = this.add.sprite(this.sys.game.config.width + 100 + offsetX, roadY, 'tree'); treeExtra.setScale(0.15); treeExtra.setOrigin(0.5, 1); this.backgroundObjects.add(treeExtra); } const object = this.add.sprite(this.sys.game.config.width + 100, roadY, objectKey); object.setScale(scale); object.setOrigin(0.5, 1); // Set origin to bottom center object.setDepth(objectKey === 'tree' ? 3 : 2); // Trees get depth 3, buildings get depth 2 this.backgroundObjects.add(object); // Debug: Log object properties console.log(`Added ${objectKey}: x=${object.x}, y=${object.y}, scale=${scale}, visible=${object.visible}`); } update(time, delta) { if (this.gameOver) return; // Handle auto-firing this.autoFireTimer += delta; if (this.autoFireTimer >= this.autoFireInterval) { this.shoot(); this.autoFireTimer = 0; } // Update mountain spawn timer this.mountainTimer += delta; if (this.mountainTimer >= this.mountainInterval) { const roadY = this.sys.game.config.height - (this.sys.game.config.height * 0.7); const mountain = this.add.sprite(this.sys.game.config.width + 100, roadY, 'mountain'); mountain.setOrigin(0.5, 1); mountain.setScale(0.4); mountain.setDepth(-1); // Mountains in front of sky (-2) but behind trees (3) and buildings (2) this.mountains.add(mountain); this.mountainTimer = 0; } // Update mountains position this.mountains.children.iterate((mountain) => { if (mountain) { mountain.x -= this.scrollSpeed * 0.25; // Move at quarter speed for stronger parallax effect if (mountain.x < -200) { mountain.destroy(); } } }); // Update power-up charge if (!this.hasPowerUp) { this.powerUpCharge = Math.min(this.powerUpCharge + delta, this.powerUpChargeTime); // Update charge bar width const chargeWidth = (this.powerUpCharge / this.powerUpChargeTime) * 200; this.chargeBar.width = this.powerUpCharge >= this.powerUpChargeTime ? 200 : chargeWidth; // Check if fully charged and space pressed if (this.powerUpCharge >= this.powerUpChargeTime && Phaser.Input.Keyboard.JustDown(this.spaceKey)) { this.hasPowerUp = true; this.chargeBar.width = 200; // Set to full width when activated this.powerUpCharge = 0; // Power-up duration: 10 seconds this.time.delayedCall(10000, () => { this.hasPowerUp = false; }); } } // Update deathlink charge if (!this.hasDeathLinkPowerUp) { this.deathLinkCharge = Math.min(this.deathLinkCharge + delta, this.deathLinkChargeTime); // Update deathlink bar width const deathLinkWidth = (this.deathLinkCharge / this.deathLinkChargeTime) * 200; this.deathLinkBar.width = this.deathLinkCharge >= this.deathLinkChargeTime ? 200 : deathLinkWidth; // Check if fully charged and X pressed if (this.deathLinkCharge >= this.deathLinkChargeTime && Phaser.Input.Keyboard.JustDown(this.xKey)) { this.hasDeathLinkPowerUp = true; this.deathLinkBar.width = 200; // Set to full width when activated this.deathLinkCharge = 0; // Start the death beam effect this.startDeathBeams(); // Power-up duration: 6 seconds this.time.delayedCall(6000, () => { this.hasDeathLinkPowerUp = false; if (this.deathBeamEvent) { this.deathBeamEvent.remove(); } }); } } // Update particle spray charge if (!this.hasParticleSprayPowerUp) { this.particleSprayCharge = Math.min(this.particleSprayCharge + delta, this.particleSprayChargeTime); // Update particle spray bar width const particleSprayWidth = (this.particleSprayCharge / this.particleSprayChargeTime) * 200; this.particleSprayBar.width = this.particleSprayCharge >= this.particleSprayChargeTime ? 200 : particleSprayWidth; // Check if fully charged and Z pressed if (this.particleSprayCharge >= this.particleSprayChargeTime && Phaser.Input.Keyboard.JustDown(this.zKey)) { this.hasParticleSprayPowerUp = true; this.particleSprayBar.width = 200; this.particleSprayCharge = 0; // Create particle group for collision detection this.particleGroup = this.physics.add.group(); // Create particle emitters const upEmitter = this.add.particles('explosion').createEmitter({ x: this.player.x, y: this.player.y, speed: { min: 300, max: 500 }, angle: { min: 60, max: 120 }, scale: { start: 0.1, end: 0 }, lifespan: 2000, blendMode: 'ADD', frequency: 50, emitCallback: (particle) => { // Create physics-enabled particle sprite const particleSprite = this.particleGroup.create(particle.x, particle.y, 'explosion'); particleSprite.setScale(0.1); particleSprite.setAlpha(0.6); // Enable physics and set collision properties particleSprite.body.setSize(40, 40); particleSprite.body.enable = true; // Set velocity based on emitter angle and speed const angle = Phaser.Math.DegToRad(Phaser.Math.Between(60, 120)); const speed = Phaser.Math.Between(300, 500); particleSprite.body.setVelocity( Math.cos(angle) * speed, Math.sin(angle) * speed ); // Set particle lifetime this.time.delayedCall(2000, () => { if (particleSprite && particleSprite.active) { particleSprite.destroy(); } }); } }); const downEmitter = this.add.particles('explosion').createEmitter({ x: this.player.x, y: this.player.y, speed: { min: 300, max: 500 }, angle: { min: 240, max: 300 }, scale: { start: 0.1, end: 0 }, lifespan: 2000, blendMode: 'ADD', frequency: 50, emitCallback: (particle) => { // Create physics-enabled particle sprite const particleSprite = this.particleGroup.create(particle.x, particle.y, 'explosion'); particleSprite.setScale(0.1); particleSprite.setAlpha(0.6); // Enable physics and set collision properties particleSprite.body.setSize(40, 40); particleSprite.body.enable = true; // Set velocity based on emitter angle and speed const angle = Phaser.Math.DegToRad(Phaser.Math.Between(240, 300)); const speed = Phaser.Math.Between(300, 500); particleSprite.body.setVelocity( Math.cos(angle) * speed, Math.sin(angle) * speed ); // Set particle lifetime this.time.delayedCall(2000, () => { if (particleSprite && particleSprite.active) { particleSprite.destroy(); } }); } }); // Single, effective collision detection for particles and enemies this.physics.add.overlap(this.particleGroup, this.enemies, (particle, enemy) => { if (particle.active && enemy.active) { if (enemy.zombieType === 'zombie3') { enemy.hitPoints--; if (enemy.hitPoints <= 0) { this.createExplosion(enemy.x, enemy.y); enemy.destroy(); this.updateScore(180); } } else { this.createExplosion(enemy.x, enemy.y); enemy.destroy(); this.updateScore(10); } particle.destroy(); } }, null, this); // Follow the player upEmitter.startFollow(this.player); downEmitter.startFollow(this.player); // Power-up duration: 8 seconds this.time.delayedCall(8000, () => { this.hasParticleSprayPowerUp = false; upEmitter.stop(); downEmitter.stop(); // Destroy any remaining particles this.particleGroup.clear(true, true); this.time.delayedCall(1000, () => { upEmitter.manager.destroy(); downEmitter.manager.destroy(); }); }); } } // Update dozer charge if (!this.hasDozerPowerUp) { this.dozerCharge = Math.min(this.dozerCharge + delta, this.dozerChargeTime); // Update dozer bar width const dozerWidth = (this.dozerCharge / this.dozerChargeTime) * 200; this.dozerBar.width = this.dozerCharge >= this.dozerChargeTime ? 200 : dozerWidth; // Check if fully charged and shift pressed if (this.dozerCharge >= this.dozerChargeTime && Phaser.Input.Keyboard.JustDown(this.shiftKey)) { this.hasDozerPowerUp = true; this.dozerBar.width = 200; // Set to full width when activated this.dozerCharge = 0; this.isInvulnerable = true; // Create bull sprite in front of player this.dozerBull = this.add.sprite(this.player.x + 50, this.player.y, 'bull'); this.dozerBull.setScale(0.3); this.dozerBull.setDepth(2); // Between player and background // Visual feedback for dozer mode this.player.setTint(0xffff00); // Start blinking effect this.dozerBlinkEffect = this.time.addEvent({ delay: 100, callback: () => { this.player.alpha = this.player.alpha === 1 ? 0.3 : 1; }, loop: true }); // Dozer power-up duration: 7 seconds this.time.delayedCall(7000, () => { this.hasDozerPowerUp = false; this.isInvulnerable = false; this.player.clearTint(); this.player.alpha = 1; // Ensure player is fully visible // Stop blinking effect if (this.dozerBlinkEffect) { this.dozerBlinkEffect.destroy(); } // Remove bull sprite if (this.dozerBull) { this.dozerBull.destroy(); this.dozerBull = null; } }); } } // Scroll background and road // Road is now static, no need to update position // Player movement if (this.cursors.up.isDown || this.mobileControls.up) { this.player.body.setVelocityY(-300); } else if (this.cursors.down.isDown || this.mobileControls.down) { this.player.body.setVelocityY(300); } else { this.player.body.setVelocityY(0); } // Update bull position if Dozer power-up is active if (this.hasDozerPowerUp && this.dozerBull) { this.dozerBull.x = this.player.x + 50; // Position bull in front of player this.dozerBull.y = this.player.y; // Match player's vertical position } // Limited horizontal movement if (this.cursors.left.isDown || this.mobileControls.left) { this.player.body.setVelocityX(-150); } else if (this.cursors.right.isDown || this.mobileControls.right) { this.player.body.setVelocityX(150); } else { this.player.body.setVelocityX(0); } // Spawn enemies this.enemySpawnTimer += delta; if (this.enemySpawnTimer >= this.enemySpawnInterval) { // Adjust max enemies based on score threshold if (this.score < 3000) { this.maxEnemies = 12 + Math.floor(this.score / 100); } else { // Slower increase after 3000 points this.maxEnemies = 42 + Math.floor((this.score - 3000) / 300); } // Cap the maximum number of enemies this.maxEnemies = Math.min(this.maxEnemies, 60); // Only spawn if we haven't reached max enemies if (this.enemies.countActive() < this.maxEnemies) { // Adjust number of enemies spawned based on score const spawnCount = this.score < 3000 ? 9 : 6; for (let i = 0; i < spawnCount && this.enemies.countActive() < this.maxEnemies; i++) { this.spawnEnemy(); } } this.enemySpawnTimer = 0; // Adjust spawn interval reduction based on score if (this.score < 3000) { this.enemySpawnInterval = Math.max(this.minSpawnInterval, this.enemySpawnInterval - 25); } else { // Much slower reduction in spawn interval after 3000 points this.enemySpawnInterval = Math.max(this.minSpawnInterval, this.enemySpawnInterval - 10); } } // Update hazard spawn timer this.hazardSpawnTimer += delta; if (this.hazardSpawnTimer >= this.hazardSpawnInterval) { this.spawnHazard(); this.hazardSpawnTimer = 0; // Random interval between 2 and 4 seconds this.hazardSpawnInterval = Phaser.Math.Between(2000, 4000); } // Update hazards this.roadHazards.children.iterate((hazard) => { if (hazard) { hazard.x -= this.scrollSpeed * 0.5; // Match tree/background object speed if (hazard.x < -100) { hazard.destroy(); } } }); // Update background object spawn timer this.backgroundObjectTimer += delta; if (this.backgroundObjectTimer >= this.backgroundObjectInterval) { this.spawnBackgroundObject(); this.backgroundObjectTimer = 0; // Random interval between 1.5 and 3.5 seconds this.backgroundObjectInterval = Phaser.Math.Between(1500, 3500); } // Update background objects this.backgroundObjects.children.iterate((object) => { if (object) { object.x -= this.scrollSpeed * 0.5; // Move slower than the road if (object.x < -200) { object.destroy(); } } }); // Update clouds this.clouds1.children.iterate((cloud) => { if (cloud) { cloud.x -= this.scrollSpeed * 0.3; // Move at 30% of scroll speed if (cloud.x < -200) { cloud.destroy(); } } }); this.clouds2.children.iterate((cloud) => { if (cloud) { cloud.x -= this.scrollSpeed * 0.15; // Move at 15% of scroll speed (half speed of cloud1) if (cloud.x < -200) { cloud.destroy(); } } }); // Check cloud spawn timers this.cloud1Timer += delta; this.cloud2Timer += delta; if (this.cloud1Timer >= this.cloudSpawnInterval) { this.spawnCloud(1); this.cloud1Timer = 0; } if (this.cloud2Timer >= this.cloudSpawnInterval) { this.spawnCloud(2); this.cloud2Timer = 0; } // Update power-ups this.powerUps.children.iterate((powerUp) => { if (powerUp) { if (powerUp.x < -50) { powerUp.destroy(); } } }); // Update enemies this.enemies.children.iterate((enemy) => { if (enemy) { // Handle projectile throwing for zombie2 if (enemy.isProjectileZombie && !enemy.projectileThrown) { const distance = Phaser.Math.Distance.Between(enemy.x, enemy.y, this.player.x, this.player.y); if (distance < 400) { // Only throw when within range this.throwProjectile(enemy); } } // Gradually increase enemy speed based on score (all speeds reduced by 70%) const speedIncrease = Math.min(this.score / 400, 1.5); // Max 1.5x speed increase const baseSpeed = this.enemySpeed * (1 + speedIncrease) * 0.3; // Apply 30% speed modifier // Apply different speed modifiers based on zombie type let finalSpeed; if (enemy.zombieType === 'zombie3') { finalSpeed = baseSpeed * 0.45; // 55% slower for zombie3 } else if (enemy.zombieType === 'zombie') { finalSpeed = baseSpeed * 1.35; // 35% faster for regular zombies } else { finalSpeed = baseSpeed * 0.9; // 10% slower for zombie2 } enemy.x -= finalSpeed; if (enemy.x < -50) { enemy.destroy(); } } }); // Update bullets (removed bullet movement since laser beams are stationary) this.bullets.children.iterate((bullet) => { if (bullet && bullet.x < 0) { bullet.destroy(); } }); } // Shooting methods shoot() { // Always shoot laser this.shootSingleLaser(); // Additionally shoot rockets if power-up is active if (this.hasPowerUp) { this.shootTripleRockets(); } } shootSingleLaser() { const cybertruckRightEdge = this.player.x + ((this.player.width * this.player.scaleX) / 2); const laserWidth = this.sys.game.config.width - cybertruckRightEdge; const laserHeight = 4; const laserContainer = this.add.container(0, 0); const laser = this.add.rectangle( cybertruckRightEdge + (laserWidth / 2), this.player.y, laserWidth, laserHeight, 0x0066ff ).setAlpha(0.8); const glow = this.add.rectangle( cybertruckRightEdge + (laserWidth / 2), this.player.y, laserWidth, laserHeight * 2, 0x0066ff, 0.3 ); laserContainer.add([glow, laser]); this.bullets.add(laser); if (!laser.body) { this.physics.add.existing(laser); } laser.body.enable = true; laser.body.setSize(laserWidth, laserHeight * 8); laser.body.setOffset(0, -laserHeight * 4); const updateLaser = () => { const rightEdge = this.player.x + ((this.player.width * this.player.scaleX) / 2); const newWidth = this.sys.game.config.width - rightEdge; laser.width = newWidth; glow.width = newWidth; laser.x = rightEdge + (newWidth / 2); laser.y = this.player.y; glow.x = laser.x; glow.y = laser.y; }; const updateEvent = this.events.addListener('update', updateLaser); this.time.delayedCall(125, () => { this.events.removeListener('update', updateEvent); laser.destroy(); glow.destroy(); laserContainer.destroy(); }); } shootTripleRockets() { for (let i = 0; i < 3; i++) { const rocket = this.bullets.create(this.player.x + 50, this.player.y, 'rocket'); rocket.setScale(0.049); // Set to 50px diameter rocket.setDepth(1000); rocket.isRocket = true; // Add trail effect const particles = this.add.particles('explosion'); const emitter = particles.createEmitter({ speed: 20, scale: { start: 0.05, end: 0 }, alpha: { start: 0.5, end: 0 }, lifespan: 300, blendMode: 'ADD' }); emitter.startFollow(rocket); // Clean up particles when rocket is destroyed rocket.on('destroy', () => { emitter.stop(); this.time.delayedCall(300, () => particles.destroy()); }); // Ensure physics body is enabled and exists if (!rocket.body) { this.physics.add.existing(rocket); } rocket.body.enable = true; // Find closest enemy or use random position if no enemies let targetX = this.sys.game.config.width; let targetY = this.player.y; const enemies = this.enemies.getChildren(); if (enemies.length > 0) { // Get random enemy from available enemies const randomEnemy = enemies[Math.floor(Math.random() * enemies.length)]; targetX = randomEnemy.x; targetY = randomEnemy.y; } // Add random variation to trajectory targetX += Phaser.Math.Between(-100, 100); targetY += Phaser.Math.Between(-100, 100); // Calculate angle to target const angle = Phaser.Math.Angle.Between(rocket.x, rocket.y, targetX, targetY); rocket.rotation = angle; // Set rotation to match movement direction // Set velocity with some randomness const speed = 300 + Phaser.Math.Between(-50, 50); this.physics.moveTo(rocket, targetX, targetY, speed); // Add slight wave motion this.tweens.add({ targets: rocket, y: rocket.y + Phaser.Math.Between(-50, 50), duration: 1000, yoyo: true, repeat: -1 }); // Destroy rocket after 3 seconds if it hasn't hit anything this.time.delayedCall(3000, () => { if (rocket.active) { this.createExplosion(rocket.x, rocket.y); rocket.destroy(); } }); } } createExplosion(x, y) { const explosion = this.add.sprite(x, y, 'explosion'); explosion.setScale(0.15); // Reduced by 50% from 0.3 explosion.setDepth(1001); this.tweens.add({ targets: explosion, alpha: 0, scale: 0.25, // Reduced by 50% from 0.5 duration: 300, onComplete: () => explosion.destroy() }); } // Remove duplicate shootSingleLaser method shootTripleLaser() { const cybertruckRightEdge = this.player.x + ((this.player.width * this.player.scaleX) / 2); const laserWidth = this.sys.game.config.width - cybertruckRightEdge; const startHeight = this.player.height * this.player.scaleY * 0.3; // Start with 30% of vehicle height const endHeight = this.player.height * this.player.scaleY * 1.5; // End with 150% of vehicle height const laserContainer = this.add.container(0, 0); // Create multiple segments for gradient effect const segments = 8; for (let i = 0; i < segments; i++) { const segmentWidth = laserWidth / segments; const progress = i / (segments - 1); const currentHeight = startHeight + (endHeight - startHeight) * progress; // Main laser segment const laser = this.add.rectangle( cybertruckRightEdge + (segmentWidth * (i + 0.5)), this.player.y, segmentWidth, currentHeight, 0x0066ff ).setAlpha(0.6); // Glow effect for segment const glow = this.add.rectangle( cybertruckRightEdge + (segmentWidth * (i + 0.5)), this.player.y, segmentWidth, currentHeight * 1.2, 0x0066ff, 0.3 ); laserContainer.add([glow, laser]); if (i === 0) { // Add to bullets group for collision detection (using first segment) this.bullets.add(laser); this.physics.add.existing(laser); laser.body.setSize(laserWidth, endHeight); // Use full width for collision laser.body.enable = true; } } // Update laser position with player const updateLaser = () => { const rightEdge = this.player.x + ((this.player.width * this.player.scaleX) / 2); const newWidth = this.sys.game.config.width - rightEdge; const segmentWidth = newWidth / segments; laserContainer.each((child, i) => { if (i % 2 === 0) { // Handle both glow and laser const segmentIndex = Math.floor(i / 2); const progress = segmentIndex / (segments - 1); const currentHeight = startHeight + (endHeight - startHeight) * progress; // Update laser segment child.width = segmentWidth; child.height = currentHeight; child.x = rightEdge + (segmentWidth * (segmentIndex + 0.5)); child.y = this.player.y; // Update glow segment const glow = laserContainer.list[i + 1]; glow.width = segmentWidth; glow.height = currentHeight * 1.2; glow.x = child.x; glow.y = child.y; } }); }; const updateEvent = this.events.addListener('update', updateLaser); this.time.delayedCall(125, () => { this.events.removeListener('update', updateEvent); laserContainer.each(child => { if (child) { child.destroy(); } }); laserContainer.destroy(); }); } spawnEnemy() { const roadHeight = this.sys.game.config.height * 0.7; const roadY = this.sys.game.config.height - roadHeight; const randomY = Phaser.Math.Between(roadY + 50, this.sys.game.config.height - 50); // Determine zombie type based on score and random chance let zombieType = 'zombie'; let scale = 0.036; // Reduced by 10% from 0.04 if (this.score >= 500) { // When score is 500 or more, introduce zombie3 const roll = Math.random(); // Check if there's already a zombie3 on screen const hasZombie3 = this.enemies.getChildren().some(enemy => enemy.zombieType === 'zombie3'); if (roll < 0.03 && !hasZombie3) { // Only spawn zombie3 if none exists zombieType = 'zombie3'; scale = 0.108; } else if (roll < 0.15) { // 12% chance for zombie2 zombieType = 'zombie2'; } } else if (Math.random() < 0.2) { // Original 20% chance for zombie2 zombieType = 'zombie2'; } const zombie = this.add.container(this.sys.game.config.width + 50, randomY); const body = this.add.sprite(0, 0, zombieType); body.setScale(scale); body.setAlpha(1); // Ensure full opacity zombie.add(body); zombie.setDepth(1000); zombie.zombieType = zombieType; // Initialize hit points for zombie3 if (zombieType === 'zombie3') { zombie.hitPoints = 18; // Tripled from 6 to 18 hits needed zombie.maxHitPoints = 18; // Track max hit points for potential visual feedback } // Add additional properties for zombie2 if (zombieType === 'zombie2') { zombie.isProjectileZombie = true; zombie.projectileThrown = false; zombie.spriteBody = body; } // Add wobbling motion this.tweens.add({ targets: zombie, y: randomY + 20, duration: 400, yoyo: true, repeat: -1 }); // Add rotation wobble this.tweens.add({ targets: body, angle: 15, duration: 300, yoyo: true, repeat: -1 }); this.enemies.add(zombie); this.physics.add.existing(zombie); zombie.body.setSize(25, 40); } throwProjectile(enemy) { // Only throw if the enemy is in front of the player (to the right) if (enemy.projectileThrown || enemy.x <= this.player.x) return; enemy.projectileThrown = true; enemy.spriteBody.setTexture('zombie2e'); const projectile = this.projectiles.create(enemy.x, enemy.y, 'molotov'); projectile.setScale(0.1); projectile.setDepth(1000); // Ensure projectiles are rendered above everything // Calculate angle to player const angle = Phaser.Math.Angle.Between(enemy.x, enemy.y, this.player.x, this.player.y); // Set projectile velocity const speed = 200; this.physics.moveTo(projectile, this.player.x, this.player.y, speed); // Add rotation animation this.tweens.add({ targets: projectile, angle: 360, duration: 1500, repeat: -1 }); // Destroy projectile after 2 seconds this.time.delayedCall(2000, () => { if (projectile.active) { projectile.destroy(); } }); // Reset zombie2 after cooldown this.time.delayedCall(3000, () => { if (enemy.active) { enemy.projectileThrown = false; enemy.spriteBody.setTexture('zombie2'); } }); } hitEnemy(bullet, target) { // Comprehensive null checks if (!bullet || !target) return; // Check if this is the first enemy kill and remove title if it exists if (!this.firstKill && this.titleText) { this.firstKill = true; this.titleText.destroy(); this.titleText = null; } if (!bullet.active || !target.active) return; if (!bullet.body || !target.body) { // Try to add physics body if missing if (!bullet.body) this.physics.add.existing(bullet); if (!target.body) this.physics.add.existing(target); // If still no body, return if (!bullet.body || !target.body) return; } // Ensure bodies are enabled bullet.body.enable = true; target.body.enable = true; // Create explosion if it's a rocket if (bullet.isRocket) { this.createExplosion(bullet.x, bullet.y); bullet.destroy(); } // Check if the target is a health item if (this.healthItems.contains(target)) { target.destroy(); // Create small explosion effect const explosion = this.add.sprite(target.x, target.y, 'explosion').setScale(0.1); explosion.setDepth(1001); this.tweens.add({ targets: explosion, alpha: 0, scale: 0.2, duration: 200, onComplete: () => explosion.destroy() }); return; } // Create explosion effect at the exact collision point const explosion = this.add.sprite(target.x, target.y, 'explosion').setScale(0.1); explosion.setDepth(1001); // Ensure explosion appears above everything this.tweens.add({ targets: explosion, alpha: 0, scale: 0.2, duration: 200, onComplete: () => explosion.destroy() }); // Don't destroy the laser if it hits anything if (!bullet.width) { // If it's not a laser (bullet.width would be undefined for normal bullets) bullet.destroy(); } // Check if the target is a projectile if (this.projectiles.contains(target)) { target.destroy(); } else { // Target is an enemy if (target.zombieType === 'zombie3') { target.hitPoints--; if (target.hitPoints <= 0) { target.destroy(); this.updateScore(180); } else { // Set semi-transparent state for damaged zombie3 target.list[0].setAlpha(0.6); } } else { target.destroy(); this.updateScore(10); } } } spawnHealthItem() { const roadHeight = this.sys.game.config.height * 0.7; const roadY = this.sys.game.config.height - roadHeight; const randomY = Phaser.Math.Between(roadY + 100, this.sys.game.config.height - 100); const healthItem = this.healthItems.create(this.sys.game.config.width + 50, randomY, 'health'); healthItem.setScale(0.08); healthItem.setDepth(2); // Add floating animation this.tweens.add({ targets: healthItem, y: randomY + 20, duration: 1000, yoyo: true, repeat: -1 }); // Move health item healthItem.setVelocityX(-150); // Destroy if it goes off screen this.time.delayedCall(10000, () => { if (healthItem.active) { healthItem.destroy(); } }); } collectHealth(player, healthItem) { healthItem.destroy(); // Recover 50% of max health const healAmount = 50; this.playerHealth = Math.min(100, this.playerHealth + healAmount); // Update health bar this.healthBar.width = (this.playerHealth / 100) * 160; // Update health bar color based on new health value if (this.playerHealth > 50) { this.healthBar.setFillStyle(0x00ff00); } else if (this.playerHealth > 20) { this.healthBar.setFillStyle(0xff9900); } // Visual feedback for health pickup this.cameras.main.flash(100, 0, 255, 0, 0.5); } gameOverHandler(player, enemy) { // Check if player has dozer power-up active if (this.hasDozerPowerUp) { // Destroy the enemy without taking damage if (enemy && enemy.active) { enemy.destroy(); this.updateScore(10); } return; } // Regular damage handling this.playerHealth -= 10; // Update health bar width based on health percentage this.healthBar.width = (this.playerHealth / 100) * 160; // 160 is the new total health bar width (20% smaller) // Change health bar color based on health level if (this.playerHealth <= 20) { this.healthBar.setFillStyle(0xff0000); // Red when health is critical (below 20%) } else if (this.playerHealth <= 50) { this.healthBar.setFillStyle(0xff9900); // Orange when health is low (below 50%) } else { this.healthBar.setFillStyle(0x00ff00); // Green for healthy state (above 50%) } // Create hit effect this.cameras.main.flash(100, 255, 0, 0, 0.5); // Destroy the enemy that hit the player only if it exists if (enemy && enemy.active) { enemy.destroy(); } // Check if player has died if (this.playerHealth <= 0) { this.gameOver = true; this.physics.pause(); // Save score to JsonBin this.saveScore(this.score); // Stop the music if (this.backgroundMusic) { this.backgroundMusic.stop(); } // Game Over Text this.add.text( this.sys.game.config.width / 2, 200, 'GAME OVER', { fontSize: '32px', fill: '#fff', stroke: '#000', strokeThickness: 4, align: 'center' } ).setOrigin(0.5).setDepth(10000); // Play Again Button - moved to top const playAgainButton = this.add.text( this.sys.game.config.width / 2, 50, 'PLAY AGAIN', { fontSize: '28px', fill: '#fff', backgroundColor: '#000', stroke: '#fff', strokeThickness: 2, padding: { left: 20, right: 20, top: 10, bottom: 10 } } ) .setOrigin(0.5) .setInteractive({ useHandCursor: true }) .on('pointerover', () => playAgainButton.setStyle({ fill: '#ff0' })) .on('pointerout', () => playAgainButton.setStyle({ fill: '#fff' })) .on('pointerdown', () => window.location.reload()) .setDepth(10000); return; } // Add invulnerability frames with visual feedback only player.alpha = 0.5; this.isInvulnerable = true; // Reset player visibility and invulnerability after short period this.time.delayedCall(1000, () => { player.alpha = 1; this.isInvulnerable = false; }); } spawnHazard() { const roadHeight = this.sys.game.config.height * 0.7; const roadY = this.sys.game.config.height - roadHeight; // Random Y position on the road, but keeping some margin from edges const randomY = Phaser.Math.Between(roadY + 100, this.sys.game.config.height - 100); const hazard = this.roadHazards.create(this.sys.game.config.width + 50, randomY, 'broken'); hazard.setScale(0.08); // Adjust scale as needed hazard.setDepth(2); // Above road but below player // Add physics body hazard.body.setSize(hazard.width * 0.8, hazard.height * 0.8); // Slightly smaller hitbox than visual } hitHazard(player, hazard) { if (this.isInvulnerable) return; // Don't take damage if invulnerable // Reduce health by 20 this.playerHealth = Math.max(0, this.playerHealth - 20); // Update health bar this.healthBar.width = (this.playerHealth / 100) * 160; // Update health bar color if (this.playerHealth <= 20) { this.healthBar.setFillStyle(0xff0000); } else if (this.playerHealth <= 50) { this.healthBar.setFillStyle(0xff9900); } // Create hit effect this.cameras.main.flash(100, 255, 0, 0, 0.5); // Destroy the hazard hazard.destroy(); // Check if player has died if (this.playerHealth <= 0) { this.gameOver = true; this.physics.pause(); // Game Over Text this.add.text( this.sys.game.config.width / 2, 200, 'GAME OVER', { fontSize: '32px', fill: '#fff', stroke: '#000', strokeThickness: 4, align: 'center' } ).setOrigin(0.5); // Play Again Button const playAgainButton = this.add.text( this.sys.game.config.width / 2, 50, 'PLAY AGAIN', { fontSize: '28px', fill: '#fff', backgroundColor: '#000', stroke: '#fff', strokeThickness: 2, padding: { left: 20, right: 20, top: 10, bottom: 10 } } ) .setOrigin(0.5) .setInteractive({ useHandCursor: true }) .on('pointerover', () => playAgainButton.setStyle({ fill: '#ff0' })) .on('pointerout', () => playAgainButton.setStyle({ fill: '#fff' })) .on('pointerdown', () => window.location.reload()); return; } // Add invulnerability frames player.alpha = 0.5; this.isInvulnerable = true; // Reset player visibility and invulnerability after 1 second this.time.delayedCall(1000, () => { player.alpha = 1; this.isInvulnerable = false; }); } hitProjectile(player, projectile) { if (!this.isInvulnerable && !this.hasDozerPowerUp) { projectile.destroy(); this.gameOverHandler(player, null); } } destroyProjectile(bullet, projectile) { if (bullet.active && projectile.active) { this.createExplosion(projectile.x, projectile.y); projectile.destroy(); if (bullet.isRocket) { bullet.destroy(); } } } hitExplosion(player, explosion) { if (!this.isInvulnerable && !this.hasDozerPowerUp) { this.gameOverHandler(player, null); } } spawnCloud(type, xPosition = this.sys.game.config.width + 100) { const roadY = this.sys.game.config.height - (this.sys.game.config.height * 0.7); const skyHeight = roadY; let cloud; if (type === 1) { cloud = this.add.sprite( xPosition, skyHeight * 0.4, // Position at 40% of sky height from top 'cloud1' ); cloud.setScale(0.3); cloud.setDepth(1); // Set depth for cloud1 this.clouds1.add(cloud); } else { cloud = this.add.sprite( xPosition, skyHeight * 0.2, // Position at 20% of sky height from top 'cloud2' ); cloud.setScale(0.25); cloud.setDepth(1); // Set depth for cloud2 this.clouds2.add(cloud); } } startDeathBeams() { // Create a timer event that spawns death beams every 200ms this.deathBeamEvent = this.time.addEvent({ delay: 200, callback: () => { // Get all active enemies const enemies = this.enemies.getChildren(); if (enemies.length > 0) { // Randomly select an enemy const target = Phaser.Utils.Array.GetRandom(enemies); // Create the death beam const beam = this.add.rectangle( target.x, 0, 8, this.sys.game.config.height, 0xff6600 ).setOrigin(0.5, 0); // Add glow effect const glow = this.add.rectangle( target.x, 0, 16, this.sys.game.config.height, 0xff6600, 0.3 ).setOrigin(0.5, 0); // Destroy the targeted enemy this.createExplosion(target.x, target.y); target.destroy(); this.updateScore(10); // Fade out and destroy the beam this.tweens.add({ targets: [beam, glow], alpha: 0, duration: 200, onComplete: () => { beam.destroy(); glow.destroy(); } }); } }, loop: true }); } async loadScores() { try { const response = await fetch(`${this.jsonbinUrl}${this.binId}/latest`, { method: 'GET', headers: { 'X-Master-Key': this.jsonbinKey } }); if (!response.ok) throw new Error('Failed to load scores'); const data = await response.json(); this.globalScores = data.record.scores || []; // Sort scores in descending order this.globalScores.sort((a, b) => b.score - a.score); // Keep only top 10 scores this.globalScores = this.globalScores.slice(0, 10); return this.globalScores; } catch (error) { console.error('Error loading scores:', error); return []; } } async saveScore(score) { try { // Load existing scores first await this.loadScores(); // Check if score qualifies for top 10 const isTopTen = this.globalScores.length < 10 || score > this.globalScores[this.globalScores.length - 1].score; if (isTopTen) { // Create name entry UI const bgBox = this.add.rectangle( this.sys.game.config.width / 2, this.sys.game.config.height / 2, 400, 160, 0x000000, 0.8 ).setOrigin(0.5).setDepth(9999); const border = this.add.rectangle( this.sys.game.config.width / 2, this.sys.game.config.height / 2, 400, 160, 0xffffff, 0 ).setOrigin(0.5).setDepth(9999).setStrokeStyle(2, 0xffffff); const namePrompt = this.add.text( this.sys.game.config.width / 2, this.sys.game.config.height / 2 - 30, 'NEW HIGH SCORE!\nEnter your initials:', { fontSize: '24px', fill: '#fff', stroke: '#000', strokeThickness: 4, align: 'center' } ).setOrigin(0.5).setDepth(10000); // Create three letter containers const letters = ['A', 'A', 'A']; let currentLetterIndex = 0; const letterSpacing = 40; const letterTexts = []; // Create letter text objects for (let i = 0; i < 3; i++) { const letterText = this.add.text( this.sys.game.config.width / 2 + (i - 1) * letterSpacing, this.sys.game.config.height / 2 + 20, letters[i], { fontSize: '48px', fill: i === 0 ? '#ff0' : '#fff', stroke: '#000', strokeThickness: 4, align: 'center' } ).setOrigin(0.5).setDepth(10000); letterTexts.push(letterText); } // Create SAVE button const saveButton = this.add.text( this.sys.game.config.width / 2, this.sys.game.config.height / 2 + 70, 'SAVE', { fontSize: '24px', fill: '#fff', backgroundColor: '#000', stroke: '#fff', strokeThickness: 2, padding: { left: 20, right: 20, top: 10, bottom: 10 } } ).setOrigin(0.5).setDepth(10000) .setInteractive({ useHandCursor: true }) .on('pointerover', () => saveButton.setStyle({ fill: '#ff0' })) .on('pointerout', () => saveButton.setStyle({ fill: '#fff' })) .on('pointerdown', () => { const playerName = letters.join(''); this.finalizeScore(score, playerName); // Clean up letterTexts.forEach(text => text.destroy()); namePrompt.destroy(); saveButton.destroy(); bgBox.destroy(); border.destroy(); }); // Add keyboard controls const keyHandler = (event) => { switch (event.keyCode) { case Phaser.Input.Keyboard.KeyCodes.LEFT: if (currentLetterIndex > 0) { letterTexts[currentLetterIndex].setFill('#fff'); currentLetterIndex--; letterTexts[currentLetterIndex].setFill('#ff0'); } break; case Phaser.Input.Keyboard.KeyCodes.RIGHT: if (currentLetterIndex < 2) { letterTexts[currentLetterIndex].setFill('#fff'); currentLetterIndex++; letterTexts[currentLetterIndex].setFill('#ff0'); } break; case Phaser.Input.Keyboard.KeyCodes.UP: letters[currentLetterIndex] = String.fromCharCode( (letters[currentLetterIndex].charCodeAt(0) - 65 + 1) % 26 + 65 ); letterTexts[currentLetterIndex].setText(letters[currentLetterIndex]); break; case Phaser.Input.Keyboard.KeyCodes.DOWN: letters[currentLetterIndex] = String.fromCharCode( (letters[currentLetterIndex].charCodeAt(0) - 65 + 25) % 26 + 65 ); letterTexts[currentLetterIndex].setText(letters[currentLetterIndex]); break; case Phaser.Input.Keyboard.KeyCodes.ENTER: const playerName = letters.join(''); this.finalizeScore(score, playerName); // Clean up letterTexts.forEach(text => text.destroy()); namePrompt.destroy(); saveButton.destroy(); bgBox.destroy(); border.destroy(); break; } }; // Add the key handler const keyboardListener = this.input.keyboard.on('keydown', keyHandler); // Clean up function for all event listeners and UI elements const cleanup = () => { this.input.keyboard.removeListener('keydown', keyHandler); letterTexts.forEach(text => text.destroy()); namePrompt.destroy(); saveButton.destroy(); bgBox.destroy(); border.destroy(); }; // Update save button to use cleanup function saveButton.off('pointerdown').on('pointerdown', () => { const playerName = letters.join(''); cleanup(); this.finalizeScore(score, playerName); }); } else { // Just display the scoreboard this.displayScoreboard(); } } catch (error) { console.error('Error saving score:', error); this.displayScoreboard(); // Fallback to showing scoreboard } } async finalizeScore(score, playerName) { // Add new score with player name this.globalScores.push({ name: playerName, score: score }); // Sort and keep top 10 this.globalScores.sort((a, b) => b.score - a.score); this.globalScores = this.globalScores.slice(0, 10); // Save to JsonBin try { const response = await fetch(`${this.jsonbinUrl}${this.binId}`, { method: 'PUT', headers: { 'Content-Type': 'application/json', 'X-Master-Key': this.jsonbinKey }, body: JSON.stringify({ scores: this.globalScores }) }); if (!response.ok) throw new Error('Failed to save score'); this.displayScoreboard(); } catch (error) { console.error('Error finalizing score:', error); this.displayScoreboard(); // Fallback to showing scoreboard } } displayScoreboard() { let scoresText = ''; this.globalScores.forEach((entry, index) => { scoresText += `${index + 1}. ${entry.name.padEnd(3, ' ')} ${entry.score}\n`; }); this.add.text( this.sys.game.config.width / 2, this.sys.game.config.height / 2 + 100, scoresText, { fontSize: '18px', fill: '#fff', stroke: '#000', strokeThickness: 4, align: 'center', fixedWidth: 400 } ).setOrigin(0.5).setDepth(10000); } createMobileControls() { // D-pad configuration const dpadSize = 180; const buttonSize = 60; const margin = 20; const alpha = 0.7; // Position d-pad on the right side const dpadX = this.sys.game.config.width - dpadSize - margin; const dpadY = this.sys.game.config.height - dpadSize - margin; const centerX = dpadX + dpadSize / 2; const centerY = dpadY + dpadSize / 2; // Create main d-pad background const dpadBg = this.add.image(centerX, centerY, 'explosion') .setScale(0.25) .setAlpha(0.2) .setTint(0x000000) .setDepth(2000) .setScrollFactor(0); // Create center button const centerButton = this.add.rectangle(centerX, centerY, buttonSize, buttonSize, 0x333333, alpha) .setDepth(2001) .setScrollFactor(0); // Create directional buttons const createDirectionalButton = (x, y, direction) => { const button = this.add.rectangle(x, y, buttonSize, buttonSize, 0x666666, alpha) .setInteractive() .setDepth(2001) .setScrollFactor(0); // Add directional arrow const arrowGraphics = this.add.graphics() .setDepth(2002) .setScrollFactor(0); arrowGraphics.lineStyle(3, 0xffffff, alpha); arrowGraphics.beginPath(); // Draw arrow based on direction const arrowSize = buttonSize * 0.4; if (direction === 'up') { arrowGraphics.moveTo(x, y + arrowSize / 2); arrowGraphics.lineTo(x, y - arrowSize / 2); arrowGraphics.lineTo(x - arrowSize / 3, y - arrowSize / 4); arrowGraphics.moveTo(x, y - arrowSize / 2); arrowGraphics.lineTo(x + arrowSize / 3, y - arrowSize / 4); } else if (direction === 'down') { arrowGraphics.moveTo(x, y - arrowSize / 2); arrowGraphics.lineTo(x, y + arrowSize / 2); arrowGraphics.lineTo(x - arrowSize / 3, y + arrowSize / 4); arrowGraphics.moveTo(x, y + arrowSize / 2); arrowGraphics.lineTo(x + arrowSize / 3, y + arrowSize / 4); } else if (direction === 'left') { arrowGraphics.moveTo(x + arrowSize / 2, y); arrowGraphics.lineTo(x - arrowSize / 2, y); arrowGraphics.lineTo(x - arrowSize / 4, y - arrowSize / 3); arrowGraphics.moveTo(x - arrowSize / 2, y); arrowGraphics.lineTo(x - arrowSize / 4, y + arrowSize / 3); } else if (direction === 'right') { arrowGraphics.moveTo(x - arrowSize / 2, y); arrowGraphics.lineTo(x + arrowSize / 2, y); arrowGraphics.lineTo(x + arrowSize / 4, y - arrowSize / 3); arrowGraphics.moveTo(x + arrowSize / 2, y); arrowGraphics.lineTo(x + arrowSize / 4, y + arrowSize / 3); } arrowGraphics.strokePath(); // Add touch event handlers button.on('pointerdown', () => { this.mobileControls[direction] = true; button.setFillStyle(0x888888); }); button.on('pointerup', () => { this.mobileControls[direction] = false; button.setFillStyle(0x666666); }); button.on('pointerout', () => { this.mobileControls[direction] = false; button.setFillStyle(0x666666); }); return button; }; // Create directional buttons const upButton = createDirectionalButton(centerX, centerY - buttonSize, 'up'); const rightButton = createDirectionalButton(centerX + buttonSize, centerY, 'right'); const downButton = createDirectionalButton(centerX, centerY + buttonSize, 'down'); const leftButton = createDirectionalButton(centerX - buttonSize, centerY, 'left'); // Make power-up meters clickable this.chargeBar.setInteractive() .on('pointerdown', () => { if (this.powerUpCharge >= this.powerUpChargeTime) { this.hasPowerUp = true; this.chargeBar.width = 200; this.powerUpCharge = 0; this.time.delayedCall(10000, () => { this.hasPowerUp = false; }); } }); this.dozerBar.setInteractive() .on('pointerdown', () => { if (this.dozerCharge >= this.dozerChargeTime) { this.activateDozerPowerUp(); } }); this.deathLinkBar.setInteractive() .on('pointerdown', () => { if (this.deathLinkCharge >= this.deathLinkChargeTime) { this.activateDeathLinkPowerUp(); } }); this.particleSprayBar.setInteractive() .on('pointerdown', () => { if (this.particleSprayCharge >= this.particleSprayChargeTime) { this.activateParticleSprayPowerUp(); } }); } activateDozerPowerUp() { this.hasDozerPowerUp = true; this.dozerBar.width = 200; this.dozerCharge = 0; this.isInvulnerable = true; this.dozerBull = this.add.sprite(this.player.x + 50, this.player.y, 'bull'); this.dozerBull.setScale(0.3); this.dozerBull.setDepth(2); this.player.setTint(0xffff00); this.dozerBlinkEffect = this.time.addEvent({ delay: 100, callback: () => { this.player.alpha = this.player.alpha === 1 ? 0.3 : 1; }, loop: true }); this.time.delayedCall(7000, () => { this.hasDozerPowerUp = false; this.isInvulnerable = false; this.player.clearTint(); this.player.alpha = 1; if (this.dozerBlinkEffect) { this.dozerBlinkEffect.destroy(); } if (this.dozerBull) { this.dozerBull.destroy(); this.dozerBull = null; } }); } activateDeathLinkPowerUp() { this.hasDeathLinkPowerUp = true; this.deathLinkBar.width = 200; this.deathLinkCharge = 0; this.startDeathBeams(); this.time.delayedCall(6000, () => { this.hasDeathLinkPowerUp = false; if (this.deathBeamEvent) { this.deathBeamEvent.remove(); } }); } activateParticleSprayPowerUp() { this.hasParticleSprayPowerUp = true; this.particleSprayBar.width = 200; this.particleSprayCharge = 0; this.particleGroup = this.physics.add.group(); const upEmitter = this.createParticleEmitter(60, 120); const downEmitter = this.createParticleEmitter(240, 300); this.physics.add.overlap(this.particleGroup, this.enemies, this.handleParticleEnemyCollision, null, this); upEmitter.startFollow(this.player); downEmitter.startFollow(this.player); this.time.delayedCall(8000, () => { this.hasParticleSprayPowerUp = false; upEmitter.stop(); downEmitter.stop(); this.particleGroup.clear(true, true); this.time.delayedCall(1000, () => { upEmitter.manager.destroy(); downEmitter.manager.destroy(); }); }); } createParticleEmitter(minAngle, maxAngle) { return this.add.particles('explosion').createEmitter({ x: this.player.x, y: this.player.y, speed: { min: 300, max: 500 }, angle: { min: minAngle, max: maxAngle }, scale: { start: 0.1, end: 0 }, lifespan: 2000, blendMode: 'ADD', frequency: 50, emitCallback: this.handleParticleEmit.bind(this) }); } handleParticleEmit(particle) { const particleSprite = this.particleGroup.create(particle.x, particle.y, 'explosion'); particleSprite.setScale(0.1); particleSprite.setAlpha(0.6); particleSprite.body.setSize(40, 40); particleSprite.body.enable = true; const angle = Phaser.Math.DegToRad(Phaser.Math.Between(60, 120)); const speed = Phaser.Math.Between(300, 500); particleSprite.body.setVelocity( Math.cos(angle) * speed, Math.sin(angle) * speed ); this.time.delayedCall(2000, () => { if (particleSprite && particleSprite.active) { particleSprite.destroy(); } }); } handleParticleEnemyCollision(particle, enemy) { if (particle.active && enemy.active) { if (enemy.zombieType === 'zombie3') { enemy.hitPoints--; if (enemy.hitPoints <= 0) { this.createExplosion(enemy.x, enemy.y); enemy.destroy(); this.updateScore(180); } } else { this.createExplosion(enemy.x, enemy.y); enemy.destroy(); this.updateScore(10); } particle.destroy(); } } } const container = document.getElementById('renderDiv'); const config = { type: Phaser.AUTO, parent: container, scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 800, height: 600, physics: { default: 'arcade', arcade: { debug: false } }, scene: ContraVehicle }; window.phaserGame = new Phaser.Game(config);