Integration via API - Videocalling with Queue

This usecase describes example steps of the configuration and API usage which are needed to integrate the Videocalliing plugin with a waiting queue.

For the detailled API documentation see Conference JavaScript API.

1. JavaScript integration

The JavaScript has to be integrated in each webpage where we want to video call.

Learn how to implement the JavaScript on your page.

2. Join the conference

Implement a button where the customer can join the conference. It is possible to add some meta information firstName, lastName, email to the customer which is automatically created. After the customer is created he joins a queue and an agent can pick it from the queue.

/**
 * @param UID customerId which should be unique
 * @param additionalProperties (optional + every property is optional)
 * @param callback which is called when the join was complete
 */
CV.conference.join('UID', { firstName: '', lastName: '', email: '', joinedTimestamp: new Date().getTime()}, callback);

3. Check the current queue status

After the customer has joined the queue it is necessary to poll the queue to hold the customer within the queue. If the polling stops (i.e. the customer leaves the website), the customer is thrown out of the queue after 5sec.

CV.conference.queueStatus('UID', callback);

4. Start the conference

When the current queue status is -1, the queue polling will stop and the agent has already assigned the customer and will join the conference. At this point it is meaningful to start the conference.

CV.conference.start('UID');

Example Code

<script src="https://cdn.chatvisor.com/cdn/js/XXXXXX.js" type="text/javascript" async></script>
<script>
function join() {
  CV.conference.join('UID', { 
    firstName: 'Max', 
    lastName: 'Mustermann', 
    email: 'max.mustermann@example.com' 
  }, function() {
    startQueuePolling();
  });
}

function startQueuePolling() {
  CV.conference.queueStatus('UID', function(index) {
    console.log("My current queue index is ", index);
    if (index == -1) {
      CV.conference.start('UID');
    }
  });
}
</script>

<button onclick="join()">Join the conference</button>