mxDefaultToolbarCodec

Custom codec for configuring mxDefaultToolbars.  This class is created and registered dynamically at load time and used implicitly via mxCodec and the mxCodecRegistry.  This codec only reads configuration data for existing toolbars handlers, it does not encode or create toolbars.

Summary
mxDefaultToolbarCodecCustom codec for configuring mxDefaultToolbars.
Functions
encodeReturns null.
decodeReads a sequence of the following child nodes and attributes:
Variables
allowEvalStatic global switch that specifies if the use of eval is allowed for evaluating text content.

Functions

encode

codec.encode = function(enc,
obj)

Returns null.

decode

codec.decode = function(dec,
node,
into)

Reads a sequence of the following child nodes and attributes:

Child Nodes

addAdds a new item to the toolbar.  See below for attributes.
separatorAdds a vertical separator.  No attributes.
hrAdds a horizontal separator.  No attributes.
brAdds a linefeed.  No attributes.

Attributes

asResource key for the label.
actionName of the action to execute in enclosing editor.
modeModename (see below).
templateTemplate name for cell insertion.
styleOptional style to override the template style.
iconIcon (relative/absolute URL).
pressedIconOptional icon for pressed state (relative/absolute URL).
idOptional ID to be used for the created DOM element.
toggleOptional 0 or 1 to disable toggling of the element.  Default is 1 (true).

The action, mode and template attributes are mutually exclusive.  The style can only be used with the template attribute.  The add node may contain another sequence of add nodes with as and action attributes to create a combo box in the toolbar.  If the icon is specified then a list of the child node is expected to have its template attribute set and the action is ignored instead.

Nodes with a specified template may define a function to be used for inserting the cloned template into the graph.  Here is an example of such a node:

<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"><![CDATA[
  function (editor, cell, evt, targetCell)
  {
    let pt = mxUtils.convertPoint(
      editor.graph.container, mxEvent.getClientX(evt),
        mxEvent.getClientY(evt));
    return editor.addVertex(targetCell, cell, pt.x, pt.y);
  }
]]></add>

In the above function, editor is the enclosing mxEditor instance, cell is the clone of the template, evt is the mouse event that represents the drop and targetCell is the cell under the mousepointer where the drop occurred.  The targetCell is retrieved using mxGraph.getCellAt.

Futhermore, nodes with the mode attribute may define a function to be executed upon selection of the respective toolbar icon.  In the example below, the default edge style is set when this specific connect-mode is activated:

<add as="connect" mode="connect"><![CDATA[
  function (editor)
  {
    if (editor.defaultEdge != null)
    {
      editor.defaultEdge.style = 'straightEdge';
    }
  }
]]></add>

Both functions require mxDefaultToolbarCodec.allowEval to be set to true.

Modes

selectLeft mouse button used for rubberband- & cell-selection.
connectAllows connecting vertices by inserting new edges.
panDisables selection and switches to panning on the left button.

Example

To add items to the toolbar

<mxDefaultToolbar as="toolbar">
  <add as="save" action="save" icon="images/save.gif"/>
  <br/><hr/>
  <add as="select" mode="select" icon="images/select.gif"/>
  <add as="connect" mode="connect" icon="images/connect.gif"/>
</mxDefaultToolbar>

Variables

allowEval

mxDefaultToolbarCodec.allowEval

Static global switch that specifies if the use of eval is allowed for evaluating text content.  Default is true.  Set this to false if stylesheets may contain user input

Toolbar for the editor.
codec.encode = function(enc,
obj)
Returns null.
codec.decode = function(dec,
node,
into)
Reads a sequence of the following child nodes and attributes:
mxDefaultToolbarCodec.allowEval
Static global switch that specifies if the use of eval is allowed for evaluating text content.
XML codec for JavaScript object graphs.
Singleton class that acts as a global registry for codecs.
Extends mxEventSource to implement an application wrapper for a graph that adds actions, I/O using mxCodec, auto-layout using mxLayoutManager, command history using undoManager, and standard dialogs and widgets, eg.
mxGraph.prototype.getCellAt = function(x,
y,
parent,
vertices,
edges,
ignoreFn)
Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent.
Close