Panel stays open fullscreen, closes itself when too small

Saira-A · Jan 11, 2024 · 260b0f0 · 260b0f0
1 parent ccb6037
commit 260b0f0
Showing 1 changed file with 25 additions and 21 deletions.
diff --git a/src/content-handlers/iiif/modules/uv-shared-module/RightPanel.ts b/src/content-handlers/iiif/modules/uv-shared-module/RightPanel.ts
@@ -17,36 +17,40 @@ export class RightPanel<T extends ExpandPanel> extends BaseExpandPanel<T> {
     let isLargeScreen: boolean = window.innerWidth >= 1200;
 
     const updatePanelBasedOnScreenWidth = () => {
-        const newIsLargeScreen = window.innerWidth >= 1200;
-
-        if (newIsLargeScreen !== isLargeScreen) {
-            isLargeScreen = newIsLargeScreen;
-
-            if (this.fullscreenEnabled && isLargeScreen) {
-
-                this.toggle(true);
-            } else {
-
-                this.toggle(false);
-            }
+      const newIsLargeScreen = window.innerWidth >= 1200;
+
+      if (newIsLargeScreen !== isLargeScreen) {
+        isLargeScreen = newIsLargeScreen;
+
+        if (this.fullscreenEnabled && isLargeScreen) {
+          this.toggle(true);
+        } else {
+          this.toggle(false);
         }
+      }
     };
 
-
     updatePanelBasedOnScreenWidth();
 
-
     window.addEventListener('resize', updatePanelBasedOnScreenWidth);
 
+    // Open the panel by default for small screens and close it after a few seconds
+    if (!isLargeScreen) {
+      this.toggle(true);
+
+      setTimeout(() => {
+        this.toggle(false);
+      }, 5000); 
+    }
+
     this.extensionHost.subscribe(IIIFEvents.TOGGLE_EXPAND_RIGHT_PANEL, () => {
-        if (this.isFullyExpanded) {
-            this.collapseFull();
-        } else {
-            this.expandFull();
-        }
+      if (this.isFullyExpanded) {
+        this.collapseFull();
+      } else {
+        this.expandFull();
+      }
     });
-}
-
+  }
 
 
   init(): void {