diff --git a/assets/images/logo.png b/assets/images/logo.png new file mode 100644 index 0000000..35e93e3 Binary files /dev/null and b/assets/images/logo.png differ diff --git a/js/scenes/IntroScene.js b/js/scenes/IntroScene.js index 9d98c66..0f5ec9c 100644 --- a/js/scenes/IntroScene.js +++ b/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', { - fontFamily: 'FutureImperfect', - fontSize: '72px', - fill: '#00ccff', - stroke: '#003366', - strokeThickness: 6, - }).setOrigin(0.5).setDepth(2); + const logo = this.add.image(W / 2 + 200, H / 5 + 25, 'logo').setOrigin(0.5).setScale(0.6).setAlpha(0).setDepth(2); - this.add.text(W / 2, H / 2, 'Survive the waves. Choose your power.', { - fontSize: '20px', - fill: '#aaaaaa', - }).setOrigin(0.5).setDepth(2); + // Fade in, then yoyo scale between 0.6 and 0.7 + this.tweens.add({ + targets: logo, + 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'); }