Merge pull request #163 from alexander-fedorenko/save-selection-as-an…

…notation

Exporting selected plots into annotation

assets/translations/data.en-US.json

@@ -295,6 +295,8 @@
                 },
                 "parcelle" : {
                     "fiche": "Information form",
+                    "saveAsAnnotation": "Save as annotation",
+                    "selectedPlots": "Selected plots",
                     "uf": "Land Unit Information",
                     "delete": "Delete selected plots",
                     "zoom": {

assets/translations/data.fr-FR.json

@@ -295,6 +295,8 @@
                 },
                 "parcelle" : {
                     "fiche": "Fiche d'info parcelle(s)",
+                    "saveAsAnnotation": "Enregistrer en tant qu'annotation",
+                    "selectedPlots": "Parcelles sélectionnées",
                     "uf": "Fiche unité foncière",
                     "delete": "Enlever parcelle(s)",
                     "zoom": {

js/extension/actions/cadastrapp.js

@@ -37,6 +37,7 @@ export const SAVE_BUBBLE_INFO = "CADASTRAPP:SAVE_BUBBLE_INFO";
 export const SHOW_POPUP = "CADASTRAPP:SHOW_POPUP";
 export const PRINT_SUBMITTED = "CADASTRAPP:PRINT_SUBMITTED";
 export const PRINT_RESPONSE = "CADASTRAPP:PRINT_RESPONSE";
+export const SAVE_AS_ANNOTATION = "CADASTRAPP:SAVE_AS_ANNOTATION";
 
 /**
  * Set the style of highlight
@@ -306,3 +307,11 @@ export const onPrintResponse = (requestId, allowDocument = true) => ({
     allowDocument,
     requestId
 });
+
+/**
+ * Save print response of the request id and allow document to be printed
+ * @return {{type: string}}
+ */
+export const saveAsAnnotation = () => ({
+    type: SAVE_AS_ANNOTATION
+});

js/extension/components/plot/PlotSelectionToolbar.jsx

@@ -23,6 +23,7 @@ export default function PlotSelectionToolbar({
     authLevel = {},
     currentData = [],
     loadInfo = () => {},
+    onSaveAsAnnotation = () => {},
     zoomToSelection = () => {},
     removePlots = () => {},
     showLandedPropertyInformationByParcelle = () => {},
@@ -63,6 +64,11 @@ export default function PlotSelectionToolbar({
                     glyph: "info-sign",
                     tooltipId: "cadastrapp.result.parcelle.fiche",
                     onClick: () => { loadInfo(selectedPlots);}
+                }, {
+                    disabled: !isDataPresent,
+                    glyph: "comment",
+                    tooltipId: "cadastrapp.result.parcelle.saveAsAnnotation",
+                    onClick: () => { onSaveAsAnnotation(selectedPlots);}
                 }, ((isCNIL1 || isCNIL2) ? {
                     renderButton:
                         (<DropdownButton

js/extension/epics/__tests__/events-test.js

@@ -0,0 +1,110 @@
+/*
+ * Copyright 2022, GeoSolutions Sas.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import expect from "expect";
+import { testEpic } from "@mapstore/epics/__tests__/epicTestUtils";
+import {saveAsAnnotation} from "../../actions/cadastrapp";
+import {CADASTRAPP_VECTOR_LAYER_ID} from "@js/extension/constants";
+import {cadastrappSaveAsAnnotation} from "@js/extension/epics/events";
+import {SET_CONTROL_PROPERTY} from "@mapstore/actions/controls";
+import {NEW_ANNOTATION, SET_EDITING_FEATURE} from "@mapstore/actions/annotations";
+
+describe("download Epics", () => {
+    const state = {
+        cadastrapp: {
+            configuration:
+                {
+                    cadastreLayerIdParcelle: 'testProp'
+                }
+        },
+        additionallayers: [
+            {
+                id: CADASTRAPP_VECTOR_LAYER_ID,
+                options: {
+                    id: CADASTRAPP_VECTOR_LAYER_ID,
+                    features: [
+                        {
+                            type: 'Feature',
+                            geometry: {
+                                type: 'MultiPolygon',
+                                coordinates: [
+                                    [
+                                        [
+                                            [0, 0],
+                                            [0, 1],
+                                            [1, 1],
+                                            [0, 0]
+                                        ]
+                                    ]
+                                ]
+                            },
+                            properties: {
+                                testProp: 'SomeTitle'
+                            },
+                            style: {
+                                fillColor: '#81BEF7',
+                                opacity: 0.6,
+                                fillOpacity: 0.6,
+                                color: '#111111',
+                                weight: 4
+                            }
+                        },
+                        {
+                            type: 'Feature',
+                            geometry: {
+                                type: 'Polygon',
+                                coordinates: [
+                                    [
+                                        [0, 0],
+                                        [0, 1],
+                                        [1, 1],
+                                        [0, 0]
+                                    ]
+                                ]
+                            },
+                            properties: {
+                                testProp: 'SomeTitle2'
+                            },
+                            style: {
+                                fillColor: '#81BEF7',
+                                opacity: 0.6,
+                                fillOpacity: 0.6,
+                                color: '#111111',
+                                weight: 4
+                            }
+                        }
+                    ]
+                }
+            }
+        ]
+    };
+
+    it("cadastrappSaveAsAnnotation", done => {
+        testEpic(
+            cadastrappSaveAsAnnotation,
+            3,
+            saveAsAnnotation(),
+            actions => {
+                expect(actions.length).toBe(3);
+                actions.map(action=>{
+                    switch (action.type) {
+                    case SET_CONTROL_PROPERTY:
+                    case NEW_ANNOTATION:
+                        break;
+                    case SET_EDITING_FEATURE:
+                        expect(action.feature.features.length).toBe(2);
+                        break;
+                    default:
+                        expect(false).toBe(true);
+                    }
+                });
+                done();
+            },
+            state
+        );
+    });
+});

js/extension/epics/cadastrapp.js

@@ -7,7 +7,7 @@ export { syncLayerForPlots, zoomToExtentAllResultsEpic } from './layerSync';
 // epics that implement map selection
 export { cadastrappMapSelection, mouseMovePopupEpic, showPopupEpic, showLandedPropertyByParcelle, togglePopupOnIdentify } from './mapSelection';
 
-export { cadastrappZoomToSelection } from './events';
+export { cadastrappZoomToSelection, cadastrappSaveAsAnnotation } from './events';
 
 export { cadastrappSearch, cadastrappOwnersSearch } from './search';
 

js/extension/epics/events.js

@@ -1,9 +1,11 @@
-
 import Rx from 'rxjs';
-import {  ZOOM_TO_SELECTION } from '../actions/cadastrapp';
-import { getCurrentPlotFeatures, getSelectedFeatures } from '../selectors/cadastrapp';
+import {SAVE_AS_ANNOTATION, ZOOM_TO_SELECTION} from '../actions/cadastrapp';
+import {getCadastrappVectorLayer, getCurrentPlotFeatures, getSelectedFeatures} from '../selectors/cadastrapp';
 import { zoomToExtent } from '@mapstore/actions/map';
 import bbox from '@turf/bbox';
+import {convertFeaturesToAnnotation} from "@js/extension/utils/download";
+import {setControlProperty} from "@mapstore/actions/controls";
+import {newAnnotation, setEditingFeature} from "@mapstore/actions/annotations";
 
 
 /**
@@ -22,3 +24,18 @@ export function cadastrappZoomToSelection(action$, store) {
     });
 }
 
+/**
+ * Saves cadastrapp selection to the annotation
+ */
+export function cadastrappSaveAsAnnotation(action$, store) {
+    return action$.ofType(SAVE_AS_ANNOTATION).switchMap(() => {
+        const state = store.getState();
+        const collection = convertFeaturesToAnnotation(getCadastrappVectorLayer(state), state);
+        return Rx.Observable.of(
+            setControlProperty('annotations', 'enabled', true),
+            newAnnotation(),
+            setEditingFeature(collection)
+        );
+    });
+}
+

js/extension/plugins/cadastrapp/PlotSelection.jsx

@@ -13,7 +13,8 @@ import {
     removePlots,
     zoomToSelection,
     loadInfo,
-    showLandedPropertyInformationByParcelle
+    showLandedPropertyInformationByParcelle,
+    saveAsAnnotation
 } from '../../actions/cadastrapp';
 
 import {
@@ -43,7 +44,8 @@ const PlotsSelection = connect((state) => ({
     removePlots: removePlots,
     zoomToSelection: zoomToSelection,
     showLandedPropertyInformationByParcelle,
-    onTabDelete: () => removePlotSelection()
+    onTabDelete: () => removePlotSelection(),
+    onSaveAsAnnotation: saveAsAnnotation
 })(PS);
 
 /**

js/extension/utils/__tests__/download-test.js

@@ -0,0 +1,76 @@
+import expect from 'expect';
+import {convertFeaturesToAnnotation} from "@js/extension/utils/download";
+
+describe('download utils', () => {
+    it("convertFeaturesToAnnotation", () => {
+        const state = {
+            cadastrapp: {
+                configuration:
+                    {
+                        cadastreLayerIdParcelle: 'testProp'
+                    }
+            }
+        };
+
+        const layer = {
+            features: [
+                {
+                    type: 'Feature',
+                    geometry: {
+                        type: 'MultiPolygon',
+                        coordinates: [
+                            [
+                                [
+                                    [0, 0],
+                                    [0, 1],
+                                    [1, 1],
+                                    [0, 0]
+                                ]
+                            ]
+                        ]
+                    },
+                    properties: {
+                        testProp: 'SomeTitle'
+                    },
+                    style: {
+                        fillColor: '#81BEF7',
+                        opacity: 0.6,
+                        fillOpacity: 0.6,
+                        color: '#111111',
+                        weight: 4
+                    }
+                },
+                {
+                    type: 'Feature',
+                    geometry: {
+                        type: 'Polygon',
+                        coordinates: [
+                            [
+                                [0, 0],
+                                [0, 1],
+                                [1, 1],
+                                [0, 0]
+                            ]
+                        ]
+                    },
+                    properties: {
+                        testProp: 'SomeTitle2'
+                    },
+                    style: {
+                        fillColor: '#81BEF7',
+                        opacity: 0.6,
+                        fillOpacity: 0.6,
+                        color: '#111111',
+                        weight: 4
+                    }
+                }
+            ]
+        };
+
+        const converted = convertFeaturesToAnnotation(layer, state);
+        expect(converted.features[0].geometry.type).toBe('Polygon');
+        expect(converted.features[1].geometry.type).toBe(layer.features[1].geometry.type);
+        expect(converted.features[0].properties.geometryTitle).toBe('SomeTitle');
+        expect(converted.features[1].properties.geometryTitle).toBe('SomeTitle2');
+    });
+});

js/extension/utils/download.js

@@ -1,4 +1,9 @@
 import axios from '@mapstore/libs/ajax';
+import uuidv1 from 'uuid/v1';
+import {validateFeatureCoordinates} from "@mapstore/utils/MeasureUtils";
+import {cadastreLayerIdParcelle} from "@js/extension/selectors/cadastrapp";
+import {getMessageById} from "@mapstore/utils/LocaleUtils";
+import {currentMessagesSelector} from "@mapstore/selectors/locale";
 
 export const toDownload = ({ fileName, mimeType }) => (response) => {
     const dataUrl = window.URL.createObjectURL(new Blob([response.data], { type: mimeType }));
@@ -36,3 +41,53 @@ export function downloadResponse(response, { fileName = 'unknown' } = {}) {
     link.remove();
     window.URL.revokeObjectURL(url);
 }
+
+/**
+ * Converts cadastrapp selection into geoJson accepted by annotations
+ * @param vectorLayer
+ * @param state
+ * @returns object
+ */
+export const convertFeaturesToAnnotation = (vectorLayer, state) => {
+    const id = uuidv1();
+    return {
+        type: "FeatureCollection",
+        features: [
+            ...(vectorLayer?.features ?? []).map(feature => ({
+                type: 'Feature',
+                geometry: {
+                    type: feature.geometry.type === 'MultiPolygon' ? 'Polygon' : feature.geometry.type,
+                    coordinates: feature.geometry.type === 'MultiPolygon'
+                        ? validateFeatureCoordinates({coordinates: feature.geometry.coordinates[0], type: 'Polygon'})
+                        : validateFeatureCoordinates(feature.geometry),
+                    textLabels: feature.geometry.textLabels
+                },
+                properties: {
+                    id: uuidv1(),
+                    isValidFeature: true,
+                    geometryTitle: feature.properties[cadastreLayerIdParcelle(state)],
+                    values: feature.properties?.values || []
+                },
+                style: [{
+                    ...feature.style,
+                    type: feature.geometry.type,
+                    id: uuidv1(),
+                    geometry: null,
+                    title: `${feature.geometry.type} Style`,
+                    filtering: true
+                }]
+            }))
+        ],
+        properties: {
+            id,
+            description: '',
+            type: 'Cadastrapp',
+            title: getMessageById(currentMessagesSelector(state), "cadastrapp.result.parcelle.selectedPlots"),
+            iconGlyph: 'geometry-collection'
+        },
+        id,
+        style: {},
+        newFeature: true,
+        visibility: true
+    };
+};