Skip to main content

Custom data panels

What you learn​

You're instantiating DIVA Player in your web front-end and relying on third party video streaming source.

The goal of this article is to build the simplest front-end to stream a video from your video production with custom data panels (panels that can be refreshed but not synchronized with the timeline).

Before starting​

  • Ensure the video production you rely on is up and running.
  • Set the videoId and the related setting configuration.
  • Ensure that in the VideoMetadata the following section is available:
"customDataPanels": [
  {
    "feedUrl": "https://example.com/customOverlay/standing.html",
    "menu": "Serie A STANDING"
  },
    ...
],

Instantiation​

There's no code to add to the Basic instantiation code.

Troubleshooting tips​

In case the timeline and commentary don't show data as expected, double-check that pushengine data timecodes are equal or greater than programDateTime in the videoMetadata — get it by exploring Network in the Chrome developer tools — and less than the video duration.