Skip to content

Instantly share code, notes, and snippets.

@boyangwang

boyangwang/promo_no_delay.html

Last active May 28, 2017 05:00
Show Gist options
  • Save boyangwang/18ec29ff89e2cfc6c55b8d956faab2d0 to your computer and use it in GitHub Desktop.
Save boyangwang/18ec29ff89e2cfc6c55b8d956faab2d0 to your computer and use it in GitHub Desktop.
Download ZIP
hola_player promo with no delay
Raw
promo_no_delay.html
<!DOCTYPE html>
<html>
<head>
<script src="//player2.h-cdn.com/hola_player.dev.js?customer=demo"></script>
</head>
<body>
<div><h1>Video tag with Hola player - playing HLS</h1></div>
<style>
#wrapper {
position: relative;
height: 360px;
}
#stream {
position: absolute;
top: 0;
left: 0;
}
#promo {
position: absolute;
display: none;
top: 0;
left: 0;
z-index: 10;
}
</style>
<div id="wrapper">
<video id="stream" preload="none" class="video-js vjs-default-skin" width="640" height="360" controls>
<source
src="http://wowza.streamroot.io/liveorigin/stream1/playlist.m3u8"
type="application/x-mpegurl">
</video>
<video id="promo" preload="auto" class="video-js vjs-default-skin" width="640" height="360" controls>
<source
src="http://streamer5.vidgyor.com/vod-origin/promos/yupptv/yupptv_promo_1.mp4"
type="video/mp4">
</video>
</div>
<div id="log">
Log:
</div>
<script>
var log_div = document.getElementById('log');
function log(){
log_div.innerHTML =
log_div.innerHTML + '<br/>' +
Array.prototype.join.call(arguments, ' ');
};
var adTagUrl = 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x360&iu=/106213651/Pilot-Midroll3&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&url=[referrer_url]&description_url=[description_url]&correlator=[timestamp]';
window.hola_player({
player: "#promo",
}, function(v){
window.promo_player = v;
v.on('ended', function() {
v.dispose();
window.videojs.getPlayers().stream.play();
});
});
window.hola_player({
player: "#stream",
auto_play: true,
ads: {
manual: true
}
}, function(v){
v.on([
'readyforpreroll',
'contentplayback',
'adsready',
'adplaying',
'adscanceled',
'adserror',
'nopreroll',
'nopostroll',
'adend',
'adskip',
'adstart',
'ads-ad-started',
'ads-request',
'ads-load',
'ads-pod-started',
'ads-pod-ended',
'ads-allpods-completed',
'ads-ad-started',
'ads-ad-ended',
'ads-ad-skip',
'ads-ad-skipped',
'ads-skipped',
'ads-skip',
'ads-first-quartile',
'ads-midpoint',
'ads-third-quartile',
'ads-pause',
'ads-play',
'ads-mute',
'ads-click',
], function(e){
log(e.type);
});
var ad_played = false;
var start_time;
v.on('timeupdate', function(){
var cur = v.currentTime();
if (!start_time) {
return start_time = cur;
}
if (!ad_played && cur - start_time > 10) {
v.ima.playAd(adTagUrl);
ad_played = true;
}
});
v.on('ads-ad-skipped', function(){
v.one('contentplayback', function(){
v.pause();
});
document.getElementById('promo').style.display = 'block';
window.videojs.getPlayers().promo.play();
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment