From 3ad3945e7b0ba13cda5e4e7f522a008e3caa0d34 Mon Sep 17 00:00:00 2001
From: "Alexander \"Arav\" Andreev" <me@arav.su>
Date: Tue, 10 Dec 2024 22:47:54 +0400
Subject: [PATCH] Some refactoring in main.js.

---
 web/assets/js/main.js | 60 ++++++++++++++++++++++++-------------------
 1 file changed, 34 insertions(+), 26 deletions(-)

diff --git a/web/assets/js/main.js b/web/assets/js/main.js
index ce0b332..8993b26 100644
--- a/web/assets/js/main.js
+++ b/web/assets/js/main.js
@@ -24,13 +24,18 @@ let g_current_row = g_back_row;
 if (localStorage.getItem('audio_volume') == null)
 	localStorage['audio_volume'] = 0.5;
 
-function overlay_close() {
+
+function overlayClose() {
 	overlay_content.firstChild.remove();
 	overlay.style.visibility = "hidden";
 	g_scale = 1;
 	g_oc_offset = g_oc_translate = [0, 0];
 }
 
+
+overlay.addEventListener("mouseup", e => {
+	if (e.target.tagName === "DIV" && e.button === 0) overlayClose(); });
+
 overlay_content.addEventListener("wheel", e => {
 	e.preventDefault();
 	g_scale = Math.min(Math.max(0.25, g_scale + (e.deltaY * -0.001)), 4);
@@ -38,9 +43,6 @@ overlay_content.addEventListener("wheel", e => {
 		`translate(${g_oc_translate[0]}px, ${g_oc_translate[1]}px) scale(${g_scale})`;
 });
 
-overlay.addEventListener("mouseup", e => {
-	if (e.target.tagName === "DIV" && e.button === 0) overlay_close(); });
-
 overlay_content.addEventListener("mousedown", e => {
 	if (e.buttons !== 1) return;
 	e.preventDefault();
@@ -52,24 +54,12 @@ overlay_content.addEventListener("mousemove", e => {
 	e.preventDefault();
 	g_oc_translate[0] = e.clientX - e.target.x - g_oc_offset[0];
 	g_oc_translate[1] = e.clientY - e.target.y - g_oc_offset[1];
-	e.target.style.transform = `translate(${g_oc_translate[0]}px, ${g_oc_translate[1]}px) scale(${g_scale})`;
-});
-
-overlay_autoplay = document.getElementsByName("autoplay")[0];
-
-if (localStorage.getItem('autoplay') == null)
-	localStorage['autoplay'] = overlay_autoplay.checked = false;
-
-overlay_autoplay.addEventListener("change", e => {
-	localStorage['autoplay'] = e.target.checked;
-	if (e.target.checked && overlay_content.firstChild !== undefined)
-		if (overlay_content.firstChild.tagName === "AUDIO" || overlay_content.firstChild.tagName === "VIDEO")
-			if (overlay_content.firstChild.ended)
-				b_next.click();
+	e.target.style.transform =
+		`translate(${g_oc_translate[0]}px, ${g_oc_translate[1]}px) scale(${g_scale})`;
 });
 
 
-function determine_media_element(path) {
+function determineMediaElement(path) {
 	path = path.toLowerCase();
 	if (video_formats.some(ext => path.endsWith(ext)))
 		return "video";
@@ -80,7 +70,7 @@ function determine_media_element(path) {
 	return undefined;
 }
 
-function send_to_overlay(pathname, media_type_element) {
+function overlaySet(pathname, media_type_element) {
 	if (media_type_element === undefined)
 		return false;
 	if (overlay_content.children.length != 0) {
@@ -120,14 +110,15 @@ function getSibling(isNext = true, upDown = false) {
 	return g_current_row;
 }
 
+
 const [b_prev, b_next] = overlay.getElementsByTagName("button");
 
 b_prev.addEventListener("click", e => {
 	do {
 		getSibling(false, false);
 	} while (g_current_row.classList.contains("hidden")
-		|| !send_to_overlay(g_current_row.firstChild.firstChild.pathname, 
-			determine_media_element(g_current_row.firstChild.firstChild.pathname)));
+		|| !overlaySet(g_current_row.firstChild.firstChild.pathname, 
+			determineMediaElement(g_current_row.firstChild.firstChild.pathname)));
 	g_current_row.firstChild.firstChild.focus();
 	e.preventDefault();
 });
@@ -136,22 +127,38 @@ b_next.addEventListener("click", e => {
 	do {
 		getSibling(true, false);
 	} while (g_current_row.classList.contains("hidden")
-		|| !send_to_overlay(g_current_row.firstChild.firstChild.pathname,
-			determine_media_element(g_current_row.firstChild.firstChild.pathname)));
+		|| !overlaySet(g_current_row.firstChild.firstChild.pathname,
+			determineMediaElement(g_current_row.firstChild.firstChild.pathname)));
 	g_current_row.firstChild.firstChild.focus();
 	e.preventDefault();
 });
 
+
 Array.from(g_tbody.children)
 	.forEach(v => {
 		if (v.lastChild.innerHTML === "DIR") return;
 		v.firstChild.firstChild.addEventListener("click", e => {
 			g_current_row = e.target.parentNode.parentNode;
-			if (send_to_overlay(e.target.pathname, determine_media_element(e.target.pathname)))
+			if (overlaySet(e.target.pathname, determineMediaElement(e.target.pathname)))
 				e.preventDefault();
 		});
 	});
 
+
+overlay_autoplay = document.getElementsByName("autoplay")[0];
+
+if (localStorage.getItem('autoplay') == null)
+	localStorage['autoplay'] = overlay_autoplay.checked = false;
+
+overlay_autoplay.addEventListener("change", e => {
+	localStorage['autoplay'] = e.target.checked;
+	const media_element = overlay_content.firstChild
+	if (e.target.checked && media_element !== undefined)
+		if (media_element.tagName === "AUDIO" || media_element.tagName === "VIDEO")
+			if (media_element.ended)
+				b_next.click();
+});
+
 //// KEYBOARD HANDLING
 
 window.addEventListener("keydown", e => {
@@ -190,7 +197,7 @@ window.addEventListener("keydown", e => {
 			e.preventDefault();
 			b_next.click();
 			break;
-		case "Escape": overlay_close(); break;
+		case "Escape": overlayClose(); break;
 		case "Space":
 			e.preventDefault();
 			const el = overlay_content.firstChild;
@@ -203,6 +210,7 @@ window.addEventListener("keydown", e => {
 
 
 document.getElementsByName("filter")[0].classList.remove("hidden");
+
 function filter(sub) {
 	const table = g_tbody.children;
 	for (let j = 0; j < table.length; ++j)