diff --git a/UI/Base/ScrollableFullScreen.ts b/UI/Base/ScrollableFullScreen.ts index 90732719bd..3c20d89ef0 100644 --- a/UI/Base/ScrollableFullScreen.ts +++ b/UI/Base/ScrollableFullScreen.ts @@ -32,15 +32,12 @@ export default class ScrollableFullScreen { resetScrollSignal: UIEventSource }) => BaseUIElement, hashToShow: string, - isShown: UIEventSource = new UIEventSource(false), - options?: { - setHash?: true | boolean - } + isShown: UIEventSource = new UIEventSource(false) ) { 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 - if (setHash) { - Hash.hash.addCallback((h) => { - if (h === undefined) { - isShown.setData(false) - } - }) - } + Hash.hash.addCallback((h) => { + 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() + } } diff --git a/UI/DefaultGuiState.ts b/UI/DefaultGuiState.ts index 43c2c94de2..cb780b1c41 100644 --- a/UI/DefaultGuiState.ts +++ b/UI/DefaultGuiState.ts @@ -4,14 +4,22 @@ import Hash from "../Logic/Web/Hash" export class DefaultGuiState { static state: DefaultGuiState - public readonly welcomeMessageIsOpened: UIEventSource - public readonly downloadControlIsOpened: UIEventSource - public readonly filterViewIsOpened: UIEventSource - public readonly copyrightViewIsOpened: UIEventSource - public readonly currentViewControlIsOpened: UIEventSource - public readonly userInfoIsOpened: UIEventSource + + public readonly welcomeMessageIsOpened: UIEventSource = new UIEventSource( + false + ) + public readonly downloadControlIsOpened: UIEventSource = new UIEventSource( + false + ) + public readonly filterViewIsOpened: UIEventSource = new UIEventSource(false) + public readonly copyrightViewIsOpened: UIEventSource = new UIEventSource( + false + ) + public readonly currentViewControlIsOpened: UIEventSource = new UIEventSource( + false + ) + public readonly userInfoIsOpened: UIEventSource = new UIEventSource(false) public readonly welcomeMessageOpenedTab: UIEventSource - public readonly allFullScreenStates: UIEventSource[] = [] 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( - "welcome-control-toggle", - 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 = { + const sources = { + welcome: this.welcomeMessageIsOpened, 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() - states[hash]?.setData(true) - }) + + sources[Hash.hash.data?.toLowerCase()]?.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) - } - }) - } - } } }