Merge remote-tracking branch 'origin/2.4'

api/src/Map.js

@@ -9,6 +9,7 @@ import Feature from 'ol/Feature.js';
 import Overlay from 'ol/Overlay.js';
 import Point from 'ol/geom/Point.js';
 import {Icon, Style} from 'ol/style.js';
+import {createDefaultStyle} from 'ol/style/Style.js';
 import View from 'ol/View.js';
 import VectorSource from 'ol/source/Vector.js';
 import VectorLayer from 'ol/layer/Vector.js';
@@ -58,7 +59,7 @@ import * as themes from './Themes.js';
 /**
  * @type {Array<string>}
  */
-const EXCLUDE_PROPERTIES = ['geom', 'geometry', 'boundedBy'];
+const EXCLUDE_PROPERTIES = ['boundedBy'];
 
 
 /**
@@ -288,6 +289,8 @@ class Map {
       marker.setStyle(new Style({
         image
       }));
+    } else {
+      marker.setStyle(createDefaultStyle);
     }
     this.vectorSource_.addFeature(marker);
   }
@@ -401,12 +404,13 @@ class Map {
         throw new Error('Wrong geometry type');
       }
       const coordinates = point.getCoordinates();
+      const geometryName = feature.getGeometryName();
       const properties = feature.getProperties();
       let contentHTML = '';
       if (table) {
         contentHTML += '<table><tbody>';
         for (const key in properties) {
-          if (!EXCLUDE_PROPERTIES.includes(key)) {
+          if (!EXCLUDE_PROPERTIES.includes(key) || key !== geometryName) {
             contentHTML += '<tr>';
             contentHTML += `<th>${key}</th>`;
             contentHTML += `<td>${properties[key]}</td>`;

contribs/gmf/apps/desktop/Controller.js

@@ -15,6 +15,7 @@ import gmfControllersAbstractDesktopController, {AbstractDesktopController}
 import appBase from '../appmodule.js';
 import EPSG2056 from '@geoblocks/proj/src/EPSG_2056.js';
 import EPSG21781 from '@geoblocks/proj/src/EPSG_21781.js';
+import olSourceVector from 'ol/source/Vector.js';
 
 if (!window.requestAnimationFrame) {
   alert('Your browser is not supported, please update it or use another one. You will be redirected.\n\n'
@@ -111,6 +112,8 @@ const module = angular.module('Appdesktop', [
   gmfControllersAbstractDesktopController.name,
 ]);
 
+module.value('ngeoSnappingSource', new olSourceVector());
+
 module.value('gmfContextualdatacontentTemplateUrl', 'gmf/contextualdata');
 module.run(
   /**

contribs/gmf/src/controllers/desktop.scss

@@ -248,7 +248,7 @@ gmf-search {
 .gmf-floorselector {
   left: 0.62rem;
   top: 6rem;
-  height: 15rem;
+  height: 10rem;
 }
 
 .gmf-app-data-panel {

contribs/gmf/src/editing/Snapping.js

@@ -25,6 +25,7 @@ import olInteractionSnap from 'ol/interaction/Snap.js';
  * @param {angular.IHttpService} $http Angular $http service.
  * @param {angular.IQService} $q The Angular $q service.
  * @param {angular.IScope} $rootScope Angular rootScope.
+ * @param {angular.auto.IInjectorService} $injector Angular injector.
  * @param {angular.ITimeoutService} $timeout Angular timeout service.
  * @param {import("gmf/theme/Themes.js").ThemesService} gmfThemes The gmf Themes service.
  * @param {import("gmf/layertree/TreeManager.js").LayertreeTreeManager} gmfTreeManager The gmf TreeManager
@@ -34,7 +35,9 @@ import olInteractionSnap from 'ol/interaction/Snap.js';
  * @ngname gmfSnapping
  * @hidden
  */
-export function EditingSnappingService($http, $q, $rootScope, $timeout, gmfThemes, gmfTreeManager) {
+export function EditingSnappingService(
+  $http, $q, $rootScope, $injector, $timeout, gmfThemes, gmfTreeManager
+) {
 
   // === Injected services ===
 
@@ -62,6 +65,12 @@ export function EditingSnappingService($http, $q, $rootScope, $timeout, gmfTheme
    */
   this.timeout_ = $timeout;
 
+  /**
+   * @type {angular.auto.IInjectorService}
+   * @private
+   */
+  this.injector_ = $injector;
+
   /**
    * @type {import("gmf/theme/Themes.js").ThemesService}
    * @private
@@ -113,13 +122,35 @@ export function EditingSnappingService($http, $q, $rootScope, $timeout, gmfTheme
    */
   this.ogcServers_ = null;
 
+  /**
+   * @type {import('ol/source/Vector.js').default<*>|undefined}
+   * @private
+   */
+  this.ngeoSnappingSource_ = this.injector_.has('ngeoSnappingSource') ?
+    this.injector_.get('ngeoSnappingSource') : undefined;
+}
+
+
+class CustomSnap extends olInteractionSnap {
+  /**
+   * @param {import('ol/interaction/Snap.js').Options} options
+   */
+  constructor(options) {
+    super(options);
+    document.body.addEventListener('keydown', (evt) => {
+      this.setActive(evt.keyCode !== 17); // Ctrl key
+    });
+    document.body.addEventListener('keyup', () => {
+      this.setActive(true);
+    });
+  }
 }
 
 
 /**
  * In order for a `ol.interaction.Snap` to work properly, it has to be added
  * to the map after any draw interactions or other kinds of interactions that
- * ineracts with features on the map.
+ * interacts with features on the map.
  *
  * This method can be called to make sure the Snap interactions are on top.
  *
@@ -132,7 +163,7 @@ EditingSnappingService.prototype.ensureSnapInteractionsOnTop = function() {
 
   let item;
   for (const uid in this.cache_) {
-    item = this.cache_[+uid];
+    item = this.cache_[uid];
     if (item.active) {
       if (!item.interaction) {
         throw new Error('Missing item.interaction');
@@ -270,11 +301,11 @@ EditingSnappingService.prototype.registerTreeCtrl_ = function(treeCtrl) {
  */
 EditingSnappingService.prototype.unregisterAllTreeCtrl_ = function() {
   for (const uid in this.cache_) {
-    const item = this.cache_[+uid];
+    const item = this.cache_[uid];
     if (item) {
       item.stateWatcherUnregister();
       this.deactivateItem_(item);
-      delete this.cache_[+uid];
+      delete this.cache_[uid];
     }
   }
 };
@@ -416,7 +447,7 @@ EditingSnappingService.prototype.activateItem_ = function(item) {
 
   const map = this.map_;
 
-  const interaction = new olInteractionSnap({
+  const interaction = new CustomSnap({
     edge: item.snappingConfig.edge,
     features: item.features,
     pixelTolerance: item.snappingConfig.tolerance,
@@ -468,6 +499,7 @@ EditingSnappingService.prototype.deactivateItem_ = function(item) {
   }
 
   item.active = false;
+  this.refreshSnappingSource_();
 };
 
 
@@ -478,7 +510,7 @@ EditingSnappingService.prototype.loadAllItems_ = function() {
   this.mapViewChangePromise_ = null;
   let item;
   for (const uid in this.cache_) {
-    item = this.cache_[+uid];
+    item = this.cache_[uid];
     if (item.active) {
       this.loadItemFeatures_(item);
     }
@@ -555,6 +587,7 @@ EditingSnappingService.prototype.loadItemFeatures_ = function(item) {
       const readFeatures = new olFormatWFS().readFeatures(response.data);
       if (readFeatures) {
         item.features.extend(readFeatures);
+        this.refreshSnappingSource_();
       }
     });
 
@@ -576,6 +609,24 @@ EditingSnappingService.prototype.handleMapMoveEnd_ = function() {
   );
 };
 
+/**
+ * @private
+ */
+EditingSnappingService.prototype.refreshSnappingSource_ = function() {
+  if (this.ngeoSnappingSource_ === undefined) {
+    throw new Error('Missing SnappingSource');
+  }
+  this.ngeoSnappingSource_.clear();
+  for (const uid in this.cache_) {
+    const item = this.cache_[uid];
+    if (item.features === undefined) {
+      throw new Error('Missing features');
+    }
+    if (item.active) {
+      this.ngeoSnappingSource_.addFeatures(item.features.getArray());
+    }
+  }
+};
 
 /**
  * @typedef {Object<string, CacheItem>} Cache

examples/drawfeature.js

@@ -21,7 +21,6 @@ const module = angular.module('app', [
   ngeoMiscToolActivateMgr.name,
 ]);
 
-
 /**
  * @param {angular.IScope} $scope Angular scope.
  * @param {import("ol/Collection.js").default<import('ol/Feature.js').default<import("ol/geom/Geometry.js").default>>} ngeoFeatures Collection

src/editing/createfeatureComponent.js

@@ -81,6 +81,7 @@ module.directive('ngeoCreatefeature', editingCreateFeatureComponent);
  * @param {angular.gettext.gettextCatalog} gettextCatalog Gettext catalog.
  * @param {angular.ICompileService} $compile Angular compile service.
  * @param {angular.IFilterService} $filter Angular filter
+ * @param {angular.auto.IInjectorService} $injector Angular injector service.
  * @param {angular.IScope} $scope Scope.
  * @param {angular.ITimeoutService} $timeout Angular timeout service.
  * @param {import("ngeo/misc/EventHelper.js").EventHelper} ngeoEventHelper Ngeo event helper service
@@ -91,7 +92,7 @@ module.directive('ngeoCreatefeature', editingCreateFeatureComponent);
  * @ngdoc controller
  * @ngname ngeoCreatefeatureController
  */
-function Controller(gettextCatalog, $compile, $filter, $scope, $timeout, ngeoEventHelper) {
+function Controller(gettextCatalog, $compile, $filter, $injector, $scope, $timeout, ngeoEventHelper) {
 
   /**
    * @type {boolean}
@@ -149,6 +150,12 @@ function Controller(gettextCatalog, $compile, $filter, $scope, $timeout, ngeoEve
    */
   this.ngeoEventHelper_ = ngeoEventHelper;
 
+  /**
+   * @type {angular.auto.IInjectorService}
+   * @private
+   */
+  this.injector_ = $injector;
+
   /**
    * The draw or measure interaction responsible of drawing the vector feature.
    * The actual type depends on the geometry type.
@@ -195,14 +202,23 @@ Controller.prototype.$onInit = function() {
       'Double-click or click last point to finish'
     );
 
+    /** @type {import('ngeo/interaction/Measure.js').MeasureOptions} */
+    const options = {
+      style: new olStyleStyle(),
+      startMsg: this.compile_(`<div translate>${helpMsg}</div>`)(this.scope_)[0],
+      continueMsg: this.compile_(`<div translate>${contMsg}</div>`)(this.scope_)[0],
+    };
+    if (this.injector_.has('ngeoSnappingTolerance')) {
+      options.tolerance = this.injector_.get('ngeoSnappingTolerance');
+    }
+    if (this.injector_.has('ngeoSnappingSource')) {
+      options.source = this.injector_.get('ngeoSnappingSource');
+    }
+
     interaction = new ngeoInteractionMeasureLength(
       this.filter_('ngeoUnitPrefix'),
       gettextCatalog,
-      {
-        style: new olStyleStyle(),
-        startMsg: this.compile_(`<div translate>${helpMsg}</div>`)(this.scope_)[0],
-        continueMsg: this.compile_(`<div translate>${contMsg}</div>`)(this.scope_)[0]
-      }
+      options
     );
   } else if (this.geomType === ngeoGeometryType.POLYGON ||
       this.geomType === ngeoGeometryType.MULTI_POLYGON

src/editing/createregularpolygonfromclickComponent.js

@@ -188,7 +188,7 @@ Controller.prototype.handleDrawEnd_ = function(evt) {
     throw new Error('Missing features');
   }
   // @ts-ignore: evt should be of type {import('ol/interaction/Draw.js').DrawEvent but he is private
-  const feature = new olFeature(evt.feature.getGeometry());
+  const feature = new olFeature(evt.detail.feature.getGeometry());
   this.features.push(feature);
 };
 

src/interaction/Measure.js

@@ -25,10 +25,12 @@ import VectorSource from 'ol/source/Vector.js';
  * then the default behaviour occurs depending on the measure type.
  * @property {number} [decimals] Defines the number of decimals to keep in the measurement. If not defined,
  * then the default behaviour occurs depending on the measure type.
+ * @property {number} [tolerance] Defines the tolerance.
  * @property {import("ol/style/Style.js").StyleLike} [style] The style to be used when
  * drawing is finished.
  * @property {import("ol/style/Style.js").StyleLike} [sketchStyle] The style to be used
  * while drawing.
+ * @property {import('ol/source/Vector.js').default} [source] The source.
  */
 
 
@@ -228,13 +230,11 @@ class Measure extends olInteractionInteraction {
   /**
    * Creates the draw interaction.
    *
-   * @abstract
    * @param {import("ol/style/Style.js").StyleLike} style The sketchStyle used for the drawing
    *    interaction.
    * @param {VectorSource<import("ol/geom/Geometry.js").default>} source Vector source.
    * @return {?import("ol/interaction/Draw.js").default|import("ngeo/interaction/DrawAzimut.js").default|import("ngeo/interaction/MobileDraw.js").default}
    *    The interaction
-   * @protected
    */
   createDrawInteraction(style, source) {
     return null;
@@ -453,10 +453,8 @@ class Measure extends olInteractionInteraction {
    * Function implemented in inherited classes to compute measurement, determine
    * where to place the tooltip and determine which help message to display.
    *
-   * @abstract
    * @param {function(string, ?import("ol/coordinate.js").Coordinate): void} callback The function
    *     to be called.
-   * @protected
    */
   handleMeasure(callback) {}