Event Handler

Qiscus Chat SDK provides a simple way to let applications publish and listen some real time event. You can publish typing, read, user status, custom event, and you can handle freely in event handler. This lets you inform users that another participant is actively engaged in communicating with them. Qiscus Chat SDK is using function callback when you initialize Chat SDK. You can define it like this:

Javascript
    
 
qiscus.init({    AppId: 'QISCUS_SDK_APP_ID',    options: {        loginSuccessCallback: function() {},        loginErrorCallback(data) {},        commentDeletedCallback: function (data) {},        commentDeliveredCallback: function (data) {},        commentReadCallback: function (data) {},        presenceCallback: function (data, userId) {},        typingCallback: function (data) {},        onReconnectCallback: function (data) {},        newMessagesCallback: function (messages) {},        roomClearedCallback: function (data) {},        roomChangedCallback: function (data) {},    }})
Copy

Receiving Message

Messages can be received through a newMessagesCallback event. This event is triggered whenever users send a message, you can implement this event, for example:

Javascript
    
 
newMessagesCallback: function (messages) {    var message = messages[0]    // Do something with message}
Copy

newMessagesCallback got a parameter of array of single comment object, not an object of comment.

Sending Typing Status

You can have a typing status by publish the typing event. You need to pass typing status. Set 1 to indicate the typing event is active, set 0 to indicate the event is inactive, you can use the code below:

Javascript
    
 
qiscus.publishTyping(typing) // 1 true, 0 false
Copy

Sending Online Status

You can set online or offline by passing isOnline status. Set true to indicate user is online, and set false to indicate that user is offline. The result will be on presenceCallback: function (data, userId) . Below are the code for publish online or offline:

Javascript
    
 
qiscus.publishOnlinePresence(isOnline) // true : online, false: offline
Copy

Customizing Real-time Event

You can publish and listen any events such as when participant is listening music, writing document, and many other case that you need to tell an event to other participant in a Chat Room.

Firstly you need passing roomId which ChatRoom you want to set, and the structured data for defining what event you want to send. Example of structured data of writing document event:

JSON
    
 
{  "sender": "John Doe",  "event": "writing document...",  "active": "true"}
Copy

Then you can send event using this following method publishEvent:

Javascript
    
 
qiscus.publishEvent(roomId, payload)
Copy

if you need to stop telling other participant that event is ended, you can send a flag to be false inside your structured data, for example:

JSON
    
 
{  "sender": "John Doe",  "event": "writing document...",  "active": "false"}
Copy

After sending an event, then you need to listen the event with related roomId, for example:

Javascript
    
 
qiscus.subscribeEvent(roomId, callback)
Copy

You need unlisten the event with related roomId, for example:

Javascript
    
 
qiscus.unsubscribeEvent(roomId)
Copy

Connection to Qiscus Server

You can have control in your App, when you are reconnected, by default Qiscus Chat SDK will try reconnect automatically, and you get the event once it success. Below is the code for the event:

Javascript
    
 
onReconnectCallback: function (data) {    // data},
Copy

On Message Status Change

After you listen some of events in a ChatRoom, You can receive the real time message status which defined by the event, such as typing, delivered, and read, for example:

Javascript
    
 
commentDeliveredCallback: function (data) {    // On comment delivered},commentReadCallback: function (data) {    // On comment has been read}
Copy

This is an complete version how to use Qiscus Event Handler, for example:

Javascript
    
 
qiscus.init({    AppId: 'QISCUS_SDK_APP_ID',    options: {        loginSuccessCallback: function() {            //  successfully login        },        loginErrorCallback(data) {            // failed login          },        newMessagesCallback: function (messages) {            // On receive a new messages        },        commentDeliveredCallback: function (data) {            // On comment delivered        },        commentReadCallback: function (data) {            // On comment has been read by user        },        presenceCallback: function (data, userId) {            // On user change it "online" status        },        typingCallback: function (data) {            // On user typing        },        onReconnectCallback: function (data) {            // On chat SDK realtime adapter successfully reconnect to server        },        commentDeletedCallback: function (data) {            // On comment deleted        },        roomClearedCallback: function (data) {            // On user successfully cleared a room messages        }    }})
Copy

Here's event handler table:

Method	When to call
newMessagesCallback	When a user successfully send a message
commentDeletedCallback	When a message has been deleted
commentDeliveredCallback	When a message successfully delivered to a user
commentReadCallback	When a message has been read by user
presenceCallback	When user change it online status
typingCallback	When user is still typing or not
onReconnectCallback	When Chat SDK realtime adapter successfully reconnected to server
roomClearedCallback	When successfully cleared a room messages

Last updated on

Was this page helpful?