Undo for Component Developers
Overview
The Undo functionality is implemented as one of the framework's Subcomponents. It can be used to provide undo support for any component that bears a model.
Currently, the Fluid components that support Undo are:
Component developers must ensure that their component has certain features for Undo to work with it. A component must:
- Bear a model,
- Implement
that.updateModel()
, - Initialize the Undo decorator if requested.
Join the infusion-users mailing list and ask your questions there.
Model
To support Undo, a component must bear a 'model,' a collection of Javascript objects which constitute the data which it is operating on. A model:
- consists of pure data, i.e. Javascript objects containing only other objects and primitives, without any functions;
- is public, i.e. accessible as a member of the component's top-level
that
.
The actual contents of a model is, of course, entirely dependent on the component.
To support Undo, a component's model must:
- be called
model
Implementing that.updateModel
The component must implement a public function on its that
object called updateModel
:
fluid.myComponent = function(container, options) { var that = fluid.initView("fluid.myComponent", container, options); ... that.updateModel = function (newValue, source) { }; };
The updateModel()
function must update the locally stored model using the newValue
provided. The source
parameter is the subcomponent that triggered the model change.
Initializing the Undo decorator
A component must respond to a user-supplied option requesting Undo by initializing the Undo decorator. This is accomplished by using the initSubcomponents()
framework function:
that.decorators = fluid.initSubcomponents(that, className, args);
For more information on subcomponents, see Subcomponents.
Dependencies
The Undo functionality's dependencies can be met by including the minified InfusionAll.js
file in the header of the HTML file:
<script type="text/javascript" src="InfusionAll.js"></script>
Alternatively, if you are including individual files, you must include Undo.js
:
<... other dependencies ...> <script type="text/javascript" src="components/undo/js/Undo.js"></script>