Initial hls video playback support

This commit is contained in:
Zed 2019-08-19 20:25:00 +02:00
parent bce76ab8d1
commit f5fef0ff3a
6 changed files with 45 additions and 13 deletions

View file

@ -297,7 +297,7 @@ video, .video-container img {
top: 0;
left: 0;
z-index: 1;
background-color: #000000bd;
background-color: #0000008d;
}
.video-overlay p {
@ -309,6 +309,15 @@ video, .video-container img {
font-size: 20px;
}
.video-overlay div {
position: relative;
z-index: 0;
top: calc(50% - 20px);
margin: 0 auto;
width: 40px;
height: 40px;
}
.still-image {
max-height: 379.5px;
max-width: 533px;

2
public/js/hls.light.min.js vendored Normal file

File diff suppressed because one or more lines are too long

15
public/js/hlsPlayback.js Normal file
View file

@ -0,0 +1,15 @@
function playVideo(overlay) {
const video = overlay.parentElement.querySelector('video');
video.setAttribute("controls", "");
overlay.style.display = "none";
const url = video.getAttribute("data-url");
var hls = new Hls({autoStartLoad: false});
hls.loadSource(url);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function () {
hls.loadLevel = hls.levels.length - 1;
hls.startLoad();
video.play();
});
}