More convenience with condition chaining

src/ol/interaction/DragPan.js

@@ -5,8 +5,13 @@ import PointerInteraction, {
   centroid as centroidFromPointers,
 } from './Pointer.js';
 import {FALSE} from '../functions.js';
+import {
+  chain,
+  focusWithTabindex,
+  noModifierKeys,
+  primaryAction,
+} from '../events/condition.js';
 import {easeOut} from '../easing.js';
-import {noModifierKeys, primaryAction} from '../events/condition.js';
 import {
   rotate as rotateCoordinate,
   scale as scaleCoordinate,
@@ -17,8 +22,8 @@ import {
  * @property {import("../events/condition.js").Condition} [condition] A function that takes an {@link module:ol/MapBrowserEvent~MapBrowserEvent} and returns a boolean
  * to indicate whether that event should be handled.
  * Default is {@link module:ol/events/condition~noModifierKeys} and {@link module:ol/events/condition~primaryAction}.
- * In addition, if there is a `tabindex` attribute on the map element,
- * {@link module:ol/events/condition~focus} will also be applied.
+ * @property {boolean} [onFocusOnly=false] When the map's target has a `tabindex` attribute set,
+ * the interaction will only handle events when the map has the focus.
  * @property {import("../Kinetic.js").default} [kinetic] Kinetic inertia to apply to the pan.
  */
 
@@ -59,11 +64,17 @@ class DragPan extends PointerInteraction {
      */
     this.panning_ = false;
 
+    const condition = options.condition
+      ? options.condition
+      : chain(noModifierKeys, primaryAction);
+
     /**
      * @private
      * @type {import("../events/condition.js").Condition}
      */
-    this.condition_ = options.condition ? options.condition : defaultCondition;
+    this.condition_ = options.onFocusOnly
+      ? chain(focusWithTabindex, condition)
+      : condition;
 
     /**
      * @private
@@ -175,12 +186,4 @@ class DragPan extends PointerInteraction {
   }
 }
 
-/**
- * @param {import("../MapBrowserEvent.js").default} mapBrowserEvent Browser event.
- * @return {boolean} Combined condition result.
- */
-export function defaultCondition(mapBrowserEvent) {
-  return noModifierKeys(mapBrowserEvent) && primaryAction(mapBrowserEvent);
-}
-
 export default DragPan;

src/ol/interaction/MouseWheelZoom.js

@@ -4,7 +4,7 @@
 import EventType from '../events/EventType.js';
 import Interaction, {zoomByDelta} from './Interaction.js';
 import {DEVICE_PIXEL_RATIO, FIREFOX} from '../has.js';
-import {always} from '../events/condition.js';
+import {always, chain, focusWithTabindex} from '../events/condition.js';
 import {clamp} from '../math.js';
 
 /**
@@ -21,8 +21,8 @@ export const Mode = {
  * takes an {@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}.
- * In addition, if there is a `tabindex` attribute on the map element,
- * {@link module:ol/events/condition~focus} will also be applied.
+ * @property {boolean} [onFocusOnly=false] When the map's target has a `tabindex` attribute set,
+ * the interaction will only handle events when the map has the focus.
  * @property {number} [maxDelta=1] Maximum mouse wheel delta.
  * @property {number} [duration=250] Animation duration in milliseconds.
  * @property {number} [timeout=80] Mouse wheel timeout duration in milliseconds.
@@ -96,11 +96,15 @@ class MouseWheelZoom extends Interaction {
         ? options.constrainResolution
         : false;
 
+    const condition = options.condition ? options.condition : always;
+
     /**
      * @private
      * @type {import("../events/condition.js").Condition}
      */
-    this.condition_ = options.condition ? options.condition : always;
+    this.condition_ = options.onFocusOnly
+      ? chain(focusWithTabindex, condition)
+      : condition;
 
     /**
      * @private