Load app instance output

Load app instance output

Load the app instance output to update content in an overlay and trigger animations using an app or the REST API.

Supported data integrations

Type
Support
Description

Control node

Yes

Update control nodes and trigger animations via apps and the REST API.

Data node

Yes

Update data nodes via the REST API.

Composition scripting

Yes

Manage user interactions and read data from third-party APIs.

Data stream

Yes

Connect data streams via composition scripting.

<!DOCTYPE html>
<html>

<head>
  <!-- Include the Singular Graphic JavaSrcipt library -->
  <script src="https://app.singular.live/libs/singulargraphics/1.0.0/singulargraphics.js"></script>
</head>

<body>
  <!-- define iFrame for a non-interactive Singular Player Instance -->
  <iframe id="SingularOverlay" style="width:720px; height: 400px;"
    src="https://app.singular.live/singularplayer/client"></iframe>

  <script>
    // Singular App Instance 
    const SHARED_APP_TOKEN = "2B50lCTxWNYfoYadq1I2K9";

    // create graphic object from iframe 'SingularOverlay'
    const overlay = SingularGraphics("SingularOverlay");

    // render app instance specified by SHARED_APP_TOKEN,
    // the second param is output name, passing undefined to select the first output
    overlay.renderAppOutput(SHARED_APP_TOKEN, null, function (isSuccess) {
      if (isSuccess) {
        console.log("App output loaded");
      } else {
        console.warn("Couldn't load app output");
      }
    });
  </script>
</body>
</html>

View on codepen.io.

Open the control app.

PreviousControl local preview of appNextOverlay SDK

Last updated

Was this helpful?