Use `dialogFactory()` to set media categories

diff --git a/ts/WoltLabSuite/Core/Media/Clipboard.ts b/ts/WoltLabSuite/Core/Media/Clipboard.ts
index 68b0e761173cdf0b09b34bd27fb0e3f8b6d6f1e5..7a12ae598280afee89a5ad3a5582d30a3f6d40b8 100644 (file)
--- a/ts/WoltLabSuite/Core/Media/Clipboard.ts
+++ b/ts/WoltLabSuite/Core/Media/Clipboard.ts
@@ -11,17 +11,19 @@ import MediaManager from "./Manager/Base";
 import MediaManagerEditor from "./Manager/Editor";
 import * as Clipboard from "../Controller/Clipboard";
 import * as UiNotification from "../Ui/Notification";
-import * as UiDialog from "../Ui/Dialog";
 import * as EventHandler from "../Event/Handler";
-import * as Language from "../Language";
+import { getPhrase } from "../Language";
 import * as Ajax from "../Ajax";
 import { AjaxCallbackObject, AjaxCallbackSetup } from "../Ajax/Data";
-import { DialogCallbackObject, DialogCallbackSetup } from "../Ui/Dialog/Data";
+import { dialogFactory } from "WoltLabSuite/Core/Component/Dialog";
+import WoltlabCoreDialogElement from "WoltLabSuite/Core/Element/woltlab-core-dialog";
 
 let _mediaManager: MediaManager;
 let _didInit = false;
 
-class MediaClipboard implements AjaxCallbackObject, DialogCallbackObject {
+class MediaClipboard implements AjaxCallbackObject {
+  #dialog?: WoltlabCoreDialogElement;
+
   public _ajaxSetup(): ReturnType<AjaxCallbackSetup> {
     return {
       data: {
@@ -33,12 +35,17 @@ class MediaClipboard implements AjaxCallbackObject, DialogCallbackObject {
   public _ajaxSuccess(data): void {
     switch (data.actionName) {
       case "getSetCategoryDialog":
-        UiDialog.open(this, data.returnValues.template);
+        this.#dialog = dialogFactory().fromHtml(data.returnValues.template).asConfirmation();
+        this.#dialog.show(getPhrase("wcf.media.setCategory"));
+        this.#dialog.addEventListener("primary", () => {
+          const category = this.#dialog!.content.querySelector('select[name="categoryID"]') as HTMLSelectElement;
+          setCategory(~~category.value);
+        });
 
         break;
 
       case "setCategory":
-        UiDialog.close(this);
+        this.#dialog?.close();
 
         UiNotification.show();
 
@@ -47,27 +54,6 @@ class MediaClipboard implements AjaxCallbackObject, DialogCallbackObject {
         break;
     }
   }
-
-  public _dialogSetup(): ReturnType<DialogCallbackSetup> {
-    return {
-      id: "mediaSetCategoryDialog",
-      options: {
-        onSetup: (content) => {
-          content.querySelector("button")!.addEventListener("click", (event) => {
-            event.preventDefault();
-
-            const category = content.querySelector('select[name="categoryID"]') as HTMLSelectElement;
-            setCategory(~~category.value);
-
-            const target = event.currentTarget as HTMLButtonElement;
-            target.disabled = true;
-          });
-        },
-        title: Language.get("wcf.media.setCategory"),
-      },
-      source: null,
-    };
-  }
 }
 
 const ajax = new MediaClipboard();

diff --git a/wcfsetup/install/files/acp/templates/__mediaSetCategoryDialog.tpl b/wcfsetup/install/files/acp/templates/__mediaSetCategoryDialog.tpl
index 0954bde9ba828470ea29838a9d274b81e956005a..d51fc4bc9a2b7fbb23430f73f1fd72da618dd7aa 100644 (file)
--- a/wcfsetup/install/files/acp/templates/__mediaSetCategoryDialog.tpl
+++ b/wcfsetup/install/files/acp/templates/__mediaSetCategoryDialog.tpl
@@ -22,7 +22,3 @@
                </select>
        </dl>
 </div>
-
-<div class="formSubmit">
-       <button type="button" data-type="submit" class="button buttonPrimary">{lang}wcf.global.button.submit{/lang}</button>
-</div>

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Clipboard.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Clipboard.js
index 976d5606b4216502ba24c0b7ff6ce1691bae91c8..2cc8b9e18fe32b34d746267daf4228b144f09849 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Clipboard.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Clipboard.js
@@ -6,19 +6,18 @@
  * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @woltlabExcludeBundle tiny
  */
-define(["require", "exports", "tslib", "../Controller/Clipboard", "../Ui/Notification", "../Ui/Dialog", "../Event/Handler", "../Language", "../Ajax"], function (require, exports, tslib_1, Clipboard, UiNotification, UiDialog, EventHandler, Language, Ajax) {
+define(["require", "exports", "tslib", "../Controller/Clipboard", "../Ui/Notification", "../Event/Handler", "../Language", "../Ajax", "WoltLabSuite/Core/Component/Dialog"], function (require, exports, tslib_1, Clipboard, UiNotification, EventHandler, Language_1, Ajax, Dialog_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.setMediaManager = exports.init = void 0;
     Clipboard = tslib_1.__importStar(Clipboard);
     UiNotification = tslib_1.__importStar(UiNotification);
-    UiDialog = tslib_1.__importStar(UiDialog);
     EventHandler = tslib_1.__importStar(EventHandler);
-    Language = tslib_1.__importStar(Language);
     Ajax = tslib_1.__importStar(Ajax);
     let _mediaManager;
     let _didInit = false;
     class MediaClipboard {
+        #dialog;
         _ajaxSetup() {
             return {
                 data: {
@@ -29,33 +28,20 @@ define(["require", "exports", "tslib", "../Controller/Clipboard", "../Ui/Notific
         _ajaxSuccess(data) {
             switch (data.actionName) {
                 case "getSetCategoryDialog":
-                    UiDialog.open(this, data.returnValues.template);
+                    this.#dialog = (0, Dialog_1.dialogFactory)().fromHtml(data.returnValues.template).asConfirmation();
+                    this.#dialog.show((0, Language_1.getPhrase)("wcf.media.setCategory"));
+                    this.#dialog.addEventListener("primary", () => {
+                        const category = this.#dialog.content.querySelector('select[name="categoryID"]');
+                        setCategory(~~category.value);
+                    });
                     break;
                 case "setCategory":
-                    UiDialog.close(this);
+                    this.#dialog?.close();
                     UiNotification.show();
                     Clipboard.reload();
                     break;
             }
         }
-        _dialogSetup() {
-            return {
-                id: "mediaSetCategoryDialog",
-                options: {
-                    onSetup: (content) => {
-                        content.querySelector("button").addEventListener("click", (event) => {
-                            event.preventDefault();
-                            const category = content.querySelector('select[name="categoryID"]');
-                            setCategory(~~category.value);
-                            const target = event.currentTarget;
-                            target.disabled = true;
-                        });
-                    },
-                    title: Language.get("wcf.media.setCategory"),
-                },
-                source: null,
-            };
-        }
     }
     const ajax = new MediaClipboard();
     let clipboardObjectIds = [];