Developer platform

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 nameDescription
onChatDisplayedTriggered when the chatbox is displayed on the visitor screen (either opened or reduced).
onChatHiddenTriggered when the visitor closes the chatbox (after the conversation has been closed by the operator).
onChatButtonDisplayedTriggered when a “click to chat” button is displayed on the visitor screen.
onChatStartedTriggered when a chat conversation has started.
onChatEndedTriggered when a chat conversation has ended.
onCallButtonDisplayedTriggered when a “click to call” button is displayed on the visitor screen.
onMessageReceivedTriggered when an operator message is received by the visitor.
onMessageSentTriggered when the visitor sends a message.
onSatisfactionDisplayedTriggered when the satisfaction survey is displayed to the visitor.
onSatisfactionAnsweredTriggered 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:

PropertyDescription
context.idLegacy conversation ID (integer ID)
context.conversationIdNew conversation ID in UUID format that you can use in our GraphQL API
context.vuidVisitor 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:

PropertyDescription
context.idLegacy conversation ID (integer ID)
context.endedBy⚠️ DEPRECATED. The conversation can only be ended by an operator
context.conversationIdNew conversation ID in UUID format that you can use in our GraphQL API
context.vuidVisitor 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:

PropertyDescription
context.timeLocal time of the message (visitor time)
context.msgThe text message received
context.dateLocal DateTime of the message (ISO 8601)
context.operator.idInternal iAdvize operator id
context.operator.externalIdThe 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:

PropertyDescription
context.timeLocal time of the message (visitor time)
context.msgThe 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']);
};