08-29-2024 09:03 AM
Hi,
Can you pleas support me here,
I need to create a finesse custom gadget that load a url (webpage) inserting the customer number.
I have sample screenpop gadget code from devnet portal, however it is about inbound calls where callvariable value is used to insert the customer number.
In my requirement scenario, we need to pop the url for outbound calls as well (dialer outbound - agent campaign) and if possible for manual outbound too.
Can you please suggest
08-29-2024 04:55 PM
Hi,
You should be able to modify the handleNewDialog method to pop the url for outbound calls. The handleNewDialog gets called every time there is a new call, whether that is inbound or outbound. You can probably filter on the callType.
Thanx,
Denise
08-30-2024 12:15 AM
Hi Denise,
Thanks for the reply,
How do I get the contact number for outbound call, which I need to insert in the loaded url
08-30-2024 04:42 AM - edited 08-30-2024 04:48 AM
Is there a reason why you don't use the builtin workflow in Finesse for this (if you only have to insert the customer number)
Make 2 workflows - 1 for inbound and 1 for outbound
On inbound the customer number is the FromAdresse and on outbound it is the DNIS
08-30-2024 04:54 AM
Hi Thomas,
Workflow to open a new browser tab?
Customer requirement is to load the webpage within finesse iframe as a gadget.
09-03-2024 08:18 AM
I'm a little rusty. I totally forgot that you can use the built in workflow to do this! Thanks for the reminder.
@Sinu , take a look at the documentation here: https://www.cisco.com/c/en/us/td/docs/voice_ip_comm/cust_contact/contact_center/finesse/finesse_1262/admin/guide/cfin_b_1262_cisco-finesse-administration-guide/cfin_m_1261-manage-workflows.html#task_3EAA554250740FFA3C4D9167F98F8F4F
08-30-2024 05:37 AM
make sense
For getting the customer Number on a outbound call you have to look at the dialog
Dialog - Finesse - Cisco DevNet
Dialog API Parameters - Finesse - Cisco DevNet
So if you calltype is ACD_IN the customer number is the fromAdresse, and if the callType is an oputbound calltype the customerNumber is toAdresse
function handleNewDialog(dialog) {
const callVars = dialog.getMediaProperties();
var calltype = callVars.callType();
var fromAdresse = dialog.fromAddress();
var toAdresse = dialog.toAddress();
var customerPhone = "";
if (calltype === "ACD_IN") {
customerPhone = fromAddress
} else if (calltype === "OUTBOUND") {
customerPhone = toAddress
}
}
use this code as inspiration (just made for inspiration - not tested)
08-30-2024 05:41 AM
and remember this in your userload :
function handleUserLoad(userevent) {
clientLogs.log("(UserLoad) In");
dialogs = user.getDialogs({
onCollectionAdd: handleNewDialog,
});
clientLogs.log("(UserLoad) Out");
}
and this in you init :
user = new finesse.restservices.User({
id: cfg.id,
onLoad: handleUserLoad,
});
08-30-2024 06:25 AM
Full example with the screenPop sample gadget :
var finesse = finesse || {};
finesse.gadget = finesse.gadget || {};
finesse.container = finesse.container || {};
clientLogs = finesse.cslogger.ClientLogger || {}; // for logging
/** @namespace */
finesse.modules = finesse.modules || {};
finesse.modules.SampleGadget = (function ($) {
var numDialogs = 0; // used to count the calls (dialogs)
var callvars = new Array(); // the callvars array of callvariables
var user, states, dialogs, clientLogs, customerPhone, calltype, fromAdresse, toAdresse,
/**
* Populates the fields in the gadget with data
*/
render = function () {
var currentState = user.getState();
// html is initially a div tag
var html = '<div>';
// for debugging you could print out the agent state and the number of calls (Dialogs)
//html += '<div id="agentstate"> The current state is: ' + user.getState() + '</div>';
//html += '<div id="dialogcount"> The number of dialogs is: ' + numDialogs + '</div>';
if (numDialogs==1) {
// if we were triggered by a new call (numDialogs==1) then set the html to the url we want to pop in the iframe
// build the url by adding the callvariable 1 into the search parameter
html += '<iframe src="https://youUrl?customerPhone=' + customerPhone + '" width="100%" height="650"> </iframe>';
// comment out the above line and uncomment the line below to change the search engine to bing
// Note: google search won't allow an iframe, yahoo search has errors too
//html += '<iframe src="https://www.bing.com/search?q=' + callvars["callVariable1"] + '" width="100%" height="650"> </iframe>';
// add the closing </div> html element
html += '</div>';
clientLogs.log("render(): HTML is: " + html); // for debugging
//set the html document's agentout element (see the html after the /script tag) to the html we want to render
$('#agentout').html(html);
// automatically adjust the height of the gadget to show the html
gadgets.window.adjustHeight();
} else {
// we don't have a call yet
html += 'Screen Pop Goes here';
html += '</div>';
//set the html document's agentout element to the html we want to render
$('#agentout').html(html);
// automatically adjust the height of the gadget to show the html
gadgets.window.adjustHeight();
}
},
_processCall = function (dialog) {
// if here then callvar1 didnt show up on initial dialog
// get the latest callvariables
callvars = dialog.getMediaProperties();
clientLogs.log("_processCall(): callVariable1=" + callvars["callVariable1"]);
render();
},
/**
* Handler for additions to the Dialogs collection object. This will occur when a new
* Dialog is created on the Finesse server for this user.
*/
handleNewDialog = function(dialog) {
// increment the number of dialogs
numDialogs++;
// get the call variable data from the dialog
// dialog.getMediaProperties() returns an array of properties
callvars = dialog.getMediaProperties();
calltype = callVars.callType();
fromAdresse = dialog.getFromAddress();
toAdresse = dialog.getToAddress();
customerPhone = "";
if (calltype === "ACD_IN") {
customerPhone = fromAddress
} else if (calltype === "OUTBOUND") {
customerPhone = toAddress
}
clientLogs.log("handleNewDialog(): callVariable1="+callvars["callVariable1"]);
// if callVariable1 is null then add a handler for subsequent dialog events
// where the call data will have been updated
if (callvars["callVariable1"] == null) {
dialog.addHandler('change', _processCall);
} else {
// render the html in the gadget
clientLogs.log("handleNewDialog(): rendering dialog");
render();
}
},
/**
* Handler for deletions from the Dialogs collection object for this user. This will occur
* when a Dialog is removed from this user's collection (example, end call)
*/
handleEndDialog = function(dialog) {
// decrement the number of dialogs
numDialogs--;
// render the html in the gadget
render();
},
/**
* Handler for the onLoad of a User object. This occurs when the User object is initially read
* from the Finesse server. Any once only initialization should be done within this function.
*/
handleUserLoad = function (userevent) {
// Get an instance of the dialogs collection and register handlers for dialog additions and
// removals
dialogs = user.getDialogs({
onCollectionAdd : handleNewDialog,
onCollectionDelete : handleEndDialog
});
render();
},
/**
* Handler for all User updates
*/
handleUserChange = function(userevent) { };
/** @scope finesse.modules.SampleGadget */
return {
/**
* Performs all initialization for this gadget
*/
init : function () {
var cfg = finesse.gadget.Config;
clientLogs = finesse.cslogger.ClientLogger; // declare clientLogs
gadgets.window.adjustHeight();
// Initiate the ClientServices and the logger and then load the user object. ClientServices are
// initialized with a reference to the current configuration.
finesse.clientservices.ClientServices.init(cfg, false);
// Initiate the ClientLogs. The gadget id will be logged as a part of the message
clientLogs.init(gadgets.Hub, "ScreenPop", finesse.gadget.Config);
user = new finesse.restservices.User({
id: cfg.id,
onLoad : handleUserLoad,
onChange : handleUserChange
});
states = finesse.restservices.User.States;
// Initiate the ContainerServices and add a handler for when the tab is visible
// to adjust the height of this gadget in case the tab was not visible
// when the html was rendered (adjustHeight only works when tab is visible)
containerServices = finesse.containerservices.ContainerServices.init();
containerServices.addHandler(finesse.containerservices.ContainerServices.Topics.ACTIVE_TAB, function() {
clientLogs.log("Gadget is now visible"); // log to Finesse logger
// automatically adjust the height of the gadget to show the html
gadgets.window.adjustHeight();
});
containerServices.makeActiveTabReq();
}
};
}(jQuery));
08-30-2024 06:37 AM
Thanks So much Thomas!!!
I will try this and share with you the feedback
09-02-2024 10:13 PM - edited 10-02-2024 08:57 PM
.
09-03-2024 08:19 AM
Hi,
For a single call, there can be more than one event. It is possible that the toAddress has not been populated yet. You need to throw away the events that are null and wait for it to be populated. I suggest watching the events coming in to verify this is the case.
Thanx,
Denise
09-24-2024 10:53 PM - edited 10-02-2024 08:57 PM
.
09-05-2024 12:12 AM
I understand you're looking to create a Finesse custom gadget that loads a URL with the customer's number, not just for inbound calls but also for outbound scenarios, including dialer outbound and manual outbound calls.
As a Cisco Solution Plus vendor, 2Ring offers a range of Finesse gadgets designed to be highly customizable to meet various requirements, including the use case you described. We provide solutions that can dynamically generate URLs using call data, such as the customer number, for both inbound and outbound calls.
For your specific scenario, we can offer a solution that supports: https://developer.cisco.com/ecosystem/cpp/solutions/161953/
If you would like more information on how our Finesse gadgets can address your needs or discuss your requirements in more detail, please feel free to reach out to me directly. I'd be happy to assist you further.
2Ring is on CCW / Cisco’s Price List (Solutions Plus) so all of our products can be purchased directly through Cisco via CCW-Solutions Plus under 2RING-APPS.
Looking forward to hearing from you!
Marco
Discover and save your favorite ideas. Come back to expert answers, step-by-step guides, recent topics, and more.
New here? Get started with these tips. How to use Community New member guide