From 44a8b98ba454c781e7bf0b83f4537d02e9c6c651 Mon Sep 17 00:00:00 2001 From: Matthias Schmidt Date: Sat, 12 Dec 2020 16:04:41 +0100 Subject: [PATCH] Convert `Form/Builder/Field/Dependency/Container/TabMenu` to TypeScript --- .../Field/Dependency/Container/TabMenu.js | 56 ++++++++--------- .../Field/Dependency/Container/TabMenu.js | 60 ------------------- .../Field/Dependency/Container/TabMenu.ts | 52 ++++++++++++++++ 3 files changed, 76 insertions(+), 92 deletions(-) delete mode 100644 wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js create mode 100644 wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.ts diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js index 11c799a6db..b6dafd9c82 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js @@ -2,53 +2,45 @@ * Container visibility handler implementation for a tab menu that checks visibility * based on the visibility of its tab menu list items. * - * @author Matthias Schmidt - * @copyright 2001-2019 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu - * @see module:WoltLabSuite/Core/Form/Builder/Field/Dependency/Abstract + * @author Matthias Schmidt + * @copyright 2001-2020 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu + * @see module:WoltLabSuite/Core/Form/Builder/Field/Dependency/Abstract * @since 5.2 */ -define(['./Abstract', 'Core', 'Dom/Util', '../Manager', 'Ui/TabMenu'], function (Abstract, Core, DomUtil, DependencyManager, UiTabMenu) { +define(["require", "exports", "tslib", "./Abstract", "../Manager", "../../../../../Dom/Util", "../../../../../Ui/TabMenu", "../../../../../Core"], function (require, exports, tslib_1, Abstract_1, Manager_1, DomUtil, UiTabMenu, Core) { "use strict"; - /** - * @constructor - */ - function TabMenu(containerId) { - this.init(containerId); - } - ; - Core.inherit(TabMenu, Abstract, { - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/Default#checkContainer - */ - checkContainer: function () { + Abstract_1 = tslib_1.__importDefault(Abstract_1); + Manager_1 = tslib_1.__importDefault(Manager_1); + DomUtil = tslib_1.__importStar(DomUtil); + UiTabMenu = tslib_1.__importStar(UiTabMenu); + Core = tslib_1.__importStar(Core); + class TabMenu extends Abstract_1.default { + checkContainer() { // only consider containers that have not been hidden by their own dependencies - if (DependencyManager.isHiddenByDependencies(this._container)) { + if (Manager_1.default.isHiddenByDependencies(this._container)) { return; } - var containerIsVisible = !elIsHidden(this._container); - var containerShouldBeVisible = false; - var tabMenuListItems = elBySelAll('#' + DomUtil.identify(this._container) + ' > nav > ul > li', this._container.parentNode); - for (var i = 0, length = tabMenuListItems.length; i < length; i++) { - if (!elIsHidden(tabMenuListItems[i])) { - containerShouldBeVisible = true; - break; - } - } + const containerIsVisible = this._container.style.display !== "none"; + const listItems = this._container.parentNode.querySelectorAll("#" + DomUtil.identify(this._container) + " > nav > ul > li"); + const containerShouldBeVisible = Array.from(listItems).some((child) => { + return child.style.display !== "none"; + }); if (containerIsVisible !== containerShouldBeVisible) { if (containerShouldBeVisible) { - elShow(this._container); + this._container.style.display = "block"; UiTabMenu.getTabMenu(DomUtil.identify(this._container)).selectFirstVisible(); } else { - elHide(this._container); + this._container.style.display = "none"; } // check containers again to make sure parent containers can react to // changing the visibility of this container - DependencyManager.checkContainers(); + Manager_1.default.checkContainers(); } } - }); + } + Core.enableLegacyInheritance(TabMenu); return TabMenu; }); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js b/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js deleted file mode 100644 index 1602b8f6f8..0000000000 --- a/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.js +++ /dev/null @@ -1,60 +0,0 @@ -/** - * Container visibility handler implementation for a tab menu that checks visibility - * based on the visibility of its tab menu list items. - * - * @author Matthias Schmidt - * @copyright 2001-2019 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu - * @see module:WoltLabSuite/Core/Form/Builder/Field/Dependency/Abstract - * @since 5.2 - */ -define(['./Abstract', 'Core', 'Dom/Util', '../Manager', 'Ui/TabMenu'], function(Abstract, Core, DomUtil, DependencyManager, UiTabMenu) { - "use strict"; - - /** - * @constructor - */ - function TabMenu(containerId) { - this.init(containerId); - }; - Core.inherit(TabMenu, Abstract, { - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/Default#checkContainer - */ - checkContainer: function() { - // only consider containers that have not been hidden by their own dependencies - if (DependencyManager.isHiddenByDependencies(this._container)) { - return; - } - - var containerIsVisible = !elIsHidden(this._container); - var containerShouldBeVisible = false; - - var tabMenuListItems = elBySelAll('#' + DomUtil.identify(this._container) + ' > nav > ul > li', this._container.parentNode); - for (var i = 0, length = tabMenuListItems.length; i < length; i++) { - if (!elIsHidden(tabMenuListItems[i])) { - containerShouldBeVisible = true; - break; - } - } - - if (containerIsVisible !== containerShouldBeVisible) { - if (containerShouldBeVisible) { - elShow(this._container); - - UiTabMenu.getTabMenu(DomUtil.identify(this._container)).selectFirstVisible(); - } - else { - elHide(this._container); - } - - // check containers again to make sure parent containers can react to - // changing the visibility of this container - DependencyManager.checkContainers(); - } - } - }); - - return TabMenu; -}); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.ts b/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.ts new file mode 100644 index 0000000000..cf132631bd --- /dev/null +++ b/wcfsetup/install/files/ts/WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu.ts @@ -0,0 +1,52 @@ +/** + * Container visibility handler implementation for a tab menu that checks visibility + * based on the visibility of its tab menu list items. + * + * @author Matthias Schmidt + * @copyright 2001-2020 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Form/Builder/Field/Dependency/Container/TabMenu + * @see module:WoltLabSuite/Core/Form/Builder/Field/Dependency/Abstract + * @since 5.2 + */ + +import Abstract from "./Abstract"; +import DependencyManager from "../Manager"; +import * as DomUtil from "../../../../../Dom/Util"; +import * as UiTabMenu from "../../../../../Ui/TabMenu"; +import * as Core from "../../../../../Core"; + +class TabMenu extends Abstract { + public checkContainer(): void { + // only consider containers that have not been hidden by their own dependencies + if (DependencyManager.isHiddenByDependencies(this._container)) { + return; + } + + const containerIsVisible = this._container.style.display !== "none"; + const listItems = this._container.parentNode!.querySelectorAll( + "#" + DomUtil.identify(this._container) + " > nav > ul > li", + ); + const containerShouldBeVisible = Array.from(listItems).some((child: HTMLElement) => { + return child.style.display !== "none"; + }); + + if (containerIsVisible !== containerShouldBeVisible) { + if (containerShouldBeVisible) { + this._container.style.display = "block"; + + UiTabMenu.getTabMenu(DomUtil.identify(this._container))!.selectFirstVisible(); + } else { + this._container.style.display = "none"; + } + + // check containers again to make sure parent containers can react to + // changing the visibility of this container + DependencyManager.checkContainers(); + } + } +} + +Core.enableLegacyInheritance(TabMenu); + +export = TabMenu; -- 2.20.1