qwc2 2025.12.15 → 2025.12.18

package/plugins/MapFilter.js

@@ -290,12 +290,12 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
       var commitButtons = [{
         key: 'Save',
         icon: 'ok',
-        label: LocaleUtils.tr("mapfilter.save"),
+        label: LocaleUtils.tr("common.save"),
         extraClasses: "button-accept"
       }, {
         key: 'Cancel',
         icon: 'remove',
-        label: LocaleUtils.tr("mapfilter.cancel"),
+        label: LocaleUtils.tr("common.cancel"),
         extraClasses: "button-reject"
       }];
       var sampleFilters = '["field", "=", "val"]\n' + '[["field", ">", "val1"], "and", ["field", "<", "val2"]]';
@@ -389,7 +389,7 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
             value: _this.state.filters[config.id].values[field.id]
           }, !field.defaultValue ? /*#__PURE__*/React.createElement("option", {
             value: ""
-          }, LocaleUtils.tr("mapfilter.select")) : null, field.inputConfig.options.map(function (entry) {
+          }, LocaleUtils.tr("common.select")) : null, field.inputConfig.options.map(function (entry) {
             var _entry$value, _entry$value2, _entry$label;
             return /*#__PURE__*/React.createElement("option", {
               key: (_entry$value = entry.value) !== null && _entry$value !== void 0 ? _entry$value : entry,
@@ -483,7 +483,7 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
           onChange: function onChange(value) {
             return _this.updateCustomFilter(key, 'layer', value);
           },
-          placeholder: LocaleUtils.tr("mapfilter.selectlayer"),
+          placeholder: LocaleUtils.tr("common.selectlayer"),
           value: entry.layer
         }, layerNames.map(function (layerName) {
           return /*#__PURE__*/React.createElement("div", {
@@ -518,19 +518,19 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
       var geomFilter = _this.state.geomFilter;
       var filterButtons = [{
         key: "Polygon",
-        tooltip: LocaleUtils.tr("redlining.polygon"),
+        tooltip: LocaleUtils.tr("common.polygon"),
         icon: "polygon",
-        label: LocaleUtils.tr("redlining.polygon")
+        label: LocaleUtils.tr("common.polygon")
       }, {
         key: "Circle",
-        tooltip: LocaleUtils.tr("redlining.circle"),
+        tooltip: LocaleUtils.tr("common.circle"),
         icon: "circle",
-        label: LocaleUtils.tr("redlining.circle")
+        label: LocaleUtils.tr("common.circle")
       }, {
         key: "Pick",
-        tooltip: LocaleUtils.tr("redlining.pick"),
+        tooltip: LocaleUtils.tr("common.pick"),
         icon: "pick",
-        label: LocaleUtils.tr("redlining.pick")
+        label: LocaleUtils.tr("common.pick")
       }];
       var active = geomFilter.picking ? "Pick" : geomFilter.geomType || "";
       return /*#__PURE__*/React.createElement("div", {

package/plugins/Measure.js

@@ -52,7 +52,8 @@ var Measure = /*#__PURE__*/function (_React$Component) {
         bearingHeadMarker: _this.props.bearingHeadMarker,
         bearingTailMarker: _this.props.bearingTailMarker,
         lineHeadMarker: _this.props.lineHeadMarker,
-        lineTailMarker: _this.props.lineTailMarker
+        lineTailMarker: _this.props.lineTailMarker,
+        markerScale: _this.props.markerScale
       });
       _this.props.setSnappingConfig(_this.props.snapping, _this.props.snappingActive);
     });
@@ -199,6 +200,8 @@ _defineProperty(Measure, "propTypes", {
   /** Tail marker of distance line measurement geometry. Can be one of `OUTARROW`, `INARROW`, `LINE`. */
   lineTailMarker: PropTypes.string,
   mapCrs: PropTypes.string,
+  /** Scale factor for all heade/tail markers. */
+  markerScale: PropTypes.number,
   measureState: PropTypes.object,
   setSnappingConfig: PropTypes.func,
   /** Whether to show the widget to switch between measure modes. */
@@ -210,6 +213,7 @@ _defineProperty(Measure, "propTypes", {
   snappingActive: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])
 });
 _defineProperty(Measure, "defaultProps", {
+  markerScale: 1,
   showMeasureModeSwitcher: true,
   snapping: true,
   snappingActive: true

package/plugins/NewsPopup.js

@@ -57,7 +57,7 @@ var NewsPopup = /*#__PURE__*/function (_React$Component) {
         className: "newspopup-dialog-popup-buttonbar"
       }, /*#__PURE__*/React.createElement("button", {
         onClick: _this.closeDialog
-      }, LocaleUtils.tr("newspopup.dialogclose")), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", {
+      }, LocaleUtils.tr("common.close")), /*#__PURE__*/React.createElement("label", null, /*#__PURE__*/React.createElement("input", {
         onChange: function onChange(ev) {
           return _this.setState({
             dontShowAgain: ev.target.checked

package/plugins/ObliqueView.js

@@ -23,14 +23,17 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import React from 'react';
 import { connect } from 'react-redux';
 import axios from 'axios';
+import isEqual from 'lodash.isequal';
 import ol from 'openlayers';
 import PropTypes from 'prop-types';
+import { zoomToExtent } from '../actions/map';
 import { setCurrentTask } from '../actions/task';
 import Icon from '../components/Icon';
 import ResizeableWindow from '../components/ResizeableWindow';
 import LayerRegistry from '../components/map/layers/index';
 import InputContainer from '../components/widgets/InputContainer';
 import ConfigUtils from '../utils/ConfigUtils';
+import CoordinatesUtils from '../utils/CoordinatesUtils';
 import LayerUtils from '../utils/LayerUtils';
 import LocaleUtils from '../utils/LocaleUtils';
 import MapUtils from '../utils/MapUtils';
@@ -116,17 +119,6 @@ var ObliqueView = /*#__PURE__*/function (_React$Component) {
       _this.setState({
         currentZoom: zoom
       });
-      _this.map.on('moveend', function () {
-        _this.setState(function (state) {
-          var newZoom = _this.map.getView().getZoom();
-          if (newZoom !== state.currentZoom) {
-            return {
-              currentZoom: newZoom
-            };
-          }
-          return null;
-        });
-      });
       var layers = [];
       var themeConfig = _this.props.theme.obliqueDatasets.find(function (entry) {
         return entry.name === _this.state.selectedDataset;
@@ -198,6 +190,33 @@ var ObliqueView = /*#__PURE__*/function (_React$Component) {
         s: 180
       }[_this.state.currentDirection];
     });
+    _defineProperty(_this, "sync2DExtent", function () {
+      if (!_this.state.datasetConfig) {
+        return;
+      }
+      _this.setState(function (state) {
+        var center = CoordinatesUtils.reproject(_this.props.map.center, _this.props.map.projection, state.datasetConfig.crs);
+        var resolution = MapUtils.computeForZoom(_this.props.map.resolutions, _this.props.map.zoom);
+        _this.map.getView().setCenter(center);
+        _this.map.getView().setResolution(resolution);
+        return {
+          currentCenter: center,
+          currentZoom: _this.map.getView().getZoom()
+        };
+      });
+    });
+    _defineProperty(_this, "trackFocus", function (ev) {
+      var _this$map, _this$map$getTargetEl, _mapEl$contains, _mapObliqueEl$contain;
+      var mapEl = document.getElementById("map");
+      var mapObliqueEl = (_this$map = _this.map) === null || _this$map === void 0 || (_this$map$getTargetEl = _this$map.getTargetElement) === null || _this$map$getTargetEl === void 0 ? void 0 : _this$map$getTargetEl.call(_this$map);
+      if (mapEl !== null && mapEl !== void 0 && (_mapEl$contains = mapEl.contains) !== null && _mapEl$contains !== void 0 && _mapEl$contains.call(mapEl, document.activeElement)) {
+        _this.focusedMap = "map";
+      } else if (mapObliqueEl !== null && mapObliqueEl !== void 0 && (_mapObliqueEl$contain = mapObliqueEl.contains) !== null && _mapObliqueEl$contain !== void 0 && _mapObliqueEl$contain.call(mapObliqueEl, document.activeElement)) {
+        _this.focusedMap = "mapOblique";
+      } else {
+        _this.focusedMap = null;
+      }
+    });
     var controls = ol.control.defaults({
       zoom: false,
       attribution: false,
@@ -210,15 +229,39 @@ var ObliqueView = /*#__PURE__*/function (_React$Component) {
       controls: controls,
       interactions: interactions
     });
-    _this.map.on('moveend', _this.searchClosestImage);
     _this.map.on('rotateend', _this.searchClosestImage);
+    _this.map.on('moveend', function () {
+      _this.searchClosestImage();
+      _this.setState(function (state) {
+        var newZoom = _this.map.getView().getZoom();
+        var newCenter = _this.map.getView().getCenter();
+        if (newZoom !== state.currentZoom || !isEqual(newCenter, state.currentCenter)) {
+          return {
+            currentZoom: newZoom,
+            currentCenter: newCenter
+          };
+        }
+        return null;
+      });
+    });
     _this.closestImage = null;
     _this.obliqueImageryLayer = null;
     _this.state = ObliqueView.defaultState;
+    _this.focusedMap = null;
     return _this;
   }
   _inherits(ObliqueView, _React$Component);
   return _createClass(ObliqueView, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      window.addEventListener('focus', this.trackFocus, true);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      window.removeEventListener('focus', this.trackFocus);
+    }
+  }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
       if (this.props.active && !prevProps.active) {
@@ -256,6 +299,13 @@ var ObliqueView = /*#__PURE__*/function (_React$Component) {
         var _this$map$getView2, _this$map$getView2$se;
         (_this$map$getView2 = this.map.getView()) === null || _this$map$getView2 === void 0 || (_this$map$getView2$se = _this$map$getView2.setZoom) === null || _this$map$getView2$se === void 0 || _this$map$getView2$se.call(_this$map$getView2, this.state.currentZoom);
       }
+      if (this.state.viewsLocked && this.state.datasetConfig) {
+        if (this.focusedMap === "map" && this.props.map.bbox !== prevProps.map.bbox) {
+          this.sync2DExtent();
+        } else if (this.focusedMap === "mapOblique" && (this.state.currentCenter !== prevState.currentCenter || this.state.currentZoom !== prevState.currentZoom)) {
+          this.props.zoomToExtent(this.map.getView().calculateExtent(), this.state.datasetConfig.crs);
+        }
+      }
     }
   }, {
     key: "render",
@@ -265,8 +315,25 @@ var ObliqueView = /*#__PURE__*/function (_React$Component) {
         return null;
       }
       var rot = this.getRotation();
+      var extraControls = [{
+        icon: "sync",
+        callback: this.sync2DExtent,
+        title: LocaleUtils.tr("common.sync2dview")
+      }, {
+        icon: "lock",
+        callback: function callback() {
+          return _this2.setState(function (state) {
+            return {
+              viewsLocked: !state.viewsLocked
+            };
+          });
+        },
+        title: LocaleUtils.tr("common.lock2dview"),
+        active: this.state.viewsLocked
+      }];
       return /*#__PURE__*/React.createElement(ResizeableWindow, {
         dockable: this.props.geometry.side,
+        extraControls: extraControls,
         icon: "oblique",
         initialHeight: this.props.geometry.initialHeight,
         initialWidth: this.props.geometry.initialWidth,
@@ -371,13 +438,14 @@ _defineProperty(ObliqueView, "propTypes", {
   }),
   /** The initial map scale. */
   initialScale: PropTypes.number,
-  mapBbox: PropTypes.object,
+  map: PropTypes.object,
   projection: PropTypes.string,
   /** A list of allowed map scales, in decreasing order. */
   scales: PropTypes.arrayOf(PropTypes.number),
   setCurrentTask: PropTypes.func,
   theme: PropTypes.object,
-  themes: PropTypes.object
+  themes: PropTypes.object,
+  zoomToExtent: PropTypes.func
 });
 _defineProperty(ObliqueView, "defaultProps", {
   geometry: {
@@ -396,15 +464,18 @@ _defineProperty(ObliqueView, "defaultState", {
   selectedDataset: null,
   datasetConfig: null,
   currentDirection: null,
-  currentZoom: 0
+  currentZoom: 0,
+  currentCenter: null,
+  viewsLocked: false
 });
 export default connect(function (state) {
   return {
     active: state.task.id === "ObliqueView",
-    mapBbox: state.map.bbox,
+    map: state.map,
     theme: state.theme.current,
     themes: state.theme.themes
   };
 }, {
-  setCurrentTask: setCurrentTask
+  setCurrentTask: setCurrentTask,
+  zoomToExtent: zoomToExtent
 })(ObliqueView);

package/plugins/Print.js

@@ -255,7 +255,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
           key: item.name,
           value: item.name
         }, _this.translateLayoutName(item));
-      })))), _this.props.formats.length > 1 ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.format")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("select", {
+      })))), _this.props.formats.length > 1 ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("common.format")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("select", {
         disabled: _this.state.printSeriesEnabled,
         name: "FORMAT",
         onChange: _this.formatChanged,
@@ -287,7 +287,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
         disabled: true,
         placeholder: LocaleUtils.tr("print.pickatlasfeature", _this.state.layout.atlasCoverageLayer),
         type: "text"
-      }))) : null, isEmpty(_this.state.atlasFeatures) ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.scale")), /*#__PURE__*/React.createElement("td", null, scaleChooser)) : null, resolutionChooser ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.resolution")), /*#__PURE__*/React.createElement("td", null, resolutionChooser)) : null, _this.props.displayRotation ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.rotation")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(InputContainer, null, /*#__PURE__*/React.createElement(NumberInput, {
+      }))) : null, isEmpty(_this.state.atlasFeatures) ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.scale")), /*#__PURE__*/React.createElement("td", null, scaleChooser)) : null, resolutionChooser ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("common.resolution")), /*#__PURE__*/React.createElement("td", null, resolutionChooser)) : null, _this.props.displayRotation ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.rotation")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(InputContainer, null, /*#__PURE__*/React.createElement(NumberInput, {
         decimals: 1,
         mobile: true,
         name: mapName + ":rotation",
@@ -338,7 +338,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
         value: _this.state.printSeriesOverlap
       }), /*#__PURE__*/React.createElement("span", {
         role: "suffix"
-      }, _this.state.printSeriesOverlap, "\xA0%")))) : null, !_this.props.inlinePrintOutput && _this.state.printSeriesEnabled ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("print.download")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("select", {
+      }, _this.state.printSeriesOverlap, "\xA0%")))) : null, !_this.props.inlinePrintOutput && _this.state.printSeriesEnabled ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("common.download")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("select", {
         onChange: _this.changeDownloadMode,
         role: "input",
         value: _this.state.downloadMode || ""
@@ -426,7 +426,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
         type: "submit"
       }, _this.state.printing ? /*#__PURE__*/React.createElement("span", {
         className: "print-wait"
-      }, /*#__PURE__*/React.createElement(Spinner, null), " ", LocaleUtils.tr("print.wait")) : LocaleUtils.tr("print.submit")))));
+      }, /*#__PURE__*/React.createElement(Spinner, null), " ", LocaleUtils.tr("common.wait")) : LocaleUtils.tr("print.submit")))));
     });
     _defineProperty(_this, "renderPrintLabelField", function (label, opts) {
       var defaultValue = opts.defaultValue || "";
@@ -562,7 +562,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
     _defineProperty(_this, "renderPrintOutputWindow", function () {
       var extraControls = [{
         icon: 'save',
-        title: LocaleUtils.tr('print.save'),
+        title: LocaleUtils.tr('common.save'),
         callback: _this.savePrintOutput
       }];
       return /*#__PURE__*/React.createElement(ResizeableWindow, {
@@ -585,7 +585,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
         className: "print-output-window-body"
       }, !_this.state.outputLoaded ? /*#__PURE__*/React.createElement("span", {
         className: "print-output-window-wait"
-      }, /*#__PURE__*/React.createElement(Spinner, null), " ", LocaleUtils.tr("print.wait")) : null, /*#__PURE__*/React.createElement("iframe", {
+      }, /*#__PURE__*/React.createElement(Spinner, null), " ", LocaleUtils.tr("common.wait")) : null, /*#__PURE__*/React.createElement("iframe", {
         name: "print-output-window",
         src: _this.state.pdfDataUrl
       })));
@@ -844,7 +844,7 @@ var Print = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this3 = this;
-      var minMaxTooltip = this.state.minimized ? LocaleUtils.tr("print.maximize") : LocaleUtils.tr("print.minimize");
+      var minMaxTooltip = this.state.minimized ? LocaleUtils.tr("window.maximize") : LocaleUtils.tr("window.minimize");
       var extraTitlebarContent = /*#__PURE__*/React.createElement(Icon, {
         className: "print-minimize-maximize",
         icon: this.state.minimized ? 'chevron-down' : 'chevron-up',
@@ -1196,7 +1196,7 @@ _defineProperty(Print, "propTypes", {
   printExternalLayers: PropTypes.bool,
   /** Whether to print highlights on the map, e.g. selected features or redlining. */
   printMapHighlights: PropTypes.bool,
-  /** Restrict print scale to list of predefine print scales, if any. */
+  /** Restrict print scale to list of predefined print scales, if any. */
   restrictToPrintScales: PropTypes.bool,
   /** Scale factor to apply to line widths, font sizes, ... of redlining drawings passed to GetPrint.  */
   scaleFactor: PropTypes.number,

package/plugins/Redlining.js

@@ -39,6 +39,7 @@ import { LayerRole, addLayer } from '../actions/layers';
 import { setSnappingConfig } from '../actions/map';
 import { changeRedliningState, resetRedliningState } from '../actions/redlining';
 import Icon from '../components/Icon';
+import MeasureSwitcher from '../components/MeasureSwitcher';
 import TaskBar from '../components/TaskBar';
 import ButtonBar from '../components/widgets/ButtonBar';
 import ColorButton from '../components/widgets/ColorButton';
@@ -114,7 +115,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
       var activeButton = _this.props.redlining.action === "Draw" ? _this.props.redlining.geomType : _this.props.redlining.action;
       var drawButtons = [{
         key: "Point",
-        tooltip: LocaleUtils.tr("redlining.point"),
+        tooltip: LocaleUtils.tr("common.point"),
         icon: "point",
         data: {
           action: "Draw",
@@ -123,7 +124,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       }, {
         key: "LineString",
-        tooltip: LocaleUtils.tr("redlining.line"),
+        tooltip: LocaleUtils.tr("common.line"),
         icon: "line",
         data: {
           action: "Draw",
@@ -132,7 +133,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       }, [{
         key: "Polygon",
-        tooltip: LocaleUtils.tr("redlining.polygon"),
+        tooltip: LocaleUtils.tr("common.polygon"),
         icon: "polygon",
         data: {
           action: "Draw",
@@ -141,7 +142,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       }, toolEnabled("Circle") ? {
         key: "Circle",
-        tooltip: LocaleUtils.tr("redlining.circle"),
+        tooltip: LocaleUtils.tr("common.circle"),
         icon: "circle",
         data: {
           action: "Draw",
@@ -150,7 +151,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       } : null, toolEnabled("Ellipse") ? {
         key: "Ellipse",
-        tooltip: LocaleUtils.tr("redlining.ellipse"),
+        tooltip: LocaleUtils.tr("common.ellipse"),
         icon: "ellipse",
         data: {
           action: "Draw",
@@ -159,7 +160,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       } : null, toolEnabled("Square") ? {
         key: "Square",
-        tooltip: LocaleUtils.tr("redlining.square"),
+        tooltip: LocaleUtils.tr("common.square"),
         icon: "box",
         data: {
           action: "Draw",
@@ -168,7 +169,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       } : null, toolEnabled("Box") ? {
         key: "Box",
-        tooltip: LocaleUtils.tr("redlining.rectangle"),
+        tooltip: LocaleUtils.tr("common.rectangle"),
         icon: "rect",
         data: {
           action: "Draw",
@@ -177,7 +178,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       } : null].filter(Boolean), {
         key: "Text",
-        tooltip: LocaleUtils.tr("redlining.text"),
+        tooltip: LocaleUtils.tr("common.text"),
         icon: "text",
         data: {
           action: "Draw",
@@ -204,7 +205,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
       }] : [];
       var editButtons = [{
         key: "Pick",
-        tooltip: LocaleUtils.tr("redlining.pick"),
+        tooltip: LocaleUtils.tr("common.pick"),
         icon: "nodetool",
         data: {
           action: "Pick",
@@ -222,7 +223,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         }
       } : null, toolEnabled("Clone") ? {
         key: "Clone",
-        tooltip: LocaleUtils.tr("redlining.clone"),
+        tooltip: LocaleUtils.tr("common.clone"),
         icon: "clone",
         data: {
           action: "Clone",
@@ -231,7 +232,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         disabled: !_this.props.redlining.selectedFeature
       } : null, {
         key: "Delete",
-        tooltip: LocaleUtils.tr("redlining.delete"),
+        tooltip: LocaleUtils.tr("common.delete"),
         icon: "trash",
         data: {
           action: "Delete",
@@ -323,7 +324,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
         disabled: !haveLayer,
         menuIcon: "export",
         onActivate: _this["export"],
-        tooltip: LocaleUtils.tr("redlining.export")
+        tooltip: LocaleUtils.tr("common.export")
       }, /*#__PURE__*/React.createElement("div", {
         className: "redlining-export-menu-entry",
         key: "GeoJSON",
@@ -341,7 +342,7 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
       });
     });
     _defineProperty(_this, "renderStandardControls", function () {
-      var sizeLabel = LocaleUtils.tr("redlining.line");
+      var sizeLabel = LocaleUtils.tr("common.line");
       var showDash = true;
       if (["Text", "Point"].includes(_this.props.redlining.geomType)) {
         sizeLabel = LocaleUtils.tr("redlining.size");
@@ -491,21 +492,16 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
       })))) : null, /*#__PURE__*/React.createElement("div", {
         className: "redlining-control redlining-control-fill"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "controlgroup"
-      }, _this.props.redlining.geomType !== 'Text' && _this.props.allowGeometryLabels ? /*#__PURE__*/React.createElement("button", {
-        className: "button" + (_this.props.redlining.measurements ? " pressed" : ""),
-        onClick: function onClick() {
-          return _this.props.changeRedliningState({
-            measurements: !_this.props.redlining.measurements,
-            style: _objectSpread(_objectSpread({}, _this.props.redlining.style), {}, {
-              text: ''
-            })
-          });
+        className: "controlgroup" + (_this.props.redlining.showmeasurements ? " redlining-control-fill" : "")
+      }, _this.props.redlining.geomType !== 'Text' && _this.props.allowGeometryLabels ? /*#__PURE__*/React.createElement(MeasureSwitcher, {
+        changeMeasureState: function changeMeasureState(diff) {
+          return _this.props.changeRedliningState(_objectSpread(_objectSpread({}, diff), {}, {
+            text: ''
+          }));
         },
-        title: LocaleUtils.tr("redlining.measurements")
-      }, /*#__PURE__*/React.createElement(Icon, {
-        icon: "measure"
-      })) : null, (_this.props.redlining.geomType === 'Text' || _this.props.allowGeometryLabels) && !_this.props.redlining.measurements ? /*#__PURE__*/React.createElement("input", {
+        geomType: _this.props.redlining.geomType,
+        measureState: _this.props.redlining
+      }) : null, (_this.props.redlining.geomType === 'Text' || _this.props.allowGeometryLabels) && !_this.props.redlining.showmeasurements ? /*#__PURE__*/React.createElement("input", {
         className: "controlgroup-fillitem",
         onChange: function onChange(ev) {
           return _this.updateRedliningStyle({
@@ -513,57 +509,13 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
           });
         },
         placeholder: labelPlaceholder,
-        readOnly: _this.props.redlining.measurements,
+        readOnly: _this.props.redlining.showmeasurements,
         ref: function ref(el) {
           return _this.setLabelRef(el);
         },
         type: "text",
         value: _this.props.redlining.style.text
-      }) : null, _this.props.redlining.measurements && ['LineString', 'Circle'].includes(_this.props.redlining.geomType) ? /*#__PURE__*/React.createElement("select", {
-        className: "controlgroup-fillitem",
-        onChange: function onChange(ev) {
-          return _this.props.changeRedliningState({
-            lenUnit: ev.target.value
-          });
-        },
-        value: _this.props.redlining.lenUnit
-      }, /*#__PURE__*/React.createElement("option", {
-        value: "metric"
-      }, LocaleUtils.tr("measureComponent.metric")), /*#__PURE__*/React.createElement("option", {
-        value: "imperial"
-      }, LocaleUtils.tr("measureComponent.imperial")), /*#__PURE__*/React.createElement("option", {
-        value: "m"
-      }, "m"), /*#__PURE__*/React.createElement("option", {
-        value: "km"
-      }, "km"), /*#__PURE__*/React.createElement("option", {
-        value: "ft"
-      }, "ft"), /*#__PURE__*/React.createElement("option", {
-        value: "mi"
-      }, "mi")) : null, _this.props.redlining.measurements && ['Polygon', 'Ellipse', 'Square', 'Box'].includes(_this.props.redlining.geomType) ? /*#__PURE__*/React.createElement("select", {
-        className: "controlgroup-fillitem",
-        onChange: function onChange(ev) {
-          return _this.props.changeRedliningState({
-            areaUnit: ev.target.value
-          });
-        },
-        value: _this.props.redlining.areaUnit
-      }, /*#__PURE__*/React.createElement("option", {
-        value: "metric"
-      }, LocaleUtils.tr("measureComponent.metric")), /*#__PURE__*/React.createElement("option", {
-        value: "imperial"
-      }, LocaleUtils.tr("measureComponent.imperial")), /*#__PURE__*/React.createElement("option", {
-        value: "sqm"
-      }, "m\xB2"), /*#__PURE__*/React.createElement("option", {
-        value: "ha"
-      }, "ha"), /*#__PURE__*/React.createElement("option", {
-        value: "sqkm"
-      }, "km\xB2"), /*#__PURE__*/React.createElement("option", {
-        value: "sqft"
-      }, "ft\xB2"), /*#__PURE__*/React.createElement("option", {
-        value: "acre"
-      }, "acre"), /*#__PURE__*/React.createElement("option", {
-        value: "sqmi"
-      }, "mi\xB2")) : null)));
+      }) : null)));
     });
     _defineProperty(_this, "setLabelRef", function (el) {
       _this.labelInput = el;

package/plugins/Reports.js

@@ -71,7 +71,7 @@ var Reports = /*#__PURE__*/function (_React$Component) {
       var pickButtons = [{
         key: 'Pick',
         icon: 'pick',
-        label: LocaleUtils.tr("reports.pick")
+        label: LocaleUtils.tr("common.pick")
       }, {
         key: 'Region',
         icon: 'pick_region',
@@ -79,7 +79,7 @@ var Reports = /*#__PURE__*/function (_React$Component) {
       }, {
         key: 'All',
         icon: 'ok',
-        label: LocaleUtils.tr("reports.all"),
+        label: LocaleUtils.tr("common.all"),
         forceLabel: true
       }];
       return /*#__PURE__*/React.createElement("div", {
@@ -113,7 +113,7 @@ var Reports = /*#__PURE__*/function (_React$Component) {
         type: "button"
       }, _this.state.generatingReport ? /*#__PURE__*/React.createElement(Spinner, null) : /*#__PURE__*/React.createElement(Icon, {
         icon: "report"
-      }), /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("reports.download")))));
+      }), /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("common.download")))));
     });
     _defineProperty(_this, "setLayerVisible", function (layerUrl, layerName) {
       var path = [];

package/plugins/Routing.js

@@ -234,7 +234,7 @@ var Routing = /*#__PURE__*/function (_React$Component) {
         }
       }, /*#__PURE__*/React.createElement(Icon, {
         icon: "clear"
-      }), " ", LocaleUtils.tr("routing.clear"))), _this.state.mode === 'transit' ? /*#__PURE__*/React.createElement("div", {
+      }), " ", LocaleUtils.tr("common.clear"))), _this.state.mode === 'transit' ? /*#__PURE__*/React.createElement("div", {
         className: "routing-time-settings"
       }, /*#__PURE__*/React.createElement("select", {
         onChange: _this.updateTransitTimepoint,
@@ -330,7 +330,7 @@ var Routing = /*#__PURE__*/function (_React$Component) {
         }), " ", /*#__PURE__*/React.createElement("a", {
           href: "#",
           onClick: _this.exportRoute
-        }, LocaleUtils.tr("routing.export"))), /*#__PURE__*/React.createElement("span", {
+        }, LocaleUtils.tr("common.export"))), /*#__PURE__*/React.createElement("span", {
           className: "routing-result-spacer"
         }), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icon, {
           icon: "layers"
@@ -467,7 +467,7 @@ var Routing = /*#__PURE__*/function (_React$Component) {
         }
       }, /*#__PURE__*/React.createElement(Icon, {
         icon: "clear"
-      }), " ", LocaleUtils.tr("routing.clear")))), isoConfig.busy ? /*#__PURE__*/React.createElement("div", {
+      }), " ", LocaleUtils.tr("common.clear")))), isoConfig.busy ? /*#__PURE__*/React.createElement("div", {
         className: "routing-busy"
       }, /*#__PURE__*/React.createElement(Spinner, null), " ", LocaleUtils.tr("routing.computing")) : null, isoConfig.result ? _this.renderIsochroneResult(isoConfig) : null);
     });
@@ -486,7 +486,7 @@ var Routing = /*#__PURE__*/function (_React$Component) {
         }), " ", /*#__PURE__*/React.createElement("a", {
           href: "#",
           onClick: _this.exportIsochrone
-        }, LocaleUtils.tr("routing.export"))), /*#__PURE__*/React.createElement("span", {
+        }, LocaleUtils.tr("common.export"))), /*#__PURE__*/React.createElement("span", {
           className: "routing-result-spacer"
         }), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icon, {
           icon: "layers"

package/plugins/TopBar.js

@@ -243,6 +243,8 @@ _defineProperty(TopBar, "propTypes", {
   searchOptions: PropTypes.shape({
     /** Whether to show the search filter widget. */
     allowSearchFilters: PropTypes.bool,
+    /** Whether to focus the search field on startup. */
+    focusOnStartup: PropTypes.bool,
     /** Whether to hide the result labels on the map. */
     hideResultLabels: PropTypes.bool,
     /** The style used for highlighting search result geometries. */

package/plugins/ValueTool.js

@@ -178,7 +178,7 @@ var ValueTool = /*#__PURE__*/function (_React$Component) {
             onChange: function onChange(value) {
               return _this.setLayerBands(key, value);
             },
-            placeholder: LocaleUtils.tr("valuetool.all"),
+            placeholder: LocaleUtils.tr("common.all"),
             value: _this.state.selectedBands[key] || ""
           })) : null);
         });