
# Class: AuWizard

Implements a multi-step editor.

## Hierarchy

* any

  ↳ **AuWizard**

## Implements

* [IEditorElement](../interfaces/ieditorelement.md)

## Index

### Constructors

* [constructor](auwizard.md#constructor)

### Properties

* [downloadUrl](auwizard.md#downloadurl)
* [driver](auwizard.md#driver)
* [editorState](auwizard.md#editorstate)
* [varManager](auwizard.md#varmanager)

### Methods

* [_okButtonClick](auwizard.md#_okbuttonclick)
* [addCustomPropertyInScope](auwizard.md#addcustompropertyinscope)
* [appendVars](auwizard.md#appendvars)
* [closeEditorPopup](auwizard.md#closeeditorpopup)
* [closeModal](auwizard.md#closemodal)
* [createEditorSnapshot](auwizard.md#createeditorsnapshot)
* [debug](auwizard.md#debug)
* [downloadFile](auwizard.md#downloadfile)
* [downloadFilesAsZip](auwizard.md#downloadfilesaszip)
* [getJsonProcessor](auwizard.md#getjsonprocessor)
* [getUncompiledWidgetNames](auwizard.md#getuncompiledwidgetnames)
* [hideEditorPopup](auwizard.md#hideeditorpopup)
* [manageCustomTopBarVisibility](auwizard.md#managecustomtopbarvisibility)
* [manageDefaultTopBarVisibility](auwizard.md#managedefaulttopbarvisibility)
* [nextStep](auwizard.md#nextstep)
* [openProjects](auwizard.md#openprojects)
* [prevStep](auwizard.md#prevstep)
* [restoreEditor](auwizard.md#restoreeditor)
* [saveProject](auwizard.md#saveproject)
* [showEditorPopup](auwizard.md#showeditorpopup)
* [showModal](auwizard.md#showmodal)
* [showPreloader](auwizard.md#showpreloader)
* [showToast](auwizard.md#showtoast)
* [switchToStep](auwizard.md#switchtostep)
* [toggleDrawerByClickOnShade](auwizard.md#toggledrawerbyclickonshade)
* [toggleShade](auwizard.md#toggleshade)

## Constructors

###  constructor

\+ **new AuWizard**(): *[AuWizard](auwizard.md)*

**Returns:** *[AuWizard](auwizard.md)*

## Properties

###  downloadUrl

• **downloadUrl**: *string* = ""

Url of the blob object to download by the user, which is created in [downloadFilesAsZip](auwizard.md#downloadfilesaszip).

___

###  driver

• **driver**: *IDriver*

*Implementation of [IEditorElement](../interfaces/ieditorelement.md).[driver](../interfaces/ieditorelement.md#driver)*

A reference to an e-commerce driver.

___

###  editorState

• **editorState**: *string* = ""

An editor state calculated in [createEditorSnapshot](auwizard.md#createeditorsnapshot).

___

###  varManager

• **varManager**: *[IVariableManager](../interfaces/ivariablemanager.md)* =  new VariableManager(this)

An object for managing variables.

## Methods

###  _okButtonClick

▸ **_okButtonClick**(`event`: any): *Promise‹void›*

**Parameters:**

Name | Type |
------ | ------ |
`event` | any |

**Returns:** *Promise‹void›*

___

###  addCustomPropertyInScope

▸ **addCustomPropertyInScope**(`name`: string, `property`: any, `inform`: boolean): *void*

Adds a custom property to the compilation scope.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`name` | string | - | The property name. |
`property` | any | - | A value of the property.  |
`inform` | boolean | true | - |

**Returns:** *void*

___

###  appendVars

▸ **appendVars**(`varsDictionary`: kvObject‹string, any›): *void*

_Deprecated, use [varManager.append()](../interfaces/ivariablemanager.md#append) instead._ Appends values to the current `vars` object.

**Parameters:**

Name | Type | Description |
------ | ------ | ------ |
`varsDictionary` | kvObject‹string, any› | An object, which will be merged with the current `vars`.  |

**Returns:** *void*

___

###  closeEditorPopup

▸ **closeEditorPopup**(`isForce`: boolean): *void*

Close editor popup and dispose editor instance.

**Parameters:**

Name | Type | Default |
------ | ------ | ------ |
`isForce` | boolean | false |

**Returns:** *void*

___

###  closeModal

▸ **closeModal**(`name`: string): *Promise‹void›*

Close a modal window by its name.

**Parameters:**

Name | Type |
------ | ------ |
`name` | string |

**Returns:** *Promise‹void›*

___

###  createEditorSnapshot

▸ **createEditorSnapshot**(`force`: boolean): *Promise‹string›*

Creates an editor snapshot, which can be used to restore the editor state.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`force` | boolean | false | If `true`, then this method also saves the product by using the [saveProduct method](https://customerscanvas.com/dev/sdks/design-editor-js/reference/IframeApi/Editor.html) of the Customer's Canvas IFrame API. |

**Returns:** *Promise‹string›*

A compressed Base64 string, which can be passed to [restoreEditor](auwizard.md#restoreeditor).

___

###  debug

▸ **debug**(`name`: string | string[]): *void*

Debugs widgets.

**Parameters:**

Name | Type | Description |
------ | ------ | ------ |
`name` | string &#124; string[] | The widget name or an array of widget names for debugging.  |

**Returns:** *void*

___

###  downloadFile

▸ **downloadFile**(`url`: string, `filename`: string, `newTab`: boolean): *Promise‹void›*

Downloads a file by URL.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`url` | string | - | The URL of the file that should be downloaded. |
`filename` | string | - | The name to be assigned to the downloaded file. |
`newTab` | boolean | false | If `true`, opens the link in a new tab.  |

**Returns:** *Promise‹void›*

___

###  downloadFilesAsZip

▸ **downloadFilesAsZip**(`files`: Array‹[DownloadingModel](downloadingmodel.md)›): *Promise‹string›*

Downloads multiple files and packs them to a ZIP archive.

**Parameters:**

Name | Type | Description |
------ | ------ | ------ |
`files` | Array‹[DownloadingModel](downloadingmodel.md)› | An array of objects `{url:string, filename:string}` describing files that should be downloaded and zipped. |

**Returns:** *Promise‹string›*

The URL of the archive.

___

###  getJsonProcessor

▸ **getJsonProcessor**(): *JsonProcessor*

Returns an instance of the JsonProcessor.

**Returns:** *JsonProcessor*

___

###  getUncompiledWidgetNames

▸ **getUncompiledWidgetNames**(): *string[]*

**Returns:** *string[]*

___

###  hideEditorPopup

▸ **hideEditorPopup**(): *void*

Hide editor popup

**Returns:** *void*

___

###  manageCustomTopBarVisibility

▸ **manageCustomTopBarVisibility**(`display`: boolean): *void*

Changes the visibility of a custom TopBar.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`display` | boolean | false | If `true`, displays the TopBar. By default, the custom TopBar is hidden.  |

**Returns:** *void*

___

###  manageDefaultTopBarVisibility

▸ **manageDefaultTopBarVisibility**(`display`: boolean): *void*

Changes the visibility of the default TopBar.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`display` | boolean | false | If `true`, displays the TopBar. By default, the default TopBar is hidden.  |

**Returns:** *void*

___

###  nextStep

▸ **nextStep**(): *void*

Activates the next step in the editor.

**Returns:** *void*

___

###  openProjects

▸ **openProjects**(): *void*

Open popup window with saved projects

**Returns:** *void*

___

###  prevStep

▸ **prevStep**(): *void*

Activates the previous step in the editor.

**Returns:** *void*

___

###  restoreEditor

▸ **restoreEditor**(`snapshot`: string): *Promise‹void›*

Restores the editor state.

**Parameters:**

Name | Type | Description |
------ | ------ | ------ |
`snapshot` | string | A compressed Base64 string representing the editor snapshot. You can obtain this string in [createEditorSnapshot](auwizard.md#createeditorsnapshot).  |

**Returns:** *Promise‹void›*

___

###  saveProject

▸ **saveProject**(): *void*

Open dialog for entering project name

**Returns:** *void*

___

###  showEditorPopup

▸ **showEditorPopup**(): *void*

Show editor popup

**Returns:** *void*

___

###  showModal

▸ **showModal**(`name`: string, `isAutoStart`: boolean): *Promise‹void›*

Shows a modal window by its name.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`name` | string | - | The name of the modal window. |
`isAutoStart` | boolean | false | If `true`, shows the modal window after initializing the editor.  |

**Returns:** *Promise‹void›*

___

###  showPreloader

▸ **showPreloader**(`isPreload`: boolean, `message`: string | string[], `timeout`: number): *void*

Shows and hides a preloader.

Under the hood, this method uses a counter to manage the preloader. If `counter > 0`, then it shows the preloader, otherwise, it hides the preloader. The default value of the counter is `0`.
```
"onClick": [
  "{{#function main.showPreloader(true, 'Creating print files...')}}",
  "{{#function $["editor"].getHiResImages(800,800)}}",
  "{{#function main.showPreloader(false)}}"
]
```

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`isPreload` | boolean | - | If `true`, increments the counter. If `false`, decrements the counter. |
`message` | string &#124; string[] |  [""] | A text message that appears next to the preloader icon.  |
`timeout` | number | 5 | - |

**Returns:** *void*

___

###  showToast

▸ **showToast**(`eventData`: object): *void*

**Parameters:**

▪ **eventData**: *object*

Name | Type |
------ | ------ |
`duration?` | number |
`message` | string |

**Returns:** *void*

___

###  switchToStep

▸ **switchToStep**(`index`: number, `force`: boolean): *void*

Activates a step by its index.

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`index` | number | - | The zero-based index of the required step.  |
`force` | boolean | false | - |

**Returns:** *void*

___

###  toggleDrawerByClickOnShade

▸ **toggleDrawerByClickOnShade**(): *void*

**Returns:** *void*

___

###  toggleShade

▸ **toggleShade**(`value`: boolean): *void*

**Parameters:**

Name | Type |
------ | ------ |
`value` | boolean |

**Returns:** *void*
