Skip to content

Edit Action Handler

This callback is optional. You don’t need to implement anything for it and it doesn’t return anything. It is called whenever the user does the following gestures on the canvas:

  • Clicks a tool/icon in the toolbar.
  • Clicks an option in the context menu or context toolbar
  • Presses a key combination on the keyboard to cause the canvas to change.
  • Performs some direct manipulation on the canvas such as:
    • Create a node
    • Moves one or a set of nodes/comments
    • Edits a comment
    • Links two nodes together
    • etc

These is will either perform one of the many internal actions supported by Common Canvas or the application’s own external actions, if they have been added to the context menu/toolbar or the main canvas toolbar.

editActionHandler

    editActionHandler(data, command)

This callback is called after the common-canvas internal object model has been updated. This callback is provided with two parameters: data and command.

  1. data parameter - This is the data for the initial request create by whatever action the user performed. The data fields can vary depending on the action. Here is an example:
        {
          editType: "createComment",
          editSource: "contextmenu",
          selectedObjects: [],
          selectedObjectIds: [],
          offsetX: 100,
          offsetY: 42
        }
    
  • editType - This is the action that originates from either the toolbar, context menu, keyboard action or direct manipulation on the canvas. If you specified your own action in the context menu or in the toolbar this field will be your action’s name.

  • editSource - This is the source of the action. It can be set to “toolbar”, “contextmenu”, “keyboard” or “canvas” (for an action caused by direct manipulation on the canvas).

  • selectedObjects - An array of the currently selected objects.

  • selectedObjectIds - An array of the IDs of currently selected objects. Included for backward compatibility.

  • Other fields - Numerous other fields which vary based on the action and the source of the action.

  1. command parameter - This is a Javascript class which is the command object that was executed to run the action ‘requested’ by the user and added to the command stack. The command object may contain fields which are the result of executing the command. For example, when the user creates a new node on the canvas the ‘createNode’ action will be performed and the command parameter in editActionHandler will contain a field called newNode which is the node that was created on the canvas.

    If the user performed an undo action this will be the command that has been undone. If the user performed a redo action this will be the command that was redone.

Handling external actions

If you specified your application’s own ‘external’ action you can do whatever is necessary in this callback.

The editType field of the first parameter, passed in to the callback, will be set to the action name.

Here’s a simple expmple:

    editActionHandler(data, command) {
        if (data.editType === "myAction") {
            // Execute my action code here.
        }
    }