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