From c33b4a6a17223e53b7bab74a8ece82ed6fa28e70 Mon Sep 17 00:00:00 2001
From: Yiannis Christodoulou <yiannis@web357.com>
Date: Mon, 20 Oct 2025 00:29:58 +0300
Subject: [PATCH] Keep player controls visible when settings menu is open

Introduces methods to keep the video player controls visible while the custom settings menu is open by periodically setting the player to active. Ensures the interval is cleared when the menu is closed or the component is disposed to prevent unintended behavior.
---
 .../components/controls/CustomSettingsMenu.js | 56 +++++++++++++++----
 1 file changed, 46 insertions(+), 10 deletions(-)

diff --git a/frontend-tools/video-js/src/components/controls/CustomSettingsMenu.js b/frontend-tools/video-js/src/components/controls/CustomSettingsMenu.js
index 17ca8fff..5c3dc163 100644
--- a/frontend-tools/video-js/src/components/controls/CustomSettingsMenu.js
+++ b/frontend-tools/video-js/src/components/controls/CustomSettingsMenu.js
@@ -562,16 +562,6 @@ class CustomSettingsMenu extends Component {
         }
     }
 
-    // Cleanup method
-    dispose() {
-        this.stopSubtitleSync();
-        // Remove event listeners
-        document.removeEventListener('click', this.handleClickOutside);
-        // Remove text track change listener
-        if (this.player()) {
-            this.player().off('texttrackchange');
-        }
-    }
 
     getAvailableQualities() {
         // Priority: provided options -> MEDIA_DATA JSON -> player sources -> default
@@ -960,6 +950,9 @@ class CustomSettingsMenu extends Component {
             this.settingsOverlay.classList.remove('show');
             this.settingsOverlay.style.display = 'none';
 
+            // Stop keeping controls visible
+            this.stopKeepingControlsVisible();
+
             // Restore body scroll on mobile when closing
             if (this.isMobile) {
                 document.body.style.overflow = '';
@@ -970,6 +963,9 @@ class CustomSettingsMenu extends Component {
             this.settingsOverlay.classList.add('show');
             this.settingsOverlay.style.display = 'block';
 
+            // Keep controls visible while settings menu is open
+            this.keepControlsVisible();
+
             // Add haptic feedback on mobile when opening
             if (this.isMobile && navigator.vibrate) {
                 navigator.vibrate(30);
@@ -1029,11 +1025,40 @@ class CustomSettingsMenu extends Component {
         return this.settingsOverlay && this.settingsOverlay.classList.contains('show');
     }
 
+    // Keep controls visible while settings menu is open
+    keepControlsVisible() {
+        const player = this.player();
+        if (!player) return;
+
+        // Keep player in active state
+        player.userActive(true);
+
+        // Set up interval to periodically keep player active
+        this.controlsVisibilityInterval = setInterval(() => {
+            if (this.isMenuOpen()) {
+                player.userActive(true);
+            } else {
+                this.stopKeepingControlsVisible();
+            }
+        }, 1000); // Check every second
+    }
+
+    // Stop keeping controls visible
+    stopKeepingControlsVisible() {
+        if (this.controlsVisibilityInterval) {
+            clearInterval(this.controlsVisibilityInterval);
+            this.controlsVisibilityInterval = null;
+        }
+    }
+
     // Close the settings menu
     closeMenu() {
         if (this.settingsOverlay) {
             this.settingsOverlay.classList.remove('show');
             this.settingsOverlay.style.display = 'none';
+
+            // Stop keeping controls visible
+            this.stopKeepingControlsVisible();
             this.speedSubmenu.style.display = 'none';
             if (this.qualitySubmenu) this.qualitySubmenu.style.display = 'none';
             if (this.subtitlesSubmenu) this.subtitlesSubmenu.style.display = 'none';
@@ -1447,6 +1472,17 @@ class CustomSettingsMenu extends Component {
     }
 
     dispose() {
+        // Stop subtitle sync and clear interval
+        this.stopSubtitleSync();
+        
+        // Stop keeping controls visible
+        this.stopKeepingControlsVisible();
+        
+        // Remove text track change listener
+        if (this.player()) {
+            this.player().off('texttrackchange');
+        }
+        
         // Remove event listeners
         document.removeEventListener('click', this.handleClickOutside);