Apply suggestions from code review
authorMatthias Schmidt <gravatronics@live.com>
Fri, 8 Jan 2021 10:53:23 +0000 (11:53 +0100)
committerMatthias Schmidt <gravatronics@live.com>
Fri, 8 Jan 2021 10:53:23 +0000 (11:53 +0100)
wcfsetup/install/files/js/WoltLabSuite/Core/Controller/Media/List.js
wcfsetup/install/files/js/WoltLabSuite/Core/Media/Editor.js
wcfsetup/install/files/js/WoltLabSuite/Core/Media/Manager/Editor.js
wcfsetup/install/files/ts/WoltLabSuite/Core/Controller/Media/List.ts
wcfsetup/install/files/ts/WoltLabSuite/Core/Media/Editor.ts
wcfsetup/install/files/ts/WoltLabSuite/Core/Media/Manager/Editor.ts

index bf235265bdb685a25f5322a48591c6788af6ce77..3431bca9fe076bab6f645afa88a0e95d1c2d4778 100644 (file)
@@ -17,9 +17,9 @@ define(["require", "exports", "tslib", "../../Media/List/Upload", "../../Media/C
     DomChangeListener = tslib_1.__importStar(DomChangeListener);
     Clipboard = tslib_1.__importStar(Clipboard);
     const _mediaEditor = new Editor_1.default({
-        _editorSuccess: function (media, oldCategoryId) {
+        _editorSuccess: (media, oldCategoryId) => {
             if (media.categoryID != oldCategoryId) {
-                window.setTimeout(function () {
+                window.setTimeout(() => {
                     window.location.reload();
                 }, 500);
             }
index 2503fcbd751ea5fc0519508779d55f7b8e57be51..ac7f7423c26ec3aefd49c9c43f759e7c0a8a8415 100644 (file)
@@ -67,14 +67,16 @@ define(["require", "exports", "tslib", "../Core", "../Ui/Notification", "../Ui/D
          */
         _initEditor(content, data) {
             this._availableLanguageCount = ~~data.returnValues.availableLanguageCount;
-            this._categoryIds = data.returnValues.categoryIDs.map((number) => number);
+            this._categoryIds = data.returnValues.categoryIDs.map((number) => ~~number);
             if (data.returnValues.mediaData) {
                 this._media = data.returnValues.mediaData;
             }
+            const mediaId = this._media.mediaID;
             // make sure that the language chooser is initialized first
             setTimeout(() => {
+                var _a, _b, _c;
                 if (this._availableLanguageCount > 1) {
-                    LanguageChooser.setLanguageId(`mediaEditor_${this._media.mediaID}_languageID`, this._media.languageID || window.LANGUAGE_ID);
+                    LanguageChooser.setLanguageId(`mediaEditor_${mediaId}_languageID`, this._media.languageID || window.LANGUAGE_ID);
                 }
                 if (this._categoryIds.length) {
                     const categoryID = content.querySelector("select[name=categoryID]");
@@ -88,27 +90,22 @@ define(["require", "exports", "tslib", "../Core", "../Ui/Notification", "../Ui/D
                 const title = content.querySelector("input[name=title]");
                 const altText = content.querySelector("input[name=altText]");
                 const caption = content.querySelector("textarea[name=caption]");
-                const mediaId = this._media.mediaID;
                 if (this._availableLanguageCount > 1 && this._media.isMultilingual) {
                     if (document.getElementById(`altText_${mediaId}`)) {
-                        LanguageInput.setValues(`altText_${this._media.mediaID}`, (this._media.altText || {}));
+                        LanguageInput.setValues(`altText_${mediaId}`, (this._media.altText || {}));
                     }
                     if (document.getElementById(`caption_${mediaId}`)) {
-                        LanguageInput.setValues(`caption_${this._media.mediaID}`, (this._media.caption || {}));
+                        LanguageInput.setValues(`caption_${mediaId}`, (this._media.caption || {}));
                     }
-                    LanguageInput.setValues(`title_${this._media.mediaID}`, (this._media.title || {}));
+                    LanguageInput.setValues(`title_${mediaId}`, (this._media.title || {}));
                 }
                 else {
-                    title.value = this._media.title ? this._media.title[this._media.languageID || window.LANGUAGE_ID] : "";
+                    title.value = ((_a = this._media) === null || _a === void 0 ? void 0 : _a.title[this._media.languageID || window.LANGUAGE_ID]) || "";
                     if (altText) {
-                        altText.value = this._media.altText
-                            ? this._media.altText[this._media.languageID || window.LANGUAGE_ID]
-                            : "";
+                        altText.value = ((_b = this._media) === null || _b === void 0 ? void 0 : _b.altText[this._media.languageID || window.LANGUAGE_ID]) || "";
                     }
                     if (caption) {
-                        caption.value = this._media.caption
-                            ? this._media.caption[this._media.languageID || window.LANGUAGE_ID]
-                            : "";
+                        caption.value = ((_c = this._media) === null || _c === void 0 ? void 0 : _c.caption[this._media.languageID || window.LANGUAGE_ID]) || "";
                     }
                 }
                 if (this._availableLanguageCount > 1) {
@@ -123,7 +120,7 @@ define(["require", "exports", "tslib", "../Core", "../Ui/Notification", "../Ui/D
                 content.querySelector("button[data-type=submit]").addEventListener("click", () => this._saveData());
                 // remove focus from input elements and scroll dialog to top
                 document.activeElement.blur();
-                document.getElementById(`mediaEditor_${this._media.mediaID}`).parentNode.scrollTop = 0;
+                document.getElementById(`mediaEditor_${mediaId}`).parentNode.scrollTop = 0;
                 // Initialize button to replace media file.
                 const uploadButton = content.querySelector(".mediaManagerMediaReplaceButton");
                 let target = content.querySelector(".mediaThumbnail");
@@ -131,7 +128,7 @@ define(["require", "exports", "tslib", "../Core", "../Ui/Notification", "../Ui/D
                     target = document.createElement("div");
                     content.appendChild(target);
                 }
-                new Replace_1.default(~~this._media.mediaID, DomUtil.identify(uploadButton), 
+                new Replace_1.default(mediaId, DomUtil.identify(uploadButton), 
                 // Pass an anonymous element for non-images which is required internally
                 // but not needed in this case.
                 DomUtil.identify(target), {
index d27c6b82d38372a7170ec4fea19450b336a04550..64e3238a058fd06db955adbd1d6e61f601cb128c 100644 (file)
@@ -132,11 +132,7 @@ define(["require", "exports", "tslib", "./Base", "../../Core", "../../Event/Hand
          * Returns the id of the insert dialog based on the media files to be inserted.
          */
         _getInsertDialogId() {
-            let dialogId = "mediaInsert";
-            this._mediaToInsert.forEach((media, mediaId) => {
-                dialogId += `-${mediaId}`;
-            });
-            return dialogId;
+            return ["mediaInsert", ...this._mediaToInsert.keys()].join("-");
         }
         /**
          * Returns the supported thumbnail sizes (excluding `original`) for all media images to be inserted.
@@ -144,10 +140,10 @@ define(["require", "exports", "tslib", "./Base", "../../Core", "../../Event/Hand
         _getThumbnailSizes() {
             return ["small", "medium", "large"]
                 .map((size) => {
-                const supportSize = Array.from(this._mediaToInsert).every(([_mediaId, media]) => {
+                const sizeSupported = Array.from(this._mediaToInsert.values()).every((media) => {
                     return media[size + "ThumbnailType"] !== null;
                 });
-                if (supportSize) {
+                if (sizeSupported) {
                     return size;
                 }
                 return null;
@@ -195,10 +191,7 @@ define(["require", "exports", "tslib", "./Base", "../../Core", "../../Event/Hand
          * Inserts a series of uploaded images into the editor using a slider.
          */
         _insertMediaGallery() {
-            const mediaIds = [];
-            this._mediaToInsert.forEach(function (media) {
-                mediaIds.push(media.mediaID);
-            });
+            const mediaIds = Array.from(this._mediaToInsert.keys());
             this._options.editor.buffer.set();
             this._options.editor.insert.text("[wsmg='" + mediaIds.join(",") + "'][/wsmg]");
         }
index 54c84b80ae4b26c7368e8845ae479fc0a2b6c1c8..c296837da530b2b56bada6d4d3a7c255bd3f8b10 100644 (file)
@@ -13,13 +13,13 @@ import * as EventHandler from "../../Event/Handler";
 import MediaEditor from "../../Media/Editor";
 import * as DomChangeListener from "../../Dom/Change/Listener";
 import * as Clipboard from "../../Controller/Clipboard";
-import { MediaUploadSuccessEventData } from "../../Media/Data";
+import { Media, MediaUploadSuccessEventData } from "../../Media/Data";
 import MediaManager from "../../Media/Manager/Base";
 
 const _mediaEditor = new MediaEditor({
-  _editorSuccess: function (media, oldCategoryId) {
+  _editorSuccess: (media: Media, oldCategoryId: number) => {
     if (media.categoryID != oldCategoryId) {
-      window.setTimeout(function () {
+      window.setTimeout(() => {
         window.location.reload();
       }, 500);
     }
index 8e47517eade28da1cb4f736a5cb6ae3ff9585ca2..f0247b0c7ce5d54a4ec2f75dd92b4d4f9711ee5d 100644 (file)
@@ -90,17 +90,18 @@ class MediaEditor implements AjaxCallbackObject {
    */
   protected _initEditor(content: HTMLElement, data: InitEditorData): void {
     this._availableLanguageCount = ~~data.returnValues.availableLanguageCount;
-    this._categoryIds = data.returnValues.categoryIDs.map((number) => number);
+    this._categoryIds = data.returnValues.categoryIDs.map((number) => ~~number);
 
     if (data.returnValues.mediaData) {
       this._media = data.returnValues.mediaData;
     }
+    const mediaId = this._media!.mediaID;
 
     // make sure that the language chooser is initialized first
     setTimeout(() => {
       if (this._availableLanguageCount > 1) {
         LanguageChooser.setLanguageId(
-          `mediaEditor_${this._media!.mediaID}_languageID`,
+          `mediaEditor_${mediaId}_languageID`,
           this._media!.languageID || window.LANGUAGE_ID,
         );
       }
@@ -117,29 +118,24 @@ class MediaEditor implements AjaxCallbackObject {
       const title = content.querySelector("input[name=title]") as HTMLInputElement;
       const altText = content.querySelector("input[name=altText]") as HTMLInputElement;
       const caption = content.querySelector("textarea[name=caption]") as HTMLInputElement;
-      const mediaId = this._media!.mediaID;
 
       if (this._availableLanguageCount > 1 && this._media!.isMultilingual) {
         if (document.getElementById(`altText_${mediaId}`)) {
-          LanguageInput.setValues(`altText_${this._media!.mediaID}`, (this._media!.altText || {}) as I18nValues);
+          LanguageInput.setValues(`altText_${mediaId}`, (this._media!.altText || {}) as I18nValues);
         }
 
         if (document.getElementById(`caption_${mediaId}`)) {
-          LanguageInput.setValues(`caption_${this._media!.mediaID}`, (this._media!.caption || {}) as I18nValues);
+          LanguageInput.setValues(`caption_${mediaId}`, (this._media!.caption || {}) as I18nValues);
         }
 
-        LanguageInput.setValues(`title_${this._media!.mediaID}`, (this._media!.title || {}) as I18nValues);
+        LanguageInput.setValues(`title_${mediaId}`, (this._media!.title || {}) as I18nValues);
       } else {
-        title.value = this._media!.title ? this._media!.title[this._media!.languageID || window.LANGUAGE_ID] : "";
+        title.value = this._media?.title[this._media!.languageID || window.LANGUAGE_ID] || "";
         if (altText) {
-          altText.value = this._media!.altText
-            ? this._media!.altText[this._media!.languageID || window.LANGUAGE_ID]
-            : "";
+          altText.value = this._media?.altText[this._media!.languageID || window.LANGUAGE_ID] || "";
         }
         if (caption) {
-          caption.value = this._media!.caption
-            ? this._media!.caption[this._media!.languageID || window.LANGUAGE_ID]
-            : "";
+          caption.value = this._media?.caption[this._media!.languageID || window.LANGUAGE_ID] || "";
         }
       }
 
@@ -159,7 +155,7 @@ class MediaEditor implements AjaxCallbackObject {
 
       // remove focus from input elements and scroll dialog to top
       (document.activeElement! as HTMLElement).blur();
-      (document.getElementById(`mediaEditor_${this._media!.mediaID}`)!.parentNode as HTMLElement).scrollTop = 0;
+      (document.getElementById(`mediaEditor_${mediaId}`)!.parentNode as HTMLElement).scrollTop = 0;
 
       // Initialize button to replace media file.
       const uploadButton = content.querySelector(".mediaManagerMediaReplaceButton")!;
@@ -169,7 +165,7 @@ class MediaEditor implements AjaxCallbackObject {
         content.appendChild(target);
       }
       new MediaReplace(
-        ~~this._media!.mediaID,
+        mediaId,
         DomUtil.identify(uploadButton),
         // Pass an anonymous element for non-images which is required internally
         // but not needed in this case.
index 11589cda343f40c55d235fa0eb6a8c82e47291c7..74bc6456055d5ed0a9889e42bc423545e9b684ef 100644 (file)
@@ -18,9 +18,9 @@ import * as Clipboard from "../../Controller/Clipboard";
 import { OnDropPayload } from "../../Ui/Redactor/DragAndDrop";
 import DomUtil from "../../Dom/Util";
 
-type PasteFromClipboard = {
+interface PasteFromClipboard {
   blob: Blob;
-};
+}
 
 class MediaManagerEditor extends MediaManager<MediaManagerEditorOptions> {
   protected _activeButton;
@@ -177,13 +177,7 @@ class MediaManagerEditor extends MediaManager<MediaManagerEditorOptions> {
    * Returns the id of the insert dialog based on the media files to be inserted.
    */
   protected _getInsertDialogId(): string {
-    let dialogId = "mediaInsert";
-
-    this._mediaToInsert.forEach((media, mediaId) => {
-      dialogId += `-${mediaId}`;
-    });
-
-    return dialogId;
+    return ["mediaInsert", ...this._mediaToInsert.keys()].join("-");
   }
 
   /**
@@ -192,11 +186,11 @@ class MediaManagerEditor extends MediaManager<MediaManagerEditorOptions> {
   protected _getThumbnailSizes(): string[] {
     return ["small", "medium", "large"]
       .map((size) => {
-        const supportSize = Array.from(this._mediaToInsert).every(([_mediaId, media]) => {
+        const sizeSupported = Array.from(this._mediaToInsert.values()).every((media) => {
           return media[size + "ThumbnailType"] !== null;
         });
 
-        if (supportSize) {
+        if (sizeSupported) {
           return size;
         }
 
@@ -252,10 +246,7 @@ class MediaManagerEditor extends MediaManager<MediaManagerEditorOptions> {
    * Inserts a series of uploaded images into the editor using a slider.
    */
   protected _insertMediaGallery(): void {
-    const mediaIds: number[] = [];
-    this._mediaToInsert.forEach(function (media) {
-      mediaIds.push(media.mediaID);
-    });
+    const mediaIds = Array.from(this._mediaToInsert.keys());
 
     this._options.editor!.buffer.set();
     this._options.editor!.insert.text("[wsmg='" + mediaIds.join(",") + "'][/wsmg]");