Flowplayer · VOD pre-roll - Live feature

 

Live stream kindly provided by StreamShow.

<head/>

For smoother HLS playback in modern browsers we load the hlsjs plugin.

<!-- Flowplayer library -->
<script src="//releases.flowplayer.org/6.0.5/flowplayer.min.js"></script>
<!-- Flowplayer hlsjs engine -->
<script src="//releases.flowplayer.org/hlsjs/flowplayer.hlsjs.min.js"></script>

HTML

<style>

.flowplayer {
background-color: #eee;
}

CSS

<script>

The live property is set on the clip level.

window.onload = function () {
 
flowplayer("#player", {
ratio: 9/16,
splash: true,
embed: {
playlist: true
},
playlist: [{
live: false,
sources: [
{ type: "application/x-mpegurl",
src: "//edge.flowplayer.org/night7.m3u8" }
]
}, {
live: true,
sources: [
{ type: "application/x-mpegurl",
src: "http://wms.shared.streamshow.it/canale8/canale8/playlist.m3u8" }
]
}]
 
}).on("ready", function (e, api, video) {
// info for demo purposes
document.getElementById("playing").innerHTML =
api.engine.engineName + " engine playing " + video.src;
 
});
 
};

JavaScript

<body/>

<div id="player"></div>
 
<!-- only for demo purposes -->
<p id="playing" class="info">&nbsp;</p>

HTML