geosolutions-it#8334 Persist viewer type in the map configuration

allyoucanmap · Mar 1, 2023 · 3f7daf8 · 3f7daf8
1 parent 257a7f4
commit 3f7daf8
Show file tree

Hide file tree

Showing 83 changed files with 481 additions and 562 deletions.
diff --git a/web/client/actions/__tests__/globeswitcher-test.js b/web/client/actions/__tests__/globeswitcher-test.js
diff --git a/web/client/actions/__tests__/maptype-test.js b/web/client/actions/__tests__/maptype-test.js
@@ -8,7 +8,7 @@
 
 import expect from 'expect';
 
-import { MAP_TYPE_CHANGED, changeMapType, updateLast2dMapType, UPDATE_LAST_2D_MAPTYPE } from '../maptype';
+import { MAP_TYPE_CHANGED, changeMapType } from '../maptype';
 
 describe('Test correctness of the maptype actions', () => {
 
@@ -18,10 +18,4 @@ describe('Test correctness of the maptype actions', () => {
         expect(retVal.type).toBe(MAP_TYPE_CHANGED);
         expect(retVal.mapType).toBe('maptype');
     });
-    it('updateLast2dMapType', () => {
-        const retVal = updateLast2dMapType("leaflet");
-        expect(retVal).toExist();
-        expect(retVal.type).toBe(UPDATE_LAST_2D_MAPTYPE);
-        expect(retVal.mapType).toBe('leaflet');
-    });
 });
diff --git a/web/client/actions/globeswitcher.js b/web/client/actions/globeswitcher.js
diff --git a/web/client/actions/maptype.js b/web/client/actions/maptype.js
@@ -7,13 +7,14 @@
  */
 
 export const MAP_TYPE_CHANGED = 'MAP_TYPE_CHANGED';
-export const UPDATE_LAST_2D_MAPTYPE = "MAP_TYPE:UPDATE_LAST_2D_MAPTYPE";
+export const VISUALIZATION_MODE_CHANGED = 'MAP_TYPE:VISUALIZATION_MODE_CHANGED';
 
 /**
  * changes the map type
+ * @deprecated
  * @memberof actions.maptype
  * @param  {string} mapType the mapType.
- * @return {action}         the action of type `MAP_TYPE_CHANGED` with mapType
+ * @return {action} the action of type `MAP_TYPE_CHANGED` with mapType
  */
 export function changeMapType(mapType) {
     return {
@@ -22,24 +23,17 @@ export function changeMapType(mapType) {
     };
 }
 /**
- * Saves the last 2d map
- * @memberof actions.globeswitcher
- * @param  {string} mapType last maptype
- * @return {object}         action
- * ```
- * {
- *   type: MAPTYPE_2D_SELECTED,
- *   mapType
- * }
- * ```
+ * changes the visualization mode
+ * @memberof actions.maptype
+ * @param  {string} visualizationMode eg: 2D or 3D.
+ * @return {action} the action of type `VISUALIZATION_MODE_CHANGED` with visualizationMode
  */
-export function updateLast2dMapType(mapType) {
+export function changeVisualizationMode(visualizationMode) {
     return {
-        type: UPDATE_LAST_2D_MAPTYPE,
-        mapType
+        type: VISUALIZATION_MODE_CHANGED,
+        visualizationMode
     };
 }
-
 /**
  * Actions for map type management.Allow to manage the default map type.
  * @name actions.maptype

diff --git a/web/client/api.html b/web/client/api.html
@@ -30,7 +30,7 @@
         <script type="text/javascript">
         function init() {
             MapStore2.create('container', {
-                originalUrl: "./#viewer/leaflet/0"
+                originalUrl: "./#viewer/0"
             });
         }
         </script>

diff --git a/web/client/api/media/__tests__/geostore-test.js b/web/client/api/media/__tests__/geostore-test.js
@@ -168,7 +168,8 @@ describe('GeoStore media api', () => {
                         canEdit: true,
                         name: 'Name',
                         description: 'Description',
-                        type: 'map'
+                        type: 'map',
+                        visualizationMode: '2D'
                     });
                     done();
                 },

diff --git a/web/client/api/media/geostore.js b/web/client/api/media/geostore.js
@@ -9,7 +9,7 @@ import { Observable } from 'rxjs';
 import castArray from 'lodash/castArray';
 import { excludeGoogleBackground, extractTileMatrixFromSources } from '../../utils/LayersUtils';
 import { convertFromLegacy, normalizeConfig } from '../../utils/ConfigUtils';
-
+import { VisualizationModes } from "../../utils/MapTypeUtils";
 import { getResource, getResources } from '../persistence';
 import uuid from 'uuid';
 
@@ -88,7 +88,8 @@ export const getData = ({ selectedItem }) => {
                             const tileMatrix = extractTileMatrixFromSources(mapState.map.sources, layer);
                             return { ...layer, ...tileMatrix };
                         })
-                        : layers
+                        : layers,
+                    visualizationMode: config?.visualizationMode || VisualizationModes._2D
                 };
 
                 return Observable.of({

diff --git a/web/client/components/buttons/GoFullButton.jsx b/web/client/components/buttons/GoFullButton.jsx
@@ -38,7 +38,7 @@ class GoFullButton extends React.Component {
         glyph: "share",
         tooltip: "fullscreen.viewLargerMap",
         urlRegex: "^(.*?)embedded.html.*?#\\/(\\d?)",
-        urlReplaceString: "$1#/viewer/leaflet/$2"
+        urlReplaceString: "$1#/viewer/$2"
     };
 
     render() {

diff --git a/web/client/components/contextcreator/ConfigureMapStep.jsx b/web/client/components/contextcreator/ConfigureMapStep.jsx
@@ -11,11 +11,12 @@ import React from 'react';
 import Message from '../I18N/Message';
 import ConfirmDialog from '../misc/ConfirmDialog';
 import MapViewer from '../../containers/MapViewer';
+import { MapLibraries } from '../../utils/MapTypeUtils';
 
 export default ({
     pluginsConfig = {},
     plugins = {},
-    mapType = 'openlayers',
+    mapType = MapLibraries.OPENLAYERS,
     className = 'viewer context-creator-viewer',
     showConfirm = false,
     confirmMessage = 'contextCreator.configureMap.confirm',

diff --git a/web/client/components/contextcreator/ContextCreator.jsx b/web/client/components/contextcreator/ContextCreator.jsx
@@ -233,7 +233,8 @@ export default class ContextCreator extends React.Component {
             "Undo",
             "Redo",
             "Expander",
-            "FilterLayer"
+            "FilterLayer",
+            "GlobeViewSwitcher"
         ],
         ignoreViewerPlugins: false,
         allAvailablePlugins: [],

diff --git a/web/client/components/data/featuregrid/toolbars/Toolbar.jsx b/web/client/components/data/featuregrid/toolbars/Toolbar.jsx
@@ -10,6 +10,7 @@ import { getApi } from '../../../../api/userPersistedStorage';
 import TSplitButtonComp from "./TSplitButton";
 import Spinner from "react-spinkit";
 import Select from "react-select";
+import { MapLibraries } from '../../../../utils/MapTypeUtils';
 
 const TButton = withHint(TButtonComp);
 const TSplitButton = withHint(TSplitButtonComp);
@@ -172,7 +173,7 @@ const standardButtons = {
         id="snap-button"
         keyProp="snap-button"
         tooltipId={snapping ? "featuregrid.toolbar.disableSnapping" : "featuregrid.toolbar.enableSnapping"}
-        visible={mode === "EDIT" && (pluginCfg?.snapTool ?? true) && mapType === 'openlayers'}
+        visible={mode === "EDIT" && (pluginCfg?.snapTool ?? true) && mapType === MapLibraries.OPENLAYERS}
         onClick={() => {
             events.toggleSnapping && events.toggleSnapping(!snapping);
         }}

diff --git a/web/client/components/geostory/common/map/Controls.jsx b/web/client/components/geostory/common/map/Controls.jsx
@@ -12,6 +12,7 @@ import Message from '../../../I18N/Message';
 import Select from "react-select";
 import {isNil} from "lodash";
 import { applyDefaults } from '../../../../utils/GeoStoryUtils';
+import { VisualizationModes } from '../../../../utils/MapTypeUtils';
 
 import SwitchButton from '../../../misc/switch/SwitchButton';
 import localizedProps from '../../../misc/enhancers/localizedProps';
@@ -30,8 +31,9 @@ export const Controls = ({
         zoomControl: !isNil(map.zoomControl) ? map.zoomControl : true,
         mapInfoControl: !isNil(map.mapInfoControl) ? map.mapInfoControl : false
     });
+    const is3D = map?.visualizationMode === VisualizationModes._3D;
     return (<Form className="ms-geostory-map-controls">
-        <FormGroup>
+        {!is3D && <FormGroup>
             <ControlLabel><Message msgId="geostory.mapEditor.zoom"/></ControlLabel>
             <SwitchButton
                 onChange={() => {
@@ -60,7 +62,7 @@ export const Controls = ({
                 onChange={(val) => onChangeMap("mapOptions.zoomPosition", val && val.value ? val.value : "topLeft")}
                 placeholder="geostory.builder.settings.titlePlaceholder"
             />
-        </FormGroup>
+        </FormGroup>}
         <FormGroup>
             <ControlLabel><Message msgId="geostory.mapEditor.pan"/></ControlLabel>
             <SwitchButton
@@ -75,7 +77,7 @@ export const Controls = ({
                 checked={options.mapOptions && options.mapOptions.interactions && options.mapOptions.interactions.dragPan}
             />
         </FormGroup>
-        <FormGroup>
+        {!is3D && <FormGroup>
             <ControlLabel><Message msgId="geostory.mapEditor.identify"/></ControlLabel>
             <SwitchButton
                 onChange={() => {
@@ -93,7 +95,7 @@ export const Controls = ({
                 selectProps={{
                     wrapperStyle: { marginTop: 10 }
                 }}/>}
-        </FormGroup>
+        </FormGroup>}
     </Form>);
 };
 

diff --git a/web/client/components/geostory/common/map/FitBounds.jsx b/web/client/components/geostory/common/map/FitBounds.jsx
@@ -11,9 +11,10 @@ import PropTypes from 'prop-types';
 
 import { reprojectBbox, reproject } from '../../../../utils/CoordinatesUtils';
 import Point from 'ol/geom/Point';
+import { MapLibraries } from '../../../../utils/MapTypeUtils';
 
 const zoomTo = {
-    openlayers: {
+    [MapLibraries.OPENLAYERS]: {
         fit: ({ map, geometry, padding, geometryProjection, fixedZoom, maxZoom, duration }) => {
             const view = map.getView();
             const mapProjection = view.getProjection().getCode();
@@ -32,7 +33,7 @@ const zoomTo = {
             });
         }
     },
-    leaflet: {
+    [MapLibraries.LEAFLET]: {
         fit: ({ map, geometry, padding, geometryProjection, fixedZoom, maxZoom, duration }) => {
             const zoom = fixedZoom ? map.getZoom() : maxZoom;
             const { top = 0, right = 0, bottom = 0, left = 0 } = padding;

diff --git a/web/client/components/geostory/common/map/LocalDrawSupport.jsx b/web/client/components/geostory/common/map/LocalDrawSupport.jsx
@@ -9,7 +9,7 @@
 import React, { useState, useEffect } from "react";
 import PropTypes from 'prop-types';
 import DrawSupport from '../../../map/openlayers/DrawSupport';
-
+import { MapLibraries } from '../../../../utils/MapTypeUtils';
 /**
  * A draw support interface to use as component instead of plugin
  * @prop {object} map map library instance object
@@ -37,7 +37,7 @@ function LocalDrawSupport({
         setStatus(active ? 'drawOrEdit' : 'clean');
     }, [active]);
 
-    if (mapType !== 'openlayers') {
+    if (mapType !== MapLibraries.OPENLAYERS) {
         return null;
     }
 

diff --git a/web/client/components/geostory/media/Map.jsx b/web/client/components/geostory/media/Map.jsx
@@ -16,6 +16,8 @@ import Portal from '../../../components/misc/Portal';
 import tooltip from '../../../components/misc/enhancers/tooltip';
 import { withResizeDetector } from 'react-resize-detector';
 
+import { MapLibraries } from '../../../utils/MapTypeUtils';
+
 import ButtonRB from '../../misc/Button';
 const Button = tooltip(ButtonRB);
 
@@ -37,7 +39,7 @@ export default compose(
     size,
     showCaption,
     caption: contentCaption,
-    mapType = "leaflet", // default for when map MediaViewer is not connected to redux
+    mapType = MapLibraries.LEAFLET, // default for when map MediaViewer is not connected to redux
     onMapTypeLoaded,
     layers: geoStoryLayers,
     children,

diff --git a/web/client/components/import/ShapefileUploadAndStyle.jsx b/web/client/components/import/ShapefileUploadAndStyle.jsx
@@ -31,6 +31,7 @@ import {
 import Button from '../misc/Button';
 import SelectShape from './SelectShape';
 import { Promise } from 'es6-promise';
+import { MapLibraries } from '../../utils/MapTypeUtils';
 
 class ShapeFileUploadAndStyle extends React.Component {
     static propTypes = {
@@ -98,7 +99,7 @@ class ShapeFileUploadAndStyle extends React.Component {
             }
             return null;
         }),
-        mapType: "leaflet",
+        mapType: MapLibraries.LEAFLET,
         stylers: {},
         buttonSize: "small",
         uploadOptions: {},

diff --git a/web/client/components/import/style/StylePanel.jsx b/web/client/components/import/style/StylePanel.jsx
@@ -18,6 +18,7 @@ import { toVectorStyle } from '../../../utils/StyleUtils';
 
 import Button from '../../misc/Button';
 import { checkFeaturesStyle } from '../../../utils/ImporterUtils';
+import { MapLibraries } from '../../../utils/MapTypeUtils';
 
 class StylePanel extends React.Component {
     static propTypes = {
@@ -53,7 +54,7 @@ class StylePanel extends React.Component {
     };
 
     static defaultProps = {
-        mapType: "leaflet",
+        mapType: MapLibraries.LEAFLET,
         buttonSize: "small",
         setLayers: () => {},
         addLayer: () => {},

diff --git a/web/client/components/map/BaseMap.jsx b/web/client/components/map/BaseMap.jsx
@@ -123,10 +123,14 @@ class BaseMap extends React.Component {
     };
 
     renderTools = () => {
-        return this.props.tools.map((tool) => {
-            const {impl: Tool, name, ...options} = this.getTool(tool);
-            return <Tool key={name} {...options} />;
-        });
+        return this.props.tools
+            .filter((tool) => {
+                return this.props?.plugins?.tools?.[isString(tool) ? tool : tool?.name];
+            })
+            .map((tool) => {
+                const {impl: Tool, name, ...options} = this.getTool(tool);
+                return <Tool key={name} {...options} />;
+            });
     };
 
     render() {