Convert `Acp/Ui/Page/Add` to TypeScript
authorAlexander Ebert <ebert@woltlab.com>
Sun, 29 Nov 2020 23:45:20 +0000 (00:45 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Sun, 29 Nov 2020 23:45:20 +0000 (00:45 +0100)
wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Page/Add.js
wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.js [deleted file]
wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.ts [new file with mode: 0644]

index 8153cb549708e54d78c904948e47e2810b9343cc..76376741eac68c62843fa189e85281286508f64e 100644 (file)
@@ -1,58 +1,73 @@
 /**
  * Provides the dialog overlay to add a new page.
  *
- * @author     Alexander Ebert
- * @copyright  2001-2019 WoltLab GmbH
- * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
- * @module     WoltLabSuite/Core/Acp/Ui/Page/Add
+ * @author  Alexander Ebert
+ * @copyright  2001-2019 WoltLab GmbH
+ * @license  GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module  WoltLabSuite/Core/Acp/Ui/Page/Add
  */
-define(['Core', 'Language', 'Ui/Dialog'], function (Core, Language, UiDialog) {
+define(["require", "exports", "tslib", "../../../Language", "../../../Ui/Dialog"], function (require, exports, tslib_1, Language, Dialog_1) {
     "use strict";
-    var _languages, _link;
-    /**
-     * @exports     WoltLabSuite/Core/Acp/Ui/Page/Add
-     */
-    return {
-        /**
-         * Initializes the page add handler.
-         *
-         * @param       {string}        link            redirect URL
-         * @param       {int}           languages       number of available languages
-         */
-        init: function (link, languages) {
-            _languages = languages;
-            _link = link;
-            var buttons = elBySelAll('.jsButtonPageAdd');
-            for (var i = 0, length = buttons.length; i < length; i++) {
-                buttons[i].addEventListener('click', this.openDialog.bind(this));
-            }
-        },
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.openDialog = exports.init = void 0;
+    Language = tslib_1.__importStar(Language);
+    Dialog_1 = tslib_1.__importDefault(Dialog_1);
+    class AcpUiPageAdd {
+        constructor(link, isI18n) {
+            this.link = link;
+            this.isI18n = isI18n;
+            document.querySelectorAll(".jsButtonPageAdd").forEach((button) => {
+                button.addEventListener("click", (ev) => this.openDialog(ev));
+            });
+        }
         /**
          * Opens the 'Add Page' dialog.
-         *
-         * @param       {Event=}        event   event object
          */
-        openDialog: function (event) {
+        openDialog(event) {
             if (event instanceof Event) {
                 event.preventDefault();
             }
-            UiDialog.open(this);
-        },
-        _dialogSetup: function () {
+            Dialog_1.default.open(this);
+        }
+        _dialogSetup() {
             return {
-                id: 'pageAddDialog',
+                id: "pageAddDialog",
                 options: {
-                    onSetup: function (content) {
-                        elBySel('button', content).addEventListener('click', function (event) {
+                    onSetup: (content) => {
+                        const button = content.querySelector("button");
+                        button.addEventListener("click", (event) => {
                             event.preventDefault();
-                            var pageType = elBySel('input[name="pageType"]:checked', content).value;
-                            var isMultilingual = (_languages > 1) ? elBySel('input[name="isMultilingual"]:checked', content).value : 0;
-                            window.location = _link.replace(/{\$pageType}/, pageType).replace(/{\$isMultilingual}/, isMultilingual);
+                            const pageType = content.querySelector('input[name="pageType"]:checked').value;
+                            let isMultilingual = "0";
+                            if (this.isI18n) {
+                                isMultilingual = content.querySelector('input[name="isMultilingual"]:checked')
+                                    .value;
+                            }
+                            window.location.href = this.link
+                                .replace("{$pageType}", pageType)
+                                .replace("{$isMultilingual}", isMultilingual);
                         });
                     },
-                    title: Language.get('wcf.acp.page.add')
-                }
+                    title: Language.get("wcf.acp.page.add"),
+                },
             };
         }
-    };
+    }
+    let acpUiPageAdd;
+    /**
+     * Initializes the page add handler.
+     */
+    function init(link, languages) {
+        if (!acpUiPageAdd) {
+            acpUiPageAdd = new AcpUiPageAdd(link, languages > 0);
+        }
+    }
+    exports.init = init;
+    /**
+     * Opens the 'Add Page' dialog.
+     */
+    function openDialog() {
+        acpUiPageAdd.openDialog();
+    }
+    exports.openDialog = openDialog;
 });
diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.js b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.js
deleted file mode 100644 (file)
index c355a9c..0000000
+++ /dev/null
@@ -1,66 +0,0 @@
-/**
- * Provides the dialog overlay to add a new page.
- * 
- * @author     Alexander Ebert
- * @copyright  2001-2019 WoltLab GmbH
- * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
- * @module     WoltLabSuite/Core/Acp/Ui/Page/Add
- */
-define(['Core', 'Language', 'Ui/Dialog'], function(Core, Language, UiDialog) {
-       "use strict";
-       
-       var _languages, _link;
-       
-       /**
-        * @exports     WoltLabSuite/Core/Acp/Ui/Page/Add
-        */
-       return {
-               /**
-                * Initializes the page add handler.
-                * 
-                * @param       {string}        link            redirect URL
-                * @param       {int}           languages       number of available languages
-                */
-               init: function(link, languages) {
-                       _languages = languages;
-                       _link = link;
-                       
-                       var buttons = elBySelAll('.jsButtonPageAdd');
-                       for (var i = 0, length = buttons.length; i < length; i++) {
-                               buttons[i].addEventListener('click', this.openDialog.bind(this));
-                       }
-               },
-               
-               /**
-                * Opens the 'Add Page' dialog.
-                * 
-                * @param       {Event=}        event   event object
-                */
-               openDialog: function(event) {
-                       if (event instanceof Event) {
-                               event.preventDefault();
-                       }
-                       
-                       UiDialog.open(this);
-               },
-               
-               _dialogSetup: function() {
-                       return {
-                               id: 'pageAddDialog',
-                               options: {
-                                       onSetup: function(content) {
-                                               elBySel('button', content).addEventListener('click', function(event) {
-                                                       event.preventDefault();
-                                                       
-                                                       var pageType = elBySel('input[name="pageType"]:checked', content).value;
-                                                       var isMultilingual = (_languages > 1) ? elBySel('input[name="isMultilingual"]:checked', content).value : 0;
-                                                       
-                                                       window.location = _link.replace(/{\$pageType}/, pageType).replace(/{\$isMultilingual}/, isMultilingual);
-                                               });
-                                       },
-                                       title: Language.get('wcf.acp.page.add')
-                               }
-                       };
-               }
-       };
-});
diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.ts b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Page/Add.ts
new file mode 100644 (file)
index 0000000..df7eb89
--- /dev/null
@@ -0,0 +1,81 @@
+/**
+ * Provides the dialog overlay to add a new page.
+ *
+ * @author  Alexander Ebert
+ * @copyright  2001-2019 WoltLab GmbH
+ * @license  GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module  WoltLabSuite/Core/Acp/Ui/Page/Add
+ */
+
+import { DialogCallbackObject } from "../../../Ui/Dialog/Data";
+import * as Language from "../../../Language";
+import UiDialog from "../../../Ui/Dialog";
+
+class AcpUiPageAdd implements DialogCallbackObject {
+  private readonly isI18n: boolean;
+  private readonly link: string;
+
+  constructor(link: string, isI18n: boolean) {
+    this.link = link;
+    this.isI18n = isI18n;
+
+    document.querySelectorAll(".jsButtonPageAdd").forEach((button: HTMLAnchorElement) => {
+      button.addEventListener("click", (ev) => this.openDialog(ev));
+    });
+  }
+
+  /**
+   * Opens the 'Add Page' dialog.
+   */
+  openDialog(event?: MouseEvent): void {
+    if (event instanceof Event) {
+      event.preventDefault();
+    }
+
+    UiDialog.open(this);
+  }
+
+  _dialogSetup() {
+    return {
+      id: "pageAddDialog",
+      options: {
+        onSetup: (content) => {
+          const button = content.querySelector("button") as HTMLButtonElement;
+          button.addEventListener("click", (event) => {
+            event.preventDefault();
+
+            const pageType = (content.querySelector('input[name="pageType"]:checked') as HTMLInputElement).value;
+            let isMultilingual = "0";
+            if (this.isI18n) {
+              isMultilingual = (content.querySelector('input[name="isMultilingual"]:checked') as HTMLInputElement)
+                .value;
+            }
+
+            window.location.href = this.link
+              .replace("{$pageType}", pageType)
+              .replace("{$isMultilingual}", isMultilingual);
+          });
+        },
+        title: Language.get("wcf.acp.page.add"),
+      },
+    };
+  }
+}
+
+let acpUiPageAdd: AcpUiPageAdd;
+
+/**
+ * Initializes the page add handler.
+ */
+export function init(link: string, languages: number): void {
+  if (!acpUiPageAdd) {
+    acpUiPageAdd = new AcpUiPageAdd(link, languages > 0);
+  }
+}
+
+/**
+ * Opens the 'Add Page' dialog.
+ */
+export function openDialog(): void {
+  acpUiPageAdd.openDialog();
+}