diff --git a/src/ol/interaction/Translate.js b/src/ol/interaction/Translate.js index f5e49da084..b40de7ff89 100644 --- a/src/ol/interaction/Translate.js +++ b/src/ol/interaction/Translate.js @@ -6,6 +6,7 @@ import Event from '../events/Event.js'; import InteractionProperty from './Property.js'; import PointerInteraction from './Pointer.js'; import {TRUE} from '../functions.js'; +import {always} from '../events/condition.js'; import {getChangeEventType} from '../Object.js'; import {includes} from '../array.js'; @@ -43,6 +44,10 @@ const TranslateEventType = { /** * @typedef {Object} Options + * @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.always}. * @property {Collection} [features] Only features contained in this collection will be able to be translated. If * not specified, all features on the map will be able to be translated. * @property {Array|function(import("../layer/Layer.js").default): boolean} [layers] A list of layers from which features should be @@ -175,6 +180,12 @@ class Translate extends PointerInteraction { */ this.hitTolerance_ = options.hitTolerance ? options.hitTolerance : 0; + /** + * @private + * @type {import("../events/condition.js").Condition} + */ + this.condition_ = options.condition ? options.condition : always; + /** * @type {import("../Feature.js").default} * @private @@ -193,6 +204,9 @@ class Translate extends PointerInteraction { * @return {boolean} If the event was consumed. */ handleDownEvent(event) { + if (!event.originalEvent || !this.condition_(event)) { + return false; + } this.lastFeature_ = this.featuresAtPixel_(event.pixel, event.map); if (!this.lastCoordinate_ && this.lastFeature_) { this.startCoordinate_ = event.coordinate; diff --git a/test/browser/spec/ol/interaction/translate.test.js b/test/browser/spec/ol/interaction/translate.test.js index b51105d431..e1cafa5455 100644 --- a/test/browser/spec/ol/interaction/translate.test.js +++ b/test/browser/spec/ol/interaction/translate.test.js @@ -10,6 +10,7 @@ import Translate, { import VectorLayer from '../../../../../src/ol/layer/Vector.js'; import VectorSource from '../../../../../src/ol/source/Vector.js'; import View from '../../../../../src/ol/View.js'; +import {shiftKeyOnly} from '../../../../../src/ol/events/condition.js'; describe('ol.interaction.Translate', function () { let target, map, source, features; @@ -256,6 +257,39 @@ describe('ol.interaction.Translate', function () { }); }); + describe('moving features, with condition option', function () { + let translate; + + beforeEach(function () { + translate = new Translate({condition: shiftKeyOnly}); + map.addInteraction(translate); + }); + + it('moves targeted feature when condition is met', function () { + const events = trackEvents(features[0], translate); + + simulateEvent('pointermove', 10, 20); + simulateEvent('pointerdown', 10, 20, true); + simulateEvent('pointerdrag', 50, -40); + simulateEvent('pointerup', 50, -40); + expect(features[0].getGeometry().getCoordinates()).to.eql([50, 40]); + + validateEvents(events, [features[0]]); + }); + + it('does not move feature when condition is not met', function () { + const events = trackEvents(features[0], translate); + + simulateEvent('pointermove', 20, 30); + simulateEvent('pointerdown', 20, 30); + simulateEvent('pointerdrag', 50, -40); + simulateEvent('pointerup', 50, -40); + expect(features[1].getGeometry().getCoordinates()).to.eql([20, -30]); + + expect(events).to.be.empty(); + }); + }); + describe('changes css cursor', function () { let element, translate;