Toolbar hides if mouse moved out of viewer tab

viewer/components/gui.ts

@@ -8,7 +8,19 @@ import type { PDFViewerApplicationType } from './interface.js'
 
 declare const PDFViewerApplication: PDFViewerApplicationType
 
-let hideToolbar: number | undefined
+let hideToolbarTimeout: number | undefined
+function hideToolbar(params: Awaited<ReturnType<typeof utils.getParams>>) {
+    if (typeof PDFViewerApplication === 'undefined') {
+        return
+    }
+    if (hideToolbarTimeout === undefined && !PDFViewerApplication.findBar.opened && !PDFViewerApplication.pdfSidebar.isOpen && !PDFViewerApplication.secondaryToolbar.isOpen) {
+        hideToolbarTimeout = setTimeout(() => {
+            const toolbarDom = document.getElementsByClassName('toolbar')[0]
+            toolbarDom.classList.add('hide')
+            hideToolbarTimeout = undefined
+        }, params.toolbar * 1000)
+    }
+}
 export async function patchViewerUI() {
     if (utils.isEmbedded()) {
         // Cannot simply remove this element, as pdf.js indeed require it to
@@ -23,27 +35,20 @@ export async function patchViewerUI() {
         containerDom.style.top = '32px'
     }
 
+    document.getElementById('outerContainer')!.onmouseleave = () => { hideToolbar(params) }
+
     document.getElementById('outerContainer')!.onmousemove = (e) => {
         if (params.toolbar === 0) {
             return
         }
         if (e.clientY <= 64) {
-            if (hideToolbar) {
-                clearTimeout(hideToolbar)
-                hideToolbar = undefined
+            if (hideToolbarTimeout) {
+                clearTimeout(hideToolbarTimeout)
+                hideToolbarTimeout = undefined
             }
             showToolbar()
         } else {
-            if (typeof PDFViewerApplication === 'undefined') {
-                return
-            }
-            if (hideToolbar === undefined && !PDFViewerApplication.findBar.opened && !PDFViewerApplication.pdfSidebar.isOpen && !PDFViewerApplication.secondaryToolbar.isOpen) {
-                hideToolbar = setTimeout(() => {
-                    const toolbarDom = document.getElementsByClassName('toolbar')[0]
-                    toolbarDom.classList.add('hide')
-                    hideToolbar = undefined
-                }, params.toolbar * 1000)
-            }
+            hideToolbar(params)
         }
     }
 

viewer/latexworkshop.css

@@ -143,7 +143,7 @@ html[dir='rtl'] .findbar {
 }
 
 #viewerContainer {
-    top: 0 !important;
+    top: 0;
 }
 
 #pageNumber {