Cisco ScreenPop gadget: how to open a popup only when the call starts and not also when the call ends?

[floatingpurr]

I'm using the default screenPop.js but instead of opening an iframe I want to open a custom url based on call variables with:

window.open(myUrl);

All works fine, however sometimes when the agent presses the end button, another identical popup is triggered. I logged the user.getState() and, in those cases, the user is still in the Talking state unless she has already pressed the end button.

Is there a way to avoid this?

window.open(

[dekwan]

Hi,

Can you clarify the condition where you are using the window.open. Also when you say "another identical popup is triggered", are you seeing that the code is being executed twice? I would recommend using your browser's developer tools with a breakpoint to see what is happening.

Thanx,

Denise

[floatingpurr]

Hi @dekwan thanks for your attention. This is a quick excerpt of my code

//other stuff from ScreenPop.js

console.log(user.getState());

if (numDialogs==1 && user.getState() == 'TALKING') { //not sure if condition user.getState() == 'TALKING' can be useful here

// set the url according to the call variables

window.open(url);

}
// etc...

I haven't inserted a breakpoint but sometimes (quite often) this code is executed also when the user ends the call and then, yes, the popup is opened twice.

[dekwan]

Hi,

Which handler is this code located? Remember that multiple events can happen for one action. So it is probably triggering this code more than once because the if condition is the same for both events.

Thanx,

Denise

[floatingpurr]

Hi Denise,

    let me provide you w/ more context. I simply started from the archive ScreenPopSampleGadget-Finesse-10.6.1-v1.0 of your GitHub repo and I inserted the window.open() in place of the iframe definition.

I'm new to Finesse Gadgets and I wondered that was enough. Going through the code, I just put my code in the following function expression:

    render = function () {
        var currentState = user.getState();
		// html is initially blank
        var html = '';
        // add a div tag to the html
        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) {
                        
                        
                        var url = 'http://example.com?q=' + callvars['BAAccountNumber'];
                        window.open(url);
		
			// 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="http://www.dogpile.com/info.dogpl/search/web?fcoid=417&fcop=topnav&fpid=27&q=' + callvars["callVariable1"] +  '" width="100%" height="650"> </iframe>';
			// comment out the above line and uncomment the line below to change the search engine to bing
			//html += '<iframe src="http://www.bing.com/search?q=' + callvars["callVariable1"] +  '" width="100%" height="650"> </iframe>';
			// note: google search won't allow an iframe, yahoo search has errors too

		
			// add the closing </div> html element
		html += '</div>';
		
		clientLogs.log(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();

	    }
         
        
        
    },

Am I doing something wrong?

Thanks!

[dekwan]

Hi,

The render function gets called in multiple places. During an end call, more than one of those places gets called and therefore the render function is called more than one time. If you want to only have it called for one particular scenario, you will need to decouple the function that executes the popup to be specific to that scenario.

To better understand how the gadget works, I'd suggest using breakpoints in the browser's developer tools.

Thanx,

Denise

[floatingpurr]

Ok, thanks, I will.

In order to start from a working example, I would really appreciate if you could suggest me what kind of handler configuration I should use, if I just want to open a simple pop up, exactly as it happens with the browser pop workflow.

[dekwan]

Hi,

If you scenario is only when the call ends, you need to isolate the execution of the code to when the call ends, so it should be handleEndDialog. I suggest going through the Learning sample gadget to understand the different handlers: https://github.com/CiscoDevNet/finesse-sample-code/tree/master/LearningSampleGadget

Thanx,

Denise

[floatingpurr]

No, I just want to open a popup only when the call starts (I've just clarified it in the main question title). With the code I posted above, this happens but sometimes the same popup is reopened also upon the end of the call and I'd like to avoid this,

Anyway, I'll go over your link and I'll try to figure out what I need.

Thanks

[dekwan · Accepted solution]

Hi,

If you want it when the call starts, then you need to put the code in handleNewDialog because that one gets triggered only when there is a new call.

Either way, I think it would be good for you to go through the learning sample gadget to get a better understanding on all of the different handlers.

Thanx,

Denise

[floatingpurr]

I'll check this out. Thanks for your kind support!