+ hide cursor on play

webroot/css/style.css

@@ -5,6 +5,10 @@ pre {
 	white-space: pre-wrap;
 }
 
+.hide-cursor {
+	cursor: none;
+}
+
 /* Unimplemented buttons */
 .ytp-button-watch-later, .ytp-subtitles-button, .ytp-size-toggle-large {
 	display: none !important;

webroot/js/player.js

@@ -6,6 +6,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 	const controlbar = document.querySelector(".html5-video-controls")
 	const video = document.getElementById('player_video');
 	const audio = document.getElementById('player_audio');
+	const movie = document.getElementById('movie_player');
 
 	loopInput.checked = false;
 
@@ -60,6 +61,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 			if (shouldPlay) {
 				classList.remove('ytp-button-play');
 				classList.add('ytp-button-pause');
+				handleMouse("frame");
 				if (video.ended) {
 					video.currentTime = 0;
 					audio.currentTime = 0;
@@ -73,6 +75,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 			} else {
 				classList.remove('ytp-button-pause');
 				classList.add('ytp-button-play');
+				clearTimeout(mouseMoveTimeout);
 				video.pause();
 				if (audio.src) {
 					audio.currentTime = video.currentTime; // sync audio to video on pause
@@ -159,8 +162,6 @@ window.addEventListener('DOMContentLoaded', (event) => {
 				document.webkitCancelFullScreen();
 			}
 		} else {
-			movie = document.getElementById('movie_player');
-
 			if (movie.requestFullscreen) {
 				movie.requestFullscreen();
 			} else if (movie.mozRequestFullScreen) {
@@ -230,16 +231,21 @@ window.addEventListener('DOMContentLoaded', (event) => {
 	let mouseMoveTimeout;
 
 	function handleMouse(type, e) {
+		movie.classList.remove("hide-cursor");
 		controlbar.style="transform: translateY(0px);";
 		clearTimeout(mouseMoveTimeout);
-		if(type != "controls") {
-			mouseMoveTimeout = setTimeout(() => {
-				controlbar.style="transform: translateY(40px);";
-			}, 2000);
-		} else if (type == "controls") {
-			mouseMoveTimeout = setTimeout(() => {
-				controlbar.style="transform: translateY(40px);";
-			}, 8000);			
+		if(video.paused == false) {
+			if(type != "controls") {
+				mouseMoveTimeout = setTimeout(() => {
+					controlbar.style="transform: translateY(40px);";
+					movie.classList.add("hide-cursor");
+				}, 2000);
+			} else if (type == "controls") {
+				mouseMoveTimeout = setTimeout(() => {
+					controlbar.style="transform: translateY(40px);";
+					movie.classList.add("hide-cursor");
+				}, 8000);			
+			}
 		}
 	}