diff --git a/src/scenes/StoryScene.js b/src/scenes/StoryScene.js index 1db71237c..93eff992a 100644 --- a/src/scenes/StoryScene.js +++ b/src/scenes/StoryScene.js @@ -106,33 +106,26 @@ class StoryScene extends Phaser.Scene { } createNoirFog(width, height) { - // Create fog texture with CANVAS gradient (proper way!) - const canvas = this.textures.createCanvas('fogTexture', 64, 64); - const ctx = canvas.context; - const gradient = ctx.createRadialGradient(32, 32, 0, 32, 32, 32); - gradient.addColorStop(0, 'rgba(255, 255, 255, 0.2)'); - gradient.addColorStop(1, 'rgba(255, 255, 255, 0)'); - ctx.fillStyle = gradient; - ctx.fillRect(0, 0, 64, 64); - canvas.refresh(); + // Simple white circle for fog (PHASER BUILT-IN - NO CANVAS ERRORS!) + const graphics = this.make.graphics({ x: 0, y: 0, add: false }); + graphics.fillStyle(0xffffff, 1); + graphics.fillCircle(32, 32, 32); + graphics.generateTexture('fogParticle', 64, 64); + graphics.destroy(); - // Fog particle emitter - SOFT, LARGE, SUBTLE - const fogEmitter = this.add.particles(0, 0, 'fogTexture', { + // Fog particle emitter - SIMPLE & WORKING + this.add.particles(0, 0, 'fogParticle', { x: { min: 0, max: width }, y: { min: 0, max: height }, - speedX: { min: -10, max: 10 }, - speedY: { min: -3, max: 3 }, - scale: { start: 2.0, end: 5.0 }, - alpha: { start: 0.1, end: 0 }, - lifespan: 6000, - speed: { min: 10, max: 30 }, - frequency: 200, + scale: { start: 2, end: 6 }, + alpha: { start: 0.05, end: 0 }, + lifespan: 8000, + speed: { min: 5, max: 20 }, + frequency: 300, blendMode: 'NORMAL' }); - fogEmitter.setDepth(2); - - // ENHANCED NOIR VIGNETTE (dark edges) + // NOIR VIGNETTE (dark edges) const vignette = this.add.rectangle(width / 2, height / 2, width, height, 0x000000, 0); vignette.setDepth(100);