@paydock/client-sdk/docs/api-vault-display.md

Paydock client sdk

<a name="VaultDisplayWidget" id="VaultDisplayWidget" href="#VaultDisplayWidget">&nbsp;</a>

## VaultDisplayWidget
Class VaultDisplayWidget include method for working on html

**Kind**: global class  

* [VaultDisplayWidget](#VaultDisplayWidget)
    * [new VaultDisplayWidget(selector, token)](#new_VaultDisplayWidget_new)
    * [.setEnv(env, [alias])](#VaultDisplayWidget+setEnv)
    * [.on(eventName, [cb])](#VaultDisplayWidget+on) ⇒ <code>Promise.&lt;(IEventData\|void)&gt;</code>
    * [.setStyles(fields)](#VaultDisplayWidget+setStyles)
    * [.load()](#VaultDisplayWidget+load)

<a name="new_VaultDisplayWidget_new" id="new_VaultDisplayWidget_new" href="#new_VaultDisplayWidget_new">&nbsp;</a>

### new VaultDisplayWidget(selector, token)

| Param | Type | Description |
| --- | --- | --- |
| selector | <code>string</code> | Selector of html element. Container for widget |
| token | <code>string</code> | One time token |

**Example**  
```js
var widget = new VaultDisplayWidget('#widget', 'token');
```
<a name="VaultDisplayWidget+setEnv" id="VaultDisplayWidget+setEnv" href="#VaultDisplayWidget+setEnv">&nbsp;</a>

### vaultDisplayWidget.setEnv(env, [alias])
Current method can change environment. By default environment = sandbox.
Also we can change domain alias for this environment. By default domain_alias = paydock.com

**Kind**: instance method of [<code>VaultDisplayWidget</code>](#VaultDisplayWidget)  

| Param | Type | Description |
| --- | --- | --- |
| env | <code>string</code> | sandbox, production |
| [alias] | <code>string</code> | Own domain alias |

**Example**  
```js
widget.setEnv('production', 'paydock.com');
```
<a name="VaultDisplayWidget+on" id="VaultDisplayWidget+on" href="#VaultDisplayWidget+on">&nbsp;</a>

### vaultDisplayWidget.on(eventName, [cb]) ⇒ <code>Promise.&lt;(IEventData\|void)&gt;</code>
Listen to events of widget

**Kind**: instance method of [<code>VaultDisplayWidget</code>](#VaultDisplayWidget)  

| Param | Type | Description |
| --- | --- | --- |
| eventName | <code>string</code> | Available event names [VAULT_DISPLAY_EVENT](VAULT_DISPLAY_EVENT) |
| [cb] | <code>listener</code> |  |

**Example**  
```js
widget.on('after_load', function (data) {
     console.log(data);
});
// or
 widget.on('after_load').then(function (data) {
     console.log(data);
});
```
<a name="VaultDisplayWidget+setStyles" id="VaultDisplayWidget+setStyles" href="#VaultDisplayWidget+setStyles">&nbsp;</a>

### vaultDisplayWidget.setStyles(fields)
Object contain styles for widget

**Kind**: instance method of [<code>VaultDisplayWidget</code>](#VaultDisplayWidget)  

| Param | Type | Description |
| --- | --- | --- |
| fields | <code>VaultDisplayStyle</code> | name of styles which can be shown in widget [VAULT_DISPLAY_STYLE](VAULT_DISPLAY_STYLE) |

**Example**  
```js
widget.setStyles({
      background_color: '#fff',
      border_color: 'yellow',
      text_color: '#FFFFAA',
      button_color: 'rgba(255, 255, 255, 0.9)',
      font_size: '20px',
      fort_family: 'fantasy'
  });
```
<a name="VaultDisplayWidget+load" id="VaultDisplayWidget+load" href="#VaultDisplayWidget+load">&nbsp;</a>

### vaultDisplayWidget.load()
The final method to beginning, the load process of widget to html

**Kind**: instance method of [<code>VaultDisplayWidget</code>](#VaultDisplayWidget)