Class: EditorBuilder

Using this class you can load (Editor:class) instances to a specified iframe element and initialize them with a specified product and configuration.

Constructors

Constructor

new EditorBuilder(backendUrl): EditorBuilder

Creates a new instance of the builder. Note, you may prefer to use a static method EditorBuilder.for instead.

Parameters

backendUrl

string

a URL to your Design Editor instance (can be installed either on your server or hosted on Aurigma's servers). If you don't have it, contact Aurigma team at info@aurigma.com.

Returns

EditorBuilder

Methods

for()

static for(backendUrl): EditorBuilder

The same as a constructor, but implemented as a static method.

Parameters

backendUrl

string

a URL to your Design Editor instance (can be installed either on your server or hosted on Aurigma's servers). If you don't have it, contact Aurigma team at info@aurigma.com.

Returns

EditorBuilder

Example

const editor = EditorLoader.for('<your-URL>').build(...);

---

preload()

preload(): Promise<void>

Creates an invisible iframe and preloads all Design Editor scripts inside it to cache them in a browser.

Returns

Promise<void>

Remarks

Use this method in scenarios when instead of calling the EditorBuilder.build method in the beginning of a page lifecycle, you do it later (e.g. when the user clicks a sort of a "Personalize" button). In this case, you should call the EditorBuilder.preload as early as possible. By the moment when you call EditorBuilder.build, all Design Editor scripts will be loaded to the browser cache and the editor will be opened very quickly.

If you call the EditorBuilder.build during the page initialization, there is no need to preload scripts.

Hint: Although this method is async, most likely you don't want to call it with await. You should just call it and let it work in the background.

---

build()

build(target, productDefinition, config): Promise<Editor>

Builds an instance of (Editor:class) and loads it in a specified iframe element.

Parameters

target

HTMLIFrameElement

the IFrame element where you want to load the editor. If another instance of an editor is already loaded, it will be automatically disposed.

productDefinition

string | string[] | IProductDefinition

it can be either a IProductDefinition structure describing the template you want to load or a string (array of strings) containing the ID of state files. When multiple state files specified, they are merged to a single product.

config

IConfiguration

the editor configuration described with the IConfiguration structure.

Returns

Promise<Editor>

The (Editor:class) class instance which allows manipulating the editor and its content.