Javascript Callbacks

Overview

Introduction

iAdvize provides Javascript callbacks functions that can be used to perform actions on specific events.

Some callbacks have a parameter that contains data specific to the triggered event.

How to use callbacks

To execute custom code during an iAdvize callback function you have to define the callbacks you want to use in a window.iAdvizeCallbacks object.

⚠️ Please note that the window.iAdvizeCallbacks must be defined before the main iAdvize tag.

---

Reference

Callback name	Description
onChatDisplayed	Triggered when the chatbox is displayed on the visitor screen (either opened or reduced).
onChatHidden	Triggered when the visitor closes the chatbox (after the conversation has been closed by the operator).
onChatButtonDisplayed	Triggered when a “click to chat” button is displayed on the visitor screen.
onChatStarted	Triggered when a chat conversation has started.
onChatEnded	Triggered when a chat conversation has ended.
onCallButtonDisplayed	Triggered when a “click to call” button is displayed on the visitor screen.
onMessageReceived	Triggered when an operator message is received by the visitor.
onMessageSent	Triggered when the visitor sends a message.
onSatisfactionDisplayed	Triggered when the satisfaction survey is displayed to the visitor.
onSatisfactionAnswered	Triggered when the visitor has answered all the questions in the satisfaction survey.

onChatDisplayed

Triggered when the chat window is displayed on the visitor screen (either opened or reduced).

Example:

window.iAdvizeCallbacks.onChatDisplayed = function() {
  // Chat window is displayed
  ...
};

onChatHidden

Triggered when the visitor closes the chatbox (after the conversation has been closed by the operator).

Example:

window.iAdvizeCallbacks.onChatHidden = function() {
  // Chat window is hidden
  ...
};

onChatButtonDisplayed

Triggered when a “click to chat” button is displayed on the visitor screen.

Example:

window.iAdvizeCallbacks.onChatButtonDisplayed = function() {
  // Chat button is displayed
  ...
};

onChatStarted

Triggered when a chat conversation has started.

Context parameter:

Property	Description
context.id	Legacy conversation ID (integer ID)
context.conversationId	New conversation ID in UUID format that you can use in our GraphQL API
context.vuid	Visitor Unique Id is a random string which can be used for analytics purposes

Example:

window.iAdvizeCallbacks.onChatStarted = function(context) {
  // Chat is started
  ...
};

onChatEnded

Triggered when a chat conversation has ended.

Context parameter:

Property	Description
context.id	Legacy conversation ID (integer ID)
context.endedBy	⚠️ DEPRECATED. The conversation can only be ended by an operator
context.conversationId	New conversation ID in UUID format that you can use in our GraphQL API
context.vuid	Visitor Unique Id is a random string which can be used for analytics purposes

Example:

window.iAdvizeCallbacks.onChatEnded = function(context) {
  // Chat conversation is closed
  ...
};

onCallButtonDisplayed

Triggered when a “click to call” button is displayed on the visitor screen.

Example:

window.iAdvizeCallbacks.onCallButtonDisplayed = function() {
  // Call button is displayed
  ...
};

onMessageReceived

Triggered when an operator message is received by the visitor.

Context parameter:

Property	Description
context.time	Local time of the message (visitor time)
context.msg	The text message received
context.date	Local DateTime of the message (ISO 8601)
context.operator.id	Internal iAdvize operator id
context.operator.externalId	The operator external id provided by the customer

Example:

window.iAdvizeCallbacks.onMessageReceived = function(context) {
  // Operator message received
  ...
};

onMessageSent

Triggered when the visitor sends a message.

Context parameter:

Property	Description
context.time	Local time of the message (visitor time)
context.msg	The text message received

Example:

window.iAdvizeCallbacks.onMessageSent = function(context) {
  // Visitor message sent
  ...
};

onSatisfactionDisplayed

Triggered when the satisfaction survey is displayed to the visitor.

Example:

window.iAdvizeCallbacks.onSatisfactionDisplayed = function() {
  // Satisfaction survey displayed to the visitor
  ...
};

onSatisfactionAnswered

Triggered when the visitor has answered all the questions in the satisfaction survey.

Example:

window.iAdvizeCallbacks.onSatisfactionAnswered = function() {
  // Satisfaction survey answered by the visitor
  ...
};

---

Guides

Safely adds events in window.iAdvizeCallbacks object

If you need to add callbacks in different places in your code and to prevent overriding a previous callback definition, you should always use this line before adding your callbacks:

// Used to prevent overriding a previous definition
window.iAdvizeCallbacks = window.iAdvizeCallbacks || {};

Safely define a function for an event

If your code is splitted in multiple files or module, you may need to define several functions for the same event.

Here is a solution to avoid overwriting a previous function:

// Used to prevent overriding a previous definition
window.iAdvizeCallbacks = window.iAdvizeCallbacks || {};

var tempOnChatStarted = window.iAdvizeCallbacks.onChatStarted || function(){};
window.iAdvizeCallbacks.onChatStarted = function(context) {

  // Call the possible already defined callback
  tempOnChatStarted(context);

  // Your new custom code here
  // ...

};

Track some Google Analytics events

// Used to prevent overriding a previous definition
window.iAdvizeCallbacks = window.iAdvizeCallbacks || {};

// Chat session starts
window.iAdvizeCallbacks.onChatStarted = function(context) {
  _gaq.push(['_trackEvent', 'iAdvize', 'Chat Start', context.startedBy]);
};

// Chat session ends
window.iAdvizeCallbacks.onChatEnded = function(context) {
  _gaq.push(['_trackEvent', 'iAdvize', 'Chat End', context.startedBy]);
};

// Call session starts
window.iAdvizeCallbacks.onCallStarted = function() {
  _gaq.push(['_trackEvent', 'iAdvize', 'Call Start']);
};

// Call session ends
window.iAdvizeCallbacks.onCallEnded = function() {
  _gaq.push(['_trackEvent', 'iAdvize', 'Call End']);
};