Friday, May 25, 2012

Getting the availability of a Queue using JavaScript

When utilizing Queue Manager as a click-to-chat platform, it's important to be able to accurately know the current state of the Queue. You wouldn't want end-users trying to chat if the queue was offline, this would lead to user disappointment and dissatisfaction. You also may want a way of displaying how many experts are currently online, available, and ready to chat, to show the strength of your 'support-force'. Our Queue front-end has had support for these sort of requests for sometime, but in our most recent release, we've made these activities easier to perform. Let me walk you through a typical scenario, and I'll show you how easy it is.

Scenario: You want to check the status of the queue on a simple web page button press.

To achieve this functionality, we'll do a few things in JavaScript, but the code itself is very straightforward. To do this we'll be using the following (new!) Queue Manager API call to get the status of the queue:
Replace the fields necessary with your environment, the Queue login ID would be something like 'Demo Support' or 'support@instant-tech.com' depending on how the Queues are set up in your deployment.

We'll make a simple JavaScript call to call this, and return the Queue status. The function below shows how the code would look to perform this task. It's a mixture of JavaScript and jQuery, so you'd need to make sure the page you are testing with is using jQuery for this example to work.
var Instant = {
    getQueueStatus: function (queueID) {
        var url = "http://192.168.1.214:8080/ITFramework/webclient?getSTStatus=" + queueID;
        
        $.ajax({
            url: url,
            type: "GET",
            complete: function(result){
                status = $.trim(result.responseText);
                if (status === "na") {
                    console.log("Queue is offline, or doesn't exist."); // Log the message out to the Chrome/Firefox/Firebug console
                }
                else if (status === "STATUS_ACTIVE") {
                    console.log("Queue is online."); // Log the message out to the Chrome/Firefox/Firebug console
                }
                else if (status === "STATUS_AWAY") {
                    console.log("Queue is unavailable. All experts are unavailable/offline."); // Log the message out to the Chrome/Firefox/Firebug console
                }
                else {
                    console.log("Queue may be available, check it's status in Sametime."); // Log the message out to the Chrome/Firefox/Firebug console
            }              
        });
    }
}
In the code above, we've created a function getQueueStatus inside our Instant object that takes the Queue ID as a parameter. We build a 'url' variable with the FQDN to our Queue Server, and the Queue ID that we passed in. Once we have that, we do a simple AJAX GET request to the url variable we built. Once we get the response, our code with run through the 'complete:' section of our code and it will assess what the server has returned. We use jQuery's $.trim() function to strip any '\n' line breaks that may be returned with the data. The API call could return up to 12 responses, but we are only really concerned with 3.
  • If we get 'na' as a response, the Queue is offline in Sametime, or it isn't a valid queue. This means our server can't see it. For this we are writing out to the Chrome/Firebug console Queue is offline, or doesn't exist. 
  •  If we get 'STATUS_ACTIVE', our server can see the queue, it's online. For this we'll write out Queue is online.
  • The other response we'd want to check for this the 'STATUS_AWAY' response, this means that the queue is online, but that all experts are currently busy. 
 Inside these if statements, you could write your own code to execute when these status' are returned. You could have this function load with the page, and if the server returns 'na' you could disable the chat button and give a message the the chat feature is currently disabled.

The other API call which we have surfaced is a way for you to get the number of available experts in the requested Queue. The code itself is almost identical to the code above, except we are requesting a different API endpoint URL:
The JavaScript below lays out this API call simply.
getAvailableExpertCount: function (queueID) {
    var url = "http://192.168.1.214:8080/ITFramework/webclient?getQueueExpertsReady=" + queueID; // Change this to the FQDN of your IQM server

    $.ajax({
        url: url,
        type: "GET",
        complete: function(result){
                count = $.trim(result.responseText);
                console.log("Experts available: " + count);
        }
    });
}
Just like the first block of code, we set a URL using our FQDN and Queue ID, and perform a simple AJAX GET to the URL that we built. We trim the response, and console out the number of experts that we have in the Queue available. This response could be set into a variable itself, which maybe you would want to include in a counter somewhere on the page to show visitors how many agents are there to help. Because this is all JavaScript, it is very flexible to wire these API calls into your website to perform some basic to advanced tasks.

No comments: