From ee1f4a14bfc1df1572a2c6dd4292fea19cf15264 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Thu, 30 Dec 2021 13:08:46 +0100 Subject: [PATCH] Move commands events --- src/commands/index.js | 43 +++++++++++++++++++++++++++---------------- src/editor/index.js | 16 +++++----------- 2 files changed, 32 insertions(+), 27 deletions(-) diff --git a/src/commands/index.js b/src/commands/index.js index 6c4d0f1f3..6bae94f33 100644 --- a/src/commands/index.js +++ b/src/commands/index.js @@ -8,12 +8,27 @@ * }) * ``` * - * Once the editor is instantiated you can use its API. Before using these methods you should get the module from the instance + * Once the editor is instantiated you can use its API and listen to its events. Before using these methods, you should get the module from the instance. * * ```js + * // Listen to events + * editor.on('run', () => { ... }); + * + * // Use the API * const commands = editor.Commands; + * commands.add(...); * ``` * + ** ## Available Events + * * `run:{commandName}` - Triggered when some command is called to run (eg. editor.runCommand('preview')) + * * `stop:{commandName}` - Triggered when some command is called to stop (eg. editor.stopCommand('preview')) + * * `run:{commandName}:before` - Triggered before the command is called + * * `stop:{commandName}:before` - Triggered before the command is called to stop + * * `abort:{commandName}` - Triggered when the command execution is aborted (`editor.on(`run:preview:before`, opts => opts.abort = 1);`) + * * `run` - Triggered on run of any command. The id and the result are passed as arguments to the callback + * * `stop` - Triggered on stop of any command. The id and the result are passed as arguments to the callback + * + * ## Methods * * [add](#add) * * [get](#get) * * [getAll](#getall) @@ -56,7 +71,7 @@ const commandsDef = [ ['component-exit', 'ComponentExit', 'select-parent'], ['component-delete', 'ComponentDelete'], ['component-style-clear', 'ComponentStyleClear'], - ['component-drag', 'ComponentDrag'] + ['component-drag', 'ComponentDrag'], ]; export default () => { @@ -67,7 +82,7 @@ export default () => { const active = {}; // Need it here as it would be used below - const add = function(id, obj) { + const add = function (id, obj) { if (isFunction(obj)) obj = { run: obj }; if (!obj.stop) obj.noStop = 1; delete obj.initialize; @@ -94,7 +109,7 @@ export default () => { init(config = {}) { c = { ...defaults, - ...config + ...config, }; em = c.em; const ppfx = c.pStylePrefix; @@ -109,14 +124,14 @@ export default () => { defaultCommands['tlb-delete'] = { run(ed) { return ed.runCommand('core:component-delete'); - } + }, }; defaultCommands['tlb-clone'] = { run(ed) { ed.runCommand('core:copy'); ed.runCommand('core:paste'); - } + }, }; defaultCommands['tlb-move'] = { @@ -171,7 +186,7 @@ export default () => { onStart, onDrag, onEnd, - event + event, }); } else { if (nativeDrag) { @@ -187,7 +202,7 @@ export default () => { } selAll.forEach(sel => sel.set('status', 'freezed-selected')); - } + }, }; // Core commands @@ -202,9 +217,7 @@ export default () => { defaultCommands[oldCmd] = cmd; // Propogate old commands (can be removed once we stop to call old commands) ['run', 'stop'].forEach(name => { - em.on(`${name}:${oldCmd}`, (...args) => - em.trigger(`${name}:${cmdName}`, ...args) - ); + em.on(`${name}:${oldCmd}`, (...args) => em.trigger(`${name}:${cmdName}`, ...args)); }); } }); @@ -274,13 +287,11 @@ export default () => { if (command) { const cmdObj = { ...command.constructor.prototype, - ...cmd + ...cmd, }; this.add(id, cmdObj); // Extend also old name commands if exist - const oldCmd = commandsDef.filter( - cmd => `core:${cmd[0]}` === id && cmd[2] - )[0]; + const oldCmd = commandsDef.filter(cmd => `core:${cmd[0]}` === id && cmd[2])[0]; oldCmd && this.add(oldCmd[2], cmdObj); } return this; @@ -432,6 +443,6 @@ export default () => { destroy() { [em, c, commands, defaultCommands, active].forEach(i => (i = {})); - } + }, }; }; diff --git a/src/editor/index.js b/src/editor/index.js index a65ca87df..ec28d796b 100644 --- a/src/editor/index.js +++ b/src/editor/index.js @@ -68,13 +68,7 @@ * * `rte:enable` - RTE enabled. The view, on which RTE is enabled, is passed as an argument * * `rte:disable` - RTE disabled. The view, on which RTE is disabled, is passed as an argument * ### Commands - * * `run:{commandName}` - Triggered when some command is called to run (eg. editor.runCommand('preview')) - * * `stop:{commandName}` - Triggered when some command is called to stop (eg. editor.stopCommand('preview')) - * * `run:{commandName}:before` - Triggered before the command is called - * * `stop:{commandName}:before` - Triggered before the command is called to stop - * * `abort:{commandName}` - Triggered when the command execution is aborted (`editor.on(`run:preview:before`, opts => opts.abort = 1);`) - * * `run` - Triggered on run of any command. The id and the result are passed as arguments to the callback - * * `stop` - Triggered on stop of any command. The id and the result are passed as arguments to the callback + * Check the [Commands](/api/commands.html) module. * ### Selectors * Check the [Selectors](/api/selector_manager.html) module. * ### Blocks @@ -106,7 +100,7 @@ export default (config = {}, opts = {}) => { const { $ } = opts; const c = { ...defaults, - ...config + ...config, }; c.pStylePrefix = c.stylePrefix; @@ -163,7 +157,7 @@ export default (config = {}, opts = {}) => { 'StyleManager', ['Styles', 'StyleManager'], 'DeviceManager', - ['Devices', 'DeviceManager'] + ['Devices', 'DeviceManager'], ].forEach(prop => { if (Array.isArray(prop)) { this[prop[0]] = em.get(prop[1]); @@ -719,7 +713,7 @@ export default (config = {}, opts = {}) => { editorView && editorView.remove(); editorView = new EditorView({ model: em, - config: c + config: c, }); return editorView.render().el; }, @@ -748,6 +742,6 @@ export default (config = {}, opts = {}) => { * // Use `$${var}` to avoid escaping * const strHtml = editor.html`Escaped ${unsafeStr}, unescaped $${safeStr}`; */ - html + html, }; };