From f0d272a3323516d7f2b58db2d261e89b22850703 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Sun, 29 Nov 2020 19:48:55 +0100 Subject: [PATCH] Convert `Acp/Ui/Option/EmailSmtpTest` to TypeScript --- .../Core/Acp/Ui/Option/EmailSmtpTest.js | 178 ++++++++++-------- .../Core/Acp/Ui/Option/EmailSmtpTest.js | 125 ------------ .../Core/Acp/Ui/Option/EmailSmtpTest.ts | 155 +++++++++++++++ 3 files changed, 254 insertions(+), 204 deletions(-) delete mode 100644 wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js create mode 100644 wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js index e006a1c204..e409109567 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js @@ -1,105 +1,125 @@ /** * Simple SMTP connection testing. * - * @author Alexander Ebert - * @copyright 2001-2018 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest + * @author Alexander Ebert + * @copyright 2001-2018 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest */ -define(['Ajax', 'Core', 'Language'], function (Ajax, Core, Language) { +define(["require", "exports", "tslib", "../../../Ajax", "../../../Dom/Util", "../../../Language"], function (require, exports, tslib_1, Ajax, Util_1, Language) { "use strict"; - var _buttonRunTest = null; - var _container = null; - return { - init: function () { - var smtpCheckbox = null; - var methods = elBySelAll('input[name="values[mail_send_method]"]', undefined, (function (radioCheckbox) { - radioCheckbox.addEventListener('change', this._onChange.bind(this)); - if (radioCheckbox.value === 'smtp') - smtpCheckbox = radioCheckbox; - }).bind(this)); + Object.defineProperty(exports, "__esModule", { value: true }); + exports.init = void 0; + Ajax = tslib_1.__importStar(Ajax); + Util_1 = tslib_1.__importDefault(Util_1); + Language = tslib_1.__importStar(Language); + class EmailSmtpTest { + constructor() { + let smtpCheckbox = null; + const methods = document.querySelectorAll('input[name="values[mail_send_method]"]'); + methods.forEach((checkbox) => { + checkbox.addEventListener("change", () => this.onChange(checkbox)); + if (checkbox.value === "smtp") { + smtpCheckbox = checkbox; + } + }); // This configuration part is unavailable when running in enterprise mode. if (methods.length === 0) { return; } - Core.triggerEvent(smtpCheckbox, 'change'); - }, - _onChange: function (event) { - var checkbox = event.currentTarget; - if (checkbox.value === 'smtp' && checkbox.checked) { - if (_container === null) - this._initUi(checkbox); - elShow(_container); + if (smtpCheckbox) { + this.onChange(smtpCheckbox); } - else if (_container !== null) { - elHide(_container); + this.container = document.createElement("div"); + this.container.innerHTML = `
${Language.get("wcf.acp.email.smtp.test")}
+
+ ${Language.get("wcf.acp.email.smtp.test.run")} + ${Language.get("wcf.acp.email.smtp.test.description")} +
`; + this.buttonRunTest = this.container.querySelector("a"); + this.buttonRunTest.addEventListener("click", (ev) => this.onClick(ev)); + } + onChange(checkbox) { + if (checkbox.value === "smtp" && checkbox.checked) { + if (this.container.parentElement === null) { + this.initUi(checkbox); + } + Util_1.default.show(this.container); + } + else if (this.container.parentElement !== null) { + Util_1.default.hide(this.container); } - }, - _initUi: function (checkbox) { - var html = '
' + Language.get('wcf.acp.email.smtp.test') + '
'; - html += '
'; - html += '' + Language.get('wcf.acp.email.smtp.test.run') + ''; - html += '' + Language.get('wcf.acp.email.smtp.test.description') + ''; - html += '
'; - _container = elCreate('dl'); - _container.innerHTML = html; - _buttonRunTest = elBySel('a', _container); - _buttonRunTest.addEventListener('click', this._onClick.bind(this)); - var insertAfter = checkbox.closest('dl'); - insertAfter.parentNode.insertBefore(_container, insertAfter.nextSibling); - }, - _onClick: function (event) { + } + initUi(checkbox) { + const insertAfter = checkbox.closest("dl"); + insertAfter.insertAdjacentElement("afterend", this.container); + } + onClick(event) { event.preventDefault(); - _buttonRunTest.disabled = true; - _buttonRunTest.innerHTML = ' ' + Language.get('wcf.global.loading'); - elInnerError(_buttonRunTest, false); - window.setTimeout((function () { - var startTls = elBySel('input[name="values[mail_smtp_starttls]"]:checked'); + this.buttonRunTest.classList.add("disabled"); + this.buttonRunTest.innerHTML = ` ${Language.get("wcf.global.loading")}`; + Util_1.default.innerError(this.buttonRunTest, false); + window.setTimeout(() => { + const startTls = document.querySelector('input[name="values[mail_smtp_starttls]"]:checked'); + const host = document.getElementById("mail_smtp_host"); + const port = document.getElementById("mail_smtp_port"); + const user = document.getElementById("mail_smtp_user"); + const password = document.getElementById("mail_smtp_password"); Ajax.api(this, { parameters: { - host: elById('mail_smtp_host').value, - port: elById('mail_smtp_port').value, - startTls: (startTls) ? startTls.value : '', - user: elById('mail_smtp_user').value, - password: elById('mail_smtp_password').value - } + host: host.value, + port: port.value, + startTls: startTls ? startTls.value : "", + user: user.value, + password: password.value, + }, }); - }).bind(this), 100); - }, - _ajaxSuccess: function (data) { - var result = data.returnValues.validationResult; - if (result === '') { - this._resetButton(true); + }, 100); + } + _ajaxSuccess(data) { + const result = data.returnValues.validationResult; + if (result === "") { + this.resetButton(true); } else { - this._resetButton(false, result); + this.resetButton(false, result); } - }, - _ajaxFailure: function (data) { - var result = ''; + } + _ajaxFailure(data) { + let result = ""; if (data && data.returnValues && data.returnValues.fieldName) { - result = Language.get('wcf.acp.email.smtp.test.error.empty.' + data.returnValues.fieldName); + result = Language.get(`wcf.acp.email.smtp.test.error.empty.${data.returnValues.fieldName}`); } - this._resetButton(false, result); - return (result === ''); - }, - _resetButton: function (success, errorMessage) { - _buttonRunTest.disabled = false; - if (success) - _buttonRunTest.innerHTML = ' ' + Language.get('wcf.acp.email.smtp.test.run.success'); - else - _buttonRunTest.innerHTML = Language.get('wcf.acp.email.smtp.test.run'); - if (errorMessage) - elInnerError(_buttonRunTest, errorMessage); - }, - _ajaxSetup: function () { + this.resetButton(false, result); + return result === ""; + } + resetButton(success, errorMessage) { + this.buttonRunTest.classList.remove("disabled"); + if (success) { + this.buttonRunTest.innerHTML = ` ${Language.get("wcf.acp.email.smtp.test.run.success")}`; + } + else { + this.buttonRunTest.innerHTML = Language.get("wcf.acp.email.smtp.test.run"); + } + if (errorMessage) { + Util_1.default.innerError(this.buttonRunTest, errorMessage); + } + } + _ajaxSetup() { return { data: { - actionName: 'emailSmtpTest', - className: 'wcf\\data\\option\\OptionAction' + actionName: "emailSmtpTest", + className: "wcf\\data\\option\\OptionAction", }, - silent: true + silent: true, }; } - }; + } + let emailSmtpTest; + function init() { + if (!emailSmtpTest) { + emailSmtpTest = new EmailSmtpTest(); + } + } + exports.init = init; }); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js deleted file mode 100644 index cc59cfcd8c..0000000000 --- a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.js +++ /dev/null @@ -1,125 +0,0 @@ -/** - * Simple SMTP connection testing. - * - * @author Alexander Ebert - * @copyright 2001-2018 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest - */ -define(['Ajax', 'Core', 'Language'], function(Ajax, Core, Language) { - "use strict"; - - var _buttonRunTest = null; - var _container = null; - - return { - init: function () { - var smtpCheckbox = null; - var methods = elBySelAll('input[name="values[mail_send_method]"]', undefined, (function (radioCheckbox) { - radioCheckbox.addEventListener('change', this._onChange.bind(this)); - - if (radioCheckbox.value === 'smtp') smtpCheckbox = radioCheckbox; - }).bind(this)); - - // This configuration part is unavailable when running in enterprise mode. - if (methods.length === 0) { - return; - } - - Core.triggerEvent(smtpCheckbox, 'change'); - }, - - _onChange: function (event) { - var checkbox = event.currentTarget; - - if (checkbox.value === 'smtp' && checkbox.checked) { - if (_container === null) this._initUi(checkbox); - - elShow(_container); - } - else if (_container !== null) { - elHide(_container); - } - }, - - _initUi: function (checkbox) { - var html = '
' + Language.get('wcf.acp.email.smtp.test') + '
'; - html += '
'; - html += '' + Language.get('wcf.acp.email.smtp.test.run') + ''; - html += '' + Language.get('wcf.acp.email.smtp.test.description') + ''; - html += '
'; - - _container = elCreate('dl'); - _container.innerHTML = html; - - _buttonRunTest = elBySel('a', _container); - _buttonRunTest.addEventListener('click', this._onClick.bind(this)); - - var insertAfter = checkbox.closest('dl'); - insertAfter.parentNode.insertBefore(_container, insertAfter.nextSibling); - }, - - _onClick: function (event) { - event.preventDefault(); - - _buttonRunTest.disabled = true; - _buttonRunTest.innerHTML = ' ' + Language.get('wcf.global.loading'); - - elInnerError(_buttonRunTest, false); - - window.setTimeout((function () { - var startTls = elBySel('input[name="values[mail_smtp_starttls]"]:checked'); - - Ajax.api(this, { - parameters: { - host: elById('mail_smtp_host').value, - port: elById('mail_smtp_port').value, - startTls: (startTls) ? startTls.value : '', - user: elById('mail_smtp_user').value, - password: elById('mail_smtp_password').value - } - }); - }).bind(this), 100); - }, - - _ajaxSuccess: function (data) { - var result = data.returnValues.validationResult; - if (result === '') { - this._resetButton(true); - } - else { - this._resetButton(false, result); - } - }, - - _ajaxFailure: function (data) { - var result = ''; - if (data && data.returnValues && data.returnValues.fieldName) { - result = Language.get('wcf.acp.email.smtp.test.error.empty.' + data.returnValues.fieldName); - } - - this._resetButton(false, result); - - return (result === ''); - }, - - _resetButton: function (success, errorMessage) { - _buttonRunTest.disabled = false; - - if (success) _buttonRunTest.innerHTML = ' ' + Language.get('wcf.acp.email.smtp.test.run.success'); - else _buttonRunTest.innerHTML = Language.get('wcf.acp.email.smtp.test.run'); - - if (errorMessage) elInnerError(_buttonRunTest, errorMessage); - }, - - _ajaxSetup: function () { - return { - data: { - actionName: 'emailSmtpTest', - className: 'wcf\\data\\option\\OptionAction' - }, - silent: true - }; - } - }; -}); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts new file mode 100644 index 0000000000..d6e9ecefed --- /dev/null +++ b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest.ts @@ -0,0 +1,155 @@ +/** + * Simple SMTP connection testing. + * + * @author Alexander Ebert + * @copyright 2001-2018 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Acp/Ui/Option/EmailSmtpTest + */ + +import * as Ajax from "../../../Ajax"; +import { AjaxCallbackObject, AjaxCallbackSetup } from "../../../Ajax/Data"; +import DomUtil from "../../../Dom/Util"; +import * as Language from "../../../Language"; + +interface AjaxResponse { + returnValues: { + fieldName?: string; + validationResult: string; + }; +} + +class EmailSmtpTest implements AjaxCallbackObject { + private readonly buttonRunTest: HTMLAnchorElement; + private readonly container: HTMLDivElement; + + constructor() { + let smtpCheckbox: HTMLInputElement | null = null; + const methods = document.querySelectorAll('input[name="values[mail_send_method]"]'); + methods.forEach((checkbox: HTMLInputElement) => { + checkbox.addEventListener("change", () => this.onChange(checkbox)); + + if (checkbox.value === "smtp") { + smtpCheckbox = checkbox; + } + }); + + // This configuration part is unavailable when running in enterprise mode. + if (methods.length === 0) { + return; + } + + if (smtpCheckbox) { + this.onChange(smtpCheckbox); + } + + this.container = document.createElement("div"); + this.container.innerHTML = `
${Language.get("wcf.acp.email.smtp.test")}
+
+ ${Language.get("wcf.acp.email.smtp.test.run")} + ${Language.get("wcf.acp.email.smtp.test.description")} +
`; + + this.buttonRunTest = this.container.querySelector("a")!; + this.buttonRunTest.addEventListener("click", (ev) => this.onClick(ev)); + } + + private onChange(checkbox: HTMLInputElement): void { + if (checkbox.value === "smtp" && checkbox.checked) { + if (this.container.parentElement === null) { + this.initUi(checkbox); + } + + DomUtil.show(this.container); + } else if (this.container.parentElement !== null) { + DomUtil.hide(this.container); + } + } + + private initUi(checkbox: HTMLInputElement): void { + const insertAfter = checkbox.closest("dl") as HTMLDListElement; + insertAfter.insertAdjacentElement("afterend", this.container); + } + + private onClick(event: MouseEvent) { + event.preventDefault(); + + this.buttonRunTest.classList.add("disabled"); + this.buttonRunTest.innerHTML = ` ${Language.get("wcf.global.loading")}`; + + DomUtil.innerError(this.buttonRunTest, false); + + window.setTimeout(() => { + const startTls = document.querySelector('input[name="values[mail_smtp_starttls]"]:checked') as HTMLInputElement; + + const host = document.getElementById("mail_smtp_host") as HTMLInputElement; + const port = document.getElementById("mail_smtp_port") as HTMLInputElement; + const user = document.getElementById("mail_smtp_user") as HTMLInputElement; + const password = document.getElementById("mail_smtp_password") as HTMLInputElement; + + Ajax.api(this, { + parameters: { + host: host.value, + port: port.value, + startTls: startTls ? startTls.value : "", + user: user.value, + password: password.value, + }, + }); + }, 100); + } + + _ajaxSuccess(data: AjaxResponse): void { + const result = data.returnValues.validationResult; + if (result === "") { + this.resetButton(true); + } else { + this.resetButton(false, result); + } + } + + _ajaxFailure(data: AjaxResponse): boolean { + let result = ""; + if (data && data.returnValues && data.returnValues.fieldName) { + result = Language.get(`wcf.acp.email.smtp.test.error.empty.${data.returnValues.fieldName}`); + } + + this.resetButton(false, result); + + return result === ""; + } + + private resetButton(success: boolean, errorMessage?: string): void { + this.buttonRunTest.classList.remove("disabled"); + + if (success) { + this.buttonRunTest.innerHTML = ` ${Language.get( + "wcf.acp.email.smtp.test.run.success", + )}`; + } else { + this.buttonRunTest.innerHTML = Language.get("wcf.acp.email.smtp.test.run"); + } + + if (errorMessage) { + DomUtil.innerError(this.buttonRunTest, errorMessage); + } + } + + _ajaxSetup(): ReturnType { + return { + data: { + actionName: "emailSmtpTest", + className: "wcf\\data\\option\\OptionAction", + }, + silent: true, + }; + } +} + +let emailSmtpTest: EmailSmtpTest; + +export function init(): void { + if (!emailSmtpTest) { + emailSmtpTest = new EmailSmtpTest(); + } +} -- 2.20.1