Showing code for

Switch and remove scenes

Move between scenes, layer them, and free their memory.

ZSceneStack keeps track of your loaded scenes. It is what passes window resizes to them and finds templates when you spawn.

Switch to another scene

Take the old scene off the stack, destroy it, then load the next one. If several scenes are loaded, ZSceneStack.clear() removes them all from the stack.

async function goToScene(oldScene: ZScene, nextPath: string) {
  ZSceneStack.pop();
  await oldScene.destroy();

  const next = new ZScene('next');
  next.load(nextPath, () => {
    ZSceneStack.push(next);
    next.loadStage(app.stage);
  });
}

Layer scenes

To keep a scene underneath, such as a popup over the game, push and load the second one too. Both get resized, and spawning checks the newest scene first.

const popup = new ZScene('popup');
popup.load('./assets/popup/', () => {
  ZSceneStack.push(popup);
  popup.loadStage(app.stage);
});

ZSceneStack.peek();          // the newest scene
ZSceneStack.getStackSize();  // how many scenes are loaded
ZScene.getSceneById('popup');