Fix #3696 Various fixes, utils and drawSupport (#3697)

* Fix 3696 Various fixes, utils and drawSupport * Fixed some docs, and removed changes to map plugin
geosolutions-it · Apr 29, 2019 · 1772771 · 1772771
1 parent aeb28d5
commit 1772771
Show file tree

Hide file tree

Showing 11 changed files with 52 additions and 20 deletions.
diff --git a/web/client/actions/notifications.js b/web/client/actions/notifications.js
@@ -12,7 +12,8 @@ const CLEAR_NOTIFICATIONS = 'CLEAR_NOTIFICATIONS';
  *    uid: "1234" // a unique identifier (if not present, current time is used),
  *    action: {
  *      label:  "label.translation.path" // or the message directly
- *    }
+ *    },
+ *    values: {param1: value1} // optional, used to parametrize the string
  *  }
  * ```
  * @param  {String} [level='success'] The level of the notification. (one of "success"|"warning"|"info"|"error")

diff --git a/web/client/api/persistence/index.js b/web/client/api/persistence/index.js
@@ -11,7 +11,7 @@ const ApiProviders = {
 };
 /**
  * MapStore Persistence layer.
- * By default MapStore persists resources on geostrore. You can add a persistence provider creating an object that
+ * By default MapStore persists resources on geostore. You can add a persistence provider creating an object that
  * implements the CRUD interface (createResource, getResource, updateResource and deleteResource)
  * and adding it to the API providers calling `addApi`.
  * Then you can select your provider by settings the  `persistenceApi` property in `localConfig.json`

diff --git a/web/client/components/map/openlayers/DrawSupport.jsx b/web/client/components/map/openlayers/DrawSupport.jsx
@@ -294,7 +294,7 @@ class DrawSupport extends React.Component {
         let drawBaseProps = {
             source,
             type: /** @type {ol.geom.GeometryType} */ geometryType,
-            style: new ol.style.Style({
+            style: geometryType === "Marker" ? VectorStyle.getMarkerStyle({style: newProps.style}) : new ol.style.Style({
                 fill: new ol.style.Fill({
                     color: 'rgba(255, 255, 255, 0.2)'
                 }),
@@ -365,11 +365,14 @@ class DrawSupport extends React.Component {
                 }
                 break;
             }
-            case "Point": case "LineString": case "Polygon": case "MultiPoint": case "MultiLineString": case "MultiPolygon": {
+            case "Marker": case "Point": case "LineString": case "Polygon": case "MultiPoint": case "MultiLineString": case "MultiPolygon": {
                 if (geometryType === "LineString") {
                     roiProps.maxPoints = maxPoints;
                 }
                 roiProps.type = geometryType;
+                if (geometryType === "Marker") {
+                    roiProps.type = "Point";
+                }
                 roiProps.geometryFunction = (coordinates, geometry) => {
                     let geom = geometry;
                     if (!geom) {
@@ -713,7 +716,7 @@ class DrawSupport extends React.Component {
     createOLGeometry = ({type, coordinates, radius, center, projection, options = {}}) => {
         let geometry;
         switch (type) {
-            case "Point": { geometry = new ol.geom.Point(coordinates ? coordinates : []); break; }
+            case "Point": case "Marker": { geometry = new ol.geom.Point(coordinates ? coordinates : []); break; }
             case "LineString": { geometry = new ol.geom.LineString(coordinates ? coordinates : []); break; }
             case "MultiPoint": { geometry = new ol.geom.MultiPoint(coordinates ? coordinates : []); break; }
             case "MultiLineString": { geometry = new ol.geom.MultiLineString(coordinates ? coordinates : []); break; }

diff --git a/web/client/components/misc/enhancers/loadingState.jsx b/web/client/components/misc/enhancers/loadingState.jsx
@@ -9,22 +9,22 @@
 const React = require('react');
 const {branch} = require('recompose');
 
-const DefaultLoadingomponent = require('../LoadingView');
+const DefaultLoadingComponent = require('../LoadingView');
 
 const defaultTest = ({loading, isLoading}) => loading || isLoading && ((typeof isLoading === 'function') ? isLoading() : isLoading === true);
 /**
-* Empty State enhancer. Enhances an object displaying an empty state view under a given condition
+* Loading State enhancer. Enhances an object displaying an empty state view under a given condition
 * @type {function}
-* @name emptyState
+* @name loadingState
 * @memberof components.misc.enhancers
 * @param {function} isLoading The test function for loading condition. By default checks loading prop as boolean or isLoading as boolean or function
 * @param {object} [loaderProps] You can pass `width` and `height` props to make the component adapt to your container
-* @param {Component} [EmptyComponent=EmptyView] the component to use for empty view. By default [EmptyView](#components.misc.EmptyView)
+* @param {Component} [LoadingComponent=DefaultLoadingComponent] the component to use for empty view. By default [DefaultLoadingComponent](#components.misc.LoadingView)
 * @example
-* emptyState(({data=[]}) => data.length === 0)(ComponentToEnhance);
+* loadingState(({isloading}) => isloading)(ComponentToEnhance);
 *
 */
-module.exports = (isLoading = defaultTest, loaderProps ={}, LoadingComponent = DefaultLoadingomponent) => branch(
+module.exports = (isLoading = defaultTest, loaderProps = {}, LoadingComponent = DefaultLoadingComponent) => branch(
     isLoading,
    // TODO return proper HOC
    () => () => <LoadingComponent {...loaderProps} />);
diff --git a/web/client/components/misc/enhancers/tooltip.jsx b/web/client/components/misc/enhancers/tooltip.jsx
@@ -30,8 +30,9 @@ const Message = require('../../I18N/Message');
  */
 module.exports = branch(
     ({tooltip, tooltipId} = {}) => tooltip || tooltipId,
-    (Wrapped) => ({tooltip, tooltipId, tooltipPosition = "top", tooltipTrigger, keyProp, ...props} = {}) => (<OverlayTrigger
+    (Wrapped) => ({tooltip, tooltipId, tooltipPosition = "top", tooltipTrigger, keyProp, idDropDown, ...props} = {}) => (<OverlayTrigger
         trigger={tooltipTrigger}
+        id={idDropDown}
         key={keyProp}
         placement={tooltipPosition}
         overlay={<Tooltip id={"tooltip-" + {keyProp}}>{tooltipId ? <Message msgId={tooltipId} /> : tooltip}</Tooltip>}><Wrapped {...props}/></OverlayTrigger>));
diff --git a/web/client/components/misc/toolbar/DropdownToolbarOptions.jsx b/web/client/components/misc/toolbar/DropdownToolbarOptions.jsx
@@ -38,7 +38,7 @@ const DropdownFeatureType = ({
     } = {}) => (
         <DropdownButtonT {...defaultButtonConfig} {...buttonConfig}>
             {menuOptions.length ? menuOptions.map(({glyph, text, onClick, active = false}, i) => (
-                <MenuItem active={active} eventKey={i} onClick={onClick}>
+                <MenuItem active={active} eventKey={i} onClick={onClick} key={i}>
                     {glyph && <Glyphicon glyph={glyph}/>} {text}
                 </MenuItem>)) : null}
         </DropdownButtonT>

diff --git a/web/client/utils/CoordinatesUtils.js b/web/client/utils/CoordinatesUtils.js
@@ -474,7 +474,7 @@ const CoordinatesUtils = {
     getGeoJSONExtent: function(geoJSON) {
         let newExtent = [Infinity, Infinity, -Infinity, -Infinity];
         const reduceCollectionExtent = (extent, collectionElement) => {
-            let ext = this.getGeoJSONExtent(collectionElement);
+            let ext = CoordinatesUtils.getGeoJSONExtent(collectionElement);
             if (this.isValidExtent(ext)) {
                 return this.extendExtent(ext, extent);
             }
@@ -505,7 +505,7 @@ const CoordinatesUtils = {
             if (geoJSON.type === "FeatureCollection") {
                 return geoJSON.features.reduce(reduceCollectionExtent, newExtent);
             } else if (geoJSON.type === "Feature" && geoJSON.geometry) {
-                return this.getGeoJSONExtent(geoJSON.geometry);
+                return CoordinatesUtils.getGeoJSONExtent(geoJSON.geometry);
             }
         }
 

diff --git a/web/client/utils/MapUtils.js b/web/client/utils/MapUtils.js
@@ -354,7 +354,7 @@ function isSimpleGeomType(geomType) {
 function getSimpleGeomType(geomType = "Point") {
     switch (geomType) {
         case "Point": case "LineString": case "Polygon": case "Circle": return geomType;
-        case "MultiPoint": return "Point";
+        case "MultiPoint": case "Marker": return "Point";
         case "MultiLineString": return "LineString";
         case "MultiPolygon": return "Polygon";
         default: return geomType;

diff --git a/web/client/utils/__tests__/CoordinatesUtils-test.js b/web/client/utils/__tests__/CoordinatesUtils-test.js
@@ -173,6 +173,19 @@ describe('CoordinatesUtils', () => {
         expect(CoordinatesUtils.getGeoJSONExtent(featureCollection)[1]).toBe(0.0);
         expect(CoordinatesUtils.getGeoJSONExtent(featureCollection)[2]).toBe(105.0);
         expect(CoordinatesUtils.getGeoJSONExtent(featureCollection)[3]).toBe(1.0);
+        expect(CoordinatesUtils.getGeoJSONExtent({ "type": "Feature",
+            "geometry": {
+                "type": "Polygon",
+                "coordinates": [
+                    [ [100.0, 0.0], [101.0, 0.0], [101.0, 1.0],
+               [100.0, 1.0], [100.0, 0.0] ]
+                ]
+            },
+            "properties": {
+                "prop0": "value0",
+                "prop1": {"this": "that"}
+            }
+        })).toEqual([ 100, 0, 101, 1 ]);
     });
     it('test coordsOLtoLeaflet on point', () => {
         let geojsonPoint = {

diff --git a/web/client/utils/__tests__/MapUtils-test.js b/web/client/utils/__tests__/MapUtils-test.js
@@ -27,7 +27,8 @@ var {
     getCurrentResolution,
     saveMapConfiguration,
     getIdFromUri,
-    parseLayoutValue
+    parseLayoutValue,
+    getSimpleGeomType
 } = require('../MapUtils');
 
 describe('Test the MapUtils', () => {
@@ -1149,5 +1150,16 @@ describe('Test the MapUtils', () => {
         const noNumberValue = parseLayoutValue('value');
         expect(noNumberValue).toBe(0);
     });
+    it('test getSimpleGeomType', () => {
+        expect(getSimpleGeomType("Point")).toBe("Point");
+        expect(getSimpleGeomType("Marker")).toBe("Point");
+        expect(getSimpleGeomType("MultiPoint")).toBe("Point");
+        expect(getSimpleGeomType("MultiLineString")).toBe("LineString");
+        expect(getSimpleGeomType("LineString")).toBe("LineString");
+        expect(getSimpleGeomType("MultiPolygon")).toBe("Polygon");
+        expect(getSimpleGeomType("Polygon")).toBe("Polygon");
+        expect(getSimpleGeomType("Circle")).toBe("Circle");
+        expect(getSimpleGeomType("Other")).toBe("Other");
+    });
 
 });
diff --git a/web/client/utils/openlayers/Icons.js b/web/client/utils/openlayers/Icons.js
@@ -54,9 +54,11 @@ module.exports = {
          getIcon: (options) => {
              let markerStyle = [new ol.style.Style({
                    image: new ol.style.Icon(({
-                     anchor: options.iconAnchor || [0.5, 1],
-                     anchorXUnits: ( options.iconAnchor || options.iconAnchor === 0) ? 'pixels' : 'fraction',
-                     anchorYUnits: ( options.iconAnchor || options.iconAnchor === 0) ? 'pixels' : 'fraction',
+                     anchor: options.style.iconAnchor || options.iconAnchor || [0.5, 1],
+                     anchorXUnits: options.style.anchorXUnits || ( options.iconAnchor || options.iconAnchor === 0) ? 'pixels' : 'fraction',
+                     anchorYUnits: options.style.anchorYUnits || ( options.iconAnchor || options.iconAnchor === 0) ? 'pixels' : 'fraction',
+                     size: options.style.size || [16, 16],
+                     anchorOrigin: options.style.anchorOrigin || "bottom-right",
                      src: options.style.iconUrl
                  }))
              })];