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 mxUndoableEdit is dispatched in an event, and added to the history inside mxUndoManager. This is done by an event listener in mxEditor.installUndoHandler.
Each atomic change of the model is represented by an object (eg. mxRootChange, mxChildChange, mxTerminalChange etc) which contains the complete undo information. The mxUndoManager also listens to the mxGraphView and stores it’s changes to the current root as insignificant undoable changes, so that drilling (step into, step up) is undone.
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.
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.
var undoManager = new mxUndoManager(); var listener = function(sender, evt) { undoManager.undoableEditHappened(evt.getProperty('edit')); }; graph.getModel().addListener(mxEvent.UNDO, listener); graph.getView().addListener(mxEvent.UNDO, listener);
The code creates a function that informs the undoManager of an undoable edit and binds it to the undo event of mxGraphModel and mxGraphView using mxEventSource.addListener.
mxUndoManager | Implements a command history. |
Events | |
mxEvent. | Fires after clear was invoked. |
mxEvent.UNDO | Fires afer a significant edit was undone in undo. |
mxEvent.REDO | Fires afer a significant edit was redone in redo. |
mxEvent.ADD | Fires after an undoable edit was added to the history. |
Functions | |
mxUndoManager | Constructs a new undo manager with the given history size. |
Variables | |
size | Maximum command history size. |
history | Array that contains the steps of the command history. |
indexOfNextAdd | Index of the element to be added next. |
Functions | |
isEmpty | Returns true if the history is empty. |
clear | Clears the command history. |
canUndo | Returns true if an undo is possible. |
undo | Undoes the last change. |
canRedo | Returns true if a redo is possible. |
redo | Redoes the last change. |
undoableEditHappened | Method to be called to add new undoable edits to the history. |
trim | Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. |
Fires after clear was invoked. This event has no properties.
Fires afer a significant edit was undone in undo. The <code>edit</code> property contains the mxUndoableEdit that was undone.
Fires afer a significant edit was redone in redo. The <code>edit</code> property contains the mxUndoableEdit that was redone.
Fires after an undoable edit was added to the history. The <code>edit</code> property contains the mxUndoableEdit that was added.
mxUndoManager.prototype.undoableEditHappened = function( undoableEdit )
Method to be called to add new undoable edits to the history.
mxUndoManager.prototype.trim = function()
Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. This is called from undoableEditHappened.
Clears the command history.
mxUndoManager.prototype.clear = function()
Undoes the last change.
mxUndoManager.prototype.undo = function()
Redoes the last change.
mxUndoManager.prototype.redo = function()
Constructs a new undo manager with the given history size.
function mxUndoManager( size )
Maximum command history size.
mxUndoManager.prototype.size
Array that contains the steps of the command history.
mxUndoManager.prototype.history
Index of the element to be added next.
mxUndoManager.prototype.indexOfNextAdd
Returns true if the history is empty.
mxUndoManager.prototype.isEmpty = function()
Returns true if an undo is possible.
mxUndoManager.prototype.canUndo = function()
Returns true if a redo is possible.
mxUndoManager.prototype.canRedo = function()
Method to be called to add new undoable edits to the history.
mxUndoManager.prototype.undoableEditHappened = function( undoableEdit )
Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit.
mxUndoManager.prototype.trim = function()
Adds the undoManager to the graph model and the view.
mxEditor.prototype.installUndoHandler = function ( graph )
Binds the specified function to the given event name.
mxEventSource.prototype.addListener = function( name, funct )