Fix modify event trigger order, should trigger modifystart before any modification and modifyend last.

src/ol/interaction/modifyinteraction.js

@@ -10,6 +10,7 @@ goog.require('ol.Collection');
 goog.require('ol.CollectionEventType');
 goog.require('ol.Feature');
 goog.require('ol.MapBrowserEvent.EventType');
+goog.require('ol.MapBrowserPointerEvent');
 goog.require('ol.ViewHint');
 goog.require('ol.coordinate');
 goog.require('ol.events.condition');
@@ -149,6 +150,12 @@ ol.interaction.Modify = function(options) {
    */
   this.ignoreNextSingleClick_ = false;
 
+  /**
+   * @type {boolean}
+   * @private
+   */
+  this.modified_ = false;
+
   /**
    * Segment RTree for each layer
    * @type {Object.<*, ol.structs.RBush>}
@@ -249,6 +256,19 @@ ol.interaction.Modify.prototype.addFeature_ = function(feature) {
 };
 
 
+/**
+ * @param {ol.MapBrowserPointerEvent} evt Map browser event
+ * @private
+ */
+ol.interaction.Modify.prototype.willModifyFeatures_ = function(evt) {
+  if (!this.modified_) {
+    this.modified_ = true;
+    this.dispatchEvent(new ol.ModifyEvent(ol.ModifyEventType.MODIFYSTART,
+        this.features_, evt));
+  }
+};
+
+
 /**
  * @param {ol.Feature} feature Feature.
  * @private
@@ -531,6 +551,7 @@ ol.interaction.Modify.compareIndexes_ = function(a, b) {
 ol.interaction.Modify.handleDownEvent_ = function(evt) {
   this.handlePointerAtPixel_(evt.pixel, evt.map);
   this.dragSegments_ = [];
+  this.modified_ = false;
   var vertexFeature = this.vertexFeature_;
   if (!goog.isNull(vertexFeature)) {
     var insertVertices = [];
@@ -575,11 +596,12 @@ ol.interaction.Modify.handleDownEvent_ = function(evt) {
         insertVertices.push([segmentDataMatch, vertex]);
       }
     }
+    if (insertVertices.length) {
+      this.willModifyFeatures_(evt);
+    }
     for (i = insertVertices.length - 1; i >= 0; --i) {
       this.insertVertex_.apply(this, insertVertices[i]);
     }
-    this.dispatchEvent(new ol.ModifyEvent(ol.ModifyEventType.MODIFYSTART,
-        this.features_, evt));
   }
   return !goog.isNull(this.vertexFeature_);
 };
@@ -592,6 +614,7 @@ ol.interaction.Modify.handleDownEvent_ = function(evt) {
  */
 ol.interaction.Modify.handleDragEvent_ = function(evt) {
   this.ignoreNextSingleClick_ = false;
+  this.willModifyFeatures_(evt);
 
   var vertex = evt.coordinate;
   for (var i = 0, ii = this.dragSegments_.length; i < ii; ++i) {
@@ -653,8 +676,11 @@ ol.interaction.Modify.handleUpEvent_ = function(evt) {
     this.rBush_.update(ol.extent.boundingExtent(segmentData.segment),
         segmentData);
   }
-  this.dispatchEvent(new ol.ModifyEvent(ol.ModifyEventType.MODIFYEND,
-      this.features_, evt));
+  if (this.modified_) {
+    this.dispatchEvent(new ol.ModifyEvent(ol.ModifyEventType.MODIFYEND,
+        this.features_, evt));
+    this.modified_ = false;
+  }
   return false;
 };
 
@@ -668,6 +694,10 @@ ol.interaction.Modify.handleUpEvent_ = function(evt) {
  * @api
  */
 ol.interaction.Modify.handleEvent = function(mapBrowserEvent) {
+  if (!(mapBrowserEvent instanceof ol.MapBrowserPointerEvent)) {
+    return true;
+  }
+
   var handled;
   if (!mapBrowserEvent.map.getView().getHints()[ol.ViewHint.INTERACTING] &&
       mapBrowserEvent.type == ol.MapBrowserEvent.EventType.POINTERMOVE &&
@@ -681,7 +711,11 @@ ol.interaction.Modify.handleEvent = function(mapBrowserEvent) {
       var geometry = this.vertexFeature_.getGeometry();
       goog.asserts.assertInstanceof(geometry, ol.geom.Point,
           'geometry should be an ol.geom.Point');
+      this.willModifyFeatures_(mapBrowserEvent);
       handled = this.removeVertex_();
+      this.dispatchEvent(new ol.ModifyEvent(ol.ModifyEventType.MODIFYEND,
+          this.features_, mapBrowserEvent));
+      this.modified_ = false;
     } else {
       handled = true;
     }