Introduction
History allows your users to perform undo and redo operations.
In ALS, history is based on serialization and deserialization of the whole project, so before using it, you must implement serialization and deserialization of your layer.
Since deserialization causes page redrawing, it can be quite slow, so you might want to ignore some operations.
ALS already manages its own operations such as adding a layer, renaming, deleting, etc. You need to write history records only for your layers.
Setting up history
You must explicitly enable history by setting SystemOptions.enableHistory
option to true
when creating L.ALS.System
instance. This will also add undo and redo buttons.
You might want to modify SystemOptions.historySize
option which defines how many history records can be stored (20
by default, 0
means unlimited). The optimal value depends on complexity of your layers. See the "Memory" tab in your browser, do some actions, watch how memory consumption grows and decide the history size based on this factor.
All together now:
let layerSystem = new L.ALS.System(map, {
// Your other options...
enableHistory: true, // Enable history and undo/redo buttons and their keyboard shortcuts
historySize: 25, // Change history size from 20 to 25
});
Using history
History is managed by calling method. It should be called at the end of each operation caused by user interaction, for example:
L.ALS.MyLayer = L.ALS.Layer.extend({
someOperation: function() {
// Operation code...
this.writeToHistory(); // Write to history at the end of this operation
});
You should always wait until all the code for the operation is executed. If you're using async
functions, you should await
all of them.
If you have asynchronous operations at L.ALS.Layer#init
, set L.ALS.Layer#writeToHistoryOnInit
to false
and write to history manually by calling L.ALS.Layer#writeToHistory
.
There are no other methods for managing history, and you don't need them, ALS does everything for you.