Add CommandsEvents

src/commands/index.ts

@@ -49,6 +49,7 @@ import { Module } from '../abstract';
 import Component, { eventDrag } from '../dom_components/model/Component';
 import Editor from '../editor/model/Editor';
 import { ObjectAny } from '../common';
+import CommandsEvents from './types';
 
 export type CommandEvent = 'run' | 'stop' | `run:${string}` | `stop:${string}` | `abort:${string}`;
 
@@ -105,6 +106,7 @@ export default class CommandsModule extends Module<CommandsConfig & { pStylePref
   defaultCommands: Record<string, Command> = {};
   commands: Record<string, CommandObject> = {};
   active: Record<string, any> = {};
+  events = CommandsEvents;
 
   /**
    * @private

src/commands/types.ts

@@ -0,0 +1,71 @@
+/**{START_EVENTS}*/
+export enum CommandsEvents {
+  /**
+   * @event `command:run` Triggered on run of any command.
+   * @example
+   * editor.on('command:run', ({ id, result, options }) => {
+   *  console.log('Command id', id, 'command result', result);
+   * });
+   */
+  run = 'command:run',
+  _run = 'run',
+
+  /**
+   * @event `command:run:COMMAND_ID` Triggered on run of a specific command.
+   * @example
+   * editor.on('command:run:my-command', ({ result, options }) => { ... });
+   */
+  runCommand = 'command:run:',
+  _runCommand = 'run:',
+
+  /**
+   * @event `command:run:before:COMMAND_ID` Triggered before the command is called.
+   * @example
+   * editor.on('command:run:before:my-command', ({ options }) => { ... });
+   */
+  runBeforeCommand = 'command:run:before:',
+
+  /**
+   * @event `command:abort:COMMAND_ID` Triggered when the command execution is aborted.
+   * @example
+   * editor.on('command:abort:my-command', ({ options }) => { ... });
+   *
+   * // The command could be aborted during the before event
+   * editor.on('command:run:before:my-command', ({ options }) => {
+   *  if (someCondition) {
+   *    options.abort = true;
+   *  }
+   * });
+   */
+  abort = 'command:abort:',
+  _abort = 'abort:',
+
+  /**
+   * @event `command:stop` Triggered on stop of any command.
+   * @example
+   * editor.on('command:stop', ({ id, result, options }) => {
+   *  console.log('Command id', id, 'command result', result);
+   * });
+   */
+  stop = 'command:stop',
+  _stop = 'stop',
+
+  /**
+   * @event `command:stop:COMMAND_ID` Triggered on stop of a specific command.
+   * @example
+   * editor.on('command:run:my-command', ({ result, options }) => { ... });
+   */
+  stopCommand = 'command:stop:',
+  _stopCommand = 'stop:',
+
+  /**
+   * @event `command:stop:before:COMMAND_ID` Triggered before the command is called to stop.
+   * @example
+   * editor.on('command:stop:before:my-command', ({ options }) => { ... });
+   */
+  stopBeforeCommand = 'command:stop:before:',
+}
+/**{END_EVENTS}*/
+
+// need this to avoid the TS documentation generator to break
+export default CommandsEvents;

src/commands/view/CommandAbstract.ts

@@ -2,6 +2,7 @@ import CanvasModule from '../../canvas';
 import { Model, ObjectAny } from '../../common';
 import Editor from '../../editor';
 import EditorModel from '../../editor/model/Editor';
+import CommandsEvents from '../types';
 
 interface ICommand<O extends ObjectAny = any> {
   run?: CommandAbstract<O>['run'];
@@ -108,18 +109,24 @@ export default class CommandAbstract<O extends ObjectAny = any> extends Model {
    * @private
    * */
   callRun(editor: Editor, options: any = {}) {
-    const id = this.id;
+    const { id } = this;
-    editor.trigger(`run:${id}:before`, options);
+    editor.trigger(`${CommandsEvents.runBeforeCommand}${id}`, { options });
+    editor.trigger(`${CommandsEvents._runCommand}${id}:before`, options);
 
-    if (options && options.abort) {
+    if (options.abort) {
-      editor.trigger(`abort:${id}`, options);
+      editor.trigger(`${CommandsEvents.abort}${id}`, { options });
+      editor.trigger(`${CommandsEvents._abort}${id}`, options);
       return;
     }
 
     const sender = options.sender || editor;
     const result = this.run(editor, sender, options);
-    editor.trigger(`run:${id}`, result, options);
+    const data = { id, result, options };
-    editor.trigger('run', id, result, options);
+    editor.trigger(`${CommandsEvents.runCommand}${id}`, data);
+    editor.trigger(CommandsEvents.run, data);
+    // deprecated
+    editor.trigger(`${CommandsEvents._runCommand}${id}`, result, options);
+    editor.trigger(CommandsEvents._run, id, result, options);
     return result;
   }
 
@@ -130,12 +137,18 @@ export default class CommandAbstract<O extends ObjectAny = any> extends Model {
    * @private
    * */
   callStop(editor: Editor, options: any = {}) {
-    const id = this.id;
+    const { id } = this;
     const sender = options.sender || editor;
-    editor.trigger(`stop:${id}:before`, options);
+    editor.trigger(`${CommandsEvents.stopBeforeCommand}${id}`, { options });
+    editor.trigger(`${CommandsEvents._stopCommand}${id}:before`, options);
     const result = this.stop(editor, sender, options);
-    editor.trigger(`stop:${id}`, result, options);
+    const data = { id, result, options };
-    editor.trigger('stop', id, result, options);
+    editor.trigger(`${CommandsEvents.stopCommand}${id}`, data);
+    editor.trigger(CommandsEvents.stop, data);
+
+    // deprecated
+    editor.trigger(`${CommandsEvents._stopCommand}${id}`, result, options);
+    editor.trigger(CommandsEvents._stop, id, result, options);
     return result;
   }