videojs-related

Load related videos after clip is finished. Not working properly, just a draft sofar.

Usage no npm install needed!

<script type="module">
  import videojsRelated from 'https://cdn.skypack.dev/videojs-related';
</script>

README

videojs-related

Load related videos after clip is finished. Not working properly, just a draft sofar.

Installation

npm install --save videojs-related

Usage

To include videojs-related on your website or web application, use any of the following methods.

<script> Tag

This is the simplest case. Get the script in whatever way you prefer and include the plugin after you include video.js, so that the videojs global is available.

<script src="//path/to/video.min.js"></script>
<script src="//path/to/videojs-related.min.js"></script>
<script>
  var player = videojs('my-video');

  player.on('ended', function(){
    // build queryparam
    var query = 'somekey=value1&otherkey=value2';

    this.related.loadSource(query);
  });

  // When response is fetched create the wall
  // TODO: Could be removed.
  player.on('related:fetched', function(event, data) {
    /**
     * Map your response accordingly.
     * data.response = {[
     *     duration: '00:00:11',
     *     image: 'http://example.com/image.jpg',
     *     title: 'The best clip',
     *     url: 'http://somesource/index.m3u8'
     * ],}
     */
    this.related.createWall(data.response)
  });

  player.related({
    base_url: 'http://example.com',
    gotoUrl: false
  });
</script>

License

MIT. Copyright (c) Gustaf Elbander <gustaf.elbander@flownetwork.se>