diff --git a/web/client/actions/measurement.js b/web/client/actions/measurement.js index 6ce88c4a12..ad616d5494 100644 --- a/web/client/actions/measurement.js +++ b/web/client/actions/measurement.js @@ -5,13 +5,13 @@ * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. */ -const CHANGE_MEASUREMENT = 'CHANGE_MEASUREMENT'; +const CHANGE_MEASUREMENT_TOOL = 'CHANGE_MEASUREMENT_TOOL'; const CHANGE_MEASUREMENT_STATE = 'CHANGE_MEASUREMENT_STATE'; function changeMeasurement(measurement) { return { - type: CHANGE_MEASUREMENT, - measurement: measurement + type: CHANGE_MEASUREMENT_TOOL, + ...measurement }; } @@ -31,7 +31,7 @@ function changeMeasurementState(measureState) { } module.exports = { - CHANGE_MEASUREMENT, + CHANGE_MEASUREMENT_TOOL, CHANGE_MEASUREMENT_STATE, changeMeasurement, changeMeasurementState diff --git a/web/client/components/mapcontrols/measure/MeasureComponent.jsx b/web/client/components/mapcontrols/measure/MeasureComponent.jsx index 6faea87175..af81d884e8 100644 --- a/web/client/components/mapcontrols/measure/MeasureComponent.jsx +++ b/web/client/components/mapcontrols/measure/MeasureComponent.jsx @@ -36,11 +36,15 @@ const MeasureComponent = React.createClass({ areaLabel: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.element]), bearingLabel: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.element]), uom: React.PropTypes.shape({ - length: React.PropTypes.shape({ unit: React.PropTypes.string.isRequired, - label: React.PropTypes.string.isRequired}), - area: React.PropTypes.shape({ unit: React.PropTypes.string.isRequired, - label: React.PropTypes.string.isRequired}) - }), + length: React.PropTypes.shape({ + unit: React.PropTypes.string.isRequired, + label: React.PropTypes.string.isRequired + }), + area: React.PropTypes.shape({ + unit: React.PropTypes.string.isRequired, + label: React.PropTypes.string.isRequired + }) + }), toggleMeasure: React.PropTypes.func, measurement: React.PropTypes.object, lineMeasureEnabled: React.PropTypes.bool, @@ -84,85 +88,24 @@ const MeasureComponent = React.createClass({ return !isEqual(nextProps, this.props); }, onLineClick: function() { - var newMeasureState; - if (this.props.lineMeasureEnabled === false) { - newMeasureState = { - lineMeasureEnabled: true, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: 'LineString', - // reset old measurements - len: 0, - area: 0, - bearing: 0 - }; - this.props.toggleMeasure(newMeasureState); - } else { - newMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false - }; - this.props.toggleMeasure(newMeasureState); - } + this.props.toggleMeasure({ + geomType: 'LineString' + }); }, onAreaClick: function() { - var newMeasureState; - if (this.props.areaMeasureEnabled === false) { - newMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: true, - bearingMeasureEnabled: false, - geomType: 'Polygon', - // reset old measurements - len: 0, - area: 0, - bearing: 0 - }; - this.props.toggleMeasure(newMeasureState); - } else { - newMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false - }; - this.props.toggleMeasure(newMeasureState); - } + this.props.toggleMeasure({ + geomType: 'Polygon' + }); }, onBearingClick: function() { - var newMeasureState; - if (this.props.bearingMeasureEnabled === false) { - newMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: true, - geomType: 'Bearing', - // reset old measurements - len: 0, - area: 0, - bearing: 0 - }; - this.props.toggleMeasure(newMeasureState); - } else { - newMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false - }; - this.props.toggleMeasure(newMeasureState); - } + this.props.toggleMeasure({ + geomType: 'Bearing' + }); }, onResetClick: function() { - var resetMeasureState = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: null, - len: 0, - area: 0, - bearing: 0 - }; - this.props.toggleMeasure(resetMeasureState); + this.props.toggleMeasure({ + geomType: null + }); }, getToolTips() { return { diff --git a/web/client/components/mapcontrols/measure/MeasureResults.jsx b/web/client/components/mapcontrols/measure/MeasureResults.jsx index 4c9f6662ec..3bdeedd09e 100644 --- a/web/client/components/mapcontrols/measure/MeasureResults.jsx +++ b/web/client/components/mapcontrols/measure/MeasureResults.jsx @@ -28,11 +28,15 @@ const MeasureResults = React.createClass({ areaLabel: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.element]), bearingLabel: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.element]), uom: React.PropTypes.shape({ - length: React.PropTypes.shape({ unit: React.PropTypes.string.isRequired, - label: React.PropTypes.string.isRequired}), - area: React.PropTypes.shape({ unit: React.PropTypes.string.isRequired, - label: React.PropTypes.string.isRequired}) - }), + length: React.PropTypes.shape({ + unit: React.PropTypes.string.isRequired, + label: React.PropTypes.string.isRequired + }), + area: React.PropTypes.shape({ + unit: React.PropTypes.string.isRequired, + label: React.PropTypes.string.isRequired + }) + }), toggleMeasure: React.PropTypes.func, measurement: React.PropTypes.object, lineMeasureEnabled: React.PropTypes.bool, diff --git a/web/client/components/mapcontrols/measure/__tests__/MeasureComponent-test.jsx b/web/client/components/mapcontrols/measure/__tests__/MeasureComponent-test.jsx index ac48c0a23e..b2aed87e94 100644 --- a/web/client/components/mapcontrols/measure/__tests__/MeasureComponent-test.jsx +++ b/web/client/components/mapcontrols/measure/__tests__/MeasureComponent-test.jsx @@ -55,13 +55,7 @@ describe("test the MeasureComponent", () => { it('test line activation', () => { let newMeasureState; let measurement = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: 'LineString', - len: 0, - area: 0, - bearing: 0 + geomType: null }; const cmp = ReactDOM.render( { lineBtn.click(); expect(newMeasureState).toExist(); - expect(newMeasureState.lineMeasureEnabled).toBe(true); + expect(newMeasureState.geomType).toBe('LineString'); }); it('test area activation', () => { let newMeasureState; let measurement = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: 'LineString', - len: 0, - area: 0, - bearing: 0 + geomType: null }; const cmp = ReactDOM.render( { areaBtn.click(); expect(newMeasureState).toExist(); - expect(newMeasureState.areaMeasureEnabled).toBe(true); + expect(newMeasureState.geomType).toBe('Polygon'); }); it('test bearing activation', () => { let newMeasureState; let measurement = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: 'LineString', - len: 0, - area: 0, - bearing: 0 + geomType: null }; const cmp = ReactDOM.render( { bearingBtn.click(); expect(newMeasureState).toExist(); - expect(newMeasureState.bearingMeasureEnabled).toBe(true); + expect(newMeasureState.geomType).toBe('Bearing'); }); it('test measurements resetting', () => { let newMeasureState; let measurement = { - lineMeasureEnabled: false, - areaMeasureEnabled: false, - bearingMeasureEnabled: false, - geomType: 'LineString', - len: 0, - area: 0, - bearing: 0 + geomType: 'Bearing' }; const cmp = ReactDOM.render( { newMeasureState = data; - }} />, document.getElementById("container") + }} + withReset={true} + />, document.getElementById("container") ); expect(cmp).toExist(); @@ -178,19 +156,15 @@ describe("test the MeasureComponent", () => { expect(cmpDom).toExist(); const buttons = cmpDom.getElementsByTagName('button'); - expect(buttons.length).toBe(3); + expect(buttons.length).toBe(4); - const bearingBtn = buttons.item(2); - // Activate - bearingBtn.click(); + const resetBtn = buttons.item(3); // Dectivate - bearingBtn.click(); + resetBtn.click(); expect(newMeasureState).toExist(); - expect(newMeasureState.lineMeasureEnabled).toBe(false); - expect(newMeasureState.areaMeasureEnabled).toBe(false); - expect(newMeasureState.bearingMeasureEnabled).toBe(false); + expect(newMeasureState.geomType).toBe(null); }); it('test bearing format', () => { diff --git a/web/client/localConfig.json b/web/client/localConfig.json index c1f947c8d3..fb5f3fac2f 100644 --- a/web/client/localConfig.json +++ b/web/client/localConfig.json @@ -13,15 +13,16 @@ "method": "basic" } ], - "plugins": { - "mobile": [{ - "name": "Map", - "cfg": { - "zoomControl": false, - "tools": ["locate"] - } - }, - { + "plugins": { + "mobile": [ + { + "name": "Map", + "cfg": { + "zoomControl": false, + "tools": ["locate"] + } + }, + { "name": "DrawerMenu", "cfg": { "glyph": "1-stilo", @@ -217,8 +218,9 @@ "cfg":{ "className": "square-button" } - }], - "desktop": [{ + } + ], + "desktop": [{ "name": "Map", "cfg": { "toolsOptions": { @@ -254,7 +256,7 @@ "name": "Identify", "showIn": ["IdentifyBar", "Settings"], "cfg": { - "panelClassName": "modal-dialog info-panel modal-content", + "panelClassName": "modal-dialog info-panel modal-content", "headerClassName": "modal-header", "bodyClassName": "modal-body info-wrap", "asPanel": false, @@ -501,7 +503,9 @@ "alwaysVisible": true } } - }, { + }, + "OmniBar", + { "name": "Login", "cfg": { "nav": false, @@ -526,7 +530,6 @@ }] } }, - "OmniBar", { "name" : "Save", "cfg": { @@ -563,7 +566,8 @@ "className": "square-button" } } - }], "embedded": [ + }], + "embedded": [ { "name": "Map", "cfg": { diff --git a/web/client/plugins/Measure.jsx b/web/client/plugins/Measure.jsx index 4d9146043e..76f8a5c706 100644 --- a/web/client/plugins/Measure.jsx +++ b/web/client/plugins/Measure.jsx @@ -14,7 +14,7 @@ const lineRuleIcon = require('./toolbar/assets/img/line-ruler.png'); const assign = require('object-assign'); -const {changeMeasurementState} = require('../actions/measurement'); +const {changeMeasurement} = require('../actions/measurement'); const Measure = require('../components/mapcontrols/measure/MeasureComponent'); @@ -40,7 +40,7 @@ const MeasurePlugin = connect((state) => { bearingMeasureEnabled: state.measurement && state.measurement.bearingMeasureEnabled || false }; }, { - toggleMeasure: changeMeasurementState + toggleMeasure: changeMeasurement })(MeasureComponent); module.exports = { diff --git a/web/client/plugins/MeasureResults.jsx b/web/client/plugins/MeasureResults.jsx index 65a3020e5d..3de34bed9d 100644 --- a/web/client/plugins/MeasureResults.jsx +++ b/web/client/plugins/MeasureResults.jsx @@ -10,7 +10,7 @@ const {connect} = require('react-redux'); const Message = require('./locale/Message'); -const {changeMeasurementState} = require('../actions/measurement'); +const {changeMeasurement} = require('../actions/measurement'); const MeasureRes = require('../components/mapcontrols/measure/MeasureResults'); @@ -33,7 +33,7 @@ const MeasureResultsPlugin = connect((state) => { bearingMeasureEnabled: state.measurement && state.measurement.bearingMeasureEnabled || false }; }, { - toggleMeasure: changeMeasurementState + toggleMeasure: changeMeasurement })(MeasureComponent); module.exports = { diff --git a/web/client/reducers/measurement.js b/web/client/reducers/measurement.js index 93194bc2bf..cd5c0cea65 100644 --- a/web/client/reducers/measurement.js +++ b/web/client/reducers/measurement.js @@ -7,7 +7,7 @@ */ var { - CHANGE_MEASUREMENT, + CHANGE_MEASUREMENT_TOOL, CHANGE_MEASUREMENT_STATE } = require('../actions/measurement'); @@ -19,9 +19,12 @@ function measurement(state = { bearingMeasureEnabled: false }, action) { switch (action.type) { - case CHANGE_MEASUREMENT: + case CHANGE_MEASUREMENT_TOOL: return assign({}, state, { - measurement: action.measurement + lineMeasureEnabled: ((action.geomType !== state.geomType) && (action.geomType === 'LineString')), + areaMeasureEnabled: ((action.geomType !== state.geomType) && (action.geomType === 'Polygon')), + bearingMeasureEnabled: ((action.geomType !== state.geomType) && (action.geomType === 'Bearing')), + geomType: (action.geomType === state.geomType) ? null : action.geomType }); case CHANGE_MEASUREMENT_STATE: return assign({}, state, {