Variable stateConst

Type Declaration

• CREDITS: 7

  default state ID for Credits Stage

• DEFAULT: 9

  default state ID for the default Stage (the default stage is the one running as soon as melonJS is started)

• GAME_END: 5

  default state ID for Game End Stage

• GAMEOVER: 4

  default state ID for Game Over Stage

• LOADING: 0

  default state ID for Loading Stage

• MENU: 1

  default state ID for Menu Stage

• PLAY: 3

  default state ID for Play Stage

• READY: 2

  default state ID for "Ready" Stage

• SCORE: 6

  default state ID for High Score Stage

• SETTINGS: 8

  default state ID for Settings Stage

• USER: 100

  default state ID for user defined constants
  

  Example

  const STATE_INFO = state.USER + 0;
  const STATE_WARN = state.USER + 1;
  const STATE_ERROR = state.USER + 2;
  const STATE_CUTSCENE = state.USER + 3;
  Copy

• change: function

  • change(stateId: number, forceChange?: boolean, ...extraArgs: unknown[]): void

    change the game/app state

    With a transition (see state.transition), the state changes once the transition covers the screen. A change asked for until then is made by that same transition rather than a second one: it switches to the last state asked for, with the last arguments given. A change to a state whose transition is off (see state.setTransition) does not wait for it, and the cover comes down as the state changes.

    Parameters

    • stateId: number

      State ID (see constants)

    • OptionalforceChange: boolean = false

      if true the state will be changed immediately (without waiting for the next frame); ignored when a transition makes the change

    • ...extraArgs: unknown[]

      extra arguments to be passed to the reset functions

    Returns void

    Example

    // The onResetEvent method on the play screen will receive two args:
    // "level_1" and the number 3
    state.change(state.PLAY, false, "level_1", 3);
    Copy

    Example

    // asked twice, by a key pressed twice on a menu: one transition, to PLAY
    state.transition("fade", "#000", 250);
    state.change(state.PLAY);
    state.change(state.PLAY);
    Copy

• current: function

  • current(): Stage | undefined

    return a reference to the current stage
    useful to call a object specific method

    Returns Stage | undefined

    the current Stage instance, or undefined if no stage is active

• freeze: function

  • freeze(duration: number, music?: boolean): Promise<void>

    Freeze the current stage for a fixed duration, then automatically resume. Useful for hit-stop / hit-pause effects on impact.

    Behaviour notes:

    • If freeze() is called again while a freeze is already active, the freeze is extended to whichever end-time is later (calls do not stack). The music flag from the initial call is preserved.
    • If the game was already paused when freeze() was called, the freeze timer will not unpause it on expiry — the game stays paused.
    • Calling state.resume() or state.stop() while a freeze is active cancels the timer and resolves the returned promise immediately.
    • The freeze is also cancelled when the window loses focus (BLUR) since the hit-stop's "moment" is short enough that the user has missed it by the time they return. The regular pauseOnBlur behaviour still keeps the game paused while away.
    • Negative, NaN, and Infinity durations silently no-op.

    Parameters

    • duration: number

      duration of the freeze in milliseconds

    • Optionalmusic: boolean = false

      also pause the current music track during the freeze

    Returns Promise<void>

    a Promise that resolves once the freeze ends (or is cancelled)

    Example

    // simple hit-stop on impact
    state.freeze(80);
    
    // chain VFX after the freeze
    await state.freeze(120);
    spawnImpactParticles();
    Copy

• get: function

  • get(stateId?: number): Stage | undefined

    returns the stage associated with the specified state (or the current one if none is specified)

    Parameters

    • OptionalstateId: number = _state

      State ID (see constants)

    Returns Stage | undefined

    the Stage instance associated with the given state ID, or undefined

• isCurrent: function

  • isCurrent(stateId: number): boolean

    return true if the specified state is the current one

    Parameters

    • stateId: number

      State ID (see constants)

    Returns boolean

    true if the specified state is the current one

• isPaused: function

  • isPaused(): boolean

    Return the pause state of the state manager

    Returns boolean

    true if the game is paused

• isRunning: function

  • isRunning(): boolean

    return the running state of the state manager

    Returns boolean

    true if a "process is running"

• pause: function

  • pause(music?: boolean): void

    pause the current stage

    Parameters

    • Optionalmusic: boolean = false

      pause current music track on screen pause

    Returns void

• restart: function

  • restart(music?: boolean): void

    Restart the current stage from a full stop.

    Parameters

    • Optionalmusic: boolean = false

      resume current music track on screen resume

    Returns void

• resume: function

  • resume(music?: boolean): void

    resume the current stage

    Parameters

    • Optionalmusic: boolean = false

      resume current music track on screen resume

    Returns void

• set: function

  • set(stateId: number, stage: Stage, start?: boolean): void

    associate the specified state with a Stage

    Parameters

    • stateId: number

      State ID (see constants)

    • stage: Stage

      Instantiated Stage to associate with state ID

    • Optionalstart: boolean = false

      if true the state will be changed immediately after adding it.

    Returns void

    Example

    class MenuScreen extends Stage {
        onResetEvent(app) {
            // Load background image
            app.world.addChild(
                new ImageLayer(0, 0, {
                    image : "bg",
                    z: 0 // z-index
                })
            );
    
            // Play music
            audio.playTrack("menu");
        }
    
        onDestroyEvent() {
            // Stop music
            audio.stopTrack();
        }
    }
    
    state.set(state.MENU, new MenuScreen());
    Copy

• setTransition: function

  • setTransition(stateId: number, enable: boolean): void

    enable/disable the transition to a particular state (by default enabled for all)

    Parameters

    • stateId: number

      State ID (see constants)

    • enable: boolean

      true to enable transition, false to disable

    Returns void

• stop: function

  • stop(shouldPauseTrack?: boolean): void

    Stop the current stage.

    Parameters

    • OptionalshouldPauseTrack: boolean = false

      pause current track on screen stop.

    Returns void

• transition: function

  • transition(
        effect: "fade" | "mask" | "pixelate",
        color: string,
        duration?: number,
        shape?: number | Polygon | Ellipse,
    ): void

    specify a global transition effect

    Parameters

    • effect: "fade" | "mask" | "pixelate"

      "fade" for a color fade, "mask" for a shape-based mask transition, "pixelate" for the screen breaking up into ever larger blocks, changing behind the largest, and coming back sharp (see PixelateTransitionEffect). A pixelate transition is a shader effect: on the Canvas renderer it does nothing, and the state changes directly.

    • color: string

      a CSS color value (not used by "pixelate")

    • Optionalduration: number = 1000

      expressed in milliseconds, for each half: the cover, then the reveal

    • Optionalshape: number | Polygon | Ellipse

      an Ellipse or Polygon defining the mask shape (required when effect is "mask"), or for "pixelate" the size of the largest blocks, in screen pixels (32 by default)

    Returns void

    Example

    // classic fade to black
    state.transition("fade", "#000", 500);
    Copy

    Example

    // iris (circle) mask transition
    state.transition("mask", "#000", 500, new Ellipse(0, 0, 1, 1));
    Copy

    Example

    // diamond mask transition
    state.transition("mask", "#000", 400, new Polygon(0, 0, [
        { x: 0, y: -1 }, { x: 1, y: 0 },
        { x: 0, y: 1 }, { x: -1, y: 0 },
    ]));
    Copy

    Example

    // the screen breaks up into 32 pixel blocks, and comes back
    state.transition("pixelate", "#000", 300);
    // into 16 pixel blocks
    state.transition("pixelate", "#000", 300, 16);
    Copy