Main Screen

Description

<main-screen></main-screen>

The main-screen is what players see when the game first loads — it hosts the Main Menu and acts as the backdrop behind it. It’s a screen component, so like every other screen it has an open state and is shown or hidden as the player moves in and out of the menu.

Structure

The main-screen renders the main menu inside it:

<main-screen data-component="main-screen">
    <main-menu></main-menu>
</main-screen>

You’ll rarely change the main-screen itself — to change the buttons it shows, customize the Main Menu; to change the look, style main-screen and its children with CSS (a full-screen background image is the most common change).

The main-screen owns the menu’s ambient music. When it opens it plays the track set in the MainScreenMusic setting, and it stops that track once the player starts the game.

monogatari.settings ({
    'MainScreenMusic': 'theme'
});

NOTE

MainScreenMusic is the id of a music asset, not a file name. Declare the track first — monogatari.assets ('music', { 'theme': 'theme.ogg' }) — then reference it here by its id.