diff --git a/src/components/Intermission.ts b/src/components/Intermission.ts index abbfb81..773d421 100644 --- a/src/components/Intermission.ts +++ b/src/components/Intermission.ts @@ -22,6 +22,7 @@ export class Intermission extends Phaser.GameObjects.Container { private rect: Phaser.GameObjects.Rectangle; private subtitles: Phaser.GameObjects.Text; + private queuedLines: string[]; private button: Button; @@ -73,15 +74,18 @@ export class Intermission extends Phaser.GameObjects.Container { this.subtitles.setStroke(ColorStr.White, 16); this.add(this.subtitles); + this.queuedLines = []; + /* Button */ this.button = new TextButton( scene, scene.W - 240, scene.H - 120, - 300, + 280, 120, - "OK" + ">", + 130 ); this.add(this.button); this.button.on("click", this.proceed, this); @@ -101,53 +105,90 @@ export class Intermission extends Phaser.GameObjects.Container { setMode(mode: Mode) { this.mode = mode; - // Show or hide elements - switch (mode) { - case Mode.IntroCutscene1: - case Mode.IntroCutscene2: - case Mode.IntroCutscene3: - case Mode.NextLevelCutscene: - this.cutscene.setVisible(true); - this.button.setVisible(true); - this.subtitles.setVisible(true); - break; - - default: - this.cutscene.setVisible(false); - this.button.setVisible(false); - this.subtitles.setVisible(false); - } - // Set content switch (mode) { case Mode.IntroCutscene1: this.cutscene.setTexture("cutscene_dummy1"); - this.subtitles.setText("Somewhere in Chocoland"); + this.queuedLines = [ + "Somewhere in Chocoland", + "What a nice day for a walk.", + "Nothing can go wrong...", + ]; break; case Mode.IntroCutscene2: this.cutscene.setTexture("cutscene_dummy2"); - this.subtitles.setText("If only my scales weren't so dirty..."); + this.queuedLines = [ + "Oh no!", + "Not the mud...!", + ]; break; case Mode.IntroCutscene3: this.cutscene.setTexture("cutscene_dummy3"); - this.subtitles.setText("Lets go to the Scale Salon™!"); + this.queuedLines = [ + "Are you OK?", + "My scales are all dirty.", + "Let's get you cleaned up.", + "(*gasp* A customer!)", + ]; break; case Mode.NextLevelCutscene: this.cutscene.setTexture("cutscene_dummy4"); - this.subtitles.setText("Wow! A new location!"); + this.queuedLines = ["Congratulations!", "Wow! A new location."]; break; case Mode.TheEnd: - this.subtitles.setText("The End"); + this.queuedLines = ["The End"]; + } + + // Show or hide elements + switch (mode) { + case Mode.IntroCutscene1: + case Mode.IntroCutscene2: + case Mode.IntroCutscene3: + case Mode.NextLevelCutscene: + // Fade in cutscene image + this.cutscene.setVisible(true); + this.cutscene.setAlpha(0); + this.scene.tweens.add({ + targets: this.cutscene, + alpha: { from: 0, to: 1 }, + duration: 500, + }); + + this.button.setVisible(false); + this.subtitles.setVisible(false); + this.scene.addEvent(1000, this.showNextLine, this); + break; + + default: + this.cutscene.setVisible(false); + this.button.setVisible(false); + this.subtitles.setVisible(false); + } + } + + showNextLine() { + let line = this.queuedLines.shift(); + if (line) { + this.subtitles.setText(line); + this.subtitles.setVisible(true); + this.button.setVisible(true); } } proceed() { this.scene.sound.play("scroll", { volume: 0.3 }); + if (this.queuedLines.length > 0) { + this.button.setVisible(false); + this.subtitles.setVisible(false); + this.scene.addEvent(500, this.showNextLine, this); + return; + } + switch (this.mode) { case Mode.IntroCutscene1: this.setMode(Mode.IntroCutscene2); @@ -158,7 +199,7 @@ export class Intermission extends Phaser.GameObjects.Container { break; case Mode.IntroCutscene3: - this.emit("close"); + this.emit("startDay"); break; case Mode.NextLevelCutscene: diff --git a/src/components/TextButton.ts b/src/components/TextButton.ts index 98cab30..9be4279 100644 --- a/src/components/TextButton.ts +++ b/src/components/TextButton.ts @@ -10,7 +10,7 @@ export class TextButton extends Button { private background: RoundRectangle; private text: Phaser.GameObjects.Text; - constructor(scene: GameScene, x: number, y: number, width: number, height: number, text: string) { + constructor(scene: GameScene, x: number, y: number, width: number, height: number, text: string, textSize: number = 48) { super(scene, x, y); scene.add.existing(this); this.scene = scene; @@ -32,7 +32,7 @@ export class TextButton extends Button { this.add(this.background); this.text = this.scene.addText({ - size: 48, + size: textSize, color: "#FFFFFF", text, }); diff --git a/src/components/UI.ts b/src/components/UI.ts index f0f036c..a7894ff 100644 --- a/src/components/UI.ts +++ b/src/components/UI.ts @@ -101,12 +101,14 @@ export class UI extends Phaser.GameObjects.Container { this.nextButton = new TextButton(scene, 0, 600, 300, 90, "Start day"); this.panel.add(this.nextButton); this.nextButton.on("click", () => { + this.scene.sound.play("scroll", { volume: 0.3 }); this.emit("nextDay"); }); this.newLocationButton = new TextButton(scene, 0, 400, 300, 200, "..."); this.panel.add(this.newLocationButton); this.newLocationButton.on("click", () => { + this.scene.sound.play("score", { volume: 1.0 }); this.emit("nextLevel"); }); } diff --git a/src/scenes/GameScene.ts b/src/scenes/GameScene.ts index 30bc038..ef30bf7 100644 --- a/src/scenes/GameScene.ts +++ b/src/scenes/GameScene.ts @@ -180,8 +180,9 @@ export class GameScene extends BaseScene { this.intermission = new Intermission(this); this.intermission.setDepth(10000); - this.intermission.on("close", () => { + this.intermission.on("startDay", () => { this.intermission.fadeToGame(); + this.startDay(); }); this.intermission.on("nextLevel", () => { const nextLevel = {