mute overlay touch

app/static/js/ascroll.js

@@ -35,7 +35,6 @@ function updatePlayer(video, frame, currentTime, out, src) {
     video.currentTime = currentTime
     video.dataset.in = currentTime
     video.dataset.out = out
-    video.controls = true
     video._frame = frame
     const show = event => {
         video.style.opacity = 1
@@ -126,10 +125,8 @@ function formatInfo(config, ascroll) {
 
 function showOverlay(event) {
     document.querySelectorAll('#video-overlay').forEach(element => element.remove())
-    console.log('showOverlay')
     var video = event.target
     var rect = video.getBoundingClientRect();
-    console.log(rect)
     var overlay = document.createElement('div')
     overlay.id = 'video-overlay'
     overlay.style.top = video.style.top
@@ -140,6 +137,7 @@ function showOverlay(event) {
     overlay.style.alignItems = 'center'
     overlay.style.justifyContent = 'center'
     overlay.style.fontSize = '45px'
+    video.controls = true
 
     if (video.muted) {
             overlay.innerHTML = `🔇`
@@ -154,11 +152,19 @@ function showOverlay(event) {
             overlay.innerHTML = `🔊`
         }
     })
-    overlay.addEventListener('mouseleave', event=> {
+    var timeout = setTimeout(() => {
+        video.controls = false
         overlay.remove()
+    }, 500)
+    overlay.addEventListener('mousemove', event=> {
+        clearTimeout(timeout)
+        timeout = setTimeout(() => {
+            video.controls = false
+            overlay.remove()
+        }, 500)
     })
     video.parentElement.appendChild(overlay)
-    console.log(overlay)
+
 }
 
 function loadItem(config) {