# Javascript API

**Open, Close and Toggle widget**

```javascript
LiveCaller.$emit('ui.widget.open');
LiveCaller.$emit('ui.widget.close');
LiveCaller.$emit('ui.widget.toggle'); 
```

**Emit event to close the currently active conversation**

```javascript
LiveCaller.$emit('ui.conversation.close');
```

example of a button, when clicked it will toggle Livecaller's widget frame

```css
<script>
  document.getElementById('your button id').addEventListener('click', function (e) {
    e.preventDefault()LiveCaller.$emit('ui.widget.toggle')})
</script>
```

**Listen to the widget opening or closing events**

```css
LiveCaller.$on('ui.widget.open', () => {});
LiveCaller.$on('ui.widget.close', () => {});
```

**Change language**

{% hint style="info" %}
change **en** to your native language 2 letter iso code: <https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2>
{% endhint %}

Change language before the widget load

```css
LiveCaller.config.merge({app: {locale: 'en'}});
```

Update language inside the loaded widget

```css
LiveCaller.$emit('app.locale.update', 'en');
```

#### JWT authentication

{% hint style="info" %}
For authentication and profile editing is used JWT verification algorithm HS256.

Read more about JWT here: <https://jwt.io/>

Token lifetime is 15 minutes\
Necessary payload information:\
sub - unique id of the customer in your system\
iat   - token generation timestamp ( UNIX timestamp seconds)
{% endhint %}

*JWT Header example:*

```css
{
  "alg": "HS256",
  "typ": "JWT"
}
```

*Edit Customer JWT Payload example:*

```css
{
  "sub": "12ba81b2-c1fe-479b-8b4a-09fecb02a3d6",
  "name": "John Doe",
  "email": "user@example.com",
  "mobile": "995000123456",
  "iat": 1565610612
}
```

**User authorization**

```javascript
LiveCaller.$emit('user.login', 'JWT Token Here');
```

**User profile update**

```javascript
 LiveCaller.$emit('user.update', 'JWT Token Here');
```

**User Logout**

```javascript
LiveCaller.$emit('user.logout');
```

**Listen for incoming messages and for conversaion closure**

```javascript
LiveCaller.$on('conversation.message.received', (message) => {
    console.log('Message content:', message.content);
});

LiveCaller.$on('ConversationWasClosed', (conversation) => {
    console.log('Conversation closed:', conversation);
});
```