Methods

These methods are available on each editor instance.

Name Description
editImage(src, options?) Load an image. Returns a Promise that resolves when the image is processed.
loadImage(src, options?) Load an image. Returns a Promise that resolves when the image is loaded.
processImage() Start processing the current image.
abortProcessImage() Stop processing the current image.
close() Triggers 'close' event. When using openModal this will trigger the modal to hide and auto destruct.
destroy() Destroy editor instance.
undo() Deprecated in 7.10.0, use history.undo()
redo() Deprecated in 7.10.0, use history.redo()
revert() Deprecated in 7.10.0, use history.revert()

The editor instance exposes a history property which we can use to navigate the interaction history programmatically.

Name Description
history.undo() Undo action.
history.redo() Redo action.
history.revert() Revert actions. Will run willRevert.
history.length The total number of history entries.
history.index Current location in history entries.
history.write(imageState?) Write new imageState to history entries, if no imageState is passed this will push the current imageState to the history stack.
history.get() Returns the current array of imageState history entries.
history.set(imageStates[]) Sets the history array, combined with history.get() this enables fully restoring of a previous image editing session.

Instances created with the openEditor JavaScript API have two additional methods.

Name Description
show() Show the editor.
hide() Hide the editor.

loadImage

Loads the supplied image. Returns a Promise that resolves with the readOutput object when the image has loaded.

editor.loadImage('./my-image.jpeg').then((readOutput) => {
    // image has loaded
});

editImage

Loads the supplied image. Returns a Promise that resolves with the writeOutput object when the editor has finished processing the image.

editor.editImage('./my-image.jpeg').then((writeOutput) => {
    // image has been edited
});

processImage

Manually triggers the editor to start processing the image. Returns a Promise with the writeOutput object when the editor has finished processing the image.

editor.processImage().then((writeOutput) => {
    // image has been processed
});