From e34e8dddb961476383a1eb040d3efb77a998c667 Mon Sep 17 00:00:00 2001
From: "Alexander \"Arav\" Andreev" <me@arav.su>
Date: Tue, 10 Dec 2024 22:20:39 +0400
Subject: [PATCH] Autoplay functionality was implemented.

---
 web/assets/css/main.css |  4 ++++
 web/assets/js/main.js   | 10 ++++++++++
 web/index.templ         |  4 ++++
 web/locales/en/en.yaml  |  1 +
 web/locales/ru/ru.yaml  |  1 +
 5 files changed, 20 insertions(+)

diff --git a/web/assets/css/main.css b/web/assets/css/main.css
index 00659d2..f00db0f 100644
--- a/web/assets/css/main.css
+++ b/web/assets/css/main.css
@@ -189,6 +189,10 @@ thead tr th.clickable.sort-down::after { content: '↓'; }
 	text-shadow: 0 0 .3rem var(--secondary-color);
 	z-index: 999; }
 
+#overlay span.c-autoplay { 
+	left: auto;
+	right: 0; }
+
 #overlay :is(video, audio, img) {
 	margin: auto;
 	max-height: 100%;
diff --git a/web/assets/js/main.js b/web/assets/js/main.js
index 81cabe5..53fb423 100644
--- a/web/assets/js/main.js
+++ b/web/assets/js/main.js
@@ -55,6 +55,15 @@ overlay_content.addEventListener("mousemove", e => {
 	e.target.style.transform = `translate(${g_oc_translate[0]}px, ${g_oc_translate[1]}px) scale(${g_scale})`;
 });
 
+overlay_autoplay = document.getElementsByName("autoplay")[0];
+
+overlay_autoplay.addEventListener("change", e => {
+	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();
+});
+
 
 function determine_media_element(path) {
 	path = path.toLowerCase();
@@ -83,6 +92,7 @@ function send_to_overlay(pathname, media_type_element) {
 		media_element.addEventListener("volumechange", e => {
 			localStorage['audio_volume'] = e.target.volume; });
 		media_element.volume = localStorage["audio_volume"];
+		media_element.addEventListener("ended", e => { if (overlay_autoplay.checked) b_next.click(); });
 	}
 
 	overlay_label.textContent = decodeURI(pathname.substr(pathname.lastIndexOf("/") + 1));
diff --git a/web/index.templ b/web/index.templ
index e513f77..7cf29b1 100644
--- a/web/index.templ
+++ b/web/index.templ
@@ -88,6 +88,10 @@ templ Index(currentPath, progVer string, stat *files.DirStat, entries *[]files.D
         <button name="prev">&#10096;</button>
         <div></div>
         <span></span>
+        <span class="c-autoplay">
+            <input id="c-autoplay" type="checkbox" name="autoplay">
+            <label for="c-autoplay">{ i18n.T(ctx, "autoplay") }</label>
+        </span>
         <button name="next">&#10097;</button>
     </div>
     </body>
diff --git a/web/locales/en/en.yaml b/web/locales/en/en.yaml
index 18041e5..23ce2c3 100644
--- a/web/locales/en/en.yaml
+++ b/web/locales/en/en.yaml
@@ -13,6 +13,7 @@ en:
     size: Size
   no-script-explain: With scripts deactivated you loose some QoL features like overlay to view files without need to leave a page, filter of directory's content, and navigation using arrow keys.
   instruction: TODO
+  autoplay: Autoplay
   footer:
     author: Alexander ❝Arav❞ Andreev
     privacy: Privacy statements
\ No newline at end of file
diff --git a/web/locales/ru/ru.yaml b/web/locales/ru/ru.yaml
index 2247bd1..1202cdb 100644
--- a/web/locales/ru/ru.yaml
+++ b/web/locales/ru/ru.yaml
@@ -13,6 +13,7 @@ ru:
     size: Размер
   no-script-explain: С отключенными скриптами ты теряешь такие удобные функции, как оверлей для просмотра файлов без необходимости покидать страницу, фильтр по содержимому директории и навигацию стрелками.
   instruction: TODO
+  autoplay: Автоматическое проигрывание
   footer:
     author: Александр «Arav» Андреев
     privacy: О приватности
\ No newline at end of file