Introduction
So you don’t miss it and have to reload the page, here’s the transition between the scenes first … and showing everything combined.
To achieve this, we just have to tell Phaser we’re using two scenes:
const config = {
type: Phaser.AUTO,
width: 1024,
height: 768,
scene: [SplashScreen, MainScene],
backgroundColor: '#CDC6CD',
physics: {
default: 'arcade',
arcade: {
debug: false
}
},
scale: {
mode: Phaser.Scale.FIT,
parent: 'gameContainer',
autoCenter: Phaser.Scale.CENTER_BOTH,
zoom: 0.5
}
};
const game = new Phaser.Game(config);And tell Phaser how we shift between the scenes. The game itself just uses a long pause, so we can do the same:
class SplashScreen extends BaseScene {
constructor() {
super('SplashScreen');
}
create() {
this.cameras.main.setBackgroundColor('#000000');
this.printAt(" BOOTY BY JOHN F CAIN ", 2, 4);
this.printAt("CATCH 20 GOLDFISH", 7, 12);
this.printAt("BUT DONT RUN OUT OF AIR", 4, 14);
this.printAt("OR GET TOO CLOSE TO THE BIG FISH", 0, 16);
this.time.delayedCall(3000, () => {
this.scene.start('MainScene');
});
}
}This is the equivalent z80 assembly code:
; Hidden Goldfish Game
@label=GoldfishGame
c$CE41 CALL $D4BE ; Call ClearScreen.
; Print the playing instructions.
$CE44 LD DE,$DD9A ; DE=Messaging_GoldfishGame.
$CE47 CALL $D60E ; Call PrintString.
; Pause to let the message sink in...
$CE4A LD BC,$012C ; BC=$012C (pause loops).
@label=GoldfishGame_PauseLoop
*$CE4D PUSH BC ; Stash the pause loop counter on the stack.
$CE4E CALL $D3A6 ; Call SmallPause.
$CE51 POP BC ; Restore the pause loop counter from the stack.
$CE52 DEC BC ; Decrease the pause loop counter by one.
$CE53 LD A,B ; {Jump to GoldfishGame_PauseLoop until the pause loop counter is zero.
$CE54 OR C ;
$CE55 JR NZ,$CE4D ; }The only other thing I’ve added, is the status bar text, which is easy now we have the “PRINT AT” method to call:
// Add the status text.
this.printAt("FISH ", 0, 22, "32px", "#000000");
this.printAt("AIR", 8, 22, "32px", "#000000");