Implement play button functionality for video playback in fullscreen

static/index.html

@@ -100,6 +100,33 @@
 
                 // Hide loader and show videos
                 hideLoader();
+
+				$("#play-button").click(function() {
+					if (currentVideo && currentVideo.url) {
+						let videoElement = $("<video controls autoplay style='width:100%;height:100%;position:fixed;top:0;left:0;z-index:10000;background-color:black;'></video>").attr("src", currentVideo.url).appendTo("body")[0];
+						if (videoElement.requestFullscreen) {
+							videoElement.requestFullscreen();
+						} else if (videoElement.mozRequestFullScreen) { /* Firefox */
+							videoElement.mozRequestFullScreen();
+						} else if (videoElement.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
+							videoElement.webkitRequestFullscreen();
+						} else if (videoElement.msRequestFullscreen) { /* IE/Edge */
+							videoElement.msRequestFullscreen();
+						}
+						videoElement.onended = function() {
+							if (document.exitFullscreen) {
+								document.exitFullscreen();
+							} else if (document.mozCancelFullScreen) { /* Firefox */
+								document.mozCancelFullScreen();
+							} else if (document.webkitExitFullscreen) { /* Chrome, Safari and Opera */
+								document.webkitExitFullscreen();
+							} else if (document.msExitFullscreen) { /* IE/Edge */
+								document.msExitFullscreen();
+							}
+							$(videoElement).remove(); // Remove video element when playback ends
+						};
+					}
+				});
 			})
 		})
 	</script>