Convert `Ui/Message/UserConsent` to TypeScript
authorAlexander Ebert <ebert@woltlab.com>
Thu, 5 Nov 2020 17:20:09 +0000 (18:20 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Thu, 5 Nov 2020 17:20:09 +0000 (18:20 +0100)
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/UserConsent.js
wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.js [deleted file]
wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts [new file with mode: 0644]

index 0c006f491ca59591dd66668f7ee2bc2d8b3152d3..289b7b5d8742e25318769d7a409dce3215e25e26 100644 (file)
@@ -6,60 +6,69 @@
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module      WoltLabSuite/Core/Ui/Message/UserConsent
  */
-define(['Ajax', 'Core', 'User', 'Dom/ChangeListener', 'Dom/Util'], function (Ajax, Core, User, DomChangeListener, DomUtil) {
-    var _enableAll = false;
-    var _knownButtons = (typeof window.WeakSet === 'function') ? new window.WeakSet() : new window.Set();
-    return {
-        init: function () {
-            if (window.sessionStorage.getItem(Core.getStoragePrefix() + 'user-consent') === 'all') {
-                _enableAll = true;
+define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Change/Listener", "../../Dom/Util", "../../User"], function (require, exports, tslib_1, Ajax, Core, Listener_1, Util_1, User_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.init = void 0;
+    Ajax = tslib_1.__importStar(Ajax);
+    Core = tslib_1.__importStar(Core);
+    Listener_1 = tslib_1.__importDefault(Listener_1);
+    Util_1 = tslib_1.__importDefault(Util_1);
+    User_1 = tslib_1.__importDefault(User_1);
+    class UserConsent {
+        constructor() {
+            this.enableAll = false;
+            this.knownButtons = new WeakSet();
+            if (window.sessionStorage.getItem(`${Core.getStoragePrefix()}user-consent`) === "all") {
+                this.enableAll = true;
             }
-            this._registerEventListeners();
-            DomChangeListener.add('WoltLabSuite/Core/Ui/Message/UserConsent', this._registerEventListeners.bind(this));
-        },
-        _registerEventListeners: function () {
-            if (_enableAll) {
-                this._enableAll();
+            this.registerEventListeners();
+            Listener_1.default.add("WoltLabSuite/Core/Ui/Message/UserConsent", () => this.registerEventListeners());
+        }
+        registerEventListeners() {
+            if (this.enableAll) {
+                this.enableAllExternalMedia();
             }
             else {
-                elBySelAll('.jsButtonMessageUserConsentEnable', undefined, (function (button) {
-                    if (!_knownButtons.has(button)) {
-                        button.addEventListener('click', this._click.bind(this));
-                        _knownButtons.add(button);
+                document.querySelectorAll(".jsButtonMessageUserConsentEnable").forEach((button) => {
+                    if (!this.knownButtons.has(button)) {
+                        this.knownButtons.add(button);
+                        button.addEventListener("click", (ev) => this.click(ev));
                     }
-                }).bind(this));
+                });
             }
-        },
-        /**
-         * @param {Event} event
-         */
-        _click: function (event) {
+        }
+        click(event) {
             event.preventDefault();
-            _enableAll = true;
-            this._enableAll();
-            if (User.userId) {
+            this.enableAll = true;
+            this.enableAllExternalMedia();
+            if (User_1.default.userId) {
                 Ajax.apiOnce({
                     data: {
-                        actionName: 'saveUserConsent',
-                        className: 'wcf\\data\\user\\UserAction'
+                        actionName: "saveUserConsent",
+                        className: "wcf\\data\\user\\UserAction",
                     },
-                    silent: true
+                    silent: true,
                 });
             }
             else {
-                window.sessionStorage.setItem(Core.getStoragePrefix() + 'user-consent', 'all');
+                window.sessionStorage.setItem(`${Core.getStoragePrefix()}user-consent`, "all");
             }
-        },
-        /**
-         * @param {Element} container
-         */
-        _enableExternalMedia: function (container) {
-            var payload = atob(elData(container, 'payload'));
-            DomUtil.insertHtml(payload, container, 'before');
-            elRemove(container);
-        },
-        _enableAll: function () {
-            elBySelAll('.messageUserConsent', undefined, this._enableExternalMedia.bind(this));
         }
-    };
+        enableExternalMedia(container) {
+            const payload = atob(container.dataset.payload);
+            Util_1.default.insertHtml(payload, container, "before");
+            container.remove();
+        }
+        enableAllExternalMedia() {
+            document.querySelectorAll(".messageUserConsent").forEach((el) => this.enableExternalMedia(el));
+        }
+    }
+    let userConsent;
+    function init() {
+        if (!userConsent) {
+            userConsent = new UserConsent();
+        }
+    }
+    exports.init = init;
 });
diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.js b/wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.js
deleted file mode 100644 (file)
index 59c10ce..0000000
+++ /dev/null
@@ -1,79 +0,0 @@
-/**
- * Prompts the user for their consent before displaying external media.
- * 
- * @author      Alexander Ebert
- * @copyright   2001-2020 WoltLab GmbH
- * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
- * @module      WoltLabSuite/Core/Ui/Message/UserConsent
- */
-define(['Ajax', 'Core', 'User', 'Dom/ChangeListener', 'Dom/Util'], function (Ajax, Core, User, DomChangeListener, DomUtil) {
-       var _enableAll = false;
-       var _knownButtons = (typeof window.WeakSet === 'function') ? new window.WeakSet() : new window.Set();
-       
-       return {
-               init: function () {
-                       if (window.sessionStorage.getItem(Core.getStoragePrefix() + 'user-consent') === 'all') {
-                               _enableAll = true;
-                       }
-                       
-                       this._registerEventListeners();
-                       
-                       DomChangeListener.add(
-                               'WoltLabSuite/Core/Ui/Message/UserConsent',
-                               this._registerEventListeners.bind(this)
-                       );
-               },
-               
-               _registerEventListeners: function () {
-                       if (_enableAll) {
-                               this._enableAll();
-                       }
-                       else {
-                               elBySelAll('.jsButtonMessageUserConsentEnable', undefined, (function (button) {
-                                       if (!_knownButtons.has(button)) {
-                                               button.addEventListener('click', this._click.bind(this));
-                                               _knownButtons.add(button);
-                                       }
-                               }).bind(this));
-                       }
-               },
-               
-               /**
-                * @param {Event} event
-                */
-               _click: function (event) {
-                       event.preventDefault();
-                       
-                       _enableAll = true;
-                       
-                       this._enableAll();
-                       
-                       if (User.userId) {
-                               Ajax.apiOnce({
-                                       data: {
-                                               actionName: 'saveUserConsent',
-                                               className: 'wcf\\data\\user\\UserAction'
-                                       },
-                                       silent: true
-                               });
-                       }
-                       else {
-                               window.sessionStorage.setItem(Core.getStoragePrefix() + 'user-consent', 'all');
-                       }
-               },
-               
-               /**
-                * @param {Element} container
-                */
-               _enableExternalMedia: function (container) {
-                       var payload = atob(elData(container, 'payload'));
-                       
-                       DomUtil.insertHtml(payload, container, 'before');
-                       elRemove(container);
-               },
-               
-               _enableAll: function () {
-                       elBySelAll('.messageUserConsent', undefined, this._enableExternalMedia.bind(this));
-               }
-       };
-});
diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts b/wcfsetup/install/files/ts/WoltLabSuite/Core/Ui/Message/UserConsent.ts
new file mode 100644 (file)
index 0000000..723df19
--- /dev/null
@@ -0,0 +1,82 @@
+/**
+ * Prompts the user for their consent before displaying external media.
+ *
+ * @author      Alexander Ebert
+ * @copyright   2001-2020 WoltLab GmbH
+ * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module      WoltLabSuite/Core/Ui/Message/UserConsent
+ */
+
+import * as Ajax from "../../Ajax";
+import * as Core from "../../Core";
+import DomChangeListener from "../../Dom/Change/Listener";
+import DomUtil from "../../Dom/Util";
+import User from "../../User";
+
+class UserConsent {
+  private enableAll = false;
+  private readonly knownButtons = new WeakSet();
+
+  constructor() {
+    if (window.sessionStorage.getItem(`${Core.getStoragePrefix()}user-consent`) === "all") {
+      this.enableAll = true;
+    }
+
+    this.registerEventListeners();
+
+    DomChangeListener.add("WoltLabSuite/Core/Ui/Message/UserConsent", () => this.registerEventListeners());
+  }
+
+  private registerEventListeners(): void {
+    if (this.enableAll) {
+      this.enableAllExternalMedia();
+    } else {
+      document.querySelectorAll(".jsButtonMessageUserConsentEnable").forEach((button: HTMLAnchorElement) => {
+        if (!this.knownButtons.has(button)) {
+          this.knownButtons.add(button);
+
+          button.addEventListener("click", (ev) => this.click(ev));
+        }
+      });
+    }
+  }
+
+  private click(event: MouseEvent): void {
+    event.preventDefault();
+
+    this.enableAll = true;
+
+    this.enableAllExternalMedia();
+
+    if (User.userId) {
+      Ajax.apiOnce({
+        data: {
+          actionName: "saveUserConsent",
+          className: "wcf\\data\\user\\UserAction",
+        },
+        silent: true,
+      });
+    } else {
+      window.sessionStorage.setItem(`${Core.getStoragePrefix()}user-consent`, "all");
+    }
+  }
+
+  private enableExternalMedia(container: HTMLElement): void {
+    const payload = atob(container.dataset.payload!);
+
+    DomUtil.insertHtml(payload, container, "before");
+    container.remove();
+  }
+
+  private enableAllExternalMedia(): void {
+    document.querySelectorAll(".messageUserConsent").forEach((el: HTMLElement) => this.enableExternalMedia(el));
+  }
+}
+
+let userConsent: UserConsent;
+
+export function init(): void {
+  if (!userConsent) {
+    userConsent = new UserConsent();
+  }
+}