Set video height depending on screen size

This commit is contained in:
0xboobface 2019-12-08 18:36:42 +01:00
parent 402dd568f9
commit cb90ff8264
1 changed files with 11 additions and 3 deletions

View File

@ -203,7 +203,7 @@
<div id="player-window" class="modal"> <div id="player-window" class="modal">
<div class="modal-content"> <div class="modal-content">
<span class="close">&times;</span> <span class="close">&times;</span>
<video id="player" preload="none" controls width="100%" height="800"> <video id="player" preload="none" controls width="100%">
</video> </video>
</div> </div>
</div> </div>
@ -401,8 +401,15 @@
if(src.indexOf('.mp4') > 0) { if(src.indexOf('.mp4') > 0) {
var video = document.getElementById('player'); var video = document.getElementById('player');
video.src = src; video.src = src;
video.load();
video.oncanplay = function() {
video.height = window.innerHeight * 0.85;
$('#player-window').css('display', 'block'); $('#player-window').css('display', 'block');
video.play(); video.play();
}
video.onloadedmetadata = function() {
console.log(video);
}
} else { } else {
if (Hls.isSupported()) { if (Hls.isSupported()) {
var video = document.getElementById('player'); var video = document.getElementById('player');
@ -412,6 +419,7 @@
console.log(src); console.log(src);
hls.loadSource(src); hls.loadSource(src);
hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) { hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
console.log(data);
console.log("manifest loaded, found " + data.levels.length + " quality level"); console.log("manifest loaded, found " + data.levels.length + " quality level");
$('#player-window').css('display', 'block'); $('#player-window').css('display', 'block');
video.play(); video.play();