+ frame advance

webroot/js/player.js

@@ -8,6 +8,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 	const video = document.getElementById('player_video');
 	const audio = document.getElementById('player_audio');
 	const movie = document.getElementById('movie_player');
+	let fps = 30;
 
 	const searchParams = new URLSearchParams(window.location.search.slice(1))
 	let startTime = 0;
@@ -47,6 +48,8 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		console.log('selected video format', videoFormat);
 		console.log('selected audio format', audioFormat);
 
+		fps = videoFormat.fps;
+
 		selectStreams(videoFormat, audioFormat)
 	} else {
 		let videoFormat = formats.find((fmt) => fmt.format_id == localStorage.getItem("videoStream"));
@@ -59,7 +62,9 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		}
 		console.log('selected video format', videoFormat);
 		console.log('selected audio format', audioFormat);
-
+		
+		fps = videoFormat.fps;
+		
 		selectStreams(videoFormat, audioFormat)
 	}
 	
@@ -218,20 +223,22 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		}
 	}
 
-	function seekRelative(t) {
+	function seekRelative(t, play) {
 		video.pause();
 		video.currentTime=video.currentTime+t;
 		if(audio) {
 			audio.pause();
 			audio.currentTime=video.currentTime;
 		}
-		playbackWait();
+		if(play != false) {
+			playbackWait();		
+		}
 	}
 
 	function handleKeyboard(e) {
 		console.log(e)
 		if (e.target.name != "search_query") {
-			if (e.key == "ArrowLeft") {
+			if (e.key == "ArrowLeft") { // go ahead, complain this is not a switch
 				seekRelative(-5);
 				e.preventDefault();
 			} else if (e.key == "ArrowRight") {
@@ -252,6 +259,14 @@ window.addEventListener('DOMContentLoaded', (event) => {
 			} else if (e.key == "<") {
 				if (speedInput.selectedIndex != 0) speedInput.selectedIndex -= 1;
 				changeSpeed();
+			} else if (e.key == ".") {
+				if (video.paused) {
+					seekRelative(1/fps, false);
+				}
+			} else if (e.key == ",") {
+				if (video.paused) {
+					seekRelative(-1/fps, false);
+				}
 			}
 		}
 	}
@@ -408,11 +423,11 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		uwu.value = e.format_id;
 		if (e.acodec == "none") {
 			uwu.innerText = `${e.ext} ${e.height}p (${e.format_id})`;
-			videoStreamInput.append(uwu);
 			if (uwu.value == localStorage.getItem("videoStream")) {
-				selectedVideoIndex = videoStreamInput.length-1;
+				selectedVideoIndex = videoStreamInput.length;
 				console.log(selectedVideoIndex)
 			}
+			videoStreamInput.append(uwu);
 			console.log(`- ${e.format_id}, czyli ${e.height}p`)
 		} else if (e.vcodec == "none") {
 			uwu.innerText = `${e.acodec} ${e.abr}kbps (${e.format_id})`;
@@ -425,7 +440,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		} else {
 			uwu.innerText = `${e.ext} ${e.height}p (${e.format_id})`;
 			if (uwu.value == localStorage.getItem("videoStream")) {
-				selectedVideoIndex = videoStreamInput.length-1;
+				selectedVideoIndex = videoStreamInput.length;
 				console.log(selectedVideoIndex)
 			}
 			videoStreamInput.append(uwu);