From: Matthias Schmidt Date: Tue, 12 Jan 2021 09:58:15 +0000 (+0100) Subject: Convert `Acp/Form/Builder/Field/Devtools/Project/RequiredPackages` to TypeScript X-Git-Tag: 5.4.0_Alpha_1~450^2~3 X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=f5ed3692b2381f1cc4f781aa2ca89239658946da;p=GitHub%2FWoltLab%2FWCF.git Convert `Acp/Form/Builder/Field/Devtools/Project/RequiredPackages` to TypeScript --- diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js index 51df952e5f..4689c7c730 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js @@ -1,102 +1,66 @@ /** * Manages the packages entered in a devtools project required package form field. * - * @author Matthias Schmidt - * @copyright 2001-2019 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Form/Acp/Builder/Field/Devtools/Project/RequiredPackages - * @see module:WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/AbstractPackageList - * @since 5.2 + * @author Matthias Schmidt + * @copyright 2001-2021 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Form/Acp/Builder/Field/Devtools/Project/RequiredPackages + * @see module:WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/AbstractPackageList + * @since 5.2 */ -define(['./AbstractPackageList', 'Core', 'Language'], function (AbstractPackageList, Core, Language) { +define(["require", "exports", "tslib", "./AbstractPackageList", "../../../../../../Core", "../../../../../../Language"], function (require, exports, tslib_1, AbstractPackageList_1, Core, Language) { "use strict"; - /** - * @constructor - */ - function RequiredPackages(formFieldId, existingPackages) { - this.init(formFieldId, existingPackages); - } - ; - Core.inherit(RequiredPackages, AbstractPackageList, { - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#init - */ - init: function (formFieldId, existingPackages) { - RequiredPackages._super.prototype.init.call(this, formFieldId, existingPackages); - this._minVersion = elById(this._formFieldId + '_minVersion'); - if (this._minVersion === null) { - throw new Error("Cannot find minimum version form field for packages field with id '" + this._formFieldId + "'."); + AbstractPackageList_1 = tslib_1.__importDefault(AbstractPackageList_1); + Core = tslib_1.__importStar(Core); + Language = tslib_1.__importStar(Language); + class RequiredPackages extends AbstractPackageList_1.default { + constructor(formFieldId, existingPackages) { + super(formFieldId, existingPackages); + this.minVersion = document.getElementById(`${this.formFieldId}_minVersion`); + if (this.minVersion === null) { + throw new Error(`Cannot find minimum version form field for packages field with id '${this.formFieldId}'.`); } - this._minVersion.addEventListener('keypress', this._keyPress.bind(this)); - this._file = elById(this._formFieldId + '_file'); - if (this._file === null) { - throw new Error("Cannot find file form field for required field with id '" + this._formFieldId + "'."); + this.minVersion.addEventListener("keypress", (ev) => this.keyPress(ev)); + this.file = document.getElementById(`${this.formFieldId}_file`); + if (this.file === null) { + throw new Error(`Cannot find file form field for required field with id '${this.formFieldId}'.`); } - }, - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_createSubmitFields - */ - _createSubmitFields: function (listElement, index) { - RequiredPackages._super.prototype._createSubmitFields.call(this, listElement, index); - var minVersion = elCreate('input'); - elAttr(minVersion, 'type', 'hidden'); - elAttr(minVersion, 'name', this._formFieldId + '[' + index + '][minVersion]'); - minVersion.value = elData(listElement, 'min-version'); - this._form.appendChild(minVersion); - var file = elCreate('input'); - elAttr(file, 'type', 'hidden'); - elAttr(file, 'name', this._formFieldId + '[' + index + '][file]'); - file.value = elData(listElement, 'file'); - this._form.appendChild(file); - }, - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_emptyInput - */ - _emptyInput: function () { - RequiredPackages._super.prototype._emptyInput.call(this); - this._minVersion.value = ''; - this._file.checked = false; - }, - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_getInputData - */ - _getInputData: function () { - return Core.extend(RequiredPackages._super.prototype._getInputData.call(this), { - file: this._file.checked, - minVersion: this._minVersion.value + } + createSubmitFields(listElement, index) { + super.createSubmitFields(listElement, index); + ["minVersion", "file"].forEach((property) => { + const element = document.createElement("input"); + element.type = "hidden"; + element.name = `${this.formFieldId}[${index}][${property}]`; + element.value = listElement.dataset[property]; + this.form.appendChild(element); }); - }, - /** - * Returns the error element for the minimum version form field. - * If `createIfNonExistent` is not given or `false`, `null` is returned - * if there is no error element, otherwise an empty error element - * is created and returned. - * - * @param {?boolean} createIfNonExistent - * @return {?HTMLElement} - */ - _getMinVersionErrorElement: function (createIfNonExistent) { - return this._getErrorElement(this._minVersion, createIfNonExistent); - }, - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_populateListItem - */ - _populateListItem: function (listItem, packageData) { - RequiredPackages._super.prototype._populateListItem.call(this, listItem, packageData); - elData(listItem, 'min-version', packageData.minVersion); - elData(listItem, 'file', ~~packageData.file); - listItem.innerHTML = ' ' + Language.get('wcf.acp.devtools.project.requiredPackage.requiredPackage', { - file: ~~packageData.file, - minVersion: packageData.minVersion, - packageIdentifier: packageData.packageIdentifier + } + emptyInput() { + super.emptyInput(); + this.minVersion.value = ""; + this.file.checked = false; + } + getInputData() { + return Core.extend(super.getInputData(), { + file: this.file.checked, + minVersion: this.minVersion.value, }); - }, - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_validateInput - */ - _validateInput: function () { - return RequiredPackages._super.prototype._validateInput.call(this) && this._validateVersion(this._minVersion.value, this._getMinVersionErrorElement.bind(this)); } - }); + populateListItem(listItem, packageData) { + super.populateListItem(listItem, packageData); + listItem.dataset.minVersion = packageData.minVersion; + listItem.dataset.file = packageData.file ? "1" : "0"; + listItem.innerHTML = ` ${Language.get("wcf.acp.devtools.project.requiredPackage.requiredPackage", { + file: packageData.file, + minVersion: packageData.minVersion, + packageIdentifier: packageData.packageIdentifier, + })}`; + } + validateInput() { + return super.validateInput() && this.validateVersion(this.minVersion); + } + } + Core.enableLegacyInheritance(RequiredPackages); return RequiredPackages; }); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js deleted file mode 100644 index 0930e2a52d..0000000000 --- a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.js +++ /dev/null @@ -1,118 +0,0 @@ -/** - * Manages the packages entered in a devtools project required package form field. - * - * @author Matthias Schmidt - * @copyright 2001-2019 WoltLab GmbH - * @license GNU Lesser General Public License - * @module WoltLabSuite/Core/Form/Acp/Builder/Field/Devtools/Project/RequiredPackages - * @see module:WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/AbstractPackageList - * @since 5.2 - */ -define(['./AbstractPackageList', 'Core', 'Language'], function(AbstractPackageList, Core, Language) { - "use strict"; - - /** - * @constructor - */ - function RequiredPackages(formFieldId, existingPackages) { - this.init(formFieldId, existingPackages); - }; - Core.inherit(RequiredPackages, AbstractPackageList, { - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#init - */ - init: function(formFieldId, existingPackages) { - RequiredPackages._super.prototype.init.call(this, formFieldId, existingPackages); - - this._minVersion = elById(this._formFieldId + '_minVersion'); - if (this._minVersion === null) { - throw new Error("Cannot find minimum version form field for packages field with id '" + this._formFieldId + "'."); - } - this._minVersion.addEventListener('keypress', this._keyPress.bind(this)); - - this._file = elById(this._formFieldId + '_file'); - if (this._file === null) { - throw new Error("Cannot find file form field for required field with id '" + this._formFieldId + "'."); - } - }, - - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_createSubmitFields - */ - _createSubmitFields: function(listElement, index) { - RequiredPackages._super.prototype._createSubmitFields.call(this, listElement, index); - - var minVersion = elCreate('input'); - elAttr(minVersion, 'type', 'hidden'); - elAttr(minVersion, 'name', this._formFieldId + '[' + index + '][minVersion]') - minVersion.value = elData(listElement, 'min-version'); - this._form.appendChild(minVersion); - - var file = elCreate('input'); - elAttr(file, 'type', 'hidden'); - elAttr(file, 'name', this._formFieldId + '[' + index + '][file]') - file.value = elData(listElement, 'file'); - this._form.appendChild(file); - }, - - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_emptyInput - */ - _emptyInput: function() { - RequiredPackages._super.prototype._emptyInput.call(this); - - this._minVersion.value = ''; - this._file.checked = false; - }, - - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_getInputData - */ - _getInputData: function() { - return Core.extend(RequiredPackages._super.prototype._getInputData.call(this), { - file: this._file.checked, - minVersion: this._minVersion.value - }); - }, - - /** - * Returns the error element for the minimum version form field. - * If `createIfNonExistent` is not given or `false`, `null` is returned - * if there is no error element, otherwise an empty error element - * is created and returned. - * - * @param {?boolean} createIfNonExistent - * @return {?HTMLElement} - */ - _getMinVersionErrorElement: function(createIfNonExistent) { - return this._getErrorElement(this._minVersion, createIfNonExistent); - }, - - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_populateListItem - */ - _populateListItem: function(listItem, packageData) { - RequiredPackages._super.prototype._populateListItem.call(this, listItem, packageData); - - elData(listItem, 'min-version', packageData.minVersion); - elData(listItem, 'file', ~~packageData.file); - listItem.innerHTML = ' ' + Language.get('wcf.acp.devtools.project.requiredPackage.requiredPackage', { - file: ~~packageData.file, - minVersion: packageData.minVersion, - packageIdentifier: packageData.packageIdentifier - }); - }, - - /** - * @see WoltLabSuite/Core/Form/Builder/Field/Devtools/Project/AbstractPackageList#_validateInput - */ - _validateInput: function() { - return RequiredPackages._super.prototype._validateInput.call(this) && this._validateVersion( - this._minVersion.value, - this._getMinVersionErrorElement.bind(this) - ); - } - }); - - return RequiredPackages; -}); diff --git a/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.ts b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.ts new file mode 100644 index 0000000000..8e6fea9c83 --- /dev/null +++ b/wcfsetup/install/files/ts/WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/RequiredPackages.ts @@ -0,0 +1,84 @@ +/** + * Manages the packages entered in a devtools project required package form field. + * + * @author Matthias Schmidt + * @copyright 2001-2021 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Form/Acp/Builder/Field/Devtools/Project/RequiredPackages + * @see module:WoltLabSuite/Core/Acp/Form/Builder/Field/Devtools/Project/AbstractPackageList + * @since 5.2 + */ + +import AbstractPackageList from "./AbstractPackageList"; +import * as Core from "../../../../../../Core"; +import * as Language from "../../../../../../Language"; +import { RequiredPackageData } from "./Data"; + +class RequiredPackages< + TPackageData extends RequiredPackageData = RequiredPackageData +> extends AbstractPackageList { + protected readonly file: HTMLInputElement; + protected readonly minVersion: HTMLInputElement; + + constructor(formFieldId: string, existingPackages: TPackageData[]) { + super(formFieldId, existingPackages); + + this.minVersion = document.getElementById(`${this.formFieldId}_minVersion`) as HTMLInputElement; + if (this.minVersion === null) { + throw new Error(`Cannot find minimum version form field for packages field with id '${this.formFieldId}'.`); + } + this.minVersion.addEventListener("keypress", (ev) => this.keyPress(ev)); + + this.file = document.getElementById(`${this.formFieldId}_file`) as HTMLInputElement; + if (this.file === null) { + throw new Error(`Cannot find file form field for required field with id '${this.formFieldId}'.`); + } + } + + protected createSubmitFields(listElement: HTMLLIElement, index: number): void { + super.createSubmitFields(listElement, index); + + ["minVersion", "file"].forEach((property) => { + const element = document.createElement("input"); + element.type = "hidden"; + element.name = `${this.formFieldId}[${index}][${property}]`; + element.value = listElement.dataset[property]!; + this.form.appendChild(element); + }); + } + + protected emptyInput(): void { + super.emptyInput(); + + this.minVersion.value = ""; + this.file.checked = false; + } + + protected getInputData(): TPackageData { + return Core.extend(super.getInputData(), { + file: this.file.checked, + minVersion: this.minVersion.value, + }) as TPackageData; + } + + protected populateListItem(listItem: HTMLLIElement, packageData: TPackageData): void { + super.populateListItem(listItem, packageData); + + listItem.dataset.minVersion = packageData.minVersion; + listItem.dataset.file = packageData.file ? "1" : "0"; + + listItem.innerHTML = ` ${Language.get("wcf.acp.devtools.project.requiredPackage.requiredPackage", { + file: packageData.file, + minVersion: packageData.minVersion, + packageIdentifier: packageData.packageIdentifier, + })}`; + } + + protected validateInput(): boolean { + return super.validateInput() && this.validateVersion(this.minVersion); + } +} + +Core.enableLegacyInheritance(RequiredPackages); + +export = RequiredPackages;