How to Trigger Events with Controls

This How-To assumes you have completed the quick start and have an exhibit connected to Gumband Cloud

Triggering Events with Controls

Controls are events that can be triggered through the Gumband UI. Common use cases for controls are rebooting an application that runs an exhibit or triggering some sort of test content or animation to help with debugging. Like statuses, controls are unique per exhibit and must be configured through the manifest. For example:

export const MANIFEST = {
  manifest: {
      statuses: [],
      controls: [
          {
            id: "reload-frontend",
            type: "Single",
            display: "Reload Frontend",
            order: 0
          },
          {
            id: "toggle-game-mode",
            type: "Single",
            display: "Toggle Game Mode",
            order: 1
          }
      ],
      settings: []
  }
}

would configure controls for the following exhibit instance in the Gumband UI:

Two control buttons in the Gumband UI.

Controls are one-way communications from the Gumband cloud to the exhibit. You can listen for a control trigger through the Sockets.CONTROL_RECEIVED event listener callback on the SDK:

this.gumbandSDK.on(Sockets.CONTROL_RECEIVED, async (payload) => {
    console.log(`Control triggered: ${payload.id}`);
    
    if(payload.id === "toggle-game-mode") {
        this.toggleGameMode();
    } else if (payload.id === "reload-frontend") {        
        this.reloadFrontend();
    }
});

Gumband Support

How to Trigger Events with Controls

Analytics

Triggering Events with Controls

Related content