videojs-youtube
Version:
YouTube playback technology for Video.js
38 lines (35 loc) • 1.16 kB
HTML
<html>
<head>
<link type="text/css" rel="stylesheet" href="../node_modules/video.js/dist/video-js.min.css" />
</head>
<body>
<video
id="vid1"
class="video-js vjs-default-skin"
controls
width="640" height="264"
data-setup='{ "techOrder": ["youtube", "html5"] }'
poster="//vjs.zencdn.net/v/oceans.png"
>
<source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
</video>
<button class="oceans">Oceans</button>
<button class="youtube">YouTube</button>
<script src="../node_modules/video.js/dist/video.js"></script>
<script src="../dist/Youtube.js"></script>
<script>
var oceans = document.querySelector('.oceans');
var youtube = document.querySelector('.youtube');
oceans.addEventListener('click', function() {
var player = videojs.players.vid1;
player.src({src: '//vjs.zencdn.net/v/oceans.mp4', type: 'video/mp4'});
});
youtube.addEventListener('click', function() {
var player = videojs.players.vid1;
player.poster('');
player.src({src: 'https://www.youtube.com/watch?v=xjS6SftYQaQ', type: 'video/youtube'});
});
</script>
</body>
</html>