Stuck in Pan Mode after long pressing the map

BrianBeck

Is it possible to handle a long press on the map?  I am trying to develop an interface where clicking on a feature on the map will open the attribute editor and long pressing on a feature will enable edit mode so the user can move the feature.

I have code that should do this:

var timer;
    on(this.map, "mouse-down", lang.hitch(this, function(e) {
        timer = setTimeout(lang.hitch(this, function() {
            this.selectFeatures(e.screenPoint).then(lang.hitch(this.editor, this.editor.moveFeature));
        }), 5*1000);
    }));

    on(this.map, "mouse-up", function(e) {
        clearTimeout(timer);
    });

When I long press the map the map somehow goes into pan mode and without clicking the mouse, wherever I move the cursor the map pans with it.  In other words, wherever I long pressed on the map will remain under the cursor wherever I move the cursor on the map.

From what I can tell, my code is also working, but with this additional side effect.  The only way I have found to get out of pan mode is to refresh the page.

I have seen other posts related to similar behavior of pan mode, but they are all limited to IE.  I am seeing this in Chrome.

JasonZou

The issue is because the map is in navigation mode by default, so when you press down the mouse key, the map responds with PAN operation. What you can do is to disable the map navigation when the user long presses the feature of a feature layer, and enable it once you finish handling the event.

In addition, I would define the onMouseDown event handler against the feature layer instead of the map. Here is the code sample assuming the featureLayer created somewhere else.

    var timer, isPan = this.map.isPan;
    on(this.featureLayer, "mouse-down", lang.hitch(this, function(e) {
        timer = setTimeout(lang.hitch(this, function() {
            isPan && this.map.disablePan();

            this.selectFeatures(e.screenPoint).then(lang.hitch(this.editor, this.editor.moveFeature));
        }), 5*1000);
    }));

    on(this.featureLayer, "mouse-up", function(e) {
        clearTimeout(timer);
        isPan && this.map.enablePan();
    });