Getting Started

To get started with the Spinorium engine, you need to initialize it. The engine provides two options to bootstrap a project, each with a different level of control:

• initialize the engine via System.initialize() manually. Gives you full control over scenes, states, and managers but requires you to provide every dependency.
• extend the PlayerController class. You override only a few configs and reuse a ready-made state machine. This is the preferable way and the fastest way to initialize the game.

System Initialization

With this option you manage the initialization process explicitly. First, initialize the engine by calling System.initialize() and pass the system config:

window.onload = () => {
    System.initialize({
        stateMachine: {
            initialTransitionsList: [
                [ LoadingState, SplashScreenState ],
                [ SplashScreenState, TutorialState ],
                [ TutorialState, MainScreenState ]
            ]
        },
        application: {
            backgroundColor: '#D4D4D4',
            applicationWrapper: '#wrapper',
            autoResizeToWrapper: true
        }
    });
};

The System.initialize() method accepts a partial configuration and merges it with the engine defaults. When you go with the manual option, you are also responsible for bringing the state machine to life. The example above bootstraps the renderer, sets up the state transitions, and starts the ticker. After that the engine does nothing until you move the state machine or scenes yourself.

Once the engine is initialized, you can write your own bootstrap sequence. For example, you can change the first state explicitly or switch to the loader scene with a few steps:

System.states.changeState(LoadingState);

System.scenes.changeScene(LoaderScene, {
    stepsQueue: [
        LoginStep,
        LoadResourcesStep,
        StartGameStep
    ]
});

Controller Initialization

With this option the game should start with PlayerController initialization. The controller wraps all boilerplate needed to wire Spinorium pieces together. Internally it performs the following steps when initialize() is called:

• creates parameters, settings, and the player model.
• sets up integration, round, and jurisdiction managers along with any custom managers you return.
• merges template overrides and system configuration overrides with the defaults.
• starts the engine and switches the state machine to LoadingState.

To plug into this flow, extend the class and override several required methods:

• createParameters() – Creates game parameters, which contain information about the player session used for backend authentication and game initialization (e.g. language, jurisdiction). Usually based on URL query parameters as data source.
• createSettings() – Creates game settings, which store player-specific preferences such as sound volume and turbo spin state. Usually based on local storage as data source.
• createTemplateConfig() – Customizes the template config, which includes game loading and initialization steps.
• createModel() – Creates a custom player model tailored to your backend and game type.
• createSystemConfig() – Customizes the engine config, including the initial configuration for all engine managers and systems, such as the renderer.

Similar to manual engine initialization, controller allows you to adapt the predefined state flow without rebuilding the whole bootstrap sequence.

export class GameController extends PlayerController {
    protected override createSystemConfig() {
        return ConfigUtil.overrideConfig(super.createSystemConfig(), {
            stateMachine: {
                initialTransitionsList: [
                    [ LoadingState, SplashScreenState ],
                    [ SplashScreenState, TutorialState ],
                    [ TutorialState, MainScreenState ]
                ]
            }
        });
    }
}

Once all required methods are overridden, call the initialize() method:

window.onload = () => {
    new GameController().initialize();
};

Depending on your configuration, the engine will automatically start the game, load all necessary resources, and initialize the game state machine. Once all resources are loaded and initialization steps pass, the player will either see the splash scene or the main scene.