support Contact Support | system status System Status
Page Contents

    Player Developer Basics: Custom Plugin - Passing Data

    In this topic, you will learn how to pass data to a custom plugin.
     

    Steps

    1. In the custom plugin code, place an options parameter in the anonymous function that defines the plugin.
      videojs.registerPlugin('navigateOnVideoEnd', function (options) {
        var myPlayer = this;
        ...
      });
    2. Use desired properties of the parameter object in your plugin code for customization:
      videojs.registerPlugin('navigateOnVideoEnd', function (options) {
        var myPlayer = this;
        ...
        window.location.href = options.redirectURL;
      });
    3. In the HTML page that calls the plugin, build an object with the required property/properties:
      <script>
        videojs.getPlayer('myPlayerID').ready(function() {
          var myPlayer = this,
             options = {"redirectURL": "http://support.brightcove.com"};
          ...
        });
      </script>
    4. When calling the custom plugin, pass the options object as a parameter:
      <script>
        videojs.getPlayer('myPlayerID').ready(function() {
          var myPlayer = this,
             options = {"redirectURL": "http://support.brightcove.com"};
          myPlayer.navigateOnVideoEnd(options);
        });
      </script>
    5. If using Studio, pass the options object to the custom plugin via the Options(JSON) form element:
      studio plugin configuration

    Complete Code

    Plugin code

    videojs.registerPlugin('navigateOnVideoEnd', function (options) {
      var myPlayer = this;
      myPlayer.on('ended', function () {
        window.location.href = options.redirectURL;
      });
    });

    HTML page calling code

    <video-js id="myPlayerID"
      data-video-id="5701193190001"
      data-account="1752604059001"
      data-player="default"
      data-embed="default"
      data-application-id
      class="video-js"
      controls
      width="640"
      height="360"></video-js>
    <script src="//players.brightcove.net/1752604059001/default_default/index.min.js"></script>
    
    <script src="redirect.js"></script>
    
    <script>
      videojs.getPlayer('myPlayerID').ready(function() {
        var myPlayer = this,
           options = {"redirectURL": "http://support.brightcove.com"};
        myPlayer.navigateOnVideoEnd(options);
      });
    </script>

    Page last updated on 27 Feb 2020