<!-- saved from url=(0026)http://www.naturaldocs.org -->
<divid=Content><divclass="CClass"><divclass=CTopicid=MainTopic><h1class=CTitle><aname="mxUndoManager"></a>mxUndoManager</h1><divclass=CBody><p>Implements a command history. When changing the graph model, an <mxUndoableChange> object is created at the start of the transaction (when model.beginUpdate is called). All atomic changes are then added to this object until the last model.endUpdate call, at which point the <ahref="mxUndoableEdit-js.html#mxUndoableEdit"class=LClassid=link18onMouseOver="ShowTip(event, 'tt13', 'link18')"onMouseOut="HideTip('tt13')">mxUndoableEdit</a> is dispatched in an event, and added to the history inside <ahref="#mxUndoManager.mxUndoManager"class=LFunctionid=link19onMouseOver="ShowTip(event, 'tt4', 'link19')"onMouseOut="HideTip('tt4')">mxUndoManager</a>. This is done by an event listener in <ahref="../editor/mxEditor-js.html#mxEditor.installUndoHandler"class=LFunctionid=link20onMouseOver="ShowTip(event, 'tt14', 'link20')"onMouseOut="HideTip('tt14')">mxEditor.installUndoHandler</a>.</p><p>Each atomic change of the model is represented by an object (eg. <ahref="../model/mxGraphModel-js.html#mxRootChange"class=LClassid=link21onMouseOver="ShowTip(event, 'tt15', 'link21')"onMouseOut="HideTip('tt15')">mxRootChange</a>, <ahref="../model/mxGraphModel-js.html#mxChildChange"class=LClassid=link22onMouseOver="ShowTip(event, 'tt16', 'link22')"onMouseOut="HideTip('tt16')">mxChildChange</a>, <ahref="../model/mxGraphModel-js.html#mxTerminalChange"class=LClassid=link23onMouseOver="ShowTip(event, 'tt17', 'link23')"onMouseOut="HideTip('tt17')">mxTerminalChange</a> etc) which contains the complete undo information. The <ahref="#mxUndoManager.mxUndoManager"class=LFunctionid=link24onMouseOver="ShowTip(event, 'tt4', 'link24')"onMouseOut="HideTip('tt4')">mxUndoManager</a> also listens to the <ahref="../view/mxGraphView-js.html#mxGraphView"class=LClassid=link25onMouseOver="ShowTip(event, 'tt18', 'link25')"onMouseOut="HideTip('tt18')">mxGraphView</a> and stores it’s changes to the current root as insignificant undoable changes, so that drilling (step into, step up) is undone.</p><p>This means when you execute an atomic change on the model, then change the current root on the view and click undo, the change of the root will be undone together with the change of the model so that the display represents the state at which the model was changed. However, these changes are not transmitted for sharing as they do not represent a state change.</p><h4class=CHeading>Example</h4><p>When adding an undo manager to a graph, make sure to add it to the model and the view as well to maintain a consistent display across multiple undo/redo steps.</p><blockquote><preclass="prettyprint">var undoManager = new mxUndoManager();
graph.getView().addListener(mxEvent.UNDO, listener);</pre></blockquote><p>The code creates a function that informs the undoManager of an undoable edit and binds it to the undo event of <ahref="../model/mxGraphModel-js.html#mxGraphModel"class=LClassid=link26onMouseOver="ShowTip(event, 'tt19', 'link26')"onMouseOut="HideTip('tt19')">mxGraphModel</a> and <ahref="../view/mxGraphView-js.html#mxGraphView"class=LClassid=link27onMouseOver="ShowTip(event, 'tt18', 'link27')"onMouseOut="HideTip('tt18')">mxGraphView</a> using <ahref="mxEventSource-js.html#mxEventSource.addListener"class=LFunctionid=link28onMouseOver="ShowTip(event, 'tt20', 'link28')"onMouseOut="HideTip('tt20')">mxEventSource.addListener</a>.</p><!--START_ND_SUMMARY--><divclass=Summary><divclass=STitle>Summary</div><divclass=SBorder><tableborder=0cellspacing=0cellpadding=0class=STable><trclass="SMain"><tdclass=SEntry><ahref="#mxUndoManager">mxUndoManager</a></td><tdclass=SDescription>Implements a command history. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxUndoManager.Events">Events</a></td><tdclass=SDescription></td></tr><trclass="SEvent SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.mxEvent.CLEAR">mxEvent.<wbr>CLEAR</a></td><tdclass=SDescription>Fires after <ahref="#mxUndoManager.clear"class=LFunctionid=link1onMouseOver="ShowTip(event, 'tt1', 'link1')"onMouseOut="HideTip('tt1')">clear</a> was invoked. </td></tr><trclass="SEvent SIndent2"><tdclass=SEntry><ahref="#mxUndoManager.mxEvent.UNDO">mxEvent.UNDO</a></td><tdclass=SDescription>Fires afer a significant edit was undone in <ahref="#mxUndoManager.undo"class=LFunctionid=link2onMouseOver="ShowTip(event, 'tt2', 'link2')"onMouseOut="HideTip('tt2')">undo</a>. </td></tr><trclass="SEvent SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.mxEvent.REDO">mxEvent.REDO</a></td><tdclass=SDescription>Fires afer a significant edit was redone in <ahref="#mxUndoManager.redo"class=LFunctionid=link3onMouseOver="ShowTip(event, 'tt3', 'link3')"onMouseOut="HideTip('tt3')">redo</a>. </td></tr><trclass="SEvent SIndent2"><tdclass=SEntry><ahref="#mxUndoManager.mxEvent.ADD">mxEvent.ADD</a></td><tdclass=SDescription>Fires after an undoable edit was added to the history. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxUndoManager.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.mxUndoManager"id=link4onMouseOver="ShowTip(event, 'tt4', 'link4')"onMouseOut="HideTip('tt4')">mxUndoManager</a></td><tdclass=SDescription>Constructs a new undo manager with the given history size. </td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxUndoManager.Variables">Variables</a></td><tdclass=SDescription></td></tr><trclass="SVariable SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.size"id=link5onMouseOver="ShowTip(event, 'tt5', 'link5')"onMouseOut="HideTip('tt5')">size</a></td><tdclass=SDescription>Maximum command history size. </td></tr><trclass="SVariable SIndent2"><tdclass=SEntry><ahref="#mxUndoManager.history"id=link6onMouseOver="ShowTip(event, 'tt6', 'link6')"onMouseOut="HideTip('tt6')">history</a></td><tdclass=SDescription>Array that contains the steps of the command history.</td></tr><trclass="SVariable SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.indexOfNextAdd"id=link7onMouseOver="ShowTip(event, 'tt7', 'link7')"onMouseOut="HideTip('tt7')">indexOfNextAdd</a></td><tdclass=SDescription>Index of the element to be added next.</td></tr><trclass="SGroup SIndent1"><tdclass=SEntry><ahref="#mxUndoManager.Functions">Functions</a></td><tdclass=SDescription></td></tr><trclass="SFunction SIndent2 SMarked"><tdclass=SEntry><ahref="#mxUndoManager.isEmpty"id=link8onMouseOver="ShowTip(event, 'tt8', 'link8')"onMouseOut="HideTip('tt8')">isEmpty</a></td><tdclass=SDescription>Returns true if the history is empty.</td></tr><trclass="SFunction SIndent2"><tdclass=SEntry><ahref="#mxUndoManage
<divclass="CEvent"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.mxEvent.CLEAR"></a>mxEvent.<wbr>CLEAR</h3><divclass=CBody><p>Fires after <ahref="#mxUndoManager.clear"class=LFunctionid=link29onMouseOver="ShowTip(event, 'tt1', 'link29')"onMouseOut="HideTip('tt1')">clear</a> was invoked. This event has no properties.</p></div></div></div>
<divclass="CEvent"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.mxEvent.UNDO"></a>mxEvent.UNDO</h3><divclass=CBody><p>Fires afer a significant edit was undone in <ahref="#mxUndoManager.undo"class=LFunctionid=link30onMouseOver="ShowTip(event, 'tt2', 'link30')"onMouseOut="HideTip('tt2')">undo</a>. The <code>edit</code> property contains the <ahref="mxUndoableEdit-js.html#mxUndoableEdit"class=LClassid=link31onMouseOver="ShowTip(event, 'tt13', 'link31')"onMouseOut="HideTip('tt13')">mxUndoableEdit</a> that was undone.</p></div></div></div>
<divclass="CEvent"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.mxEvent.REDO"></a>mxEvent.REDO</h3><divclass=CBody><p>Fires afer a significant edit was redone in <ahref="#mxUndoManager.redo"class=LFunctionid=link32onMouseOver="ShowTip(event, 'tt3', 'link32')"onMouseOut="HideTip('tt3')">redo</a>. The <code>edit</code> property contains the <ahref="mxUndoableEdit-js.html#mxUndoableEdit"class=LClassid=link33onMouseOver="ShowTip(event, 'tt13', 'link33')"onMouseOut="HideTip('tt13')">mxUndoableEdit</a> that was redone.</p></div></div></div>
<divclass="CEvent"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.mxEvent.ADD"></a>mxEvent.ADD</h3><divclass=CBody><p>Fires after an undoable edit was added to the history. The <code>edit</code> property contains the <ahref="mxUndoableEdit-js.html#mxUndoableEdit"class=LClassid=link34onMouseOver="ShowTip(event, 'tt13', 'link34')"onMouseOut="HideTip('tt13')">mxUndoableEdit</a> that was added.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.mxUndoManager"></a>mxUndoManager</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>function mxUndoManager(</td><tdclass="PParameter prettyprint "nowrap>size</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs a new undo manager with the given history size. If no history size is given, then a default size of 100 steps is used.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.size"></a>size</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.size</td></tr></table></blockquote><p>Maximum command history size. 0 means unlimited history. Default is 100.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.history"></a>history</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.history</td></tr></table></blockquote><p>Array that contains the steps of the command history.</p></div></div></div>
<divclass="CVariable"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.indexOfNextAdd"></a>indexOfNextAdd</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.indexOfNextAdd</td></tr></table></blockquote><p>Index of the element to be added next.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.isEmpty"></a>isEmpty</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.isEmpty = function()</td></tr></table></blockquote><p>Returns true if the history is empty.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.canUndo"></a>canUndo</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.canUndo = function()</td></tr></table></blockquote><p>Returns true if an undo is possible.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.undo"></a>undo</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.undo = function()</td></tr></table></blockquote><p>Undoes the last change.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.canRedo"></a>canRedo</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.canRedo = function()</td></tr></table></blockquote><p>Returns true if a redo is possible.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.redo"></a>redo</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.redo = function()</td></tr></table></blockquote><p>Redoes the last change.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.undoableEditHappened"></a>undoableEditHappened</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxUndoManager.prototype.undoableEditHappened = function(</td><tdclass="PParameter prettyprint "nowrap>undoableEdit</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote><p>Method to be called to add new undoable edits to the <ahref="#mxUndoManager.history"class=LVariableid=link35onMouseOver="ShowTip(event, 'tt6', 'link35')"onMouseOut="HideTip('tt6')">history</a>.</p></div></div></div>
<divclass="CFunction"><divclass=CTopic><h3class=CTitle><aname="mxUndoManager.trim"></a>trim</h3><divclass=CBody><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.trim = function()</td></tr></table></blockquote><p>Removes all pending steps after <ahref="#mxUndoManager.indexOfNextAdd"class=LVariableid=link36onMouseOver="ShowTip(event, 'tt7', 'link36')"onMouseOut="HideTip('tt7')">indexOfNextAdd</a> from the history, invoking die on each edit. This is called from <ahref="#mxUndoManager.undoableEditHappened"class=LFunctionid=link37onMouseOver="ShowTip(event, 'tt11', 'link37')"onMouseOut="HideTip('tt11')">undoableEditHappened</a>.</p></div></div></div>
<divclass=CToolTipid="tt1"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.clear = function()</td></tr></table></blockquote>Clears the command history.</div></div><divclass=CToolTipid="tt2"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.undo = function()</td></tr></table></blockquote>Undoes the last change.</div></div><divclass=CToolTipid="tt3"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.redo = function()</td></tr></table></blockquote>Redoes the last change.</div></div><divclass=CToolTipid="tt4"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>function mxUndoManager(</td><tdclass="PParameter prettyprint "nowrap>size</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Constructs a new undo manager with the given history size. </div></div><divclass=CToolTipid="tt5"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.size</td></tr></table></blockquote>Maximum command history size. </div></div><divclass=CToolTipid="tt6"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.history</td></tr></table></blockquote>Array that contains the steps of the command history.</div></div><divclass=CToolTipid="tt7"><divclass=CVariable><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.indexOfNextAdd</td></tr></table></blockquote>Index of the element to be added next.</div></div><divclass=CToolTipid="tt8"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.isEmpty = function()</td></tr></table></blockquote>Returns true if the history is empty.</div></div><divclass=CToolTipid="tt9"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.canUndo = function()</td></tr></table></blockquote>Returns true if an undo is possible.</div></div><divclass=CToolTipid="tt10"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.canRedo = function()</td></tr></table></blockquote>Returns true if a redo is possible.</div></div><divclass=CToolTipid="tt11"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxUndoManager.prototype.undoableEditHappened = function(</td><tdclass="PParameter prettyprint "nowrap>undoableEdit</td><tdclass="PAfterParameters prettyprint "nowrap>)</td></tr></table></td></tr></table></blockquote>Method to be called to add new undoable edits to the history.</div></div><divclass=CToolTipid="tt12"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><tdclass="prettyprint">mxUndoManager.prototype.trim = function()</td></tr></table></blockquote>Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. </div></div><divclass=CToolTipid="tt13"><divclass=CClass>Implements a composite undoable edit. </div></div><divclass=CToolTipid="tt14"><divclass=CFunction><blockquote><tableborder=0cellspacing=0cellpadding=0class="Prototype"><tr><td><tableborder=0cellspacing=0cellpadding=0><tr><tdclass="PBeforeParameters prettyprint "nowrap>mxEditor.prototype.i