Web Events

The WebEventsManager class is responsible for capturing events that are triggered by the browser and notifying the game.

There are two types of events that are handled:

• visibilitychange - triggered when the browser tab displaying the game is hidden or shown
• resize - triggered when the browser window is resized

Adding an Event Listener

To add an event listener, you must first create a callback function that will be called when the event is triggered. Then, you can register the callback function with the WebEventsManager instance.

// Create a visibility changed callback function

const visibilityChangedCallback = (isVisible: boolean): void => {
  if (isVisible) {
    console.log('The game is visible');
    // Re-enable animations, sounds, etc.
  } else {
    console.log('The game is hidden');
    // Disable animations, sounds, etc.
  }
}

// Add an event listener within a game state

this.app.webEvents.registerVisibilityChangedCallback(visibilityChangedCallback);

// To register a resize event listener

this.app.webEvents.registerResizeCallback(resizeCallback);

Removing an Event Listener

To remove an event listener, pass a reference to your callback function:

// Remove the event listener within a game state

this.app.webEvents.unregisterVisibilityChangedCallback(visibilityChangedCallback);

// To remove a resize event listener

this.app.webEvents.unregisterResizeCallback(resizeCallback);