Add animated logo to IntroScene with fullscreen activation on start

js/scenes/IntroScene.js

@@ -6,6 +6,7 @@ export class IntroScene extends Phaser.Scene {
   preload() {
     this.load.video('menu-bg', './assets/video/menu.mp4');
     this.load.audio('music-menu', './assets/music/menuBackground.mp3');
+    this.load.image('logo', './assets/images/logo.png');
   }
 
   create() {
@@ -20,20 +21,28 @@ export class IntroScene extends Phaser.Scene {
     // Dark overlay so text stays readable
     this.add.rectangle(W / 2, H / 2, W, H, 0x000000, 0.45).setDepth(1);
 
-    this.add.text(W / 2, H / 2 - 100, 'OVERRUN', {
+    const logo = this.add.image(W / 2 + 200, H / 5 + 25, 'logo').setOrigin(0.5).setScale(0.6).setAlpha(0).setDepth(2);
-      fontFamily: 'FutureImperfect',
-      fontSize: '72px',
-      fill: '#00ccff',
-      stroke: '#003366',
-      strokeThickness: 6,
-    }).setOrigin(0.5).setDepth(2);
 
-    this.add.text(W / 2, H / 2, 'Survive the waves. Choose your power.', {
+    // Fade in, then yoyo scale between 0.6 and 0.7
-      fontSize: '20px',
+    this.tweens.add({
-      fill: '#aaaaaa',
+      targets: logo,
-    }).setOrigin(0.5).setDepth(2);
+      alpha: 1,
+      duration: 1200,
+      ease: 'Sine.easeIn',
+      onComplete: () => {
+        this.tweens.add({
+          targets: logo,
+          scaleX: 0.65,
+          scaleY: 0.65,
+          duration: 1800,
+          yoyo: true,
+          repeat: -1,
+          ease: 'Sine.easeInOut',
+        });
+      },
+    });
 
-    const prompt = this.add.text(W / 2, H / 2 + 80, 'Press ENTER or click to start', {
+    const prompt = this.add.text(W / 2 + 190, H / 2 + 80, 'Press ENTER or click to start', {
       fontSize: '22px',
       fill: '#ffffff',
     }).setOrigin(0.5).setDepth(2);
@@ -48,7 +57,7 @@ export class IntroScene extends Phaser.Scene {
     });
 
     // Controls hint
-    this.add.text(W / 2, H - 60, 'WASD — Move     Mouse — Aim     Left Click — Fire', {
+    this.add.text(W / 2 + 190, H - 60, 'WASD — Move     Mouse — Aim     Left Click — Fire', {
       fontSize: '14px',
       fill: '#666666',
     }).setOrigin(0.5).setDepth(2);
@@ -56,11 +65,16 @@ export class IntroScene extends Phaser.Scene {
     this._menuMusic = this.sound.add('music-menu', { loop: true, volume: 1.0 });
     this._menuMusic.play();
 
+    // Attempt fullscreen immediately; browsers that require a user gesture will
+    // ignore this and the _start() fallback will catch it instead.
+    if (!this.scale.isFullscreen) this.scale.startFullscreen();
+
     this.input.keyboard.once('keydown-ENTER', () => this._start());
     this.input.once('pointerdown', () => this._start());
   }
 
   _start() {
+    if (!this.scale.isFullscreen) this.scale.startFullscreen();
     this._menuMusic.stop();
     this.scene.start('GameScene');
   }