Pesky InfoWindow and the Editor Toolbar

[SteveCole]

I'm trying to add some additional functionality into an application of mine. In my current application, a user has the ability to draw a point, line, or freehand polygon, and the resulting graphic is stored in a GraphicLayer. If they mess up their sketch,  they have to start over. I'm now trying to enhance this so that they can simply modify their original sketch. I'm modeling that enhancement after this sample where a user double-clicks on the graphic and then the vertices appear and are moveable.

The good news is that I have the basic coding down but I have a slight issue. The GraphicsLayer has an InfoWindow template defined and whenever you double click a graphic to edit or save your edits, the infoWindow pops up. I'm having trouble figuring out where to stop this behavior. I've managed to package up the essential aspects of what I described into a JSFiddle here.

Thoughts? Ideas?

Thanks!

Steve

[KellyHutchins · Accepted solution]

You can use the map's setInfoWindowOnClick method to show/hide the info window when the map is clicked.  Here's a bit of code that shows how this works. Basically when a graphic is clicked if editing is enabled I show the window. When someone double-clicks a graphic I set the SetInfoWindowOnClick method to false so the popup no longer displays.

        theGLayer.on("click", function(evt){
          if(editingEnabled === false){
            map.setInfoWindowOnClick(true);
          }
        });
        theGLayer.on("dbl-click", function(evt) {
            event.stop(evt);
            if (editingEnabled === false) {
              editingEnabled = true;
              editToolbar.activate(Edit.EDIT_VERTICES , evt.graphic);
              map.setInfoWindowOnClick(false);
            } else {
              editToolbar.deactivate();
              editingEnabled = false;
            }
          });

[SteveCole]

Thanks, Kelly! That did the trick.

[SteveCole]

Kelly Hutchins​

Ugh. Is there anything in this code base/example that would prevent it from working under legacy Dojo and a previous API version (3.4 to be exact)? I'm trying to add this to an application that is legacy based and API v3.4 but it throws an error as you try to edit the vertices. Here's a legacy version of my original Fiddle. I tried laying it out in the same manner as the AMD version I originally linked.

Depending on which browser you use, you get an error after you double click your sketch:

"Uncaught TypeError: Cannot read property 'add' of null" (Chrome)

"TypeError: this._scratchGL is null" (Firefox)

Both errors point to vertexMover.js, line 19.

I know the app should migrate to AMD but it's got a half dozen JS files and I still haven't been able to wrap my brain around migrating something that large an complex. Anyways, I used AMD in my pared down example because that's what all the current examples/docs are based on (path of least resistance).

Steve

[KellyHutchins]

The setInfoWindowOnClick method wasn't added until version 3.10 of the JSAPI so that method won't work at version 3.4.  Have you thought about  updating your app to the current release and leaving it in the legacy style?

[SteveCole]

Man- I keep forgetting that you can still do that with the current API versions! That took care of the problem, both in my pared down Fiddle and my application. Thanks again!

[KellyHutchins]

Excellent glad it worked!