API CTI – Shuttle 2.4.0 onwards
You can integrate xCALLY Shuttle with any kind of external Web Applications you like (external custom CRM, Ticketing solution, ERP etc…).
Info | ||
---|---|---|
| ||
The example template was written in Javascript, but the integration can be written in other languages |
The template.js file contains the basic elements to create your Custom CTI Integration through the realtime xCally Shuttle connection, thus providing the possibility to manage and autofill your external applications with the data about the call, like the caller number or the agent who answered the call and more. You can automatically open a CTI form or pop-up, and view the call/ticket/crm data on to the xCALLY Shuttle supervisor Realtime Dashboards.
The service need to connect to xcally-realtime service through the socket to receive event notification. At the meantime, the service will be able to send command and notification to agents and user sending actions to the socket.
Info | ||
---|---|---|
| ||
If Secure Connection is enabled, use https://localhost:8888 for socket connection, otherwise use http://localhost:98888 |
You can download the template.js file here and the service file here
...
Important: after the download, remember to rename the template.js file!
Event Ringing
...
The ringing event is dispatched following a ring event on an agent for a queue call
Code Block | ||
---|---|---|
| ||
event.ringing = function(data) { console.log('ringing'); wakeup('http://www.google.it', data.peer, 'new_tab'); }; |
This is the data sample for ringing event
Code Block | ||||
---|---|---|---|---|
| ||||
{ event: 'ringing', queue: 'CC-SIPPSupport', agentname: 'JohnAndrea DoeBianco', agentnum: '10071000', peer: 'SIP/johnandrea.doebianco', direction: 'inbound', uniqueid: '14370692641599601698.91494', context: 'from-sip', extension: '99996000', trunk: 'SIP/demo.trunktelephone-000003920000005e', callernum: '9981003', callername: 'telephone', ringing: true, sipname: 'andrea.bianco', channel: 'SIP/telephone-0000005e' } |
Event Abandon
...
The abandon event is dispatched following a abandoned event on a queue call
Code Block | ||
---|---|---|
| ||
event.abandon = function(data) {
console.log('abandon');
wakeup('https://www.zendesk.com/', data.peer, 'new_window');
}; |
Event Up
Panel | |
---|---|
bgColor | #E6E6FA}; |
This is the data sample for abandon event
Code Block | ||||
---|---|---|---|---|
| ||||
{
event: 'abandon',
queue: 'Support',
direction: 'unmanaged',
uniqueid: '1599601824.96',
callernum: '1003',
callername: 'telephone',
channel: 'SIP/telephone-00000060',
holdtime: '4',
unmanaged: true
} |
Event Up
The up event is dispatched following an answer event on an agent for a queue call
Code Block | ||
---|---|---|
| ||
event.up = function(data) { console.log('up'); wakeup('http://localhost', data.peer, 'new_frame'); }; |
This is the data sample for up event
Code Block | ||||
---|---|---|---|---|
| ||||
{ event: 'up', queue: 'CC-SIPPSupport', agentname: 'JohnAndrea DoeBianco', agentnum: '10071000', peer: 'SIP/johnandrea.doebianco', direction: 'inbound', uniqueid: '14370692641599601698.91494', context: 'from-sip', extension: '99996000', trunk: 'SIP/demo.trunktelephone-000003920000005e', callernum: '9981003', callername: 'telephone', holdtime: '2', ringtime: '0', up: true, sipname: 'andrea.bianco', channel: 'SIP/telephone-0000005e' } |
Event Hang Up
...
The hang up event is dispatched following an hangup event on an agent for a queue call
Code Block | ||
---|---|---|
| ||
event.hangup = function(data) { console.log('hangup'); wakeup('http://www.google.it', data.peer, 'new_tab'); }; |
Event Outbound
Panel | |
---|---|
bgColor | #E6E6FA
This is the data sample for hangup event
Code Block | ||||
---|---|---|---|---|
| ||||
{
event: 'hangup',
queue: 'Support',
agentname: 'Andrea Bianco',
agentnum: '1000',
peer: 'SIP/andrea.bianco',
direction: 'inbound',
uniqueid: '1599601698.94',
context: 'from-sip',
extension: '6000',
trunk: 'SIP/telephone-0000005e',
callernum: '1003',
callername: 'telephone',
holdtime: '2',
ringtime: '0',
talktime: '2',
reason: 'agent',
hangup: true,
sipname: 'andrea.bianco',
channel: 'SIP/telephone-0000005e'
} |
Event Outbound
The outbound event is dispatched following the initiation of an outbound call by the agent
Code Block | ||
---|---|---|
| ||
event.outbound = function(data) { console.log('outbound'); wakeup('http://www.zendesk.it', data.peer, 'new_window'); }; |
This is the data sample for outbound event
Code Block | ||||
---|---|---|---|---|
| ||||
{
event: 'outbound',
integrationid: '-1',
routeid: '1',
agentname: 'Andrea Bianco',
agentnum: '1800800800',
direction: 'outbound',
uniqueid: '1599601871.98',
context: 'from-sip',
extension: '3925926421',
trunk: 'SIP/123456789@Demo Trunk',
callernum: '123456789',
channel: 'SIP/andrea.bianco-00000062',
peer: 'SIP/andrea.bianco',
outbound: true,
sipname: 'andrea.bianco'
} |
Open CTI to an Agent
...
bgColor | #E6E6FA |
---|
...
The wakeup method is used to request the agent to open a web page
Code Block | ||
---|---|---|
| ||
var wakeup = function(url, peer, mode) {
socket.emit('AgentCTI', {
url: url,
peer: peer,
mode: mode
});
}; |
...
Push a notification to the Agent
...
The notification method is used to send a notification to the agent
Code Block | ||
---|---|---|
| ||
var notification = function(peer, type, title, body) { socket.emit('AgentCTINotification', { peer: peer, type: type, title: title, body: body }); }; |
where
peer: the Agent interface
...
Push the event into the Integration Realtime section of the Administrator
These data will populate the following section of xCALLY Realtime:
...
bgColor | #E6E6FA |
---|
The pushevent method is used to display trigger action event in Realtime section
Code Block | ||
---|---|---|
| ||
var pushevent = function(appname, data, reference, url) { data.time = new Date(); socket.emit('RealtimeCTI', { type: appname, channel: data, reference: reference, url: url }); }; |
where
appname: name of the Integration
data: object containing information about the call
reference: CTI creation id
url: the address of the CTI
Example
...
For each event you can define which action you want the integration to perform.
In this example we associate to the UP event the CTI opening to an Agent, if the call belongs to the Sales Queue.
We also pass to the Agent a custom variable called ordernumber that we have created into the Shuttle -> Settings -> Integrations -> Custom variables section.
Panelcode | ||
---|---|---|
| ||
event.up = function(data) { var order = customvariables[data.uniqueid]['ordernumber']; if if(data.queue == ‘Sales’){ wakeup('http://webservice1/sales?ordernumber='+order, data.peer, 'new_frame');} } }; |
Add a custom integration service
...