Class UndoableAbstract

An action that can be undone and redone. For example, editing a shape (see the EditController's EditShape event).

You usually create undoables in response to an event from the API, and then add them to an UndoManager.

This example shows how to create Undoables in LuciadRIA:

/**
 * Adds sample undo/redo support to an EditController.
 * @param editController The EditController to add sample undo/redo support to
 * @param undoManager The UndoManager to add the undoable to
 */
export const addEditUndoSupport = (editController: EditController, undoManager: UndoManager = SAMPLE_UNDO_MANAGER): Handle => {
  let lastShape = editController.feature.shape ? editController.feature.shape.copy() : null;
  let propertyValueBeforeEditing: unknown[] | null = null;
  const editHandle = editController.on("EditShape", ({shape, status}) => {
    if (status === EditShapeStatus.FINISHED) {
      const label = `edit ${shapeToString(shape)}`;
      const newShape = shape ? shape.copy() : null;
      addChangeShapeUndoable(editController.map!, editController.layer, editController.feature, lastShape, newShape, label, undoManager);
      lastShape = newShape ? newShape.copy() : null;
    }
  });
  const propertyHandle = editController.on("EditProperty", ({changes, status}) => {
    if (status === EditPropertyStatus.FINISHED) {
      const label = `edit property`;
      const changesWithOldValues = changes.map((change, idx) => {
        return {
          ...change,
          oldValue: propertyValueBeforeEditing![idx],
        }
      });
      addChangePropertyUndoable(editController.map!, editController.layer, editController.feature, changesWithOldValues,
          label, undoManager);
      propertyValueBeforeEditing = null;
    } else {
      // capture the previous value of the first in-progress event only, as this will have the correct value from before the editing operation
      if (propertyValueBeforeEditing == null) {
        propertyValueBeforeEditing = changes.map(change => change.oldValue);
      }
    }
  });
  const restartHandle = editController.on("Restarted", () => {
    if (!ChangeShapeUndoable.isRestartFromUndoable) {
      // restart from outside undo/redo, track the change
      const shape = editController.feature.shape;
      const label = `restart ${shapeToString(shape)}`;
      const newShape = shape ? shape.copy() : null;
      addChangeShapeUndoable(editController.map!, editController.layer, editController.feature, lastShape, newShape, label, undoManager);
      lastShape = newShape ? newShape.copy() : null;
      propertyValueBeforeEditing = null;
    }
    lastShape = editController.feature.shape ? editController.feature.shape.copy() : null;
  });
  const deactivateHandle = editController.on("Deactivated", () => {
    restartHandle.remove();
    editHandle.remove();
    deactivateHandle.remove();
  });
  return {
    remove: () => {
      restartHandle.remove();
      editHandle.remove();
      propertyHandle.remove();
      deactivateHandle.remove();
    }
  }
}
Copy

You can find the full source, and more examples in toolbox/ria/core/util/SampleUndoSupport.ts.

Common events are:

• The SelectionChange event on map when a user selects a feature.
• The ModelChanged event on a FeatureModel when a user creates a feature.
• The ModelChanged event on a FeatureModel, when a user deletes a feature.
• The EditShape event of an EditController when a user edits a feature.

See the Adding undo/redo support to your application guide for more information on how to work with undo/redo in LuciadRIA.