Add helper function to insert default file information (size, filename and the file)

diff --git a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
index 6afc50c64d82e0a92660f3ed1c3815c720491078..118d270a8c572281ce7dfb436cdda86b5c00ee3d 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
+++ b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
@@ -1,4 +1,3 @@
-import { formatFilesize } from "WoltLabSuite/Core/FileUtil";
 import type WoltlabCoreFileElement from "../File/woltlab-core-file";
 import { initFragment, toggleDropdown } from "WoltLabSuite/Core/Ui/Dropdown/Simple";
 import DomChangeListener from "WoltLabSuite/Core/Dom/Change/Listener";
@@ -7,6 +6,7 @@ import { deleteFile } from "WoltLabSuite/Core/Api/Files/DeleteFile";
 import { getPhrase } from "WoltLabSuite/Core/Language";
 import {
   fileInitializationFailed,
+  insertFileInformation,
   removeUploadProgress,
   trackUploadProgress,
 } from "WoltLabSuite/Core/Component/File/File";
@@ -158,19 +158,7 @@ export function createAttachmentFromFile(file: WoltlabCoreFileElement, editor: H
   const element = document.createElement("li");
   element.classList.add("fileList__item", "attachment__item");
 
-  const fileWrapper = document.createElement("div");
-  fileWrapper.classList.add("fileList__item__file");
-  fileWrapper.append(file);
-
-  const filename = document.createElement("div");
-  filename.classList.add("fileList__item__filename");
-  filename.textContent = file.filename || file.dataset.filename!;
-
-  const fileSize = document.createElement("div");
-  fileSize.classList.add("fileList__item__fileSize");
-  fileSize.textContent = formatFilesize(file.fileSize || parseInt(file.dataset.fileSize!));
-
-  element.append(fileWrapper, filename, fileSize);
+  insertFileInformation(element, file);
 
   void file.ready
     .then(() => {

diff --git a/ts/WoltLabSuite/Core/Component/File/File.ts b/ts/WoltLabSuite/Core/Component/File/File.ts
index 74063f1ae63ff1814e41ebd36475ab2380b6e5d4..1f4f36f91b4d038db9ba7c9473f91ca4fa78da83 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/File/File.ts
+++ b/ts/WoltLabSuite/Core/Component/File/File.ts
@@ -1,5 +1,6 @@
 import WoltlabCoreFileElement from "WoltLabSuite/Core/Component/File/woltlab-core-file";
 import { getPhrase } from "WoltLabSuite/Core/Language";
+import { formatFilesize } from "WoltLabSuite/Core/FileUtil";
 
 export function trackUploadProgress(element: HTMLElement, file: WoltlabCoreFileElement): void {
   const progress = document.createElement("progress");
@@ -71,3 +72,19 @@ function markElementAsErroneous(element: HTMLElement, errorMessage: string): voi
 
   element.append(errorElement);
 }
+
+export function insertFileInformation(container: HTMLElement, file: WoltlabCoreFileElement): void {
+  const fileWrapper = document.createElement("div");
+  fileWrapper.classList.add("fileList__item__file");
+  fileWrapper.append(file);
+
+  const filename = document.createElement("div");
+  filename.classList.add("fileList__item__filename");
+  filename.textContent = file.filename || file.dataset.filename!;
+
+  const fileSize = document.createElement("div");
+  fileSize.classList.add("fileList__item__fileSize");
+  fileSize.textContent = formatFilesize(file.fileSize || parseInt(file.dataset.fileSize!));
+
+  container.append(fileWrapper, filename, fileSize);
+}

diff --git a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
index 0784e14da2a8eb9802da32f47547b0acb0fa1519..0aceec393db18599d432e151183fc1bca5cd146e 100644 (file)
--- a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
+++ b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts
@@ -8,10 +8,10 @@
 import WoltlabCoreFileElement from "WoltLabSuite/Core/Component/File/woltlab-core-file";
 import { getPhrase } from "WoltLabSuite/Core/Language";
 import { deleteFile } from "WoltLabSuite/Core/Api/Files/DeleteFile";
-import { formatFilesize } from "WoltLabSuite/Core/FileUtil";
 import DomChangeListener from "WoltLabSuite/Core/Dom/Change/Listener";
 import {
   fileInitializationFailed,
+  insertFileInformation,
   removeUploadProgress,
   trackUploadProgress,
 } from "WoltLabSuite/Core/Component/File/File";
@@ -199,22 +199,7 @@ export class FileProcessor {
     }
 
     if (!this.showBigPreview) {
-      const fileContainer = document.createElement("div");
-      fileContainer.classList.add(this.classPrefix + "item__file");
-      fileContainer.append(element);
-      container.append(fileContainer);
-
-      const filename = document.createElement("div");
-      filename.classList.add(this.classPrefix + "item__filename");
-      filename.textContent = element.filename || element.dataset.filename!;
-
-      container.append(filename);
-
-      const fileSize = document.createElement("div");
-      fileSize.classList.add(this.classPrefix + "item__fileSize");
-      fileSize.textContent = formatFilesize(element.fileSize || parseInt(element.dataset.fileSize!));
-
-      container.append(fileSize);
+      insertFileInformation(container, element);
     }
 
     trackUploadProgress(container, element);

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
index fa387f2fa15deee44fc88a28409b92d704621cce..ae2adac05f1d0e9c61a968edab769b642f8963b3 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
@@ -1,4 +1,4 @@
-define(["require", "exports", "tslib", "WoltLabSuite/Core/FileUtil", "WoltLabSuite/Core/Ui/Dropdown/Simple", "WoltLabSuite/Core/Dom/Change/Listener", "../Ckeditor/Event", "WoltLabSuite/Core/Api/Files/DeleteFile", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Component/File/File"], function (require, exports, tslib_1, FileUtil_1, Simple_1, Listener_1, Event_1, DeleteFile_1, Language_1, File_1) {
+define(["require", "exports", "tslib", "WoltLabSuite/Core/Ui/Dropdown/Simple", "WoltLabSuite/Core/Dom/Change/Listener", "../Ckeditor/Event", "WoltLabSuite/Core/Api/Files/DeleteFile", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Component/File/File"], function (require, exports, tslib_1, Simple_1, Listener_1, Event_1, DeleteFile_1, Language_1, File_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.createAttachmentFromFile = void 0;
@@ -113,16 +113,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/FileUtil", "WoltLabSui
     function createAttachmentFromFile(file, editor) {
         const element = document.createElement("li");
         element.classList.add("fileList__item", "attachment__item");
-        const fileWrapper = document.createElement("div");
-        fileWrapper.classList.add("fileList__item__file");
-        fileWrapper.append(file);
-        const filename = document.createElement("div");
-        filename.classList.add("fileList__item__filename");
-        filename.textContent = file.filename || file.dataset.filename;
-        const fileSize = document.createElement("div");
-        fileSize.classList.add("fileList__item__fileSize");
-        fileSize.textContent = (0, FileUtil_1.formatFilesize)(file.fileSize || parseInt(file.dataset.fileSize));
-        element.append(fileWrapper, filename, fileSize);
+        (0, File_1.insertFileInformation)(element, file);
         void file.ready
             .then(() => {
             fileInitializationCompleted(element, file, editor);

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/File/File.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/File/File.js
index 9830d2e06a10b10fe3d31242737981ef7c5e3454..545b3ec8dd91e091e640721a386c10fcf12ffb8e 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/File/File.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/File/File.js
@@ -1,7 +1,7 @@
-define(["require", "exports", "WoltLabSuite/Core/Language"], function (require, exports, Language_1) {
+define(["require", "exports", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/FileUtil"], function (require, exports, Language_1, FileUtil_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.fileInitializationFailed = exports.removeUploadProgress = exports.trackUploadProgress = void 0;
+    exports.insertFileInformation = exports.fileInitializationFailed = exports.removeUploadProgress = exports.trackUploadProgress = void 0;
     function trackUploadProgress(element, file) {
         const progress = document.createElement("progress");
         progress.classList.add("fileList__item__progress__bar");
@@ -61,4 +61,17 @@ define(["require", "exports", "WoltLabSuite/Core/Language"], function (require,
         errorElement.textContent = errorMessage;
         element.append(errorElement);
     }
+    function insertFileInformation(container, file) {
+        const fileWrapper = document.createElement("div");
+        fileWrapper.classList.add("fileList__item__file");
+        fileWrapper.append(file);
+        const filename = document.createElement("div");
+        filename.classList.add("fileList__item__filename");
+        filename.textContent = file.filename || file.dataset.filename;
+        const fileSize = document.createElement("div");
+        fileSize.classList.add("fileList__item__fileSize");
+        fileSize.textContent = (0, FileUtil_1.formatFilesize)(file.fileSize || parseInt(file.dataset.fileSize));
+        container.append(fileWrapper, filename, fileSize);
+    }
+    exports.insertFileInformation = insertFileInformation;
 });

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
index 00e1fd10119aa9d96f36def972e1be746d7e3895..82b3bb4194b0db5a79c3daaa51b6afe69aadfc36 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js
@@ -4,7 +4,7 @@
  * @license   GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @since     6.1
  */
-define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Api/Files/DeleteFile", "WoltLabSuite/Core/FileUtil", "WoltLabSuite/Core/Dom/Change/Listener", "WoltLabSuite/Core/Component/File/File"], function (require, exports, tslib_1, Language_1, DeleteFile_1, FileUtil_1, Listener_1, File_1) {
+define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSuite/Core/Api/Files/DeleteFile", "WoltLabSuite/Core/Dom/Change/Listener", "WoltLabSuite/Core/Component/File/File"], function (require, exports, tslib_1, Language_1, DeleteFile_1, Listener_1, File_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getValues = exports.FileProcessor = void 0;
@@ -155,18 +155,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui
                 }
             }
             if (!this.showBigPreview) {
-                const fileContainer = document.createElement("div");
-                fileContainer.classList.add(this.classPrefix + "item__file");
-                fileContainer.append(element);
-                container.append(fileContainer);
-                const filename = document.createElement("div");
-                filename.classList.add(this.classPrefix + "item__filename");
-                filename.textContent = element.filename || element.dataset.filename;
-                container.append(filename);
-                const fileSize = document.createElement("div");
-                fileSize.classList.add(this.classPrefix + "item__fileSize");
-                fileSize.textContent = (0, FileUtil_1.formatFilesize)(element.fileSize || parseInt(element.dataset.fileSize));
-                container.append(fileSize);
+                (0, File_1.insertFileInformation)(container, element);
             }
             (0, File_1.trackUploadProgress)(container, element);
             element.ready