First, include video.js . You can do this as you usually do, or from our Teltoo scripts repository (recommended). Then add the teltoo.js SDK and teltoo-contrib-hls.min.js plugin scripts. Next, fire up the Teltoo plugin as you would with any other video.js standard plugin. The example below is all that you need. Notice that the teltoo-contrib-hls.min.js script already includes the video.js contrib-hls plugin so you do not need to add it yourself to play HLS streams.
<!-- Include videojs script --> <script src="//TS_HOST/videojs-teltoo/video.js"></script> <!-- Include Teltoo SDK and the adapter for video.js and HLS --> <script src="//TS_HOST/teltoo.js" data-teltoo-apikey="TELTOO_API_KEY"></script> <script src="//TS_HOST/videojs-teltoo/teltoo-contrib-hls.min.js"></script>
The above code example assumes that the video tag used has the 'video' id, as in the following setup:
<!-- The HTML5 video tag --> <video id="video" class="video-js vjs-default-skin" controls> <!-- Place here you own HLS source stream url (.m3u8) --> <source src="http://example.com/path/to/video.m3u8" type="application/x-mpegURL"> </video>
A detailed explanation of how to setup video.js may be found on video.js’ website here. Remember to set up the videojs skin to maintain your branding. If you don’t have one, use the default skin by including the following tag in your head section:
<link href="//TS_HOST/videojs-teltoo/video-js.css" rel="stylesheet">
Currently, Teltoo works with HLS encoded video streams (either live or on demand). In case you use a different type of encoding, the stream will be delivered as usual through your server or CDN.
Copied to Clipboard