From b1356f82d464c0386f8edb4069ce2105b95ff60f Mon Sep 17 00:00:00 2001 From: GGodPL <46885632+GGodPL@users.noreply.github.com> Date: Mon, 31 Jul 2023 00:47:40 +0200 Subject: [PATCH] Update betterMenuScreens --- mods/betterMenuScreens.js | 44 ++++++++++++++++++++++++++++++++++----- 1 file changed, 39 insertions(+), 5 deletions(-) diff --git a/mods/betterMenuScreens.js b/mods/betterMenuScreens.js index 0fa8977d..2e54c526 100644 --- a/mods/betterMenuScreens.js +++ b/mods/betterMenuScreens.js @@ -5,6 +5,7 @@ * @property {string} buttonDescription Description that is shown when the button is hovered * @property {boolean} show Whether menu screen button should get shown on tool controls * @property {() => void} [close] Closing method. Optional + * @property {() => void} [preOpen] Method called before opening. Optional * @property {() => void} [open] Opening method. Optional * @property {() => void} [onClose] Method that gets called on close (except when menu is force closed, like when clicking on a different menu button). Optional * @property {() => void} [loader] Method that injects the menu screen into HTML. Can be set to ModScreen build method. Optional @@ -46,7 +47,7 @@ var menuScreens = { } } -closeMenu = (force) => { +closeMenu = (force = false) => { if (!showingMenu) return; const menu = menuScreens[showingMenu]; if (!menu) { @@ -68,6 +69,8 @@ closeMenu = (force) => { const inject = () => { const toolControls = document.getElementById("toolControls"); const buttons = []; + const style = document.createElement("style"); + document.head.appendChild(style); for (const key in menuScreens) { const element = menuScreens[key]; if (element.show) { @@ -77,6 +80,7 @@ const inject = () => { button.onclick = () => { if (showingMenu != key) { closeMenu(true); + if (element.preOpen) element.preOpen(); if (element.open) element.open(); else { const menuParent = document.getElementById(element.parentDiv); @@ -100,12 +104,32 @@ const inject = () => { } +/** + * + * @param {string} menu Menu do be opened + * @param {boolean} [closeCurrent] Whether it should forcefully close the current screen + */ +const openMenu = (menu, closeCurrent = false) => { + if (closeCurrent) closeMenu(true); + const menuScreen = menuScreens[menu]; + if (menuScreen) { + showingMenu = menu; + if (menuScreen.preOpen) menuScreen.preOpen(); + if (menuScreen.open) menuScreen.open(); + else { + const menuParent = document.getElementById(menuScreen.parentDiv); + menuParent.style.display = "block"; + } + } +} + class MenuScreen { constructor () { this.nodes = []; this.innerHtml = ""; this.showCloseButton = true; this.closeButtonText = "-"; + this.closeButtonClass = "XButton"; } /** @@ -123,6 +147,7 @@ class MenuScreen { */ setShowCloseButton(show) { this.showCloseButton = show; + return this; } /** @@ -131,6 +156,16 @@ class MenuScreen { */ setCloseButtonText(text = "-") { this.closeButtonText = text; + return this; + } + + /** + * Sets the close button class + * @param {string} [className] Close button class. "XButton" by default + */ + setCloseButtonClass(className = "XButton") { + this.closeButtonClass = className; + return this; } /** @@ -199,7 +234,6 @@ class MenuScreen { /** * Checks whether the menu screen is ready for build. That method should not be called outside of build method - * @private */ _check() { if (!this.parentDivId) throw "No parent div id specified"; @@ -218,12 +252,12 @@ class MenuScreen { parent.style.display = "none"; const inner = document.createElement("div"); inner.className = this.innerDivClass ?? "menuScreen"; - inner.innerHTML = `${this.showCloseButton ? ` + inner.innerHTML = `${this.showCloseButton ? ` ${this.title ?? "Menu Screen"}

"; - inner.append(this.nodes); + this.nodes.forEach(n => inner.querySelector(".menuText").appendChild(n)); parent.appendChild(inner); document.getElementById(id).appendChild(parent); } } -runAfterLoadList.push(inject); \ No newline at end of file +runAfterLoadList.push(inject);