* @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
* @module WoltLabSuite/Core/Controller/User/Notification/Settings
*/
-define(['Language', 'Ui/ReusableDropdown'], function (Language, UiReusableDropdown) {
- 'use strict';
- if (!COMPILER_TARGET_DEFAULT) {
- return function () { };
+define(["require", "exports", "tslib", "../../../Language", "../../../Ui/Dropdown/Reusable"], function (require, exports, tslib_1, Language, UiDropdownReusable) {
+ "use strict";
+ Object.defineProperty(exports, "__esModule", { value: true });
+ exports.init = void 0;
+ Language = tslib_1.__importStar(Language);
+ UiDropdownReusable = tslib_1.__importStar(UiDropdownReusable);
+ let _dropDownMenu;
+ let _objectId = 0;
+ function stateChange(event) {
+ const checkbox = event.currentTarget;
+ const objectId = ~~checkbox.dataset.objectId;
+ const emailSettingsType = document.querySelector(`.notificationSettingsEmailType[data-object-id="${objectId}"]`);
+ if (emailSettingsType !== null) {
+ if (checkbox.checked) {
+ emailSettingsType.classList.remove("disabled");
+ }
+ else {
+ emailSettingsType.classList.add("disabled");
+ }
+ }
}
- var _dropDownMenu = null;
- var _objectId = null;
- /**
- * @exports WoltLabSuite/Core/Controller/User/Notification/Settings
- */
- return {
- /**
- * Binds event listeners for all notifications supporting emails.
- */
- init: function () {
- elBySelAll('.jsCheckboxNotificationSettingsState', undefined, (function (checkbox) {
- checkbox.addEventListener('change', this._stateChange.bind(this));
- }).bind(this));
- elBySelAll('.notificationSettingsEmailType', undefined, (function (button) {
- button.addEventListener('click', this._click.bind(this));
- }).bind(this));
- },
- /**
- * @param {Event} event
- */
- _stateChange: function (event) {
- var objectId = elData(event.currentTarget, 'object-id');
- var emailSettingsType = elBySel('.notificationSettingsEmailType[data-object-id="' + objectId + '"]');
- if (emailSettingsType !== null) {
- emailSettingsType.classList[event.currentTarget.checked ? 'remove' : 'add']('disabled');
+ function click(event) {
+ event.preventDefault();
+ const button = event.currentTarget;
+ _objectId = ~~button.dataset.objectId;
+ createDropDown();
+ setCurrentEmailType(getCurrentEmailTypeInputElement().value);
+ showDropDown(button);
+ }
+ function createDropDown() {
+ if (_dropDownMenu) {
+ return;
+ }
+ _dropDownMenu = document.createElement("ul");
+ _dropDownMenu.className = "dropdownMenu";
+ ["instant", "daily", "divider", "none"].forEach((value) => {
+ const listItem = document.createElement("li");
+ if (value === "divider") {
+ listItem.className = "dropdownDivider";
+ }
+ else {
+ const link = document.createElement("a");
+ link.href = "#";
+ link.textContent = Language.get(`wcf.user.notification.mailNotificationType.${value}`);
+ listItem.appendChild(link);
+ listItem.dataset.value = value;
+ listItem.addEventListener("click", (ev) => setEmailType(ev));
}
- },
- /**
- * @param {Event} event event object
- */
- _click: function (event) {
- event.preventDefault();
- event.stopPropagation();
- var button = event.currentTarget;
- _objectId = ~~elData(button, 'object-id');
- this._createDropDown();
- this._setCurrentEmailType(this._getEmailTypeInputElement().value);
- this._showDropDown(button);
- },
- _createDropDown: function () {
- if (_dropDownMenu !== null) {
- return;
+ _dropDownMenu.appendChild(listItem);
+ });
+ UiDropdownReusable.init("UiNotificationSettingsEmailType", _dropDownMenu);
+ }
+ function setCurrentEmailType(currentValue) {
+ _dropDownMenu.querySelectorAll("li").forEach((button) => {
+ const value = button.dataset.value;
+ if (value === currentValue) {
+ button.classList.add("active");
}
- _dropDownMenu = elCreate('ul');
- _dropDownMenu.className = 'dropdownMenu';
- ['instant', 'daily', 'divider', 'none'].forEach((function (value) {
- var listItem = elCreate('li');
- if (value === 'divider') {
- listItem.className = 'dropdownDivider';
- }
- else {
- var link = elCreate('a');
- link.href = '#';
- link.textContent = Language.get('wcf.user.notification.mailNotificationType.' + value);
- listItem.appendChild(link);
- elData(listItem, 'value', value);
- listItem.addEventListener('click', this._setEmailType.bind(this));
- }
- _dropDownMenu.appendChild(listItem);
- }).bind(this));
- UiReusableDropdown.init('UiNotificationSettingsEmailType', _dropDownMenu);
- },
- _setCurrentEmailType: function (currentValue) {
- elBySelAll('li', _dropDownMenu, function (button) {
- var value = elData(button, 'value');
- button.classList[(value === currentValue) ? 'add' : 'remove']('active');
- });
- },
- _showDropDown: function (referenceElement) {
- UiReusableDropdown.toggleDropdown('UiNotificationSettingsEmailType', referenceElement);
- },
- /**
- * @param {Event} event event object
- */
- _setEmailType: function (event) {
- event.preventDefault();
- var value = elData(event.currentTarget, 'value');
- this._getEmailTypeInputElement().value = value;
- var button = elBySel('.notificationSettingsEmailType[data-object-id="' + _objectId + '"]');
- button.title = Language.get('wcf.user.notification.mailNotificationType.' + value);
- var icon = elBySel('.jsIconNotificationSettingsEmailType', button);
- icon.classList.remove('fa-clock-o');
- icon.classList.remove('fa-flash');
- icon.classList.remove('fa-times');
- icon.classList.remove('green');
- icon.classList.remove('red');
- switch (value) {
- case 'daily':
- icon.classList.add('fa-clock-o');
- icon.classList.add('green');
- break;
- case 'instant':
- icon.classList.add('fa-flash');
- icon.classList.add('green');
- break;
- case 'none':
- icon.classList.add('fa-times');
- icon.classList.add('red');
- break;
+ else {
+ button.classList.remove("active");
}
- _objectId = null;
- },
- /**
- * @return {HTMLInputElement}
- */
- _getEmailTypeInputElement: function () {
- return elById('settings_' + _objectId + '_mailNotificationType');
+ });
+ }
+ function showDropDown(referenceElement) {
+ UiDropdownReusable.toggleDropdown("UiNotificationSettingsEmailType", referenceElement);
+ }
+ function setEmailType(event) {
+ event.preventDefault();
+ const listItem = event.currentTarget;
+ const value = listItem.dataset.value;
+ getCurrentEmailTypeInputElement().value = value;
+ const button = document.querySelector(`.notificationSettingsEmailType[data-object-id="${_objectId}"]`);
+ button.title = Language.get(`wcf.user.notification.mailNotificationType.${value}`);
+ const icon = button.querySelector(".jsIconNotificationSettingsEmailType");
+ icon.classList.remove("fa-clock-o", "fa-flash", "fa-times", "green", "red");
+ switch (value) {
+ case "daily":
+ icon.classList.add("fa-clock-o", "green");
+ break;
+ case "instant":
+ icon.classList.add("fa-flash", "green");
+ break;
+ case "none":
+ icon.classList.add("fa-times", "red");
+ break;
}
- };
+ _objectId = 0;
+ }
+ function getCurrentEmailTypeInputElement() {
+ return document.getElementById(`settings_${_objectId}_mailNotificationType`);
+ }
+ /**
+ * Binds event listeners for all notifications supporting emails.
+ */
+ function init() {
+ document.querySelectorAll(".jsCheckboxNotificationSettingsState").forEach((checkbox) => {
+ checkbox.addEventListener("change", (ev) => stateChange(ev));
+ });
+ document.querySelectorAll(".notificationSettingsEmailType").forEach((button) => {
+ button.addEventListener("click", (ev) => click(ev));
+ });
+ }
+ exports.init = init;
});
+++ /dev/null
-/**
- * Handles email notification type for user notification settings.
- *
- * @author Alexander Ebert
- * @copyright 2001-2020 WoltLab GmbH
- * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
- * @module WoltLabSuite/Core/Controller/User/Notification/Settings
- */
-define(['Language', 'Ui/ReusableDropdown'], function (Language, UiReusableDropdown) {
- 'use strict';
-
- if (!COMPILER_TARGET_DEFAULT) {
- return function () {};
- }
-
- var _dropDownMenu = null;
- var _objectId = null;
-
- /**
- * @exports WoltLabSuite/Core/Controller/User/Notification/Settings
- */
- return {
- /**
- * Binds event listeners for all notifications supporting emails.
- */
- init: function () {
- elBySelAll('.jsCheckboxNotificationSettingsState', undefined, (function (checkbox) {
- checkbox.addEventListener('change', this._stateChange.bind(this));
- }).bind(this));
-
- elBySelAll('.notificationSettingsEmailType', undefined, (function (button) {
- button.addEventListener('click', this._click.bind(this));
- }).bind(this));
- },
-
- /**
- * @param {Event} event
- */
- _stateChange: function (event) {
- var objectId = elData(event.currentTarget, 'object-id');
- var emailSettingsType = elBySel('.notificationSettingsEmailType[data-object-id="' + objectId + '"]');
- if (emailSettingsType !== null) {
- emailSettingsType.classList[event.currentTarget.checked ? 'remove' : 'add']('disabled');
- }
- },
-
- /**
- * @param {Event} event event object
- */
- _click: function (event) {
- event.preventDefault();
- event.stopPropagation();
-
- var button = event.currentTarget;
- _objectId = ~~elData(button, 'object-id');
-
- this._createDropDown();
-
- this._setCurrentEmailType(this._getEmailTypeInputElement().value);
-
- this._showDropDown(button);
- },
-
- _createDropDown: function () {
- if (_dropDownMenu !== null) {
- return;
- }
-
- _dropDownMenu = elCreate('ul');
- _dropDownMenu.className = 'dropdownMenu';
-
- ['instant', 'daily', 'divider', 'none'].forEach((function (value) {
- var listItem = elCreate('li');
- if (value === 'divider') {
- listItem.className = 'dropdownDivider';
- }
- else {
- var link = elCreate('a');
- link.href = '#';
- link.textContent = Language.get('wcf.user.notification.mailNotificationType.' + value);
- listItem.appendChild(link);
- elData(listItem, 'value', value);
- listItem.addEventListener('click', this._setEmailType.bind(this));
- }
-
- _dropDownMenu.appendChild(listItem);
- }).bind(this));
-
- UiReusableDropdown.init('UiNotificationSettingsEmailType', _dropDownMenu);
- },
-
- _setCurrentEmailType: function (currentValue) {
- elBySelAll('li', _dropDownMenu, function (button) {
- var value = elData(button, 'value');
- button.classList[(value === currentValue) ? 'add' : 'remove']('active');
- });
- },
-
- _showDropDown: function (referenceElement) {
- UiReusableDropdown.toggleDropdown('UiNotificationSettingsEmailType', referenceElement);
- },
-
- /**
- * @param {Event} event event object
- */
- _setEmailType: function (event) {
- event.preventDefault();
-
- var value = elData(event.currentTarget, 'value');
-
- this._getEmailTypeInputElement().value = value;
-
- var button = elBySel('.notificationSettingsEmailType[data-object-id="' + _objectId + '"]');
- button.title = Language.get('wcf.user.notification.mailNotificationType.' + value);
-
- var icon = elBySel('.jsIconNotificationSettingsEmailType', button);
- icon.classList.remove('fa-clock-o');
- icon.classList.remove('fa-flash');
- icon.classList.remove('fa-times');
- icon.classList.remove('green');
- icon.classList.remove('red');
-
- switch (value) {
- case 'daily':
- icon.classList.add('fa-clock-o');
- icon.classList.add('green');
- break;
-
- case 'instant':
- icon.classList.add('fa-flash');
- icon.classList.add('green');
- break;
-
- case 'none':
- icon.classList.add('fa-times');
- icon.classList.add('red');
- break;
- }
-
- _objectId = null;
- },
-
- /**
- * @return {HTMLInputElement}
- */
- _getEmailTypeInputElement: function () {
- return elById('settings_' + _objectId + '_mailNotificationType');
- }
- };
-});
--- /dev/null
+/**
+ * Handles email notification type for user notification settings.
+ *
+ * @author Alexander Ebert
+ * @copyright 2001-2020 WoltLab GmbH
+ * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module WoltLabSuite/Core/Controller/User/Notification/Settings
+ */
+
+import * as Language from "../../../Language";
+import * as UiDropdownReusable from "../../../Ui/Dropdown/Reusable";
+
+let _dropDownMenu: HTMLUListElement;
+let _objectId = 0;
+
+function stateChange(event: Event): void {
+ const checkbox = event.currentTarget as HTMLInputElement;
+
+ const objectId = ~~checkbox.dataset.objectId!;
+ const emailSettingsType = document.querySelector(`.notificationSettingsEmailType[data-object-id="${objectId}"]`);
+ if (emailSettingsType !== null) {
+ if (checkbox.checked) {
+ emailSettingsType.classList.remove("disabled");
+ } else {
+ emailSettingsType.classList.add("disabled");
+ }
+ }
+}
+
+function click(event: Event): void {
+ event.preventDefault();
+
+ const button = event.currentTarget as HTMLAnchorElement;
+ _objectId = ~~button.dataset.objectId!;
+
+ createDropDown();
+
+ setCurrentEmailType(getCurrentEmailTypeInputElement().value);
+
+ showDropDown(button);
+}
+
+function createDropDown(): void {
+ if (_dropDownMenu) {
+ return;
+ }
+
+ _dropDownMenu = document.createElement("ul");
+ _dropDownMenu.className = "dropdownMenu";
+
+ ["instant", "daily", "divider", "none"].forEach((value) => {
+ const listItem = document.createElement("li");
+ if (value === "divider") {
+ listItem.className = "dropdownDivider";
+ } else {
+ const link = document.createElement("a");
+ link.href = "#";
+ link.textContent = Language.get(`wcf.user.notification.mailNotificationType.${value}`);
+ listItem.appendChild(link);
+ listItem.dataset.value = value;
+ listItem.addEventListener("click", (ev) => setEmailType(ev));
+ }
+
+ _dropDownMenu.appendChild(listItem);
+ });
+
+ UiDropdownReusable.init("UiNotificationSettingsEmailType", _dropDownMenu);
+}
+
+function setCurrentEmailType(currentValue: string): void {
+ _dropDownMenu.querySelectorAll("li").forEach((button) => {
+ const value = button.dataset.value!;
+ if (value === currentValue) {
+ button.classList.add("active");
+ } else {
+ button.classList.remove("active");
+ }
+ });
+}
+
+function showDropDown(referenceElement: HTMLAnchorElement): void {
+ UiDropdownReusable.toggleDropdown("UiNotificationSettingsEmailType", referenceElement);
+}
+
+function setEmailType(event: Event): void {
+ event.preventDefault();
+
+ const listItem = event.currentTarget as HTMLLIElement;
+ const value = listItem.dataset.value!;
+
+ getCurrentEmailTypeInputElement().value = value;
+
+ const button = document.querySelector(
+ `.notificationSettingsEmailType[data-object-id="${_objectId}"]`,
+ ) as HTMLLIElement;
+ button.title = Language.get(`wcf.user.notification.mailNotificationType.${value}`);
+
+ const icon = button.querySelector(".jsIconNotificationSettingsEmailType") as HTMLSpanElement;
+ icon.classList.remove("fa-clock-o", "fa-flash", "fa-times", "green", "red");
+
+ switch (value) {
+ case "daily":
+ icon.classList.add("fa-clock-o", "green");
+ break;
+
+ case "instant":
+ icon.classList.add("fa-flash", "green");
+ break;
+
+ case "none":
+ icon.classList.add("fa-times", "red");
+ break;
+ }
+
+ _objectId = 0;
+}
+
+function getCurrentEmailTypeInputElement(): HTMLInputElement {
+ return document.getElementById(`settings_${_objectId}_mailNotificationType`) as HTMLInputElement;
+}
+
+/**
+ * Binds event listeners for all notifications supporting emails.
+ */
+export function init(): void {
+ document.querySelectorAll(".jsCheckboxNotificationSettingsState").forEach((checkbox) => {
+ checkbox.addEventListener("change", (ev) => stateChange(ev));
+ });
+
+ document.querySelectorAll(".notificationSettingsEmailType").forEach((button) => {
+ button.addEventListener("click", (ev) => click(ev));
+ });
+}