Advisor Desktop Widget Event APIs
Advisor Desktop Widget Event APIs enable the Advisor Desktop to be used in tandem with another third-party browser-based application. The third-party application would most likely be a CRM system for an at the pane integration use case. It involves a fully client (browser) side integration.
A JavaScript file served from an eGain installation is included in the third-party application. This file enables a two-way message exchange between the Advisor Desktop and the third-party application. A few lines of code in the third-party application allows it to receive various types of messages from Advisor Desktop, as well as allow for sending messages to Advisor Desktop. E.g., whenever the user selects a new activity in the Inbox in Advisor Desktop, the information about it can be broadcasted and it can be received by an interested third-party application.
What needs to be done on eGain side?
In eGain Administration Console, add the origin of the third-party application URL in the CORS configuration. Refer the section Enabling Cross-Origin Resource Sharing in Administration user guide on how to add the origin. E.g., if want to use Duo with your MS Dynamics which has the URL like https://mycrm.crm.dynamics.com, you should enable CORS for https://mycrm.crm.dynamics.com. What needs to be done on third party application side?
-
Include a JavaScript file from the eGain installation from where Advisor Desktop is served.
The URL to the JS file is
https://youregaindomain/
/web/apps/resources/js/egainremotesolve.js
For example:
<script src="https://www.mydomain.com/system/web/apps/resources/js/egainremotesolve.js" type="application/javascript"></script>- If the third-party application restricts iframe insertion using content-security-policy directives like child-src and frame-src, it needs to be changed to allow for the eGain application domain e.g., https://youregaindomain .
- Write JavaScript code to receive and send messages to Advisor Desktop. Sample code will be published.
- Take action based on messages received. For example, load customer details locally in the third-party application when a new activity is selected in Advisor Desktop.
Events published by Advisor Desktop to Third party
The following events are published by the Advisor Desktop when the eAdvisor Desktop Widget Event library is included in a third party application UI.
All events
egainSolve.init(function(){
//subscribe to all events
var listener = egainSolve.subscribeAll(function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called unsubscribeAll
//listener.unsubscribeAll();
});activityselected
This event is generated when an activity is selected in the Advisor Desktop. The event is supported for following channels:
- Chat
- Secure message
- Task
- Calltrack
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('activityselected', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type,
"channel": channel name in case of messaging chat
},
}chatmessage
This event is generated when a chat message is received or sent
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('chatmessage', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
author: author,
authorType: type of author i.e. SYSTEM, AGENT or CUST,
content: message content,
originalMsgObject: original message object with all message parameters,
activity: An object of all activity data
}chatcomplete
This event is generated when a chat is completed.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('chatcomplete', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
}); Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type,
"channel": channel name in case of messaging chat
}
}caseselected
This event is generated when a case is selected on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('caseselected', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
case: {
id: case id
}
}folderchanged
This event is generated when a folder is selected on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('folderchanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
folder: an object containing folder data like id, type , parent etc.
}nonchatactivitycomplete
This event is generated when activity(s) are completed on the Advisor Desktop. The event is supported for following channels:
- Chat
- Secure message
- Task
- Calltrack
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('nonchatactivitycomplete', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
activities: an array of object containing activity data like id, type, caseId, customerId, subject
}nonchatactivitysave
This event is generated when an activity is explicitly saved from reply pane on the Advisor Desktop. The event is supported for following channels:
- Task
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('nonchatactivitysave' function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type
}emailsend
This event is generated when an email is sent on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('emailsend', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type
}emailsendandcomplete
This event is generated when an email is sent and completed on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('emailsendandcomplete', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type
}transferactivities
This event is generated when activities are transferred on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('transferactivities', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
activities: an array of object containing activity data like id, type, caseId, customerId, subject
}customerchanged
This event is generated when a customer of selected activity is changed through the info pane on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('customerchanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{customerId: customerId}casechanged
This event is generated when a field on the case of a selected activity is changed through info pane on the Advisor Desktop. If a new case is created then new case id is sent.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('casechanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{caseId: caseid}casecustomattributechanged
This event is generated when a custom attribute field on a case of a selected activity is changed through info pane on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('casecustomattributechanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
caseId: caseid,
customAttributed: an array of modified custom attribute name value pair
}activitychanged
This event is generated when an activity field of a selected activity is changed through the info pane on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('activitychanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
activityId: activity id
}activitycustomattributechanged
This event is generated when a custom attribute field on a selected activity is changed through the info pane on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('activitycustomattributechanged', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
activityId: activity id,
customAttributed: an array of modified custom attribute name value pair
}calltrackfieldchange
This event is generated when a when content or field of a call track reply pane is changed on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('calltrackfieldchange', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
activityId: activity id,
subject: subject,
fieldName: name of field or editor in case of content,
value: new value of field value pair
}replyfieldchange
This event is generated when any field except 'content' changes in reply pane on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('replyfieldchange', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type.
"channel": channel name in case of messaging chat
},
"fieldName": field name,
"value": value of field,
"displayValue": display value if combo or multiselect field,
"custom": false
}pullchatblink
This event is generated when pull chat button start or stop event for a chat is received on the Advisor Desktop.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('pullchatblink', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"queueId": queue id
"start": start or stop
}chatassigned
This event is generated when a chat is assigned.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('chatassigned', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type,
"channel": channel name in case of messaging chat
},
}nonchatassigned
This event is generated when a non chat activity is assigned.
egainSolve.init(function(){
//subscribe to activity section event
var listener2 = egainSolve.subscribe('nonchatassigned', function(message){
console.log("event name", message.type);
console.log("event data",message.data );
});
//listener will get destroyed if called
//listener2.unsubscribe();
});Payload
{
"activity": {
"type": type,
"id": activity id,
"subject": subject,
"caseId": case id,
"customerId": customer id,
"subType": activity sub type
},
}channelavailabilitychanged
Fires when an agent channel (chat/videochat/email/social/phone) status is changed
Payload
{
"activity": {
"type": type,
"value": true or false
"status": success or fail
"reasonCode": reason code id
},
}incomingCall
Fires when call is coming in
Payload
{
callId: callId
}callPaused
Fires when call is paused
Payload
{
callId: callId
}callResumed
Fires when call is resumed
Payload
{
callId: callId
}callEnded
Fires when call ends
Payload
{
activityId: activityId,
callId: callId
}callHold
Fires when call is put on hold
Payload
{
activityId: activityId,
callId: callId
}callToggled
Fires when toggling between calls
Payload
{
activityId: activityId,
primaryCallInProgress: primaryCallInProgress,
primaryCallId: primaryCallId,
secondaryCallInProgress: secondaryCallInProgress,
secondaryCallId: secondaryCallId
}callsMerged
Fires when primary and secondary call are merged
Payload
{
activityId: activityId,
primaryCallId: primaryCallId,
secondaryCallId: secondaryCallId
}leaveConference
Fires when leaving conference call
Payload
{
callId: callId
}triggerphoneavailability
Trigger phone availability
Payload
{
name: 'phone',
value: true or false,
reasonCode: reasonCode
}Events Subscribed by Solve Advisor
The following events are subscribed by the Advisor Desktop. Third party UI can publish these events using the Advisor Desktop Widget Event library to build custom functionality.
addtoeditor
Publish event to add content to Advisor Desktop editor of currently selected activity.
egainSolve.init(function(){
egainSolve.publish('addtoeditor', {
content: "<b>Hello world</b>"
});
});Here is an example of a response
{
content: content to add to editor
}showtoast
Publish event to show a toast notification.
egainSolve.init(function(){
egainSolve.publish('showtoast', {
content: "<b>Hello world</b>"
});
});Response example
{
title: title of toast,
html: html content of toast,
width: width of toast. Defaults to 280 px,
cls: any classes to be applied to toast. Default to eg-guidance-toast,
autoClose: Auto close toast or not. Applicable only if autoCloseDelay not set
autoCloseDelay: delay in seconds before toast closes,
align: Extjs alignment string to align toast. Defaults to 'br' meaning bottom right,
stickOnClick: make toast sticky on click. Default to false,
}cleartoast
Publish event to clear all previously shown toasts if still visible.
egainSolve.init(function(){
egainSolve.publish('cleartoast', {
content: "<b>Hello world</b>"
});
});refreshmaininbox
Publish event to refresh main inbox on Advisor Desktop.
egainSolve.init(function(){
egainSolve.publish('refreshmaininbox', {
content: "<b>Hello world</b>"
});
});refreshchatinbox
Publish event to refresh chat inbox on Advisor Desktop.
egainSolve.init(function(){
egainSolve.publish('refreshchatinbox', {
content: "<b>Hello world</b>"
});
});refreshactivitypane
Publish event to refresh activity pane on Advisor Desktop.
egainSolve.init(function(){
egainSolve.publish('refreshactivitypane', {
content: "<b>Hello world</b>"
});
});refreshcasepane
Publish event to refresh case pane on Advisor Desktop.
egainSolve.init(function(){
egainSolve.publish('refreshcasepane', {
content: "<b>Hello world</b>"
});
});refreshcustomerpane
Publish event to refresh customer pane on Advisor Desktop.
egainSolve.init(function(){
egainSolve.publish('refreshcustomerpane', {
content: "<b>Hello world</b>"
});
});selectactivity
Select an activity in the inbox
{
"type": type of activity (email, chat, etc.),
"activity": {"id":Id of activity}
}openctiwidget
Launch CTI Widget
closectiwidget
Close CTI Widget
changeavailabilitystate
Change agent availability state (chat/videochat/email/phone)
{
"type": type, (chat/videochat/email/phone)
"status": true or false (enable/disable)
"reasonCode": reason code id
}aftertriggerphoneavailability
Event to change phone UI button from 3rd party system
{
"type": 'phone',
"value": true or false
"status": true or false (enable/disable)
}Callbacks Available
These callbacks can be called on the object 'egainSolve' to fetch specific data actively.
getCurrentActivityData
Publish event to show a toast notification
egainSolve.getCurrentActivityData(function(message){
var data = message.data;
});Returned Data Example of getCurrentActivityData callback
{
"type": "email",
"id": 1850,
"subject": "sup [#1719]",
"caseId": 1719,
"customerId": 1007
}getActivityReplyData
Publish event to show a toast notification
egainSolve.getActivityReplyData(function(message){
var data = message.data;
});Returned Data Example of getActivityReplyData callback
{
"activity": {
"type": "email",
"id": 1850,
"subject": "sup [#1719]",
"caseId": 1719,
"customerId": 1007
},
"fields": [
{
"name": "from_email_address",
"value": "kushal01@egain-corp.com",
"dirty": true,
"displayValue": "kushal01@egain-corp.com"
},
{
"name": "to_email_address",
"value": [
"kkhandelwal@egain.com"
],
"dirty": true,
"displayValue": [
"kkhandelwal@egain.com"
]
},
{
"name": "cc_email_address",
"value": [],
"dirty": false
},
{
"name": "subject",
"value": "sup [#1719]",
"dirty": true
},
{
"name": "actcust",
"value": "",
"custom": true,
"dirty": false
},
{
"name": "actmul",
"value": null,
"custom": true,
"dirty": false
},
{
"name": "delay_time_in_min",
"value": null,
"dirty": false
},
{
"name": "maxlength",
"value": null,
"custom": true,
"dirty": false
},
{
"name": "prasad1",
"value": "",
"custom": true,
"dirty": false
},
{
"name": "prasad2",
"value": "aaa",
"custom": true,
"dirty": false
},
{
"name": "testattr",
"value": "testing",
"custom": true,
"dirty": false
},
{
"name": "group_name",
"value": "",
"custom": true,
"dirty": false
}
]
}getAgentAvailabilityData
Event to get agent availability data
egainSolve.getAgentAvailabilityData(function(message){
var data = message.data;
});Returned Data Example of getCurrentActivityData callback
{
"chat": true,
"videochat": false,
"mail": false
}Test Sample showing use of the Advisor Desktop Widget Event API
<!DOCTYPE html>
<html>
<head>
<script src="/system/web/apps/resources/js/egainremotesolve.js" type="text/javascript"></script>
</head>
<body>
<p id ="demo" type="text/javascript">test</p>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
var counter = 1;
egainSolve.init(function(){
//subscribe to all events
var listener = egainSolve.subscribeAll(function(message){
document.getElementById("demo").innerHTML = (counter++) +" "+message.type
})
//listener will get destroyed if called unsubscribeAll
//listener .unsubscribeAll();
//var listener2 = egainSolve.subscribe('chatmessage', function(message){
// document.getElementById("demo").innerHTML = (counter++) +" "+message.type+" chat message: "+message.data.content
//});
//listener will get destroyed if called
//listener2.unsubscribe();
});
function doMultiple(){
//add content to editor
egainSolve.publish('addtoeditor', {
content: "<p><b> this is a bold line</b><br> </p>"
});
//clear previous toast
egainSolve.publish('cleartoast');
//add a new toast with given config
egainSolve.publish('showtoast', {
html: "A new toast got added",
title: 'Toast Message',
autoClose: false
});
}
</script>
<p>
This is a new page;
</p>
<p>
<a onclick="doMultiple()">Click here to add to reply;</a>
</p>
</body>
</html>
...
## Remote Client
``` html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width">
<title>eGain Solve Advisor Desktop Messages Demo</title>
<!-- Include the JS which exposes utility methods for publishing and subscribing events to and from eGain Solve Desktop -->
<script src="http://localhost/system/web/apps/resources/js/egainremotesolve.js" type="application/javascript"></script>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #333333;
margin: 20px;
}
div.eventBox {
background-color: #e4e7f2;
border-radius: 3px;
margin: 16px auto;
max-width: 75%;
padding: 16px 20px;
transition: background-color 2s;
}
div.eventBox.latest {
background-color: #cff8f2;
}
div.eventBox .message-type {
font-weight: 700;
padding-right: 30px;
display: table-cell;
}
div.eventBox .message-data {
display: table-cell;
word-break: break-word;
padding-right: 0px;
}
div.eventBox .message-data p {
display: inline;
white-space: normal;
}
select:not([multiple]) {
padding: 5px;
margin-bottom: 10px;
}
option {
padding: 6px;
}
textarea {
width: 100%;
padding: 10px;
margin-right: 40px;
box-sizing: border-box;
resize: vertical;
}
fieldset {
padding: 20px;
margin-bottom: 20px;
}
legend {
font-weight: 700;
}
span {
display: table-cell;
padding-right: 30px;
}
</style>
</head>
<body>
<!--Messages - subscribe -->
<h2>Incoming Messages</h2>
<label for="eventTypesToSubscribe"> Choose the event types to subscribe to. </label><br><br>
<select id="eventTypesToSubscribe" multiple>
<option value="-1" selected>All</option>
<option value="activityselected">Activity Selection</option>
<option value="chatmessage">Chat Message Exchange</option>
<option value="chatcomplete">Chat Complete</option>
<option value="caseselected">Case Selection</option>
<option value="emailsend">Email Send</option>
<option value="emailsendandcomplete">Email Send And Complete</option>
<option value="folderchanged">Inbox Folder Change</option>
<option value="nonchatactivitysave">Non-Chat Activity Save</option>
<option value="nonchatcomplete">Non-Chat Activity Complete</option>
<option value="triggerphoneavailability">Trigger Phone Availability</option>
</select>
<!-- Clear - printed messages -->
<div id="clearEventsWrap">
<hr>
<button id="clearEvents">Clear</button>
</div>
<div id="allEvents"></div>
<hr>
<!-- Messages - publish -->
<h2>Publish Messages</h2>
<fieldset>
<!-- Add to reply - publish -->
<legend>Add to Reply Editor</legend>
<textarea rows="4" cols="50" id="contentToAdd" placeholder="Type HTML content here..."></textarea><br>
<button id="addContentToReply">Add</button><br>
</fieldset>
<fieldset>
<!-- Toast - publish -->
<legend>Show Toast Message</legend>
<span>Title</span><span><input id="toastTitle" type="text"></span><br>
HTML <textarea rows="4" cols="50" id="toastContent" placeholder="Type HTML content here..."></textarea><br>
<span>Auto close</span><span><input id="toastAutoClose" type="checkbox"></span><br>
<button id="showToast">Show</button><br>
</fieldset>
<fieldset>
<!-- Other Messages - publish -->
<legend>Refresh various parts of the Desktop</legend>
<select id="otherPublishEvents">
<option value="refreshmaininbox" selected>Refresh Main Inbox</option>
<option value="refreshchatinbox">Refresh Chat Inbox</option>
<option value="refreshactivitypane">Refresh Activity Pane</option>
<option value="refreshcasepane">Refresh Case Pane</option>
<option value="refreshcustomerpane">Refresh Customer Pane</option>
</select><br>
<button id="fireEvent">Publish</button><br>
</fieldset>
<div>
<hr>
<button id="getactivitydata">Get Activity Data</button>
</div>
<div id="privateevents"></div>
<script>
(function () {
var listeners = [],
selections = -1,
clearNotShown = true;
// Init
egainSolve.init(registerCallback);
function registerCallback() {
if (selections == -1) {
// Subscribe to all egain solve messages and the listener to an array.
listeners.push(egainSolve.subscribeAll(eventReceivedCallback));
}
}
/*----------------------------------------------------------------------------*/
// Messages - subscribe
// Drop down to choose for message types to subscribe to
var onSelectionChange = function (e) {
var values = Array.prototype.slice.call(document.querySelectorAll('#eventTypesToSubscribe option:checked'), 0).map(function (v, i, a) {
return v.value;
});
if (selections != values) {
selections = values;
unsubscribeAndSubscribe();
};
}
document.getElementById("eventTypesToSubscribe").addEventListener('change', onSelectionChange);
function unsubscribeAndSubscribe() {
for (i in listeners) {
if (listeners[i].unsubscribeAll) {
listeners[i].unsubscribeAll();
}
else if (listeners[i].unsubscribe) {
listeners[i].unsubscribe();
}
}
listeners = [];
if (selections == -1 || (selections.indexOf("-1") != -1)) {
// Subscribe to all egain solve messages and the listener to an array.
listeners.push(egainSolve.subscribeAll(eventReceivedCallback));
if (selections != -1) {
document.getElementById("eventTypesToSubscribe").selectedIndex = 0;
}
}
else {
for (var k in selections) {
listeners.push(egainSolve.subscribe(selections[k], eventReceivedCallback));
}
}
}
function eventReceivedCallback(message) {
// What to do when you receive a message
var div = document.createElement('div');
div.className = 'eventBox latest';
div.innerHTML = '<span class="message-type">' + message.type + '</span>' + (message.data ? ('<span class="message-data"><pre>' + JSON.stringify(message.data, null, 2) + '</pre></span>') : '');
document.getElementById("allEvents").prepend(div);
if (clearNotShown) {
showClear();
}
setTimeout(function () {
div.className = 'eventBox';
}, 500);
//postToWorker(message); // Also post to shared worker.
}
/*----------------------------------------------------------------------------*/
// Add to reply - publish
document.getElementById("addContentToReply").addEventListener('click', function () {
// Publish event to add HTML content to reply editor of the selected activity if present and allowed.
egainSolve.publish('addtoeditor', {
content: document.getElementById("contentToAdd").value
});
});
/*----------------------------------------------------------------------------*/
// Toast - publish
document.getElementById("showToast").addEventListener('click', function () {
// Remove existing toast
egainSolve.publish('cleartoast');
// Show a new toast
egainSolve.publish('showtoast', {
title: document.getElementById("toastTitle").value,
html: document.getElementById("toastContent").value,
autoClose: document.getElementById("toastAutoClose").value
});
});
/*----------------------------------------------------------------------------*/
// Other Messages - publish
document.getElementById("fireEvent").addEventListener('click', onOtherEventsPublish);
function onOtherEventsPublish() {
egainSolve.publish(document.getElementById("otherPublishEvents").value);
}
/*----------------------------------------------------------------------------*/
// Clear button to remove printed messages
hideClear(); // Hide intitially
document.getElementById("clearEvents").addEventListener('click', function () {
document.getElementById("allEvents").innerHTML = "";
hideClear();
});
function showClear() {
document.getElementById("clearEventsWrap").style.display = "block";
}
function hideClear() {
document.getElementById("clearEventsWrap").style.display = "none";
}
document.getElementById("getactivitydata").addEventListener('click', getActivityCall);
function getActivityCall(){
egainSolve.getCurrentActivityData(privateEventReceivedCallback);
}
function privateEventReceivedCallback(message) {
// What to do when you receive a message
var div = document.createElement('div');
div.className = 'eventBox latest';
div.innerHTML = '<span class="message-type">' + message.type + '</span>' + (message.data ? ('<span class="message-data"><pre>' + JSON.stringify(message.data, null, 2) + '</pre></span>') : '');
document.getElementById("privateevents").prepend(div);
setTimeout(function () {
div.className = 'eventBox';
}, 500);
//postToWorker(message); // Also post to shared worker.
}
/* Utility polifill */
(function (arr) {
arr.forEach(function (item) {
if (item.hasOwnProperty('prepend')) {
return;
}
Object.defineProperty(item, 'prepend', {
configurable: true,
enumerable: true,
writable: true,
value: function prepend() {
var argArr = Array.prototype.slice.call(arguments),
docFrag = document.createDocumentFragment();
argArr.forEach(function (argItem) {
var isNode = argItem instanceof Node;
docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
});
this.insertBefore(docFrag, this.firstChild);
}
});
});
})([Element.prototype, Document.prototype, DocumentFragment.prototype]);
})();
</script>
</body>
</html>
}
...