Dan York recently posted a really nice example of how to combine Phono – the new hotness in cloud telephony that turns any web browser into a phone – and good old fashioned enterprise-grade CCXML.

Dan’s piece inspired me to think about new ways to combine cloud telephony tools like Tropo and Phono with the bedrock of enterprise telephony – CCXML. Turns out, there are some very interesting and powerful combinations possible when you merge these different ways of building phone applications.

Connecting Phono to CCXML

Dan’s piece provided a nice summary of how use Phono as a web front-end to a CCXML application. The approach he describes is a great way to extend the reach of a CCXML application to a whole new group of users – those who are viewing your web site in a browser.

There is an equally exciting way of combining CCXML with the Tropo platform – using Tropo to send IM-based “screen pops” to service agents or others within your organization when a call comes in.

In the call center and customer service industries, screen pops are a way of providing notice to a customer service agent that a call is coming in. The actual content of a screen pop can range from simply displaying the caller ID of the incoming call, to actually pulling information out of a Customer Relationship Management (CRM) system about the caller to display it to the agent before they answer.

In this post, I want to show a simple example of how Tropo can be used to compliment CCXML applications to quickly and easily add screen pop capability. After we run through the details, I want to provide some additional insights on how both Phono and Tropo can be used to significantly enhance the power of enterprise CCXML.

A Simple Tropo Screen Pop Application

The first step in our example is to set up a very simple Tropo script that will send a screen pop message to the IM network and user of our choice. To keep things simple, we’ll use PHP for this example (but you could use any of the languages supported in Tropo Scripting to do this).

Here is the code for our example script:

<?php
message($screenPopMessage, 
	array( 'network'=>$network,'to'=>$sendTo));
?>

As you can see, this is a simple Tropo scripting application that does one thing – it sends an IM message to a user on a specified network. All of the variables in this script (everything preceded by a ‘$’) will be populated when we invoke it from CCXML.

For now, go to your Tropo account and set up a new Tropo Scripting application. Give your application a name, and when filling in the field “What URL powers your app?” select “Hosted File” and opt to create a new hosted file. Click “Create Application” when done.

Once this is done, you will notice your app has several different numbers automatically provisioned. Directly beneath that, you will see the Outbound Tokens provisioned for your new application. Make note of the token for messaging, as later you will need to copy it and paste it into your CCXML script.

The last step is to provision an instant messaging network for the application. This is the IM user that will send the screen pop when an incoming call is received in CCXML (i.e., the IM message will come appear to come from this user). To keep things simple, you can just set up a Jabber account using the tropo.im domain. If you do this, you can add the user you assign to your application to your buddy list in any Jabber client, including Google Chat.

Connecting Tropo to CCXML

In order to invoke our simple Tropo screen pop application, we need to make some changes to the CCXML introduced in the Dan’s post. Our revised CCXML looks like this:

<?xml version="1.0" encoding="UTF-8"?> 
<ccxml version="1.0" xmlns:voxeo="http://community.voxeo.com/xmlns/ccxml">

  <var name="inboundID"/> 
  <var name="outboundID"/> 
  <var name="initState" expr="'state1'" />

  <!-- Tropo API information -->
  <var name="tropoAPIToken" expr="'your-tropo-session-token'"/>
  <var name="tropoAPIEndPoint" expr="'http://api-internal.tropo.com/1.0/sessions?action=create&amp;token=' + tropoAPIToken"/>
  <var name="TropoSendURL"/>

  <var name="screenPopMessage" expr="encodeURIComponent('This is a screen pop!')"/>
  <!-- Any valid IM network name such as AIM, GTALK, MSN, JABBER, TWITTER and YAHOO. -->
  <var name="network" expr="'JABBER'"/>
  <var name="sendTo" expr="'your-im-user-name'"/>

  <eventprocessor statevariable="initState">

    <transition state="state1" event="connection.alerting"> 
      <log expr="'*** INBOUND CONNECTION ALERTING ***'"/> 
      <assign name="inboundID" expr="event$.connectionid" /> 
      <assign name="initState" expr="'state2'"/> 
      <assign name="TropoSendURL" expr="tropoAPIEndPoint + '&amp;screenPopMessage=' + screenPopMessage"/>
      <assign name="TropoSendURL" expr="TropoSendURL + '&amp;network=' + network"/>
      <assign name="TropoSendURL" expr="TropoSendURL + '&amp;sendTo=' + sendTo"/>
      <send name="'http.get'" target="TropoSendURL" targettype="'basichttp'"/>
    </transition>

    <transition event="send.successful" state="state2">
      <log expr="'*** Screen pop information sent to Tropo. Accept inbound call. ***'"/>   
      <assign name="initState" expr="'state3'"/>
      <accept connectionid="inboundID" /> 
    </transition>

    <transition event="error.send.failed" state="state2">
      <log expr="'*** ERROR: Could not send screen pop information. ***'"/>
      <assign name="initState" expr="'state3'"/>
      <accept connectionid="inboundID" /> 
    </transition>

    <transition state="state3" event="connection.connected"> 
      <assign name="initState" expr="'state4'"/> 
      <!-- 4079651112 is Voxeo Sales line -->
      <createcall dest="'tel:4079651112'" callerid="'1112223333'" connectionid="outboundID" timeout="'30s'"/> 
    </transition> 

    <transition state="state4" event="connection.progressing"> 
      <log expr="'*** CONNECTION.PROGRESSING ***'"/>  
      <assign name="initState" expr="'state5'"/> 
    </transition> 

    <transition state="state5" event="connection.connected"> 
      <assign name="initState" expr="'state6'"/> 
      <log expr="'*** CONNECTION.CONNECTED: INBOUND ***'"/>  
      <join id1="inboundID" id2="outboundID" duplex="'full'"/> 
    </transition> 

    <transition state="state6" event="conference.joined"> 
      <log expr="'*** CONFERENCE JOINED: INBOUND LEG TO OUTBOUND LEG ***'"/>  
    </transition> 

    <transition event="connection.disconnected"> 
      <log expr="'*** CONNECTION.DISCONNECTED ***'"/>  
      <exit/> 
    </transition> 

    <transition event="error.*">
      <log expr="'*** AN ERROR HAS OCCURED: ' + event$.reason  + ' ***'"/>
      <exit/>
    </transition>

  </eventprocessor> 
</ccxml>

You’ll notice a few differences from the CCXML example used in Dan’s piece. It includes a variable to hold a special URL to the Tropo Session API. There are also variables to hold the IM network and user that you want to send a screen pop to when a call comes into CCXML. Make sure you enter the details of the network on line 15 and the username on line 16 to whom you want to send the screen pop. Also, enter the messaging token from your Tropo application on line 9 in this CCXML script.

Set this script up in your Evolution account (as described in Dan’s post). Now, when a call comes into CCXML from Phono, the user that you have designated gets a screen pop with the value of the screenPopMessage variable in the CCXML script.

You can obviously change this message to anything you want, but it must be URL encoded before sending to the Tropo Session API.

<var name="screenPopMessage" 
       expr="encodeURIComponent('This is a screen pop!')"/>

Icing on the Cake!

Although this example is admittedly simple, coupled with Dan’s previous piece on connecting Phono to CCXML, it demonstrates how easy it is to augment CCXML with both Phono and Tropo. But that’s not all, it gets even better…

Phono allows developers to append information to a phone call, via the Phone API. in other words, before making a Phono call from your web page, you could add information to it via a header collection – this information could be obtained from prompting the user and getting input that way, or by examining what they did on a page (i.e., clicking a link). When the call connects to CCXML, this information is then available in standard SIP headers.

What this would let you do is to add inforamtion to a Phono call via client-side jQuery, and then use that inforamtion to craft the screen pop message in CCXML. This would allow you to customize the screen pop message to a customer service agent for each caller. You could even route calls differently based on the iformation added via Phono headers.

In addition, Tropo allows for the easy creation of IM applications (and other types of communication applications). In our simple example, we are just sending a message one way, from a CCXML script to a customer service agent through an instant message. But Tropo allows developers to build interactive IM applications. So with a little more work, we could create a screen pop application that asks an agent if they want to take an incoming call, send the call to another agent, or even send it to voice mail.

Because it’s possible to inject events into a running CCXML session, a Tropo application could control how a call is routed in CCXML based on an interaction with an agent. In this way it is possible to create more sophisticated, interactive screen pops using Tropo.

Hopefully, this post and the one it was inspired by give you a sense of how Phono and Tropo can compliment standards-based CCXML.

When it comes to getting more out of your CCXML applications, Phono and Tropo are the icing on the cake!