<!-- saved from url=(0026)http://www.naturaldocs.org -->
<divid=Content><divclass="CClass"><divclass=CTopicid=MainTopic><h1class=CTitle><aname="mxDefaultToolbarCodec"></a>mxDefaultToolbarCodec</h1><divclass=CBody><p>Custom codec for configuring <ahref="../editor/mxDefaultToolbar-js.html#mxDefaultToolbar"class=LClassid=link4onMouseOver="ShowTip(event, 'tt1', 'link4')"onMouseOut="HideTip('tt1')">mxDefaultToolbar</a>s. This class is created and registered dynamically at load time and used implicitely via <ahref="mxCodec-js.html#mxCodec"class=LClassid=link5onMouseOver="ShowTip(event, 'tt4', 'link5')"onMouseOut="HideTip('tt4')">mxCodec</a> and the <ahref="mxCodecRegistry-js.html#mxCodecRegistry"class=LClassid=link6onMouseOver="ShowTip(event, 'tt5', 'link6')"onMouseOut="HideTip('tt5')">mxCodecRegistry</a>. This codec only reads configuration data for existing toolbars handlers, it does not encode or create toolbars.</p><!--START_ND_SUMMARY--><divclass=Summary><divclass=STitle>Summary</div><divclass=SBorder><tableborder=0cellspacing=0cellpadding=0class=STable><trclass="SMain"><tdclass=SEntry><ahref="#mxDefaultToolbarCodec">mxDefaultToolbarCodec</a></td><tdclass=SDescription>Custom codec for configuring <ahref="../editor/mxDefaultToolbar-js.html#mxDefaultToolbar"class=LClassid=link1onMouseOver="ShowTip(event, 'tt1', 'link1')"onMouseOut="HideTip('tt1')">mxDefaultToolbar</a>s. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxDefaultToolbarCodec.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxDefaultToolbarCodec.encode"id=link2onMouseOver="ShowTip(event, 'tt2', 'link2')"onMouseOut="HideTip('tt2')">encode</a></td><tdclass=SDescription>Returns null.</td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxDefaultToolbarCodec.decode"id=link3onMouseOver="ShowTip(event, 'tt3', 'link3')"onMouseOut="HideTip('tt3')">decode</a></td><tdclass=SDescription>Reads a sequence of the following child nodes and attributes:</td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxDefaultToolbarCodec.decode"></a>decode</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>codec.decode = function(</td><tdclass=PParameternowrap>dec,</td></tr><tr><td></td><tdclass=PParameternowrap>node,</td></tr><tr><td></td><tdclass=PParameternowrap>into</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote><p>Reads a sequence of the following child nodes and attributes:</p><h4class=CHeading>Child Nodes</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>add</td><tdclass=CDLDescription>Adds a new item to the toolbar. See below for attributes.</td></tr><tr><tdclass=CDLEntry>separator</td><tdclass=CDLDescription>Adds a vertical separator. No attributes.</td></tr><tr><tdclass=CDLEntry>hr</td><tdclass=CDLDescription>Adds a horizontal separator. No attributes.</td></tr><tr><tdclass=CDLEntry>br</td><tdclass=CDLDescription>Adds a linefeed. No attributes.</td></tr></table><h4class=CHeading>Attributes</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>as</td><tdclass=CDLDescription>Resource key for the label.</td></tr><tr><tdclass=CDLEntry>action</td><tdclass=CDLDescription>Name of the action to execute in enclosing editor.</td></tr><tr><tdclass=CDLEntry>mode</td><tdclass=CDLDescription>Modename (see below).</td></tr><tr><tdclass=CDLEntry>template</td><tdclass=CDLDescription>Template name for cell insertion.</td></tr><tr><tdclass=CDLEntry>style</td><tdclass=CDLDescription>Optional style to override the template style.</td></tr><tr><tdclass=CDLEntry>icon</td><tdclass=CDLDescription>Icon (relative/absolute URL).</td></tr><tr><tdclass=CDLEntry>pressedIcon</td><tdclass=CDLDescription>Optional icon for pressed state (relative/absolute URL).</td></tr><tr><tdclass=CDLEntry>id</td><tdclass=CDLDescription>Optional ID to be used for the created DOM element.</td></tr><tr><tdclass=CDLEntry>toggle</td><tdclass=CDLDescription>Optional 0 or 1 to disable toggling of the element. Default is 1 (true).</td></tr></table><p>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.</p><p>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:</p><blockquote><preclass="prettyprint"><add as="Swimlane" template="swimlane" icon="images/swimlane.gif"><![CDATA[
]]></add></pre></blockquote><p>In the above function, editor is the enclosing <ahref="../editor/mxEditor-js.html#mxEditor"class=LClassid=link7onMouseOver="ShowTip(event, 'tt6', 'link7')"onMouseOut="HideTip('tt6')">mxEditor</a> 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 <ahref="../view/mxGraph-js.html#mxGraph.getCellAt"class=LFunctionid=link8onMouseOver="ShowTip(event, 'tt7', 'link8')"onMouseOut="HideTip('tt7')">mxGraph.getCellAt</a>.</p><p>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:</p><blockquote><preclass="prettyprint"><add as="connect" mode="connect"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = 'straightEdge';
}
}
]]></add></pre></blockquote><h4class=CHeading>Modes</h4><tableborder=0cellspacing=0cellpadding=0class=CDescriptionList><tr><tdclass=CDLEntry>select</td><tdclass=CDLDescription>Left mouse button used for rubberband- & cell-selection.</td></tr><tr><tdclass=CDLEntry>connect</td><tdclass=CDLDescription>Allows connecting vertices by inserting new edges.</td></tr><tr><tdclass=CDLEntry>pan</td><tdclass=CDLDescription>Disables selection and switches to panning on the left button.</td></tr></table><h4class=CHeading>Example</h4><h4class=CHeading>To add items to the toolbar</h4><blockquote><preclass="prettyprint"><mxDefaultToolbar as="toolbar">
<divclass=CToolTipid="tt1"><divclass=CClass>Toolbar for the editor. </div></div><divclass=CToolTipid="tt2"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>codec.encode = function(</td><tdclass=PParameternowrap>enc,</td></tr><tr><td></td><tdclass=PParameternowrap>obj</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote>Returns null.</div></div><divclass=CToolTipid="tt3"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>codec.decode = function(</td><tdclass=PParameternowrap>dec,</td></tr><tr><td></td><tdclass=PParameternowrap>node,</td></tr><tr><td></td><tdclass=PParameternowrap>into</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote>Reads a sequence of the following child nodes and attributes:</div></div><divclass=CToolTipid="tt4"><divclass=CClass>XML codec for JavaScript object graphs. </div></div><divclass=CToolTipid="tt5"><divclass=CClass>Singleton class that acts as a global registry for codecs.</div></div><divclass=CToolTipid="tt6"><divclass=CClass>Extends mxEventSource to implement a 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. </div></div><divclass=CToolTipid="tt7"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype prettyprint"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass=PBeforeParametersnowrap>mxGraph.prototype.getCellAt = function(</td><tdclass=PParameternowrap>x,</td></tr><tr><td></td><tdclass=PParameternowrap>y,</td></tr><tr><td></td><tdclass=PParameternowrap>parent,</td></tr><tr><td></td><tdclass=PParameternowrap>vertices,</td></tr><tr><td></td><tdclass=PParameternowrap>edges</td><tdclass=PAfterParametersnowrap>)</td></tr></table></td></tr></table></blockquote>Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent. </div></div><!--END_ND_TOOLTIPS-->
