qwc2 2026.8.13 → 2026.8.21

package/plugins/BottomBar.js

@@ -156,132 +156,144 @@ var BottomBar = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this2 = this;
-      if (this.props.fullscreen) {
-        return null;
-      }
-      var leftBottomLinks = (this.props.additionalBottomBarLinks || []).filter(function (entry) {
-        return entry.side === "left";
-      }).map(this.renderLink);
-      var rightBottomLinks = (this.props.additionalBottomBarLinks || []).filter(function (entry) {
-        return entry.side !== "left";
-      }).map(this.renderLink);
-      if (this.props.viewertitleUrl) {
-        var entry = {
-          url: this.props.viewertitleUrl,
-          urlTarget: this.props.viewertitleUrlTarget,
-          label: LocaleUtils.tr("bottombar.viewertitle_label"),
-          icon: this.props.viewertitleUrlIcon
-        };
-        rightBottomLinks.push(this.renderLink(entry));
-      }
-      if (this.props.termsUrl) {
-        var _entry = {
-          url: this.props.termsUrl,
-          urlTarget: this.props.termsUrlTarget,
-          label: LocaleUtils.tr("bottombar.terms_label"),
-          icon: this.props.termsUrlIcon
-        };
-        rightBottomLinks.push(this.renderLink(_entry));
-      }
-      var enabledMouseCrs = [].concat(_toConsumableArray(this.props.additionalMouseCrs || []), [this.props.map.projection, "EPSG:4326"]);
-      var availableCRS = Object.fromEntries(Object.entries(CoordinatesUtils.getAvailableCRS()).filter(function (_ref) {
-        var _ref2 = _slicedToArray(_ref, 2),
-          key = _ref2[0],
-          value = _ref2[1];
-        return enabledMouseCrs.includes(key);
-      }));
-      var scalebar = null;
+      var widgets = [];
       if (this.props.displayScalebar) {
-        scalebar = /*#__PURE__*/React.createElement("div", {
+        widgets.push(/*#__PURE__*/React.createElement("div", {
           className: "bottombar-scalebar-container",
+          key: "scalebar",
           ref: this.initScaleBar
-        });
-      }
-      var coordinates = null;
-      if (this.props.displayCoordinates) {
-        coordinates = /*#__PURE__*/React.createElement("div", {
-          className: "controlgroup"
-        }, /*#__PURE__*/React.createElement("span", {
-          className: "bottombar-mousepos-label"
-        }, LocaleUtils.tr("bottombar.mousepos_label"), ":\xA0"), /*#__PURE__*/React.createElement(CoordinateDisplayer, {
-          className: "bottombar-mousepos",
-          coordinateFormatter: this.props.coordinateFormatter,
-          displayCrs: this.props.map.displayCrs,
-          mapCrs: this.props.map.projection
-        }), /*#__PURE__*/React.createElement("select", {
-          onChange: function onChange(ev) {
-            return _this2.props.setDisplayCrs(ev.target.value);
-          },
-          value: this.props.map.displayCrs
-        }, Object.keys(availableCRS).map(function (crs) {
-          return /*#__PURE__*/React.createElement("option", {
-            key: crs,
-            value: crs
-          }, availableCRS[crs].label);
-        })));
-      }
-      var scales = null;
-      if (this.props.displayScales) {
-        scales = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-          className: "bottombar-scales-label"
-        }, LocaleUtils.tr("bottombar.scale_label"), ":\xA0"), /*#__PURE__*/React.createElement(InputContainer, {
-          className: "bottombar-scale-combo"
-        }, /*#__PURE__*/React.createElement("span", {
-          className: "bottombar-scale-combo-prefix",
-          role: "prefix"
-        }, " 1 : "), /*#__PURE__*/React.createElement("select", {
-          onChange: function onChange(ev) {
-            return _this2.props.changeZoomLevel(parseInt(ev.target.value, 10));
-          },
-          role: "input",
-          value: Math.round(this.props.map.zoom)
-        }, this.props.map.scales.map(function (item, index) {
-          return /*#__PURE__*/React.createElement("option", {
-            key: index,
-            value: index
-          }, LocaleUtils.toLocaleFixed(item, 0));
-        })), /*#__PURE__*/React.createElement(NumberInput, {
-          decimals: 0,
-          hideArrows: true,
-          onChange: this.setScale,
-          role: "input",
-          value: this.state.scale
-        })));
+        }));
       }
-      var quickSelectDropdown = null;
-      if (this.props.displayQuickSelectDropdown && (this.props.bookmarks && this.props.bookmarks.length > 0 || this.props.visibilityPresets && this.props.visibilityPresets.length > 0)) {
-        var bookmarks = this.filterByActiveTheme(this.props.bookmarks || []);
-        var visibilityPresets = this.filterByActiveTheme(this.props.visibilityPresets || []);
-        var options = _defineProperty(_defineProperty({}, LocaleUtils.tr("appmenu.items.Bookmark"), bookmarks.map(function (bm) {
-          return ["bk:" + bm.key, bm.description];
-        })), LocaleUtils.tr("appmenu.items.VisibilityPresets"), visibilityPresets.map(function (bm) {
-          return ["vp:" + bm.key, bm.description];
+      if (!this.props.fullscreen) {
+        var _this$props$bookmarks, _this$props$visibilit;
+        var leftBottomLinks = (this.props.additionalBottomBarLinks || []).filter(function (entry) {
+          return entry.side === "left";
+        }).map(this.renderLink);
+        widgets.push(/*#__PURE__*/React.createElement("span", {
+          className: "bottombar-links",
+          key: "leftlinks"
+        }, leftBottomLinks));
+        widgets.push(/*#__PURE__*/React.createElement("span", {
+          className: "bottombar-spacer",
+          key: "spacer1"
         }));
-        quickSelectDropdown = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-          className: "bottombar-quick-select-label"
-        }, LocaleUtils.tr("bottombar.quick_select_label"), ":\xA0"), /*#__PURE__*/React.createElement(GroupSelect, {
-          onChange: this.openBookmarkOrPreset,
-          options: options,
-          placeholder: LocaleUtils.tr("common.select")
+        if (this.props.displayCoordinates) {
+          var enabledMouseCrs = [].concat(_toConsumableArray(this.props.additionalMouseCrs || []), [this.props.map.projection, "EPSG:4326"]);
+          var availableCRS = Object.fromEntries(Object.entries(CoordinatesUtils.getAvailableCRS()).filter(function (_ref) {
+            var _ref2 = _slicedToArray(_ref, 2),
+              key = _ref2[0],
+              value = _ref2[1];
+            return enabledMouseCrs.includes(key);
+          }));
+          widgets.push(/*#__PURE__*/React.createElement("div", {
+            className: "controlgroup",
+            key: "coordinates"
+          }, /*#__PURE__*/React.createElement("span", {
+            className: "bottombar-mousepos-label"
+          }, LocaleUtils.tr("bottombar.mousepos_label"), ":\xA0"), /*#__PURE__*/React.createElement(CoordinateDisplayer, {
+            className: "bottombar-mousepos",
+            coordinateFormatter: this.props.coordinateFormatter,
+            displayCrs: this.props.map.displayCrs,
+            mapCrs: this.props.map.projection
+          }), /*#__PURE__*/React.createElement("select", {
+            onChange: function onChange(ev) {
+              return _this2.props.setDisplayCrs(ev.target.value);
+            },
+            value: this.props.map.displayCrs
+          }, Object.keys(availableCRS).map(function (crs) {
+            return /*#__PURE__*/React.createElement("option", {
+              key: crs,
+              value: crs
+            }, availableCRS[crs].label);
+          }))));
+        }
+        if (this.props.displayScales) {
+          widgets.push(/*#__PURE__*/React.createElement("div", {
+            key: "scales"
+          }, /*#__PURE__*/React.createElement("span", {
+            className: "bottombar-scales-label"
+          }, LocaleUtils.tr("bottombar.scale_label"), ":\xA0"), /*#__PURE__*/React.createElement(InputContainer, {
+            className: "bottombar-scale-combo"
+          }, /*#__PURE__*/React.createElement("span", {
+            className: "bottombar-scale-combo-prefix",
+            role: "prefix"
+          }, " 1 : "), /*#__PURE__*/React.createElement("select", {
+            onChange: function onChange(ev) {
+              return _this2.props.changeZoomLevel(parseInt(ev.target.value, 10));
+            },
+            role: "input",
+            value: Math.round(this.props.map.zoom)
+          }, this.props.map.scales.map(function (item, index) {
+            return /*#__PURE__*/React.createElement("option", {
+              key: index,
+              value: index
+            }, LocaleUtils.toLocaleFixed(item, 0));
+          })), /*#__PURE__*/React.createElement(NumberInput, {
+            decimals: 0,
+            hideArrows: true,
+            onChange: this.setScale,
+            role: "input",
+            value: this.state.scale
+          }))));
+        }
+        if (this.props.displayQuickSelectDropdown && (((_this$props$bookmarks = this.props.bookmarks) === null || _this$props$bookmarks === void 0 ? void 0 : _this$props$bookmarks.length) > 0 || ((_this$props$visibilit = this.props.visibilityPresets) === null || _this$props$visibilit === void 0 ? void 0 : _this$props$visibilit.length) > 0)) {
+          var bookmarks = this.filterByActiveTheme(this.props.bookmarks || []);
+          var visibilityPresets = this.filterByActiveTheme(this.props.visibilityPresets || []);
+          var options = _defineProperty(_defineProperty({}, LocaleUtils.tr("appmenu.items.Bookmark"), bookmarks.map(function (bm) {
+            return ["bk:" + bm.key, bm.description];
+          })), LocaleUtils.tr("appmenu.items.VisibilityPresets"), visibilityPresets.map(function (bm) {
+            return ["vp:" + bm.key, bm.description];
+          }));
+          widgets.push(/*#__PURE__*/React.createElement("div", {
+            key: "quickselect"
+          }, /*#__PURE__*/React.createElement("span", {
+            className: "bottombar-quick-select-label"
+          }, LocaleUtils.tr("bottombar.quick_select_label"), ":\xA0"), /*#__PURE__*/React.createElement(GroupSelect, {
+            onChange: this.openBookmarkOrPreset,
+            options: options,
+            placeholder: LocaleUtils.tr("common.select")
+          })));
+        }
+        var rightBottomLinks = (this.props.additionalBottomBarLinks || []).filter(function (entry) {
+          return entry.side !== "left";
+        }).map(this.renderLink);
+        if (this.props.viewertitleUrl) {
+          var entry = {
+            url: this.props.viewertitleUrl,
+            urlTarget: this.props.viewertitleUrlTarget,
+            label: LocaleUtils.tr("bottombar.viewertitle_label"),
+            icon: this.props.viewertitleUrlIcon
+          };
+          rightBottomLinks.push(this.renderLink(entry));
+        }
+        if (this.props.termsUrl) {
+          var _entry = {
+            url: this.props.termsUrl,
+            urlTarget: this.props.termsUrlTarget,
+            label: LocaleUtils.tr("bottombar.terms_label"),
+            icon: this.props.termsUrlIcon
+          };
+          rightBottomLinks.push(this.renderLink(_entry));
+        }
+        widgets.push(/*#__PURE__*/React.createElement("span", {
+          className: "bottombar-spacer",
+          key: "spacer2"
         }));
+        widgets.push(/*#__PURE__*/React.createElement("span", {
+          className: "bottombar-links",
+          key: "rightlinks"
+        }, rightBottomLinks));
       }
       var style = {
         marginLeft: this.props.mapMargins.outerLeft + 'px',
         marginRight: this.props.mapMargins.outerRight + 'px'
       };
       return /*#__PURE__*/React.createElement("div", {
+        className: this.props.fullscreen ? "bottombar-fullscreen" : "",
         id: "BottomBar",
         ref: this.storeHeight,
         style: style
-      }, scalebar, /*#__PURE__*/React.createElement("span", {
-        className: "bottombar-links"
-      }, leftBottomLinks), /*#__PURE__*/React.createElement("span", {
-        className: "bottombar-spacer"
-      }), coordinates, scales, quickSelectDropdown, /*#__PURE__*/React.createElement("span", {
-        className: "bottombar-spacer"
-      }), /*#__PURE__*/React.createElement("span", {
-        className: "bottombar-links"
-      }, rightBottomLinks));
+      }, widgets);
     }
   }]);
 }(React.Component);

package/plugins/MapDropImport.js

@@ -0,0 +1,135 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * Copyright 2026 Gustavo Werle
+ * 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 React from 'react';
+import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
+import { addLayer, addLayerFeatures } from '../actions/layers';
+import ConfigUtils from '../utils/ConfigUtils';
+import FileImportUtils from '../utils/FileImportUtils';
+import LocaleUtils from '../utils/LocaleUtils';
+import './style/MapDropImport.css';
+
+/**
+ * Adds layers by dropping supported files (KML, KMZ, GeoJSON, zipped Shapefile, GeoPDF) onto the map.
+ *
+ * Disabled if `disableImportingLocalLayers` is set in the theme or global config.
+ */
+var MapDropImport = /*#__PURE__*/function (_React$Component) {
+  function MapDropImport() {
+    var _this;
+    _classCallCheck(this, MapDropImport);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, MapDropImport, [].concat(args));
+    _defineProperty(_this, "state", {
+      dragging: false
+    });
+    _defineProperty(_this, "dropAllowed", function (ev) {
+      var _ev$dataTransfer;
+      return !ConfigUtils.getConfigProp("disableImportingLocalLayers", _this.props.theme) && _toConsumableArray(((_ev$dataTransfer = ev.dataTransfer) === null || _ev$dataTransfer === void 0 ? void 0 : _ev$dataTransfer.types) || []).includes("Files") && ev.target instanceof Element && ev.target.closest("#map") !== null;
+    });
+    _defineProperty(_this, "onDragOver", function (ev) {
+      if (_this.dropAllowed(ev)) {
+        ev.preventDefault();
+        ev.dataTransfer.dropEffect = 'copy';
+        if (!_this.state.dragging) {
+          _this.setState({
+            dragging: true
+          });
+        }
+      } else if (_this.state.dragging) {
+        _this.setState({
+          dragging: false
+        });
+      }
+    });
+    _defineProperty(_this, "onDragLeave", function (ev) {
+      // relatedTarget is null when the drag leaves the window
+      if (ev.relatedTarget === null && _this.state.dragging) {
+        _this.setState({
+          dragging: false
+        });
+      }
+    });
+    _defineProperty(_this, "onDrop", function (ev) {
+      if (_this.dropAllowed(ev)) {
+        ev.preventDefault();
+        _toConsumableArray(ev.dataTransfer.files).forEach(function (file) {
+          FileImportUtils.importFile(file, _this.props.mapCrs, _this.props.addLayer, _this.props.addLayerFeatures);
+        });
+      }
+      _this.setState({
+        dragging: false
+      });
+    });
+    return _this;
+  }
+  _inherits(MapDropImport, _React$Component);
+  return _createClass(MapDropImport, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      document.addEventListener('dragover', this.onDragOver);
+      document.addEventListener('dragleave', this.onDragLeave);
+      document.addEventListener('drop', this.onDrop);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      document.removeEventListener('dragover', this.onDragOver);
+      document.removeEventListener('dragleave', this.onDragLeave);
+      document.removeEventListener('drop', this.onDrop);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!this.state.dragging) {
+        return null;
+      }
+      return /*#__PURE__*/React.createElement("div", {
+        className: "map-drop-import-overlay"
+      }, /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("mapdropimport.dropfiles")));
+    }
+  }]);
+}(React.Component);
+_defineProperty(MapDropImport, "propTypes", {
+  addLayer: PropTypes.func,
+  addLayerFeatures: PropTypes.func,
+  mapCrs: PropTypes.string,
+  theme: PropTypes.object
+});
+export default connect(function (state) {
+  return {
+    mapCrs: state.map.projection,
+    theme: state.theme.current
+  };
+}, {
+  addLayer: addLayer,
+  addLayerFeatures: addLayerFeatures
+})(MapDropImport);