Class CommandHandler
The Diagram.commandHandler implements various commands such as CommandHandler.deleteSelection or CommandHandler.redo. The CommandHandler includes keyboard event handling to interpret key presses as commands.
CommandHandlers cannot be shared amongst multiple Diagrams.
You may define a CommandHandler subclass and override methods. However you must seriously consider calling the base method in order to get its default behavior. There may be situations where not calling the base method may cause subtle bugs, but that depends on the method. Please read the Introduction page on Extensions for how to override methods and how to call a base method.
There is an example custom CommandHandler in the extensions directory: DrawCommandHandler.js, which provides alignment commands and additional behaviors for the arrow keys.
For additional discussion, please read the Introduction page on Commands.
Keyboard Shortcuts
The CommandHandler implements the following command bindings for keyboard input in doKeyDown:Ctrl-X
&Shift-Del
invoke cutSelectionCtrl-C
&Ctrl-Insert
invoke copySelectionCtrl-V
&Shift-Insert
invoke pasteSelectionDel
&Backspace
invoke deleteSelectionCtrl-A
invokes selectAllCtrl-Z
&Alt-Backspace
invoke undoCtrl-Y
&Alt-Shift-Backspace
invoke redoUp
&Down
&Left
&Right
(arrow keys) call Diagram.scrollPageUp
&PageDown
call Diagram.scrollHome
&End
call Diagram.scrollSpace
invokes scrollToPartCtrl-- & Keypad--
(minus) invoke decreaseZoomCtrl-+ & Keypad-+
(plus) invoke increaseZoomCtrl-0
invokes resetZoomShift-Z
invokes zoomToFit; repeat to return to the original scale and positionCtrl-G
invokes groupSelectionCtrl-Shift-G
invokes ungroupSelectionF2
invokes editTextBlockMenu Key
invokes showContextMenuEsc
invokes stopCommand
On a Macintosh the Command key is used as the modifier instead of the Control key.
On touch devices there is a default context menu that shows many commonly-used commands when you hold a finger down on the diagram.
Constructor Summary Details
Name | Description |
---|---|
CommandHandler()
|
The constructor produces a CommandHandler with the default key bindings. |
Properties Summary Details
Name, Value Type | Description |
---|---|
archetypeGroupData
{Object}
|
Gets or sets a data object that is copied by groupSelection when creating a new Group.More... The default value is null. If you set this to an Object, be sure that GraphLinksModel.isGroupForNodeData is true for that object. Setting this property does not raise any events. |
copiesConnectedLinks
{boolean}
1.5
|
Gets or sets whether copySelection should also copy Links that connect with selected Nodes.More... The default value is true. Setting this property does not raise any events. The DraggingTool.copiesEffectiveCollection property serves a similar role for the DraggingTool when the user holds down the control key to modify the drag into a copy operation. |
copiesGroupKey
{boolean}
1.3
|
Gets or sets whether copySelection and copyToClipboard copy the node data property whose value is the containing group data's key.More... Set this property to true if you want a copy/paste of a node to automatically have the new node be a member of the original group. Caution: this only has an effect if the Diagram's Diagram.model is a GraphLinksModel. The default value is false. |
copiesParentKey
{boolean}
1.3
|
Gets or sets whether copySelection and copyToClipboard copy the node data property whose value is the tree-parent node data's key.More... Set this property to true if you want a copy/paste of a node to automatically have the new node be a tree-child of the original tree-parent node. Caution: this only has an effect if the Diagram's Diagram.model is a TreeModel. The default value is false. |
copiesTree
{boolean}
|
Gets or sets whether copySelection should also copy subtrees.More... The default value is false. Setting this property does not raise any events. The DraggingTool.dragsTree property serves a similar role for the DraggingTool for both moving and copying operations. |
defaultScale
{number}
1.3
|
Gets or sets the Diagram.scale set by resetZoom.More... The default value is 1.0. The value must be a number larger than 0. Setting this property does not raise any events. |
deletesConnectedLinks
{boolean}
1.6
|
Gets or sets whether deleteSelection should also delete links that are connected to nodes that are deleted.More... The default value is true. Setting this property does not raise any events. |
deletesTree
{boolean}
|
Gets or sets whether deleteSelection should also delete subtrees.More... The default value is false. Setting this property does not raise any events. |
diagram
{Diagram}
|
This read-only property returns the Diagram that is using this CommandHandler, after Diagram.commandHandler has been set to this object. |
memberValidation
{function(Group, Part):boolean | null}
|
Gets or sets the predicate that determines whether or not a node may become a member of a group.More...
This predicate is called in addition to any existing group's Group.memberValidation predicate.
The default predicate is null, which is equivalent to simply returning true.
The predicate may be called passing null as the first argument (the Group) --
this asks whether it is OK to make the second argument (the Part, but not a Link) a top-level Part of the diagram.
For a more general discussion of validation, see Introduction to Validation.
The function, if supplied, must not have any side-effects. |
zoomFactor
{number}
1.1
|
Gets or sets the amount by which decreaseZoom and increaseZoom change the Diagram.scale.More... The default value is 1.05 (5%). The value must be a number larger than 1.0. Setting this property does not raise any events. |
Method Summary Details
Name, Return Type | Description |
---|---|
addTopLevelParts(coll, check)
{boolean}
|
Make sure all of the unnested Parts in the given collection are removed from any containing Groups.More... This sets Part.containingGroup to null on each Part that is not a member of another Part in the argument collection. If the check argument to this method is supplied and true, this will call isValidMember on each part, passing null as the first argument. This functionality is similar to ungroupSelection, except that this is not a command (there is no transaction and this does not raise a DiagramEvent) and the parts are necessarily becoming top-level parts (whereas ungrouping would add them to the Group containing the Group being ungrouped). This function is typically called in a Diagram.mouseDrop event handler in order to remove the selected Parts from whatever Group they had been in. If you want to add Parts to be members of a Group, call Group.addMembers. If you want to remove Parts completely from a Diagram, call Diagram.removeParts. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method.
|
canCollapseSubGraph(group)
{boolean}
|
This predicate controls whether the user can collapse expanded Groups.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canCollapseTree(node)
{boolean}
|
This predicate controls whether the user can collapse expanded subtrees of Nodes.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canCopySelection()
{boolean}
|
This predicate controls whether or not the user can invoke the copySelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canCutSelection()
{boolean}
|
This predicate controls whether or not the user can invoke the cutSelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canDecreaseZoom(factor)
{boolean}
|
This predicate controls whether or not the user can invoke the decreaseZoom command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canDeleteSelection()
{boolean}
|
This predicate controls whether or not the user can invoke the deleteSelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canEditTextBlock(textblock)
{boolean}
|
This predicate controls whether or not the user can invoke the editTextBlock command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canExpandSubGraph(group)
{boolean}
|
This predicate controls whether the user can expand collapsed Groups.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canExpandTree(node)
{boolean}
|
This predicate controls whether the user can expand collapsed subtrees of Nodes.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canGroupSelection()
{boolean}
|
This predicate controls whether or not the user can invoke the groupSelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canIncreaseZoom(factor)
{boolean}
|
This predicate controls whether or not the user can invoke the increaseZoom command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canPasteSelection()
{boolean}
|
This predicate controls whether or not the user can invoke the pasteSelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canRedo()
{boolean}
|
This predicate controls whether or not the user can invoke the redo command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canResetZoom(newscale)
{boolean}
|
This predicate controls whether or not the user can invoke the resetZoom command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canScrollToPart(part)
{boolean}
1.6
|
This predicate controls whether or not the user can invoke the scrollToPart command.More... This returns false if there is no argument Part and there are no selected Parts. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canSelectAll()
{boolean}
|
This predicate controls whether or not the user can invoke the selectAll command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canShowContextMenu(obj)
{boolean}
|
This predicate controls whether or not the user can invoke the showContextMenu command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canStopCommand()
{boolean}
|
This predicate controls whether the user may stop the current tool.More... This just returns true. This method may be overridden, but probably should not be overridden. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canUndo()
{boolean}
|
This predicate controls whether or not the user can invoke the undo command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canUngroupSelection(group)
{boolean}
|
This predicate controls whether or not the user can invoke the ungroupSelection command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
canZoomToFit()
{boolean}
1.1
|
This predicate controls whether or not the user can invoke the zoomToFit command.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. This method must not have any side-effects. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
collapseSubGraph(group)
|
This command collapses all expanded selected Groups.More... This operation is performed within a "Collapse SubGraph" transaction. Just before the end of the transaction this raises the "SubGraphCollapsed" DiagramEvent, with a collection of collapsed Groups as the subject. This currently has no default keyboard shortcut. This calls Group.collapseSubGraph to perform the collapse, which will set Group.isSubGraphExpanded to false. You may want to save the collapsed/expanded state to the model by using a TwoWay Binding on the "isSubGraphExpanded" property of your Groups, and perhaps also on the Group.wasSubGraphExpanded property. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
collapseTree(node)
|
This command collapses all expanded selected Nodes.More... This operation is performed within a "Collapse Tree" transaction. Just before the end of the transaction this raises the "TreeCollapsed" DiagramEvent, with a collection of collapsed Nodes as the subject. This currently has no default keyboard shortcut. This calls Node.collapseTree to perform the collapse, which will set Node.isTreeExpanded to false. You may want to save the collapsed/expanded state to the model by using a TwoWay Binding on the "isTreeExpanded" property of your Nodes, and perhaps also on the Node.wasTreeExpanded property. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
copySelection()
|
This command copies the currently selected parts, Diagram.selection, from the Diagram into the clipboard.More...
This is normally invoked by the This makes a copy of the current selection by calling copyToClipboard. This also raises the "ClipboardChanged" diagram event. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
copyToClipboard(coll)
|
Make a copy of the given collection of Parts and stores it in a static variable acting as the clipboard.More... The clipboard is initially null. It can hold a collection of copied Parts. It also remembers the Model.dataFormat of the diagram from which the parts were copied. This calls Diagram.copyParts in order to make a copy of the Parts for the clipboard. The values of copiesParentKey and copiesGroupKey affect whether a copied node data remembers its tree parent node (if in a TreeModel) or its containing group (if in a GraphLinksModel). This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
cutSelection()
|
This command executes a copySelection followed by a deleteSelection.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
decreaseZoom(factor)
|
This command decreases the Diagram.scale by a given factor.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
deleteSelection()
|
This command deletes the currently selected parts from the diagram.More...
This is normally invoked by the This will start a "Delete" transaction, call Diagram.removeParts, raise the "SelectionDeleted" diagram event, and finally commit the transaction. Because this command changes the selection, this method also raises the "ChangingSelection" and "ChangedSelection" diagram events. All changes are performed within a transaction. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
doKeyDown()
|
This is called by tools to handle keyboard commands.More... For most commands, this calls the "can..." predicate; if that returns true it calls the command method. If GoJS handles a key-down event as a keyboard command, the underlying event will not bubble. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. There is an example custom CommandHandler in the extensions directory: DrawCommandHandler.js, which implements additional behaviors for the arrow keys by overriding this method. For additional discussion, please read the Introduction page on Commands. |
doKeyUp()
|
This is called by tools to handle keyboard commands.More... This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. |
editTextBlock(textblock)
|
This command starts in-place editing of a TextBlock in the selected Part.More...
This is normally invoked by the This starts the TextEditingTool to have the user enter or modify the text string and finally set the TextBlock.text. You may want to save the new string to the model by using a TwoWay Binding on the "text" property of your TextBlock. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
expandSubGraph(group)
|
This command expands all collapsed selected Groups.More... This operation is performed within an "Expand SubGraph" transaction. Just before the end of the transaction this raises the "SubGraphExpanded" DiagramEvent, with a collection of expanded Groups as the subject. This currently has no default keyboard shortcut. This calls Group.expandSubGraph to perform the collapse, which will set Group.isSubGraphExpanded to true. You may want to save the collapsed/expanded state to the model by using a TwoWay Binding on the "isSubGraphExpanded" property of your Groups, and perhaps also on the Group.wasSubGraphExpanded property. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
expandTree(node)
|
This command expands all collapsed selected Nodes.More... This operation is performed within an "Expand Tree" transaction. Just before the end of the transaction this raises the "TreeExpanded" DiagramEvent, with a collection of expanded Nodes as the subject. This currently has no default keyboard shortcut. This calls Node.expandTree to perform the expand, which will set Node.isTreeExpanded to true. You may want to save the collapsed/expanded state to the model by using a TwoWay Binding on the "isTreeExpanded" property of your Nodes, and perhaps also on the Node.wasTreeExpanded property. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
groupSelection()
|
This command adds a copy of archetypeGroupData to the diagram's model
to create a new Group and then adds the selected Parts to that new group.More...
This is normally invoked by the This creates a new Group by adding a copy of the archetypeGroupData to the model. Each of the selected parts for which Part.canGroup is true and for which isValidMember is true is made a member of that new group. If all of the selected groupable parts were members of a pre-existing group, the new group also becomes a member of that pre-existing group, if isValidMember is true for that existing group with the new group. The new group becomes the only selected part. This raises the "SelectionGrouped" diagram event. This method also raises the "ChangingSelection" and "ChangedSelection" diagram events. All of the changes are performed in a "Group" transaction. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
increaseZoom(factor)
|
This command increases the Diagram.scale by a given factor.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
isValidMember(group, part)
{boolean}
|
This predicate is called to determine whether a Node may be added as a member of a Group.More...
This always checks to make sure no group might become a member of itself, either directly or indirectly.
If the Group has a Group.memberValidation predicate and if it returns false, this method returns false.
If this CommandHandler has a memberValidation predicate and if it returns false, this method returns false.
Otherwise this will return true.
For a more general discussion of validation, see Introduction to Validation.
This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method.
|
pasteFromClipboard()
{Set.
|
If the clipboard holds a collection of Parts, and if the Model.dataFormat matches that stored in the clipboard, this makes a copy of the clipboard's parts and adds the copies to this Diagram.More... This calls Diagram.copyParts in order to make a copy of the Parts in the clipboard and add them to this diagram. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
pasteSelection(pos)
|
This command copies the contents of the clipboard into this diagram and makes those new parts the new selection.More...
This is normally invoked by the This calls pasteFromClipboard to add copies of Parts into this diagram, and then selects all of the newly created parts. This also raises the "ClipboardPasted" diagram event. This method raises the "ChangingSelection" and "ChangedSelection" diagram events. All of the changes are performed in a transaction. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
redo()
|
This command calls UndoManager.redo.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
resetZoom(newscale)
|
This command sets the Diagram.scale to a new scale value, by default 1.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
scrollToPart(part)
1.6
|
This command scrolls the diagram to make a highlighted or selected Part visible in the viewport.More... Call this command repeatedly to cycle through the Diagram.highlighteds collection, if there are any Parts in that collection, or else in the Diagram.selection collection, scrolling to each one in turn by calling Diagram.centerRect.
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
selectAll()
|
This command selects all of the selectable Parts in the diagram by setting Part.isSelected to true on each one.More...
This is normally invoked by the This method raises the "ChangingSelection" and "ChangedSelection" diagram events. This ignores all parts in temporary layers. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
showContextMenu(obj)
|
This command opens the context menu for a selected Part or given GraphObject, or else for the whole Diagram.More...
This is normally invoked by the The given GraphObject must have a GraphObject.contextMenu defined in order to show anything. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
stopCommand()
|
This command cancels the operation of the current tool.More... This is typically called when the user presses ESCAPE. If the current tool is a ToolManager, this clears the diagram's selection. This then calls Tool.doCancel on the current tool. See also:
|
undo()
|
This command calls UndoManager.undo.More...
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
ungroupSelection(group)
|
This command removes selected groups from the diagram without removing their members from the diagram.More...
This is normally invoked by the For the given group, or if not supplied, each selected Group that is Group.ungroupable, expand the subgraph and change all of its member parts to be members of the group that the selected group node is in. (If the selected group is a top-level node, i.e. not a member of any group node, its members become top-level parts too.) All of those selected groups are deleted. All of the reparented member parts are selected. This raises the "SelectionUngrouped" diagram event. This method also raises the "ChangingSelection" and "ChangedSelection" diagram events. All of the changes are performed in an "Ungroup" transaction. This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|
zoomToFit()
1.1
|
This command changes the Diagram.scale so that the Diagram.documentBounds fits within the viewport.More...
If this command had been called before without any other zooming since then,
the original Diagram scale and position are restored.
This is normally invoked by the This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Introduction page on Extensions for how to override methods and how to call this base method. See also:
|