Use native event

diff --git a/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts b/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts
index ef682c60dd5f8f639fe5e7c082f0b2eb72110134..c0090c5c1021b218a1be1cc8ac22ca03d2ef2bbb 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts
+++ b/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts
@@ -14,9 +14,8 @@ import { getStoragePrefix } from "../../Core";
 import { getPhrase } from "../../Language";
 import { escapeHTML } from "../../StringUtil";
 import { dispatchToCkeditor, listenToCkeditor } from "./Event";
-import * as EventHandler from "../../Event/Handler";
 
-type Payload = {
+export type Payload = {
   html: string;
   timestamp: number;
 };
@@ -67,16 +66,12 @@ function getReturnToRestoreDialogOverlay(): HTMLElement {
 export function deleteDraft(identifier: string): void {
   try {
     window.localStorage.removeItem(getLocalStorageKey(identifier));
-
-    EventHandler.fire("com.woltlab.wcf.ckeditor5", "deleteDraft", {
-      identifier,
-    });
   } catch {
     // We cannot do anything meaningful if this fails.
   }
 }
 
-function saveDraft(identifier: string, html: string): void {
+function saveDraft(element: HTMLElement, identifier: string, html: string): void {
   if (html === "") {
     deleteDraft(identifier);
 
@@ -91,10 +86,7 @@ function saveDraft(identifier: string, html: string): void {
   try {
     window.localStorage.setItem(getLocalStorageKey(identifier), JSON.stringify(payload));
 
-    EventHandler.fire("com.woltlab.wcf.ckeditor5", "saveDraft", {
-      identifier,
-      payload,
-    });
+    dispatchToCkeditor(element).autosave(payload);
   } catch (e) {
     console.warn("Unable to write to the local storage.", e);
   }
@@ -245,7 +237,7 @@ export function initializeAutosave(
 
   configuration.autosave = {
     save(editor) {
-      saveDraft(identifier, editor.data.get());
+      saveDraft(element, identifier, editor.data.get());
 
       return Promise.resolve();
     },

diff --git a/ts/WoltLabSuite/Core/Component/Ckeditor/Event.ts b/ts/WoltLabSuite/Core/Component/Ckeditor/Event.ts
index 87295046179bb1921b688b2349a778f716ff0be9..49814410cbe0805568681d37a5c5170f03c0ca43 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Ckeditor/Event.ts
+++ b/ts/WoltLabSuite/Core/Component/Ckeditor/Event.ts
@@ -14,6 +14,7 @@ import type { InsertAttachmentPayload, RemoveAttachmentPayload, UploadAttachment
 import type { UploadMediaEventPayload } from "./Media";
 import type { InsertQuoteEventPayload } from "./Quote";
 import type { CKEditor5 } from "@woltlab/editor";
+import { Payload } from "WoltLabSuite/Core/Component/Ckeditor/Autosave";
 
 const enum EventNames {
   Bbcode = "ckeditor5:bbcode",
@@ -30,6 +31,7 @@ const enum EventNames {
   SubmitOnEnter = "ckeditor5:submit-on-enter",
   UploadAttachment = "ckeditor5:upload-attachment",
   UploadMedia = "ckeditor5:upload-media",
+  Autosave = "ckeditor5:autosave",
 }
 type BbcodeEventPayload = {
   bbcode: string;
@@ -79,6 +81,14 @@ class EventDispatcher {
     this.#element.dispatchEvent(new CustomEvent<void>(EventNames.DiscardRecoveredData));
   }
 
+  autosave(payload: Payload): void {
+    this.#element.dispatchEvent(
+      new CustomEvent<Payload>(EventNames.Autosave, {
+        detail: payload,
+      }),
+    );
+  }
+
   insertAttachment(payload: InsertAttachmentPayload): void {
     this.#element.dispatchEvent(
       new CustomEvent<InsertAttachmentPayload>(EventNames.InsertAttachment, {
@@ -301,6 +311,14 @@ class EventListener {
 
     return this;
   }
+
+  autosave(callback: (payload: Payload) => void): this {
+    this.#element.addEventListener(EventNames.Autosave, (event: CustomEvent<Payload>) => {
+      callback(event.detail);
+    });
+
+    return this;
+  }
 }
 
 export function dispatchToCkeditor(element: HTMLElement): EventDispatcher {

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Autosave.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Autosave.js
index 571589e57464045edc0ed3e03696be759cd4da0e..0679eea7aaf10c0bcab1c91e26072f08f6280243 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Autosave.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Autosave.js
@@ -8,11 +8,10 @@
  * @since 6.0
  * @woltlabExcludeBundle tiny
  */
-define(["require", "exports", "tslib", "../../Core", "../../Language", "../../StringUtil", "./Event", "../../Event/Handler"], function (require, exports, tslib_1, Core_1, Language_1, StringUtil_1, Event_1, EventHandler) {
+define(["require", "exports", "../../Core", "../../Language", "../../StringUtil", "./Event"], function (require, exports, Core_1, Language_1, StringUtil_1, Event_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.initializeAutosave = exports.setupRestoreDraft = exports.deleteDraft = void 0;
-    EventHandler = tslib_1.__importStar(EventHandler);
     function getLocalStorageKey(identifier) {
         return `${(0, Core_1.getStoragePrefix)()}ckeditor5-${identifier}`;
     }
@@ -52,16 +51,13 @@ define(["require", "exports", "tslib", "../../Core", "../../Language", "../../St
     function deleteDraft(identifier) {
         try {
             window.localStorage.removeItem(getLocalStorageKey(identifier));
-            EventHandler.fire("com.woltlab.wcf.ckeditor5", "deleteDraft", {
-                identifier,
-            });
         }
         catch {
             // We cannot do anything meaningful if this fails.
         }
     }
     exports.deleteDraft = deleteDraft;
-    function saveDraft(identifier, html) {
+    function saveDraft(element, identifier, html) {
         if (html === "") {
             deleteDraft(identifier);
             return;
@@ -72,10 +68,7 @@ define(["require", "exports", "tslib", "../../Core", "../../Language", "../../St
         };
         try {
             window.localStorage.setItem(getLocalStorageKey(identifier), JSON.stringify(payload));
-            EventHandler.fire("com.woltlab.wcf.ckeditor5", "saveDraft", {
-                identifier,
-                payload,
-            });
+            (0, Event_1.dispatchToCkeditor)(element).autosave(payload);
         }
         catch (e) {
             console.warn("Unable to write to the local storage.", e);
@@ -195,7 +188,7 @@ define(["require", "exports", "tslib", "../../Core", "../../Language", "../../St
         removeExpiredDrafts();
         configuration.autosave = {
             save(editor) {
-                saveDraft(identifier, editor.data.get());
+                saveDraft(element, identifier, editor.data.get());
                 return Promise.resolve();
             },
             waitingTime: 15000,

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Event.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Event.js
index d465ebcb5e5ed8c393e81159e66189bf1fbb3d20..db3d3ede9cd1748a15e04eb382ffae3d8e6297c3 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Event.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Event.js
@@ -27,6 +27,11 @@ define(["require", "exports"], function (require, exports) {
         discardRecoveredData() {
             this.#element.dispatchEvent(new CustomEvent("ckeditor5:discard-recovered-data" /* EventNames.DiscardRecoveredData */));
         }
+        autosave(payload) {
+            this.#element.dispatchEvent(new CustomEvent("ckeditor5:autosave" /* EventNames.Autosave */, {
+                detail: payload,
+            }));
+        }
         insertAttachment(payload) {
             this.#element.dispatchEvent(new CustomEvent("ckeditor5:insert-attachment" /* EventNames.InsertAttachment */, {
                 detail: payload,
@@ -173,6 +178,12 @@ define(["require", "exports"], function (require, exports) {
             });
             return this;
         }
+        autosave(callback) {
+            this.#element.addEventListener("ckeditor5:autosave" /* EventNames.Autosave */, (event) => {
+                callback(event.detail);
+            });
+            return this;
+        }
     }
     function dispatchToCkeditor(element) {
         return new EventDispatcher(element);