<!--Initialize player, Nuevo plugin and setup roll videos-->
<script>
var player = videojs('player_one');
player.nuevo();
player.vroll([
{
src: "//opencdn.b-cdn.net/video/preroll.mp4",
type: "video/mp4",
href: "https://url-to-go-on-click",
offset: '0', //must be '0' for preroll video
skip: 5, //optionally
id: '1' //useful for tracking roll video
}, {
src: "//opencdn.b-cdn.net/video/midroll1.mp4",
type: "video/mp4",
href: "https://url-to-go-on-click",
offset: '10', //midroll starts at 00:10
skip: 5, //optionally
id: '2'
}
src: "//opencdn.b-cdn.net/video/midroll2.mp4",
type: "video/mp4",
href: "https://url-to-go-on-click",
offset: '50%', //midroll starts at half of video
skip: 5, //optionally
id: '3'
}
src: "//opencdn.b-cdn.net/video/postroll.mp4",
type: "video/mp4",
href: "https://url-to-go-on-click",
offset: '100%', //must be '100%' for postroll video
skip: 5, //optionally
id: '4'
}
]);
</script>
Preroll video must have option "offset: 0", psotroll video must have option "offset: 100%".
You can't use postroll video for live streams. You can't use offset percentage value for live stream.
To play midroll video one after another just set same "offset" value.
Tracking video ad by ad ID
<script>
player.on('vroll', function(event, data) {
var ad_id = data.id;
var action = data.action;
}
</script>
Actions tracked by the plugin are "start", "paused", "resumed" "skipped", "completed", "error", "clicked",