view.popup.watch being fired twice

[EvonFranklin]

I am attempting to display my own custom popup when a user clicks on the MapImageLayer with the following code:

view.popup.watch("visible", function(visible) {
                view.popup.visible = false;
                if(visible){
                   var attr = view.popup.features[0].attributes;
                   $('.popup-table-container').remove();
                   var newPopup = formatPopup(attr);
                   $('body').append(newPopup);
                   $(newPopup).css({top: ($(window).height()/2)+'px',left: ($(window).width()/2)+'px'});
                }
            });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I try to close the default popup in the first line then second line I actually populate my own. I would like to stop this event from being fired twice with a single click, as a query is made twice which slows down the popup processing.

[RobertScheitlin__GISP]

Evon,

   You should use watchUtils and whenTrue:

watchUtils | API Reference | ArcGIS API for JavaScript 4.3 

That way you do not get your event handler fired when you set the popup visibility to false.

[EvonFranklin]

Thanks for the suggestion, I think this would work however I do want to watch for a popup not really an event per say

[RobertScheitlin__GISP]

??? The method I suggested is no different from what you are doing but only looking for a true property instead of true or false.

[EvonFranklin]

Right I misunderstood there a bit lol, well is the whenTrue() available from "view.popup" ?

[RobertScheitlin__GISP]

Evon,

   No there is not, that is the reason for a watchUtils class.

[EvonFranklin]

What action would I watch for in watchutils ?

[RobertScheitlin__GISP]

You would watch for the open property just like you were in your original code.

[EvonFranklin]

Oh I see now, like this ,

watchUtils.whenTrue(view, "visible", function() {

[RobertScheitlin__GISP · Accepted solution]

Almost:

watchUtils.whenTrue(view.popup, "visible", function() {‍