From 8843f7cb9301006812b917f8d3c4d5151ad97835 Mon Sep 17 00:00:00 2001 From: Dmitry Lyzo Date: Thu, 9 Jul 2020 19:05:24 +0300 Subject: [PATCH] Fix OSD lock --- src/controllers/playback/videoosd.js | 77 +++++++++++++++++----------- 1 file changed, 48 insertions(+), 29 deletions(-) diff --git a/src/controllers/playback/videoosd.js b/src/controllers/playback/videoosd.js index b54d30a387..823d43ee4c 100644 --- a/src/controllers/playback/videoosd.js +++ b/src/controllers/playback/videoosd.js @@ -333,21 +333,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med osdPoster.innerHTML = ''; } - let osdLockCount = 0; + let mouseIsDown = false; function showOsd() { slideDownToShow(headerElement); showMainOsdControls(); - if (!osdLockCount) { + if (!mouseIsDown) { startOsdHideTimer(); } } function hideOsd() { - if (osdLockCount) { - return; - } - slideUpToHide(headerElement); hideMainOsdControls(); } @@ -360,19 +356,6 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } } - function lockOsd() { - osdLockCount++; - stopOsdHideTimer(); - } - - function unlockOsd() { - osdLockCount--; - // Restart hide timer if OSD is currently visible - if (currentVisibleMenu && !osdLockCount) { - startOsdHideTimer(); - } - } - function startOsdHideTimer() { stopOsdHideTimer(); osdHideTimeout = setTimeout(hideOsd, 3e3); @@ -444,6 +427,17 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } } + // TODO: Move all idle-related code to `inputManager` or `idleManager` or `idleHelper` (per dialog thing) and listen event from there. + + function resetIdle() { + // Restart hide timer if OSD is currently visible + if (currentVisibleMenu && !mouseIsDown) { + startOsdHideTimer(); + } else { + stopOsdHideTimer(); + } + } + function onPointerMove(e) { if ('mouse' === (e.pointerType || (layoutManager.mobile ? 'touch' : 'mouse'))) { var eventX = e.screenX || 0; @@ -1216,28 +1210,35 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med } function onKeyDownCapture() { - // Restart hide timer if OSD is currently visible - if (currentVisibleMenu) { - showOsd(); - } + resetIdle(); } function onWindowMouseDown(e) { clickedElement = e.target; - lockOsd(); + mouseIsDown = true; + resetIdle(); } function onWindowMouseUp() { - unlockOsd(); + mouseIsDown = false; + resetIdle(); } function onWindowTouchStart(e) { clickedElement = e.target; - lockOsd(); + mouseIsDown = true; + resetIdle(); } function onWindowTouchEnd() { - unlockOsd(); + mouseIsDown = false; + resetIdle(); + } + + function onWindowDragEnd() { + // mousedown -> dragstart -> dragend !!! no mouseup :( + mouseIsDown = false; + resetIdle(); } function getImgUrl(item, chapter, index, maxWidth, apiClient) { @@ -1373,24 +1374,33 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med inputManager.on(window, onInputCommand); document.addEventListener('keydown', onKeyDown); dom.addEventListener(document, 'keydown', onKeyDownCapture, { - capture: true + capture: true, + passive: true }); /* eslint-disable-next-line compat/compat */ dom.addEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, { + capture: true, passive: true }); /* eslint-disable-next-line compat/compat */ dom.addEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, { + capture: true, passive: true }); dom.addEventListener(window, 'touchstart', onWindowTouchStart, { + capture: true, passive: true }); ['touchend', 'touchcancel'].forEach((event) => { dom.addEventListener(window, event, onWindowTouchEnd, { + capture: true, passive: true }); }); + dom.addEventListener(window, 'dragend', onWindowDragEnd, { + capture: true, + passive: true + }); } catch (e) { require(['appRouter'], function(appRouter) { appRouter.goHome(); @@ -1404,24 +1414,33 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med document.removeEventListener('keydown', onKeyDown); dom.removeEventListener(document, 'keydown', onKeyDownCapture, { - capture: true + capture: true, + passive: true }); /* eslint-disable-next-line compat/compat */ dom.removeEventListener(window, window.PointerEvent ? 'pointerdown' : 'mousedown', onWindowMouseDown, { + capture: true, passive: true }); /* eslint-disable-next-line compat/compat */ dom.removeEventListener(window, window.PointerEvent ? 'pointerup' : 'mouseup', onWindowMouseUp, { + capture: true, passive: true }); dom.removeEventListener(window, 'touchstart', onWindowTouchStart, { + capture: true, passive: true }); ['touchend', 'touchcancel'].forEach((event) => { dom.removeEventListener(window, event, onWindowTouchEnd, { + capture: true, passive: true }); }); + dom.removeEventListener(window, 'dragend', onWindowDragEnd, { + capture: true, + passive: true + }); stopOsdHideTimer(); headerElement.classList.remove('osdHeader'); headerElement.classList.remove('osdHeader-hidden');