diff --git a/src/js/models/maps/MapInteraction.js b/src/js/models/maps/MapInteraction.js index 5cba5459c..f8462522f 100644 --- a/src/js/models/maps/MapInteraction.js +++ b/src/js/models/maps/MapInteraction.js @@ -28,7 +28,7 @@ define([ * @since 2.27.0 * @extends Backbone.Model */ - var MapInteraction = Backbone.Model.extend( + const MapInteraction = Backbone.Model.extend( /** @lends MapInteraction.prototype */ { /** * The type of model this is. @@ -163,7 +163,7 @@ define([ /** * Handles a mouse click on the map. If the user has clicked on a feature, - * the feature is set as the 'clickedFeatures' attribute. If the map is + * the feature is set as the 'clickedFeatures' attribute. If the map or layer is * configured to show details when a feature is clicked, the feature is * also set as the 'selectedFeatures' attribute. * @param {MapInteraction} m - The MapInteraction model. @@ -175,7 +175,12 @@ define([ // Clone the models in hovered features and set them as clicked features const hoveredFeatures = this.get("hoveredFeatures").models; this.setClickedFeatures(hoveredFeatures); - const clickAction = this.get("mapModel")?.get("clickFeatureAction"); + let clickAction = this.get("hoveredFeatures") + ?.models[0].get("mapAsset") + ?.get("clickFeatureAction"); + if (clickAction == null) { + clickAction = this.get("mapModel")?.get("clickFeatureAction"); + } if (clickAction === "showDetails") { this.selectFeatures(hoveredFeatures); } else if (clickAction === "zoom") { diff --git a/src/js/models/maps/assets/MapAsset.js b/src/js/models/maps/assets/MapAsset.js index 9d4226e08..1fd3ddfec 100644 --- a/src/js/models/maps/assets/MapAsset.js +++ b/src/js/models/maps/assets/MapAsset.js @@ -108,6 +108,9 @@ define([ * from the layer list. * @property {boolean} [showOpacitySlider = true] Set to true to show opacity slider * for the layer. + * @property {"showDetails"|"zoom"} [clickFeatureAction = null] The action to take when a user clicks on a feature on the layer. The + * available options are "showDetails" (show the feature details in the + * sidebar) or "zoom" (zoom to the feature's location). */ defaults() { return { @@ -133,7 +136,7 @@ define([ statusDetails: null, hideInLayerList: false, showOpacitySlider: true, - clickFeatureAction: "", + clickFeatureAction: null, }; }, diff --git a/src/js/views/maps/MapView.js b/src/js/views/maps/MapView.js index 8871f8114..7ff6c0b99 100644 --- a/src/js/views/maps/MapView.js +++ b/src/js/views/maps/MapView.js @@ -129,10 +129,7 @@ define([ this.renderToolbar(); this.renderLayerDetails(); } - if ( - this.model.get("showFeatureInfo") && - this.model.get("clickFeatureAction") === "showDetails" - ) { + if (this.model.get("showFeatureInfo")) { this.renderFeatureInfo(); } return this; diff --git a/test/js/specs/unit/models/maps/MapInteraction.spec.js b/test/js/specs/unit/models/maps/MapInteraction.spec.js index d7ea29209..6b0991a80 100644 --- a/test/js/specs/unit/models/maps/MapInteraction.spec.js +++ b/test/js/specs/unit/models/maps/MapInteraction.spec.js @@ -73,4 +73,21 @@ define([ expect(spy.args[0][1].assets.length).to.equal(3); }); }); + it("should do nothing if the action is not LEFT_CLICK", function () { + const model = new MapInteraction(); + const initialClickedFeatures = model.get("clickedFeatures").models.length; + model.handleClick(model, "RIGHT_CLICK"); + model + .get("clickedFeatures") + .models.length.should.equal(initialClickedFeatures); + }); + + it("should set zoomTarget if clickFeatureAction is 'zoom'", function () { + const model = new MapInteraction(); + model.set("clickFeatureAction", "zoom"); + const feature1 = new Features({ id: 1 }); + model.set("hoveredFeatures", new Features([feature1])); + model.handleClick(model, "LEFT_CLICK"); + model.get("clickFeatureAction").should.equal("zoom"); + }); });