From 260b0f00769f8d1cbd8578f0de1e16451befa20b Mon Sep 17 00:00:00 2001
From: Saira-A <139405429+Saira-A@users.noreply.github.com>
Date: Thu, 11 Jan 2024 21:39:32 +0000
Subject: [PATCH] Panel stays open fullscreen, closes itself when too small

---
 .../modules/uv-shared-module/RightPanel.ts    | 46 ++++++++++---------
 1 file changed, 25 insertions(+), 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
index 9d7adc7f8..5f1053bfd 100644
--- 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 {