Rework initial behaviour of scrollableFullScreen

UI/Base/ScrollableFullScreen.ts

@@ -32,15 +32,12 @@ export default class ScrollableFullScreen {
             resetScrollSignal: UIEventSource<void>
         }) => BaseUIElement,
         hashToShow: string,
-        isShown: UIEventSource<boolean> = new UIEventSource<boolean>(false),
+        isShown: UIEventSource<boolean> = new UIEventSource<boolean>(false)
-        options?: {
-            setHash?: true | boolean
-        }
     ) {
         this.hashToShow = hashToShow
         this.isShown = isShown
 
-        if (hashToShow === undefined) {
+        if (hashToShow === undefined || hashToShow === "") {
             throw "HashToShow should be defined as it is vital for the 'back' key functionality"
         }
 
@@ -55,22 +52,17 @@ export default class ScrollableFullScreen {
         )
 
         const self = this
-        const setHash = options?.setHash ?? true
+        Hash.hash.addCallback((h) => {
-        if (setHash) {
+            if (h === undefined) {
-            Hash.hash.addCallback((h) => {
+                isShown.setData(false)
-                if (h === undefined) {
+            }
-                    isShown.setData(false)
+        })
-                }
-            })
-        }
 
-        isShown.addCallback((isShown) => {
+        isShown.addCallbackD((isShown) => {
             if (isShown) {
                 // We first must set the hash, then activate the panel
                 // If the order is wrong, this will cause the panel to disactivate again
-                if (setHash) {
+                Hash.hash.setData(hashToShow)
-                    Hash.hash.setData(hashToShow)
-                }
                 ScrollableFullScreen._currentlyOpen = self
                 self.Activate()
             } else {
@@ -81,6 +73,11 @@ export default class ScrollableFullScreen {
                 ScrollableFullScreen.collapse()
             }
         })
+        if (isShown.data) {
+            Hash.hash.setData(hashToShow)
+            ScrollableFullScreen._currentlyOpen = self
+            this.Activate()
+        }
     }
 
     private static initEmpty(): FixedUiElement {
@@ -115,6 +112,9 @@ export default class ScrollableFullScreen {
      */
     public Activate(): void {
         this.isShown.setData(true)
+        if (this.hashToShow && this.hashToShow !== "") {
+            Hash.hash.setData(this.hashToShow)
+        }
         this._fullscreencomponent.AttachTo("fullscreen")
         const fs = document.getElementById("fullscreen")
         ScrollableFullScreen._currentlyOpen = this
@@ -157,4 +157,8 @@ export default class ScrollableFullScreen {
             "fixed top-0 left-0 right-0 h-screen w-screen desktop:max-h-65vh md:w-auto md:relative z-above-controls md:rounded-xl overflow-hidden"
         )
     }
+
+    static ActivateCurrent() {
+        ScrollableFullScreen._currentlyOpen?.Activate()
+    }
 }

UI/DefaultGuiState.ts

@@ -4,14 +4,22 @@ import Hash from "../Logic/Web/Hash"
 
 export class DefaultGuiState {
     static state: DefaultGuiState
-    public readonly welcomeMessageIsOpened: UIEventSource<boolean>
+
-    public readonly downloadControlIsOpened: UIEventSource<boolean>
+    public readonly welcomeMessageIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(
-    public readonly filterViewIsOpened: UIEventSource<boolean>
+        false
-    public readonly copyrightViewIsOpened: UIEventSource<boolean>
+    )
-    public readonly currentViewControlIsOpened: UIEventSource<boolean>
+    public readonly downloadControlIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(
-    public readonly userInfoIsOpened: UIEventSource<boolean>
+        false
+    )
+    public readonly filterViewIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(false)
+    public readonly copyrightViewIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(
+        false
+    )
+    public readonly currentViewControlIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(
+        false
+    )
+    public readonly userInfoIsOpened: UIEventSource<boolean> = new UIEventSource<boolean>(false)
     public readonly welcomeMessageOpenedTab: UIEventSource<number>
-    public readonly allFullScreenStates: UIEventSource<boolean>[] = []
 
     constructor() {
         this.welcomeMessageOpenedTab = UIEventSource.asFloat(
@@ -21,75 +29,19 @@ export class DefaultGuiState {
                 `The tab that is shown in the welcome-message.`
             )
         )
-        this.welcomeMessageIsOpened = QueryParameters.GetBooleanQueryParameter(
+        const sources = {
-            "welcome-control-toggle",
+            welcome: this.welcomeMessageIsOpened,
-            false,
-            "Whether or not the welcome panel is shown"
-        )
-        this.downloadControlIsOpened = QueryParameters.GetBooleanQueryParameter(
-            "download-control-toggle",
-            false,
-            "Whether or not the download panel is shown"
-        )
-        this.filterViewIsOpened = QueryParameters.GetBooleanQueryParameter(
-            "filter-toggle",
-            false,
-            "Whether or not the filter view is shown"
-        )
-        this.copyrightViewIsOpened = QueryParameters.GetBooleanQueryParameter(
-            "copyright-toggle",
-            false,
-            "Whether or not the copyright view is shown"
-        )
-        this.currentViewControlIsOpened = QueryParameters.GetBooleanQueryParameter(
-            "currentview-toggle",
-            false,
-            "Whether or not the current view box is shown (metalayer showing current view, allows to do calculate stats for all in view)"
-        )
-        this.userInfoIsOpened = QueryParameters.GetBooleanQueryParameter(
-            "userinfo-toggle",
-            false,
-            "Whether or not the user info is shown"
-        )
-
-        const states = {
             download: this.downloadControlIsOpened,
             filters: this.filterViewIsOpened,
             copyright: this.copyrightViewIsOpened,
             currentview: this.currentViewControlIsOpened,
-            welcome: this.welcomeMessageIsOpened,
+            userinfo: this.userInfoIsOpened,
         }
-        Hash.hash.addCallbackAndRunD((hash) => {
+
-            hash = hash.toLowerCase()
+        sources[Hash.hash.data?.toLowerCase()]?.setData(true)
-            states[hash]?.setData(true)
-        })
 
         if (Hash.hash.data === "" || Hash.hash.data === undefined) {
             this.welcomeMessageIsOpened.setData(true)
         }
-
-        this.allFullScreenStates.push(
-            this.downloadControlIsOpened,
-            this.filterViewIsOpened,
-            this.copyrightViewIsOpened,
-            this.welcomeMessageIsOpened,
-            this.currentViewControlIsOpened,
-            this.userInfoIsOpened
-        )
-
-        for (let i = 0; i < this.allFullScreenStates.length; i++) {
-            const fullScreenState = this.allFullScreenStates[i]
-            for (let j = 0; j < this.allFullScreenStates.length; j++) {
-                if (i == j) {
-                    continue
-                }
-                const otherState = this.allFullScreenStates[j]
-                fullScreenState.addCallbackAndRunD((isOpened) => {
-                    if (isOpened) {
-                        otherState.setData(false)
-                    }
-                })
-            }
-        }
     }
 }