@basementuniverse/scene-manager
TypeScript icon, indicating that this package has built-in type declarations

1.0.2 • Public • Published

Game Component: Scene Manager

A component for managing a stack of scenes in a game.

How to use

Initialise the scene manager before use:

import SceneManager from '@basementuniverse/scene-manager';

SceneManager.initialise();

Update and draw the scene manager:

class Game {
  // ...

  public update(dt: number) {
    SceneManager.update(dt);
  }

  public draw(context: CanvasRenderingContext2D) {
    SceneManager.draw(context);
  }
}

Create and start a scene:

SceneManager.push(new MyScene());

End/remove a scene:

const scene = SceneManager.pop();

Clear scenes:

SceneManager.clear();

Only the top-most scene will be updated.

Scenes will be drawn bottom-to-top, but with some scenes culled depending on transparency.

Implementing a scene

Define a class that inherits from Scene:

import SceneManager, { Scene } from '@basementuniverse/scene-manager';

export class MyScene extends Scene {
  public constructor() {
    super({ transitionTime: 2.5 });
  }

  public initialise() {
    // Called when the scene is pushed onto the SceneManager
  }

  public update(dt: number) {
    // Called on every SceneManager.update() while this is the top-most scene

    console.log(this.transitionAmount); // between 0...1

    // Start another scene when a key is pressed
    if (InputManager.keyPressed('Enter')) {
      SceneManager.push(new MyOtherScene());
    }

    // Finish this scene when a key is pressed
    if (InputManager.keyPressed('Escape')) {
      SceneManager.pop();
    }
  }

  public draw(context: CanvasRenderingContext2D) {
    // Called on every SceneManager.draw() while this scene is visible
    // (depends on scenes above this one in the stack)
  }
}

Scene options

const options = { ... };
const myScene = new Scene(options);
Option Type Default Description
transitionTime number 2 The number of seconds it takes to transition in/out
transparent boolean true If true, this scene will show other scenes below it in the stack

Other components

Readme

Keywords

none

Package Sidebar

Install

npm i @basementuniverse/scene-manager

Weekly Downloads

0

Version

1.0.2

License

MIT

Unpacked Size

37.1 kB

Total Files

5

Last publish

Collaborators

  • basementuniverse