videojs-contrib-dash
Version:
A Video.js source-handler providing MPEG-DASH playback.
106 lines (94 loc) • 3.25 kB
HTML
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Test Player</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="node_modules/video.js/dist/video-js.css">
</head>
<body>
<p>BBB</p>
<video id="player" width=600 height=300 class="video-js vjs-default-skin" controls></video>
<p>BBB - oceans track</p>
<video id="player-ocean" width=600 height=300 class="video-js vjs-default-skin" controls crossorigin="anonymous">
<track default kind="captions" src="https://vjs.zencdn.net/v/oceans.vtt" srclang="en" label="Oceans">
</video>
<p>Angel One - broken subs</p>
<video id="angel-one" width=600 height=300 class="video-js vjs-default-skin" controls></video>
<p>Angel One - DRM</p>
<video id="angel-one-drm" width=600 height=300 class="video-js vjs-default-skin" controls></video>
<p>Livesim</p>
<video id="live-player" width=600 height=300 class="video-js vjs-default-skin" controls></video>
<p>Livesim - multi-subs</p>
<video id="live-subs-player" width=600 height=300 class="video-js vjs-default-skin" controls></video>
<script src="node_modules/video.js/dist/video.js"></script>
<script src="node_modules/dashjs/dist/dash.all.debug.js"></script>
<script src="dist/videojs-dash.js"></script>
<script>
var
player = videojs('player', {
html5: {
dash: {
limitBitrateByPortal: true
}
}
}),
playerOcean = videojs('player-ocean'),
angelOne = videojs('angel-one'),
angelOneDrm = videojs('angel-one-drm'),
livePlayer = videojs('live-player'),
liveSubsPlayer = videojs('live-subs-player', {
html5: {
dash: {
useTTML: true
}
}
});
player.ready(function() {
player.src({
src: 'http://dash.edgesuite.net/akamai/bbb_30fps/bbb_30fps.mpd',
type: 'application/dash+xml'
});
});
playerOcean.ready(function() {
playerOcean.src({
src: 'http://dash.edgesuite.net/akamai/bbb_30fps/bbb_30fps.mpd',
type: 'application/dash+xml'
});
});
angelOne.ready(function(){
angelOne.src({
src: 'https://storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd',
type: 'application/dash+xml'
});
});
angelOneDrm.ready(function(){
angelOneDrm.src({
src: 'https://storage.googleapis.com/shaka-demo-assets/angel-one-widevine/dash.mpd',
type: 'application/dash+xml',
keySystemOptions: [
{
name: 'com.widevine.alpha',
options: {
serverURL: 'https://cwip-shaka-proxy.appspot.com/no_auth'
}
}
]
});
});
livePlayer.ready(function(){
livePlayer.src({
src: 'http://livesim.dashif.org/livesim/mup_30/testpic_2s/Manifest.mpd',
type: 'application/dash+xml'
});
});
liveSubsPlayer.ready(function(){
liveSubsPlayer.src({
src: 'https://livesim.dashif.org/dash/vod/testpic_2s/multi_subs.mpd',
type: 'application/dash+xml'
});
});
</script>
</body>
</html>