ol 10.6.2-dev.1752510546973 → 10.6.2-dev.1752570595686

package/interaction/Extent.d.ts

@@ -24,6 +24,17 @@ export type Options = {
      * Default is {@link module :ol/events/condition.always}.
      */
     condition?: import("../events/condition.js").Condition | undefined;
+    /**
+     * A function that
+     * takes a {@link module :ol/MapBrowserEvent~MapBrowserEvent} and returns a
+     * boolean to indicate whether that event should be handled to create a new extent.
+     * If `null`, the `condition` will also be used as `createCondition`.
+     */
+    createCondition?: import("../events/condition.js").Condition | null | undefined;
+    /**
+     * An extent can be dragged.
+     */
+    drag?: boolean | undefined;
     /**
      * Initial extent. Defaults to no
      * initial extent.
@@ -72,7 +83,8 @@ import Event from '../events/Event.js';
  * @classdesc
  * Allows the user to draw a vector box by clicking and dragging on the map.
  * Once drawn, the vector box can be modified by dragging its vertices or edges.
- * This interaction is only supported for mouse devices.
+ * The interaction can also be configured with an initial extent and a `createCondition`
+ * to prevent the creation of a new extent on `pointerdown`, if desired.
  *
  * @fires ExtentEvent
  * @api
@@ -100,6 +112,16 @@ declare class Extent extends PointerInteraction {
      * @private
      */
     private condition_;
+    /**
+     * @type {import("../events/condition.js").Condition}
+     * @private
+     */
+    private createCondition_;
+    /**
+     * @type {boolean}
+     * @private
+     */
+    private drag_;
     /**
      * Extent of the drawn box
      * @type {import("../extent.js").Extent}
@@ -157,6 +179,7 @@ declare class Extent extends PointerInteraction {
     private snapToVertex_;
     /**
      * @param {import("../MapBrowserEvent.js").default} mapBrowserEvent pointer move event
+     * @return {boolean} The event was handled.
      * @private
      */
     private handlePointerMove_;
@@ -168,10 +191,16 @@ declare class Extent extends PointerInteraction {
     private createOrUpdateExtentFeature_;
     /**
      * @param {import("../coordinate.js").Coordinate} vertex location of feature
+     * @param {boolean} [createIfNotExists] create the feature if it does not exist
      * @return {Feature} vertex as feature
      * @private
      */
-    private createOrUpdatePointerFeature_;
+    private updatePointerFeature_;
+    /**
+     * Remove the vertex feature if it exists.
+     * @private
+     */
+    private noVertexFeature_;
     /**
      * Remove the interaction from its current map and attach it to the new map.
      * Subclasses may set up event handlers to get notified about changes to
@@ -192,6 +221,7 @@ declare class Extent extends PointerInteraction {
      *
      * @return {import("../extent.js").Extent} Drawn extent in the view projection.
      * @api
+     * @deprecated Use {@link module:ol/interaction/Extent~Extent#getExtent} instead.
      */
     getExtentInternal(): import("../extent.js").Extent;
     /**

package/interaction/Extent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Extent.d.ts","sourceRoot":"","sources":["Extent.js"],"names":[],"mappings":"AAsDA;;;;GAIG;AACH;IACE;;OAEG;IACH,oBAFW,OAAO,cAAc,EAAE,MAAM,EAWvC;IANC;;;;OAIG;IACH,QAHU,OAAO,cAAc,EAAE,MAAM,CAGnB;CAEvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAGY,CAAU,IAAqC,EAArC,OAAO,kBAAkB,EAAE,UAAU,KAAG,OAAO,cAAc,EAAE,MAAM;;;;8BAI/E,MAAM,IACN,OAAO,eAAe,EAAE,WAAW,CAAC,OAAO,eAAe,EAAE,UAAU,EAAE,OAAO,oBAAoB,EAAE,OAAO,EAAE,MAAM,CAAC,GACjI,OAAW,eAAe,EAAE,WAAW,CAAC,OAAO,oBAAoB,EAAE,KAAK,GAC1E,eAAqB,EAAE,OAAO,WAAW,EAAE,WAAW,EAAE,MAAM,CAAC,GAC/D,OAAW,eAAe,EAAE,WAAW,CAAC,eAAe,EAAE,WAAW,EAAE,MAAM,CAAC,GAC7E,OAAW,eAAe,EAAE,mBAAmB,CAAC,OAAO,eAAe,EAAE,UAAU,GAAC,OAAO,oBAAoB,EAAE,KAAK,GACrH,eAAqB,GAAC,eAAe,EAAE,MAAM,CAAC;kBA3E7B,oBAAoB;AAgEtC;;GAEG;AAEH;;;;;;;;GAQG;AAEH;;;;;;;;GAQG;AACH;IACE;;OAEG;IACH,sBAFW,OAAO,EAiHjB;IA1GC;;OAEG;IACH,IAFU,iBAAiB,CAAC,OAAO,WAAW,EAAE,SAAS,CAAC,CAEnD;IAEP;;OAEG;IACH,MAFU,iBAAiB,CAAC,OAAO,WAAW,EAAE,SAAS,CAAC,CAEjD;IAET;;OAEG;IACH,IAFU,iBAAiB,CAAC,IAAI,CAAC,CAE1B;IAEP;;;;OAIG;IACH,mBAAgE;IAEhE;;;;OAIG;IACH,gBAAmB;IAEnB;;;;OAIG;IACH,wBAA2B;IAE3B;;;;OAIG;IACH,wBACoE;IAEpE;;;;OAIG;IACH,yBAA6B;IAE7B;;;;OAIG;IACH,uBAA0B;IAE1B;;;;OAIG;IACH,uBAA0B;IAM1B;;;;OAIG;IACH,uBAUE;IAEF;;;;OAIG;IACH,uBAUE;IAOJ;;;;;OAKG;IACH,sBAmCC;IAED;;;OAGG;IACH,2BASC;IAED;;;;OAIG;IACH,qCAmBC;IAED;;;;OAIG;IACH,sCAWC;IAmHD;;;;;;OAMG;IACH,qBAHW,OAAO,WAAW,EAAE,OAAO,QAOrC;IAED;;;;;OAKG;IACH,aAHY,OAAO,cAAc,EAAE,MAAM,CAQxC;IAED;;;;;OAKG;IACH,qBAHY,OAAO,cAAc,EAAE,MAAM,CAKxC;IAED;;;;;OAKG;IACH,kBAHW,OAAO,cAAc,EAAE,MAAM,QAQvC;CACF;+BA1c8B,cAAc"}
+{"version":3,"file":"Extent.d.ts","sourceRoot":"","sources":["Extent.js"],"names":[],"mappings":"AA2DA;;;;GAIG;AACH;IACE;;OAEG;IACH,oBAFW,OAAO,cAAc,EAAE,MAAM,EAWvC;IANC;;;;OAIG;IACH,QAHU,OAAO,cAAc,EAAE,MAAM,CAGnB;CAEvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAGY,CAAU,IAAqC,EAArC,OAAO,kBAAkB,EAAE,UAAU,KAAG,OAAO,cAAc,EAAE,MAAM;;;;8BAI/E,MAAM,IACN,OAAO,eAAe,EAAE,WAAW,CAAC,OAAO,eAAe,EAAE,UAAU,EAAE,OAAO,oBAAoB,EAAE,OAAO,EAAE,MAAM,CAAC,GACjI,OAAW,eAAe,EAAE,WAAW,CAAC,OAAO,oBAAoB,EAAE,KAAK,GAC1E,eAAqB,EAAE,OAAO,WAAW,EAAE,WAAW,EAAE,MAAM,CAAC,GAC/D,OAAW,eAAe,EAAE,WAAW,CAAC,eAAe,EAAE,WAAW,EAAE,MAAM,CAAC,GAC7E,OAAW,eAAe,EAAE,mBAAmB,CAAC,OAAO,eAAe,EAAE,UAAU,GAAC,OAAO,oBAAoB,EAAE,KAAK,GACrH,eAAqB,GAAC,eAAe,EAAE,MAAM,CAAC;kBAhF7B,oBAAoB;AAqEtC;;GAEG;AAEH;;;;;;;;GAQG;AAEH;;;;;;;;;GASG;AACH;IACE;;OAEG;IACH,sBAFW,OAAO,EA6HjB;IAtHC;;OAEG;IACH,IAFU,iBAAiB,CAAC,OAAO,WAAW,EAAE,SAAS,CAAC,CAEnD;IAEP;;OAEG;IACH,MAFU,iBAAiB,CAAC,OAAO,WAAW,EAAE,SAAS,CAAC,CAEjD;IAET;;OAEG;IACH,IAFU,iBAAiB,CAAC,IAAI,CAAC,CAE1B;IAEP;;;;OAIG;IACH,mBAAgE;IAEhE;;;OAGG;IACH,yBAAkE;IAElE;;;OAGG;IACH,cAAkC;IAElC;;;;OAIG;IACH,gBAAmB;IAEnB;;;;OAIG;IACH,wBAA2B;IAE3B;;;;OAIG;IACH,wBACoE;IAEpE;;;;OAIG;IACH,yBAA6B;IAE7B;;;;OAIG;IACH,uBAA0B;IAE1B;;;;OAIG;IACH,uBAA0B;IAM1B;;;;OAIG;IACH,uBAUE;IAEF;;;;OAIG;IACH,uBAUE;IAOJ;;;;;OAKG;IACH,sBAmCC;IAED;;;;OAIG;IACH,2BAsBC;IAED;;;;OAIG;IACH,qCAmBC;IAED;;;;;OAKG;IACH,8BAYC;IAED;;;OAGG;IACH,yBAKC;IAgID;;;;;;OAMG;IACH,qBAHW,OAAO,WAAW,EAAE,OAAO,QAOrC;IAED;;;;;OAKG;IACH,aAHY,OAAO,cAAc,EAAE,MAAM,CAQxC;IAED;;;;;;OAMG;IACH,qBAJY,OAAO,cAAc,EAAE,MAAM,CAMxC;IAED;;;;;OAKG;IACH,kBAHW,OAAO,cAAc,EAAE,MAAM,QAQvC;CACF;+BArgB8B,cAAc"}

package/interaction/Extent.js

@@ -11,7 +11,7 @@ import {
 } from '../coordinate.js';
 import Event from '../events/Event.js';
 import {always} from '../events/condition.js';
-import {boundingExtent, getArea} from '../extent.js';
+import {boundingExtent, containsCoordinate, getArea} from '../extent.js';
 import Point from '../geom/Point.js';
 import {fromExtent as polygonFromExtent} from '../geom/Polygon.js';
 import VectorLayer from '../layer/Vector.js';
@@ -26,6 +26,11 @@ import PointerInteraction from './Pointer.js';
  * takes a {@link module:ol/MapBrowserEvent~MapBrowserEvent} and returns a
  * boolean to indicate whether that event should be handled.
  * Default is {@link module:ol/events/condition.always}.
+ * @property {import("../events/condition.js").Condition|null} [createCondition=null] A function that
+ * takes a {@link module:ol/MapBrowserEvent~MapBrowserEvent} and returns a
+ * boolean to indicate whether that event should be handled to create a new extent.
+ * If `null`, the `condition` will also be used as `createCondition`.
+ * @property {boolean} [drag=false] An extent can be dragged.
  * @property {import("../extent.js").Extent} [extent] Initial extent. Defaults to no
  * initial extent.
  * @property {import("../style/Style.js").StyleLike} [boxStyle]
@@ -91,7 +96,8 @@ export class ExtentEvent extends Event {
  * @classdesc
  * Allows the user to draw a vector box by clicking and dragging on the map.
  * Once drawn, the vector box can be modified by dragging its vertices or edges.
- * This interaction is only supported for mouse devices.
+ * The interaction can also be configured with an initial extent and a `createCondition`
+ * to prevent the creation of a new extent on `pointerdown`, if desired.
  *
  * @fires ExtentEvent
  * @api
@@ -127,6 +133,18 @@ class Extent extends PointerInteraction {
      */
     this.condition_ = options.condition ? options.condition : always;
 
+    /**
+     * @type {import("../events/condition.js").Condition}
+     * @private
+     */
+    this.createCondition_ = options.createCondition || this.condition_;
+
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this.drag_ = options.drag || false;
+
     /**
      * Extent of the drawn box
      * @type {import("../extent.js").Extent}
@@ -258,17 +276,31 @@ class Extent extends PointerInteraction {
 
   /**
    * @param {import("../MapBrowserEvent.js").default} mapBrowserEvent pointer move event
+   * @return {boolean} The event was handled.
    * @private
    */
   handlePointerMove_(mapBrowserEvent) {
     const pixel = mapBrowserEvent.pixel;
     const map = mapBrowserEvent.map;
+    const draggable =
+      this.drag_ &&
+      containsCoordinate(this.extent_, mapBrowserEvent.coordinate);
 
     let vertex = this.snapToVertex_(pixel, map);
-    if (!vertex) {
+    if (!vertex && this.createCondition_(mapBrowserEvent) && !draggable) {
       vertex = map.getCoordinateFromPixelInternal(pixel);
     }
-    this.createOrUpdatePointerFeature_(vertex);
+    if (draggable && !vertex) {
+      this.getMap().getViewport().classList.add('ol-grab');
+    } else {
+      this.getMap().getViewport().classList.remove('ol-grab');
+    }
+    if (vertex) {
+      this.updatePointerFeature_(vertex);
+      return true;
+    }
+    this.noVertexFeature_();
+    return false;
   }
 
   /**
@@ -299,22 +331,35 @@ class Extent extends PointerInteraction {
 
   /**
    * @param {import("../coordinate.js").Coordinate} vertex location of feature
+   * @param {boolean} [createIfNotExists] create the feature if it does not exist
    * @return {Feature} vertex as feature
    * @private
    */
-  createOrUpdatePointerFeature_(vertex) {
+  updatePointerFeature_(vertex, createIfNotExists = true) {
     let vertexFeature = this.vertexFeature_;
-    if (!vertexFeature) {
+    if (createIfNotExists && !vertexFeature) {
       vertexFeature = new Feature(new Point(vertex));
       this.vertexFeature_ = vertexFeature;
       this.vertexOverlay_.getSource().addFeature(vertexFeature);
-    } else {
+    }
+    if (vertexFeature) {
       const geometry = vertexFeature.getGeometry();
       geometry.setCoordinates(vertex);
     }
     return vertexFeature;
   }
 
+  /**
+   * Remove the vertex feature if it exists.
+   * @private
+   */
+  noVertexFeature_() {
+    if (this.vertexFeature_) {
+      this.vertexOverlay_.getSource().removeFeature(this.vertexFeature_);
+      this.vertexFeature_ = null;
+    }
+  }
+
   /**
    * @param {import("../MapBrowserEvent.js").default} mapBrowserEvent Map browser event.
    * @return {boolean} `false` to stop event propagation.
@@ -322,19 +367,23 @@ class Extent extends PointerInteraction {
    */
   handleEvent(mapBrowserEvent) {
     if (!mapBrowserEvent.originalEvent || !this.condition_(mapBrowserEvent)) {
+      this.noVertexFeature_();
       return true;
     }
+
+    let handled = this.handlingDownUpSequence;
+
     //display pointer (if not dragging)
     if (
       mapBrowserEvent.type == MapBrowserEventType.POINTERMOVE &&
       !this.handlingDownUpSequence
     ) {
-      this.handlePointerMove_(mapBrowserEvent);
+      handled = this.handlePointerMove_(mapBrowserEvent);
     }
     //call pointer to determine up/down/drag
     super.handleEvent(mapBrowserEvent);
     //return false to stop propagation
-    return false;
+    return !handled;
   }
 
   /**
@@ -390,13 +439,22 @@ class Extent extends PointerInteraction {
           getOpposingPoint([extent[2], y]),
         );
       }
-      //no snap - new bbox
+      //no snap - new bbox or dragging existing bbox
     } else {
       vertex = map.getCoordinateFromPixelInternal(pixel);
-      this.setExtent([vertex[0], vertex[1], vertex[0], vertex[1]]);
-      this.pointerHandler_ = getPointHandler(vertex);
+      let drag = false;
+      if (this.drag_) {
+        if (containsCoordinate(extent, vertex)) {
+          this.pointerHandler_ = getDragHandler(extent, vertex);
+          drag = true;
+        }
+      }
+      if (!drag && this.createCondition_(mapBrowserEvent)) {
+        this.setExtent([vertex[0], vertex[1], vertex[0], vertex[1]]);
+        this.pointerHandler_ = getPointHandler(vertex);
+      }
     }
-    return true; //event handled; start downup sequence
+    return !!this.pointerHandler_; //event handled; start downup sequence
   }
 
   /**
@@ -408,7 +466,7 @@ class Extent extends PointerInteraction {
     if (this.pointerHandler_) {
       const pixelCoordinate = mapBrowserEvent.coordinate;
       this.setExtent(this.pointerHandler_(pixelCoordinate));
-      this.createOrUpdatePointerFeature_(pixelCoordinate);
+      this.updatePointerFeature_(pixelCoordinate, false);
     }
   }
 
@@ -459,6 +517,7 @@ class Extent extends PointerInteraction {
    *
    * @return {import("../extent.js").Extent} Drawn extent in the view projection.
    * @api
+   * @deprecated Use {@link module:ol/interaction/Extent~Extent#getExtent} instead.
    */
   getExtentInternal() {
     return this.extent_;
@@ -531,6 +590,24 @@ function getEdgeHandler(fixedP1, fixedP2) {
   return null;
 }
 
+/**
+ * @param {import("../extent.js").Extent} extent The extent that will be dragged
+ * @param {import("../coordinate.js").Coordinate} vertex The vertex that drag delta is calculated from
+ * @return {PointerHandler|null} event handler
+ */
+function getDragHandler(extent, vertex) {
+  return function (point) {
+    const deltaX = point[0] - vertex[0];
+    const deltaY = point[1] - vertex[1];
+    return [
+      extent[0] + deltaX,
+      extent[1] + deltaY,
+      extent[2] + deltaX,
+      extent[3] + deltaY,
+    ];
+  };
+}
+
 /**
  * @param {import("../extent.js").Extent} extent extent
  * @return {Array<Array<import("../coordinate.js").Coordinate>>} extent line segments

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ol",
-  "version": "10.6.2-dev.1752510546973",
+  "version": "10.6.2-dev.1752570595686",
   "description": "OpenLayers mapping library",
   "keywords": [
     "map",

package/util.js

@@ -33,4 +33,4 @@ export function getUid(obj) {
  * OpenLayers version.
  * @type {string}
  */
-export const VERSION = '10.6.2-dev.1752510546973';
+export const VERSION = '10.6.2-dev.1752570595686';