Checkpoints
A Checkpoints
object lets you set checkpoints on a Store
, and move forward and backward through them to create undo and redo functionality.
Create a Checkpoints
object easily with the createCheckpoints
function. From there, you can set checkpoints (with the addCheckpoint
method), query the checkpoints available (with the getCheckpointIds
method), move forward and backward through them (with the goBackward
method, goForward
method, and goTo
method), and add listeners for when the list checkpoints changes (with the addCheckpointIdsListener
method).
Every checkpoint can be given a label which can be used to describe the actions that changed the Store
before this checkpoint. This can be useful for interfaces that let users 'Undo [last action]'.
You
This example shows a simple lifecycle of a Checkpoints
object: from creation, to adding a checkpoint, getting the list of available checkpoints, and then registering and removing a listener for them.
const store = createStore().setTables({pets: {fido: {sold: false}}});
const checkpoints = createCheckpoints(store);
checkpoints.setSize(200);
console.log(checkpoints.getCheckpointIds());
// -> [[], '0', []]
store.setCell('pets', 'fido', 'sold', true);
checkpoints.addCheckpoint('sale');
console.log(checkpoints.getCheckpointIds());
// -> [['0'], '1', []]
checkpoints.goBackward();
console.log(store.getCell('pets', 'fido', 'sold'));
// -> false
console.log(checkpoints.getCheckpointIds());
// -> [[], '0', ['1']]
const listenerId = checkpoints.addCheckpointIdsListener(() => {
console.log(checkpoints.getCheckpointIds());
});
store.setCell('pets', 'fido', 'species', 'dog');
// -> [['0'], undefined, []]
checkpoints.addCheckpoint();
// -> [['0'], '2', []]
// Previous redo of checkpoint '1' is now not possible.
checkpoints.delListener(listenerId);
checkpoints.destroy();
Relationships
And Checkpoints
guides
Todo App demos
TinyDraw demo
This is the collection of getter methods within the Checkpoints
interface. There are only three getter methods, getStore
, getCheckpoint
, and getCheckpointIds
.
This is the collection of setter methods within the Checkpoints
interface. There are only two setter methods, addCheckpoint
and setCheckpoint
.
This is the collection of listener methods within the Checkpoints
interface. There are only three listener methods, addCheckpointIdsListener
, addCheckpointListener
, and delListener
.
This is the collection of configuration methods within the Checkpoints
interface. There is only one method, setSize
.
This is the collection of lifecycle methods within the Checkpoints
interface. There are only two lifecycle methods, clear
and destroy
.
This is the collection of movement methods within the Checkpoints
interface. There are only three movement methods, goBackward
, goForward
, and goTo
.
This is the collection of development methods within the Checkpoints
interface. There is only one method, getListenerStats
.