Video Recommendation Player Plugins
      Back to home
      1. Knowledge Base and Documentation
      2. Video Recommendations
      3. Video Recommendation Player Plugins

      THEOPlayer Adaptive Plugin

      This details how to implement the Adaptive plugin for THEOPlayer.

      Pre-requirements

      There are two pre-requirements in order to continue with this guide:

      1. You have a THEOplayer 2.X license and library. If you don't have THEOplayer 2.X yet, you can start your free trial here or contact your THEOplayer account manager.
      2. You have some basic knowledge of how to use THEOplayer 2.X.

      Integration with IRIS.TV

      Set-up a working THEOplayer

      This won't be covered in this guide. You can read on this subject at the getting started pages.

      Include the IRIS.TV Plugin

      You need to include the JS script tag referencing the IRIS.TV Plugin. You could do this right before where you include the THEOplayer.js library.

      <script type='text/javascript'
          src='https://ovp.iris.tv/libs/adaptive/iris.adaptive.js'>
      </script>

      Include the custom integration

      You need to include the JS script tag referencing the file containing the custom integration code. You could do this right after where you include the THEOplayer.js library.

      <script type='text/javascript'
          src='https://cdn.theoplayer.com/demos/iristv/THEOplayer.iristv.js'>
      </script>

      You can also add extra styling on top of the IRIS.TV UI:

      <link rel='stylesheet' type='text/css' href='https://cdn.theoplayer.com/demos/iristv/THEOplayer.iristv.css'>
      </link>

      Initialize THEOplayer-IrisTV

      To start displaying the IRIS.TV UI, you have to call THEOplayerIrisTv() (from THEOplayer.iristv.js) and pass along the THEOplayer instance and your IRIS.TV configuration. For example:

      <script>
      ... var player = new THEOplayer.Player(videoContainer, {libraryLocation: 'https://cdn.theoplayer.com/dash/theoplayer/'}); var irisOptions = { client_token: "51afa098ah", platform_id: "5798d994ef995e0d18000176" }; THEOplayerIrisTv(player, irisOptions); player.src = "mystream.m3u8";
      </script>

      Make sure to include:

      <client_token> is a value provided by IRIS.TV after the publisher’s content has been imported. This token is used to authenticate the asset library.

      <platform_id> is the GUID of the initial asset. The GUID is taken from the publisher’s content feed and is the initial video's unique ID.

      Once this is setup, your integration is complete.