Dolphin Connect API

For versions:4.6.1

Configuration

Before using DolphinConnect API, please install the latest version of dolphin-livechat-connector npm module. At the time of this writing the version is 1.0.7.

 npm install dolphin-livechat-connector

First Import the Required Class

 import { DolphinProfile, DolphinConnect} from 'dolphin-livechat-connector';

The Outline of How to Use The API


Connect()

Call this method to establish connection to server. Below is example of how to use the method.

 dolphinConnect.connect();

Disconnect()

Call this method to disconnect with the server. Below is example of how to use the method.

 dolphinConnect.disconnect();

Connectedmethod

This method will be triggered when “DolphinConnect.isConnected” status switched (true -> false or vice versa). Below is example of how to implement the method.

connectedMethod = (connected, error) => {
    if (connected) {
        dolphinConnect.isConnected === true // TRUE
    } else {
        dolphinConnect.isConnected === false // TRUE
        console.log('Connection is broken', error);
    }
}
dolphinConnect.setConnectedMethod(connectedMethod);

Connectingmethod

This method will be triggered when DolphinConnect is establishing the connection, whether when the first time we called connect() method or reconnecting process. Below is example of how to implement the method.

connectingMethod = () => {
    dolphinConnect.isConnecting === true // TRUE
    console.log('Estabilishing connection...');
}
dolphinConnect.setConnectingMethod(connectingMethod);

onReceivedMethod

This method will be triggered when DolphinConnect detects an incoming message. Below is example of how to implement the method (Note : the “message” payload shown below is an array ofobject).

onReceiveMessage = message => {
     console.log(message);
}
dolphinConnect.setOnReceiveMethod(onReceiveMessage);

There are various kind of message we will receive :

Pure text message

This kind of message always have “text” property. This is how the message will look like.

createdAt : Thu Oct 24 2018 13:58:40 GMT+0700 (Western Indonesia Time) {}
document : null
documentName : null
origin : "Incoming"
text : "Pagi kak Albert, senang bisa menyapa kakak pagi ini."
user :
   avatar : "http://www.inmotion.co.id/assets/images/logo/sri_face.png"
   name : "Sri Virtual Assistant"
   _id : "agent/bot"
   __proto__ : Object
  _id : "0d796b45-a995-4a07-a467-105a1cf0aaaf"
   __proto__ : Object
length : 1
__proto__ : Array(0)

Quick Reply / Suggestion Message

This kind of message always have “options” property. This is how the message will look like.

createdAt : Thu Oct 24 2018 13:58:40 GMT+0700 (Western Indonesia Time) {}
options : Array(3)
  0 : "Satu@===@1"
  1 : "Sepuluh@===@10"
  2 : "Seratus@===@100"
length : 3
__proto__ : Array (0)
origin : "Incoming"
user : {_id: "agent/bot", name: "Sri Virtual Assistant", avatar: "http://www.inmotion.co.id/assistant"
 _id: "92ec78b7-2eae-4726-80cc-9a5cde4b4890"
__proto__ : Object

The “options” property has two properties which is separated by @===@ symbol. The first property is a label which is displayed in chat message, while the second one is a value/payload which is sent to backend/server. Below is an example of how to implement it.

const albelAndValue = option.split('@===@');
dolphinConnect.onSend({
    text : labelAndValue[0],
    value : labelAndValue[1],
})

Button Card Message

This kind of message always have “buttons” property. this is how the message will look like.

0:
  buttons: Array(2)
    0:
      buttonValues: Array(2)
      0: {name: "INFO", value: "info Social CRM"
      1: {name: "DETAIL", value: "https://www.inmotion.co.id"}
        length: 2
      __proto__ : Array(0)
      group: "3Dolphin"
      id: "0e1ac55c35ffdfa61be33c5fa5fe4a39"
      pictureLink: "http://chat.3dolphinsocial.com:32397/webchat/out/button/A4DCD6362865AFD1FDB6A"
      subTitle: "omniChannel Social CRM"
      title: "Social CRM"
      __proto__: Object
    1: {id: "124c7eea7d72d98f20277096924ead3d", pictureLink: "http://chat.3dolphinsocial.com:3239"
    length:2
    __proto__ : Array(0)
  createdAt : Thu Oct 24 2018 13:58:40 GMT+0700 (Western Indonesia Time) {}
  origin: "Incoming"
  user :{_id: "agent/bot", name: Sri Virtual Assistant, avatar: "http://www.inmotion.co.id/assets/images/logo"}
   _id : "4433f548-2cd2-4339-b6e3-e1948d7dc6c9"
   __proto__ : Object

Image message

This kind of message always have “image” property. this is how the message will look like.

0:
createdAt : Thu Oct 24 2018 13:58:40 GMT+0700 (Western Indonesia Time) {}
image: "http://localhost/146f5dab2c13109af37de02c76e74926/webchat/out/image/"
origin: "Incoming"
text: null
user :{_id: "agent/bot", name: Sri Virtual Assistant, avatar: "http://www.inmotion.co.id/assets/images/logo"}
   _id : "ae578614-2db6-4aoc-9901-a062f8785156"
   __proto__ : Object

onCustomerTyping()

Call this method when you want to send customer / user typing event to server. Below is example of how to use the method

dolphinConnect.onCustomerTyping();

onSend()

Call this method to send message, message must be an object or array of object. Below is example of how to send

Text Message

dolphinConnect.onSend({ text: 'Hai selamat pagi!'});
dolphinConnect.onSend([{ text: 'Hai selamat pagi!' }, { text: 'Ada yang bisa saya bantu?' }])

Image Message

dolphinConnect.onSend({ image: 'content://media/external/images/media/411782'});
dolphinConnect.onSend([{ image: 'content://media/external/images/media/411782' }, { image: 'content://media/external/images/media/411781' }])

This method also return an array of object with previous text message plus additional information like created date and id.

const messageArrObj = DolphinConnect.instance.onSend([{ text: 'Hai Selamat Pagi!' }, { text: 'Ada yang bisa saya bantu?' }]);
console.log(messageArrObj);

This is how the array of object looks like.

createdAt : Thu Oct 24 2018 13:58:40 GMT+0700 (Western Indonesia Time) {}
origin : "Outgoing"
text : "Hai Selamat Pagi!"
user :{_id: "user", name: undefined, avatar: undefined}
_id : "223040e3-1ef4-41bb-a553-3bf29e669f1c"
__proto__ : Object
1: {text: "Ada yang bisa saya bantu?", _id: "d04e7035-191e-4b0d-90d4-e20e3d7ca9f9", create
length : 2 
__proto__ : Array(0)

messageSentMethod

This method will be triggered after onSend method is called, whether the message is sent successfully or not. Below is example of how to implement the method.

messageSentMethod = (message, success, error) => {
   if (success) {
      console.log('This message is sent successfully!')
   } else {
      console.log('This message sent failed!', error)
   }

   console.log('MESSAGE :', message);
}

onAgentTypingMethod

This method will be triggered when agent is typing.  Below is example of how to implement the method.

onAgentTypingMethod = () => {
     console.log('Agent is typing...')
}
dolphinConnect.setOnAgentTypingMethod(onAgentTypingMethod);

getChatHistory

Retrieve conversation history from backend. The retrieved format is the same as previous message examples (an array of object). Below is example of how to use it.

dolphinConnect.getChatHistory(getChatHistorySuccess, getChatHistoryFailed);

getChatHistorySuccess = chatHistory => {
     //Do Something with the retrieved chat history
}

getChatHistoryFailed = error => {
       console.log('Chat History retrieval failed', error);
}

checkChannelStatus

Check whether the specified channel is online or not. Before using this method make sure you have set the service endpoint (please refer back to point 1.2)

dolphinConnect.setDetectorEndpoint('http://localhost:32520/isonline/146f5dab2c1e109af37de02c76e74926');

Below is example of how to use it.

channelOnlineMethod = () => {
       console.log('CHANNEL IS ONLINE')
}

channelOfflineMethod = message => {
       console.log('CHANNEL IS OFFLINE', message);
}

dolphinConnect.checkChannelStatus(this.channelOnlineMethod, this.channelOfflineMethod);

additionalRestHeaders

Add additional REST headers to accommodate BTPN-ApiKey header. Below is example of how to add multiple headers

dolphinConnect.setAdditionalRestHeaders({
       'BTPN-ApiKey' : 'bfd16e3f-8a88-4f24-b5de-93a276efd44c',
       'other-header': 'other-value'
})
Was this article helpful?
Dislike 0