Kollective eCDN Plugin

In this topic, you will learn to implement the Kollective eCDN plugin.

Overview

This plugin is used to integrate a Brightcove Player with Kollective eCDN.

There are a number of docs from Brightcove's Integrations web site that pertain to Kollective eCDN. They are:

Implement using Players module

To implement the plugin in Studio's Players module, use the following steps:

  1. In Studio, select the Players module.
  2. Click the player to which you wish to add the Kollective eCDN plugin.
  3. In the left-navigation, click Plugins.
  4. Click Add a Plugin > Brightcove plugin.
    select brightcove plugin
  5. From the dropdown, select Kollective eCDN.
    select kollective ecdn
  6. Enter configuration Options, if using any, in JSON format. An example is shown.
    enter options
  7. Save then publish your player.

Note that you can also simply edit a player's JSON to implement the plugin. The follow steps guide you through that process:

  1. In Studio, select the Players module.
  2. Click the player to which you wish to add the Kollective eCDN plugin.
  3. In the left-navigation, click JSON editor.
  4. To the plugins section, add the highlighted section.
    JSON configuration
  5. Save then publish your player.

Implement using code

To implement a plugin, the player needs to know the location of the plugin code, a stylesheet location (if needed), the plugin name and plugin configuration options. For the Kollective eCDN plugin:

  • The location of the JavaScript plugin code (no CSS needed in this instance) is as follows:

            https://players.brightcove.net/videojs-kollective/2/videojs-kollective.min.js
  • The name of the plugin is kollective.

The following shows using the In-Page Embed implementation of the player to associate the Kollective eCDN plugin with a single instance of a player.

  • Line 1: Gives the video-js tag an id attribute, with some value, in this case myPlayerID.
  • Line 9: Uses a script tag to include the plugin's JavaScript in the body of the HTML page.
  • Line 13: Creates a reference to the player.
  • Lines 14-25: Initializes the plugin and passes in a custom option.
        <video-js id="myPlayerID"
          data-account="1752604059001"
          data-player="decfdaf5-0a6e-43f6-82d3-39d125c413c4"
          data-embed="default"
          data-video-id="4077874637001"
          controls=""></video-js>
        <script src="https://players.brightcove.net/1752604059001/decfdaf5-0a6e-43f6-82d3-39d125c413c4_default/index.min.js"></script>
      
        <script type="text/javascript" src="https://players.brightcove.net/videojs-kollective/2/videojs-kollective.min.js"></script>
      
        <script type="text/javascript">
          videojs.getPlayer('myPlayerID').ready(function() {
            var myPlayer = this;
            myPlayer.kollective({
              "persistUserToken": true
            })
          });
        </script>

Options

The items listed below are plugin options are used when configuring the Kollective eCDN plugin.

  • ksdkUrl: Used to provide a URL to a specific version of the Kollective SDK (KSDK). If unset, Kollective's latest version is used. If the KSDK is included in-page before the player, this option can be left off.
  • persistUserToken: If true, this saves/retrieves the otherwise randomly generated user token to localstorage.

Methods

There is one method available for use with the Kollective eCDN plugin:

  • loadVideo(videoId): Loads a single video by its ID or ref ID.
    • Data type is string.
    • Returns a promise, which resolves when the Brightcove Playback API responds.
      myPlayer.kollective().loadVideo('1234567890').then(data => {
        // Playback API request is complete, but KSDK.load might not be complete!
      });