Add action to change map rotation (#1273)

geosolutions-it · Nov 15, 2016 · b5b3eb1 · b5b3eb1
1 parent 361e868
commit b5b3eb1
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 4 deletions.
diff --git a/web/client/actions/__tests__/map-test.js b/web/client/actions/__tests__/map-test.js
@@ -14,12 +14,14 @@ var {
     CHANGE_ZOOM_LVL,
     CHANGE_MAP_CRS,
     CHANGE_MAP_STYLE,
+    CHANGE_ROTATION,
     changeMapView,
     clickOnMap,
     changeMousePointer,
     changeZoomLevel,
     changeMapCrs,
-    changeMapStyle
+    changeMapStyle,
+    changeRotation
 } = require('../map');
 
 describe('Test correctness of the map actions', () => {
@@ -87,4 +89,14 @@ describe('Test correctness of the map actions', () => {
         expect(retval.style).toBe(style);
         expect(retval.mapStateSource).toBe(mapStateSource);
     });
+
+    it('changeRotation', () => {
+        let angle = 0.5235987755982989;
+        let mapStateSource = "test";
+        let retval = changeRotation(angle, mapStateSource);
+        expect(retval).toExist();
+        expect(retval.type).toEqual(CHANGE_ROTATION);
+        expect(retval.rotation).toEqual(angle);
+        expect(retval.mapStateSource).toEqual(mapStateSource);
+    });
 });
diff --git a/web/client/actions/map.js b/web/client/actions/map.js
@@ -14,6 +14,7 @@ const PAN_TO = 'PAN_TO';
 const ZOOM_TO_EXTENT = 'ZOOM_TO_EXTENT';
 const CHANGE_MAP_CRS = 'CHANGE_MAP_CRS';
 const CHANGE_MAP_STYLE = 'CHANGE_MAP_STYLE';
+const CHANGE_ROTATION = 'CHANGE_ROTATION';
 
 
 function changeMapView(center, zoom, bbox, size, mapStateSource, projection) {
@@ -73,6 +74,14 @@ function zoomToExtent(extent, crs) {
     };
 }
 
+function changeRotation(rotation, mapStateSource) {
+    return {
+        type: CHANGE_ROTATION,
+        rotation,
+        mapStateSource
+    };
+}
+
 function changeMapStyle(style, mapStateSource) {
     return {
         type: CHANGE_MAP_STYLE,
@@ -89,12 +98,14 @@ module.exports = {
     ZOOM_TO_EXTENT,
     CHANGE_MAP_CRS,
     CHANGE_MAP_STYLE,
+    CHANGE_ROTATION,
     changeMapView,
     clickOnMap,
     changeMousePointer,
     changeZoomLevel,
     changeMapCrs,
     zoomToExtent,
     panTo,
-    changeMapStyle
+    changeMapStyle,
+    changeRotation
 };
diff --git a/web/client/components/map/openlayers/Map.jsx b/web/client/components/map/openlayers/Map.jsx
@@ -37,7 +37,8 @@ var OpenlayersMap = React.createClass({
         changeMeasurementState: React.PropTypes.func,
         registerHooks: React.PropTypes.bool,
         interactive: React.PropTypes.bool,
-        onInvalidLayer: React.PropTypes.func
+        onInvalidLayer: React.PropTypes.func,
+        bbox: React.PropTypes.object
     },
     getDefaultProps() {
         return {
@@ -312,6 +313,9 @@ var OpenlayersMap = React.createClass({
         if (Math.round(newProps.zoom) !== this.props.zoom) {
             view.setZoom(Math.round(newProps.zoom));
         }
+        if (newProps.bbox && newProps.bbox.rotation !== undefined && newProps.bbox.rotation !== this.props.bbox.rotation) {
+            view.setRotation(newProps.bbox.rotation);
+        }
     },
     normalizeCenter: function(center) {
         return ol.proj.transform(center, this.props.projection, 'EPSG:4326');

diff --git a/web/client/reducers/__tests__/map-test.js b/web/client/reducers/__tests__/map-test.js
@@ -112,4 +112,15 @@ describe('Test the map reducer', () => {
         expect(state.mapStateSource).toBe("test");
         expect(state.style.width).toBe(100);
     });
+    it('change map rotation', () => {
+        let rotation = 0.5235987755982989;
+        const action = {
+            type: 'CHANGE_ROTATION',
+            rotation: rotation,
+            mapStateSource: "test"
+        };
+        let state = mapConfig({}, action);
+        expect(state.bbox.rotation).toEqual(rotation);
+        expect(state.mapStateSource).toBe("test");
+    });
 });
diff --git a/web/client/reducers/map.js b/web/client/reducers/map.js
@@ -7,7 +7,8 @@
  */
 
 var {CHANGE_MAP_VIEW, CHANGE_MOUSE_POINTER,
-    CHANGE_ZOOM_LVL, CHANGE_MAP_CRS, ZOOM_TO_EXTENT, PAN_TO, CHANGE_MAP_STYLE} = require('../actions/map');
+    CHANGE_ZOOM_LVL, CHANGE_MAP_CRS, ZOOM_TO_EXTENT, PAN_TO, CHANGE_MAP_STYLE,
+    CHANGE_ROTATION} = require('../actions/map');
 
 
 var assign = require('object-assign');
@@ -69,6 +70,10 @@ function mapConfig(state = null, action) {
         case CHANGE_MAP_STYLE: {
             return assign({}, state, {mapStateSource: action.mapStateSource, style: action.style, resize: state.resize ? state.resize + 1 : 1});
         }
+        case CHANGE_ROTATION: {
+            let newBbox = assign({}, state.bbox, {rotation: action.rotation});
+            return assign({}, state, {bbox: newBbox, mapStateSource: action.mapStateSource});
+        }
         default:
             return state;
     }