mouse to keep controls open

Author: Absulit

src/main.js

@@ -452,24 +452,49 @@ function update() {
 let isMouseMoving = false;
 let mouseStopTimeout;
 
+const guiElement = document.querySelector('.dg.main');
+let isMouseOnDatGui = false;
+
+function onMouseStopTimeout() {
+    clearTimeout(mouseStopTimeout);
+    mouseStopTimeout = null;
+    isMouseMoving = false;
+    gui.close()
+    document.body.style.cursor = 'none';
+}
+
+guiElement.addEventListener('mouseenter', () => {
+    isMouseOnDatGui = true;
+    clearTimeout(mouseStopTimeout);
+    mouseStopTimeout = null;
+});
+
+guiElement.addEventListener('mouseleave', () => {
+    isMouseOnDatGui = false;
+    if (!mouseStopTimeout) {
+        mouseStopTimeout = setTimeout(onMouseStopTimeout, 1000);
+    }
+});
+
 document.addEventListener('mousemove', e => {
     if (!isMouseMoving) {
         isMouseMoving = true;
         gui.open()
         document.body.style.cursor = 'auto';
     }
 
-    // Clear the timeout to reset the stop detection
     clearTimeout(mouseStopTimeout);
+    mouseStopTimeout = null;
 
-    // Set a timeout to detect when the mouse stops
-    mouseStopTimeout = setTimeout(_ => {
-        isMouseMoving = false;
-        gui.close()
-        document.body.style.cursor = 'none';
-    }, 1000);
+    if (isMouseOnDatGui) {
+        return;
+    }
+
+    mouseStopTimeout = setTimeout(onMouseStopTimeout, 1000);
 });
 
+
+
 /******************************/
 async function loadSongFromURL() {
     const url = new URL(window.location.href);