| 1 |
import 'video.js/dist/video-js.css'; |
| 2 |
import videojs from "!video.js"; |
| 3 |
import 'videojs-youtube' |
| 4 |
|
| 5 |
document.addEventListener( 'DOMContentLoaded', function () { |
| 6 |
// Initialize the Video.js player |
| 7 |
var playerElement = document.getElementById( 'hts-video-player' ); |
| 8 |
|
| 9 |
if ( playerElement ) { |
| 10 |
var player = videojs( 'hts-video-player', { |
| 11 |
"techOrder": [ "youtube" ], |
| 12 |
"sources": [ { |
| 13 |
"type": "video/youtube", |
| 14 |
"src": "https://www.youtube.com/watch?v=WkbQr5dSGLs&t" |
| 15 |
} ] |
| 16 |
} ); |
| 17 |
|
| 18 |
|
| 19 |
var playlistItems = document.querySelectorAll( '.hsr-playlist-item' ); |
| 20 |
if ( playlistItems ) { |
| 21 |
playlistItems.forEach( function ( item ) { |
| 22 |
item.addEventListener( 'click', function () { |
| 23 |
var videoSrc = this.getAttribute( 'data-video-src' ); |
| 24 |
|
| 25 |
player.src( { |
| 26 |
type: 'video/youtube', |
| 27 |
src: videoSrc |
| 28 |
} ); |
| 29 |
|
| 30 |
player.load(); |
| 31 |
player.play(); |
| 32 |
} ); |
| 33 |
} ); |
| 34 |
} |
| 35 |
} |
| 36 |
} ); |
| 37 |
|