Create a Twitch Extension

Note

This information is dependent upon systems maintained by Twitch. We do our best to keep it updated, but you should see the Twitch developer documentation for the latest information.

  1. Open your Twitch Developer Account.

  2. Click Your Console.

  3. Click Create Extension.

  4. Choose a name for your extension. (It can be anything.)

  5. Click Continue.

  6. Under Create an Extension Version select Panel and Video - Fullscreen.

  7. Enter something in Summary.

  8. Click Create Extension Version.

The Genvid MILE SDK uses the Twitch Extension Configuration Service. To activate it:

  1. Click Manage for your Twitch extension.

  2. Select the Capabilities tab.

  3. Under Select how you will configure your extension select Extension Configuration Service.

  4. Click Save Changes.

You’ll also need to specify the Testing Base URI for local testing.

  1. Select the Asset Hosting tab.

  2. Under Testing Base URI enter http://127.0.0.1:8081/.

While still on the Asset Hosting tab, you need to specify the Live Config Path. This lets you use the DirectX Sample admin commands from your extension.

  1. Under Live Config Path enter live_config.html.

  2. Click Save Changes.

Twitch Context

Twitch Context is triggered once per second. In our Genvid Client, we need the hlsLatencyBroadcaster to calculate the latency between the Genvid stack and Twitch platform.

The Twitch onContext callback must be bound to the Genvid Client to retrieve hlsLatencyBroadcaster. To do this, use an event listener on the twitchoncontext property of the Genvid Client video_player object.

Caution

If you listen directly to the Twitch Extension JS API event onContext, it will break the Genvid Web API. To avoid this, go through the Genvid JS API event system instead.

To use onContext, listen to the twitchextoncontext event by calling addEventListener() on videoPlayer.