Simplify events and store listeners only in one place

src/ol/interaction/DragAndDrop.js

@@ -188,12 +188,13 @@ class DragAndDrop extends Interaction {
    * @inheritDoc
    */
   setActive(active) {
-    super.setActive(active);
-    if (active) {
+    if (!this.getActive() && active) {
       this.registerListeners_();
-    } else {
+    }
+    if (this.getActive() && !active) {
       this.unregisterListeners_();
     }
+    super.setActive(active);
   }
 
   /**

src/ol/interaction/Draw.js

@@ -7,7 +7,6 @@ import MapBrowserEventType from '../MapBrowserEventType.js';
 import MapBrowserPointerEvent from '../MapBrowserPointerEvent.js';
 import {getChangeEventType} from '../Object.js';
 import {squaredDistance as squaredCoordinateDistance} from '../coordinate.js';
-import {listen} from '../events.js';
 import Event from '../events/Event.js';
 import {noModifierKeys, always, shiftKeyOnly} from '../events/condition.js';
 import {boundingExtent, getBottomLeft, getBottomRight, getTopLeft, getTopRight} from '../extent.js';
@@ -448,9 +447,7 @@ class Draw extends PointerInteraction {
         options.freehandCondition : shiftKeyOnly;
     }
 
-    listen(this,
-      getChangeEventType(InteractionProperty.ACTIVE),
-      this.updateState_, this);
+    this.addEventListener(getChangeEventType(InteractionProperty.ACTIVE), this.updateState_);
 
   }
 

src/ol/interaction/Modify.js

@@ -8,7 +8,6 @@ import Feature from '../Feature.js';
 import MapBrowserEventType from '../MapBrowserEventType.js';
 import {equals} from '../array.js';
 import {equals as coordinatesEqual, distance as coordinateDistance, squaredDistance as squaredCoordinateDistance, squaredDistanceToSegment, closestOnSegment} from '../coordinate.js';
-import {listen, unlisten} from '../events.js';
 import Event from '../events/Event.js';
 import EventType from '../events/EventType.js';
 import {always, primaryAction, altKeyOnly, singleClick} from '../events/condition.js';
@@ -158,6 +157,9 @@ class Modify extends PointerInteraction {
 
     super(/** @type {import("./Pointer.js").Options} */ (options));
 
+    /** @private */
+    this.boundHandleFeatureChange_ = this.handleFeatureChange_.bind(this);
+
     /**
      * @private
      * @type {import("../events/condition.js").Condition}
@@ -299,10 +301,8 @@ class Modify extends PointerInteraction {
     if (options.source) {
       this.source_ = options.source;
       features = new Collection(this.source_.getFeatures());
-      listen(this.source_, VectorEventType.ADDFEATURE,
-        this.handleSourceAdd_, this);
-      listen(this.source_, VectorEventType.REMOVEFEATURE,
-        this.handleSourceRemove_, this);
+      this.source_.addEventListener(VectorEventType.ADDFEATURE, this.handleSourceAdd_.bind(this));
+      this.source_.addEventListener(VectorEventType.REMOVEFEATURE, this.handleSourceRemove_.bind(this));
     } else {
       features = options.features;
     }
@@ -317,10 +317,8 @@ class Modify extends PointerInteraction {
     this.features_ = features;
 
     this.features_.forEach(this.addFeature_.bind(this));
-    listen(this.features_, CollectionEventType.ADD,
-      this.handleFeatureAdd_, this);
-    listen(this.features_, CollectionEventType.REMOVE,
-      this.handleFeatureRemove_, this);
+    this.features_.addEventListener(CollectionEventType.ADD, this.handleFeatureAdd_.bind(this));
+    this.features_.addEventListener(CollectionEventType.REMOVE, this.handleFeatureRemove_.bind(this));
 
     /**
      * @type {import("../MapBrowserPointerEvent.js").default}
@@ -343,8 +341,7 @@ class Modify extends PointerInteraction {
     if (map && map.isRendered() && this.getActive()) {
       this.handlePointerAtPixel_(this.lastPixel_, map);
     }
-    listen(feature, EventType.CHANGE,
-      this.handleFeatureChange_, this);
+    feature.addEventListener(EventType.CHANGE, this.boundHandleFeatureChange_);
   }
 
   /**
@@ -371,8 +368,7 @@ class Modify extends PointerInteraction {
       this.overlay_.getSource().removeFeature(this.vertexFeature_);
       this.vertexFeature_ = null;
     }
-    unlisten(feature, EventType.CHANGE,
-      this.handleFeatureChange_, this);
+    feature.removeEventListener(EventType.CHANGE, this.boundHandleFeatureChange_);
   }
 
   /**

src/ol/interaction/Select.js

@@ -4,7 +4,6 @@
 import {getUid} from '../util.js';
 import CollectionEventType from '../CollectionEventType.js';
 import {extend, includes} from '../array.js';
-import {listen} from '../events.js';
 import Event from '../events/Event.js';
 import {singleClick, never, shiftKeyOnly, pointerMove} from '../events/condition.js';
 import {TRUE} from '../functions.js';
@@ -254,10 +253,8 @@ class Select extends Interaction {
     this.featureLayerAssociation_ = {};
 
     const features = this.getFeatures();
-    listen(features, CollectionEventType.ADD,
-      this.addFeature_, this);
-    listen(features, CollectionEventType.REMOVE,
-      this.removeFeature_, this);
+    features.addEventListener(CollectionEventType.ADD, this.addFeature_.bind(this));
+    features.addEventListener(CollectionEventType.REMOVE, this.removeFeature_.bind(this));
   }
 
   /**

src/ol/interaction/Translate.js

@@ -3,7 +3,6 @@
  */
 import Collection from '../Collection.js';
 import {getChangeEventType} from '../Object.js';
-import {listen} from '../events.js';
 import Event from '../events/Event.js';
 import {TRUE} from '../functions.js';
 import {includes} from '../array.js';
@@ -165,9 +164,7 @@ class Translate extends PointerInteraction {
      */
     this.lastFeature_ = null;
 
-    listen(this,
-      getChangeEventType(InteractionProperty.ACTIVE),
-      this.handleActiveChanged_, this);
+    this.addEventListener(getChangeEventType(InteractionProperty.ACTIVE), this.handleActiveChanged_);
 
   }