From: Cyperghost Date: Mon, 15 Jan 2024 09:58:13 +0000 (+0100) Subject: Use native event X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=b8dfdb2a11664e2b730f7ce63e2e921b91e6d1a8;p=GitHub%2FWoltLab%2FWCF.git Use native event --- diff --git a/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts b/ts/WoltLabSuite/Core/Component/Ckeditor/Autosave.ts index ef682c60dd..c0090c5c10 100644 --- 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 8729504617..49814410cb 100644 --- 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(EventNames.DiscardRecoveredData)); } + autosave(payload: Payload): void { + this.#element.dispatchEvent( + new CustomEvent(EventNames.Autosave, { + detail: payload, + }), + ); + } + insertAttachment(payload: InsertAttachmentPayload): void { this.#element.dispatchEvent( new CustomEvent(EventNames.InsertAttachment, { @@ -301,6 +311,14 @@ class EventListener { return this; } + + autosave(callback: (payload: Payload) => void): this { + this.#element.addEventListener(EventNames.Autosave, (event: CustomEvent) => { + 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 571589e574..0679eea7aa 100644 --- 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 d465ebcb5e..db3d3ede9c 100644 --- 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);