qwc2-lts
Version:
QGIS Web Client
990 lines (989 loc) • 58.9 kB
JavaScript
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 _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
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 _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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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 _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
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 2019-2024 Sourcepole AG
* 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 axios from 'axios';
import classnames from 'classnames';
import isEmpty from 'lodash.isempty';
import pointInPolygon from 'point-in-polygon';
import polygonIntersectTest from 'polygon-intersect-test';
import PropTypes from 'prop-types';
import { createSelector } from 'reselect';
import { v1 as uuidv1 } from 'uuid';
import { LayerRole, addLayerFeatures, addThemeSublayer, removeLayer, addLayer } from '../actions/layers';
import { logAction } from '../actions/logging';
import { panTo, zoomToExtent, zoomToPoint } from '../actions/map';
import { setCurrentTask } from '../actions/task';
import { setCurrentTheme } from '../actions/theme';
import { openExternalUrl, showNotification } from '../actions/windows';
import searchProvidersSelector from '../selectors/searchproviders';
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';
import MiscUtils from '../utils/MiscUtils';
import { UrlParams } from '../utils/PermaLinkUtils';
import { FulltextSearch, SearchResultType } from '../utils/SearchProviders';
import VectorLayerUtils from '../utils/VectorLayerUtils';
import Icon from './Icon';
import MapSelection from './MapSelection';
import ButtonBar from './widgets/ButtonBar';
import ComboBox from './widgets/ComboBox';
import InputContainer from './widgets/InputContainer';
import NumberInput from './widgets/NumberInput';
import Spinner from './widgets/Spinner';
import './style/SearchBox.css';
var SearchBox = /*#__PURE__*/function (_React$Component) {
function SearchBox(props) {
var _this;
_classCallCheck(this, SearchBox);
_this = _callSuper(this, SearchBox, [props]);
_defineProperty(_this, "state", {
searchText: "",
searchSession: null,
pendingSearches: [],
recentSearches: [],
searchResults: {},
resultsVisible: false,
collapsedSections: {},
expandedLayerGroup: null,
activeLayerInfo: null,
filterOptionsVisible: false,
selectedProvider: "",
filterRegionName: "",
filterGeomType: null,
filterGeometry: null
});
_defineProperty(_this, "renderFilterOptions", function () {
var _this$state$filterGeo;
if (!_this.state.filterOptionsVisible) {
return null;
}
var providerSelection = /*#__PURE__*/React.createElement(ComboBox, {
onChange: function onChange(value) {
return _this.setState({
selectedProvider: value
});
},
value: _this.state.selectedProvider
}, /*#__PURE__*/React.createElement("div", {
value: ""
}, LocaleUtils.tr("search.all")), Object.entries(_this.props.searchProviders).map(function (_ref) {
var _prov$params, _prov$label;
var _ref2 = _slicedToArray(_ref, 2),
key = _ref2[0],
prov = _ref2[1];
return /*#__PURE__*/React.createElement("div", {
key: key,
value: key
}, (prov === null || prov === void 0 || (_prov$params = prov.params) === null || _prov$params === void 0 ? void 0 : _prov$params.title) || ((_prov$label = prov.label) !== null && _prov$label !== void 0 ? _prov$label : LocaleUtils.tr(prov.labelmsgid)));
}));
var searchRegionSelection = null;
var searchRegions = ConfigUtils.getConfigProp("searchFilterRegions", _this.props.theme);
if (!isEmpty(searchRegions)) {
searchRegionSelection = /*#__PURE__*/React.createElement(ComboBox, {
onChange: function onChange(value) {
return _this.setFilterRegion(value, searchRegions);
},
value: _this.state.filterRegionName
}, /*#__PURE__*/React.createElement("div", {
value: ""
}, LocaleUtils.tr("search.none")), searchRegions.map(function (group, gidx) {
return [/*#__PURE__*/React.createElement("div", {
"data-group-header": gidx,
disabled: true,
key: "group" + gidx
}, group.name)].concat(_toConsumableArray(group.items.map(function (item, idx) {
return /*#__PURE__*/React.createElement("div", {
"data-group": gidx,
key: item.name,
value: gidx + ":" + idx + ":" + item.name
}, item.name);
})));
}));
}
var filterButtons = [{
key: "Polygon",
tooltip: LocaleUtils.tr("redlining.polygon"),
icon: "polygon",
label: LocaleUtils.tr("redlining.polygon")
}, {
key: "Circle",
tooltip: LocaleUtils.tr("redlining.circle"),
icon: "circle",
label: LocaleUtils.tr("redlining.circle")
}];
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-filter-options"
}, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("search.providerselection"), ":"), /*#__PURE__*/React.createElement("td", null, providerSelection)), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("search.limittoarea"), ":"), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("div", {
className: "searchbox-filter-options-geometry controlgroup"
}, /*#__PURE__*/React.createElement(ButtonBar, {
active: _this.state.filterGeomType,
buttons: filterButtons,
onClick: _this.setFilterGeomType
}), searchRegionSelection, /*#__PURE__*/React.createElement("button", {
className: "button",
onClick: _this.clearFilter,
title: LocaleUtils.tr("search.clearfilter")
}, /*#__PURE__*/React.createElement(Icon, {
icon: "clear"
}))))), _this.state.filterGeomType === 'Circle' ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("search.circleradius"), ":"), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(NumberInput, {
disabled: !_this.state.filterGeometry,
min: 1,
mobile: true,
onChange: _this.setCircleRadius,
suffix: " m",
value: ((_this$state$filterGeo = _this.state.filterGeometry) === null || _this$state$filterGeo === void 0 ? void 0 : _this$state$filterGeo.radius) || 0
}))) : null)));
});
_defineProperty(_this, "setFilterGeomType", function (geomType) {
_this.setState({
filterGeomType: geomType,
filterRegionName: "",
filterGeometry: null
});
});
_defineProperty(_this, "setFilterRegion", function (value, searchRegions) {
if (value) {
var parts = value.split(":");
var item = searchRegions[parts[0]].items[parts[1]];
var geometry = {
type: "Polygon",
coordinates: [item.coordinates]
};
var mapGeometry = VectorLayerUtils.reprojectGeometry(geometry, item.crs, _this.props.map.projection);
_this.setState({
filterGeomType: null,
filterRegionName: value,
filterGeometry: mapGeometry
});
} else {
_this.setState({
filterGeomType: null,
filterRegionName: "",
filterGeometry: null
});
}
});
_defineProperty(_this, "setCircleRadius", function (value) {
_this.setState(function (state) {
return {
filterGeometry: _objectSpread(_objectSpread({}, state.filterGeometry), {}, {
radius: value
})
};
});
});
_defineProperty(_this, "clearFilter", function () {
_this.setState({
filterGeomType: null,
filterRegionName: "",
filterGeometry: null
});
});
_defineProperty(_this, "renderResultsMenu", function () {
if (!_this.state.resultsVisible) {
return false;
}
var children = [_this.renderRecentResults(), _this.renderFilters(), _this.renderResults()];
children = children.filter(function (child) {
return !isEmpty(child);
});
if (isEmpty(children)) {
if (isEmpty(_this.state.pendingSearches) && _this.state.searchResults.query_text) {
children = /*#__PURE__*/React.createElement("div", {
className: "searchbox-noresults"
}, LocaleUtils.tr("search.noresults"));
} else {
return null;
}
}
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-results",
onMouseDown: _this.setPreventBlur,
ref: MiscUtils.setupKillTouchEvents
}, children);
});
_defineProperty(_this, "renderRecentResults", function () {
var recentSearches = _this.state.recentSearches.filter(function (entry) {
return entry.toLowerCase().includes(_this.state.searchText.toLowerCase());
});
if (isEmpty(recentSearches) || recentSearches.length === 1 && recentSearches[0].toLowerCase() === _this.state.searchText.toLowerCase()) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
key: "recent"
}, /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-title",
onClick: function onClick() {
return _this.toggleSection("recent");
},
onMouseDown: MiscUtils.killEvent
}, /*#__PURE__*/React.createElement(Icon, {
icon: _this.isCollapsed("recent") ? "expand" : "collapse"
}), LocaleUtils.tr("search.recent")), !_this.isCollapsed("recent") ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-body"
}, recentSearches.map(function (entry, idx) {
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-result",
key: "r" + idx,
onClick: function onClick() {
return _this.searchTextChanged(entry);
},
onMouseDown: MiscUtils.killEvent
}, entry);
})) : null);
});
_defineProperty(_this, "renderFilters", function () {
return Object.entries(_this.state.searchResults).map(function (_ref3) {
var _ref4 = _slicedToArray(_ref3, 2),
provider = _ref4[0],
results = _ref4[1];
if (isEmpty(results.result_counts) || results.result_counts.length < 2) {
return null;
}
var collapsed = _this.isCollapsed('filter', false);
var values = results.result_counts.map(function (entry) {
return entry.filterword + ": " + _this.state.searchResults.query_text;
});
values.sort(function (a, b) {
return a.localeCompare(b);
});
return /*#__PURE__*/React.createElement("div", {
key: "filter"
}, /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-title",
onClick: function onClick() {
return _this.toggleSection("filter");
},
onMouseDown: MiscUtils.killEvent
}, /*#__PURE__*/React.createElement(Icon, {
icon: collapsed ? "expand" : "collapse"
}), LocaleUtils.tr("search.filter")), !collapsed ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-body"
}, values.map(function (value, idx) {
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-result",
key: "f" + idx,
onClick: function onClick() {
return _this.searchTextChanged(value, true, provider);
},
onMouseDown: MiscUtils.killEvent
}, /*#__PURE__*/React.createElement("span", {
className: "searchbox-result-label"
}, value));
})) : null);
}).filter(Boolean);
});
_defineProperty(_this, "renderResults", function () {
var resultRenderers = _defineProperty(_defineProperty(_defineProperty({}, SearchResultType.PLACE, _this.renderPlaceResult), SearchResultType.THEMELAYER, _this.renderThemeLayerResult), SearchResultType.THEME, _this.renderThemeResult);
var layersBeforePlaces = _this.props.searchOptions.showLayerResultsBeforePlaces;
var priorities = _defineProperty(_defineProperty(_defineProperty({}, SearchResultType.PLACE, layersBeforePlaces ? 0 : 2), SearchResultType.THEMELAYER, layersBeforePlaces ? 2 : 1), SearchResultType.THEME, layersBeforePlaces ? 1 : 0);
var results = Object.keys(_this.props.searchProviders).reduce(function (result, provider) {
if (!_this.state.searchResults[provider]) {
return result;
}
return result.concat(_this.state.searchResults[provider].results.map(function (group) {
var _group$type, _group$type2, _group$title, _group$title2;
var sectionId = provider + ":" + group.id;
var moreLabel = null;
if (group.resultCount > 0 && group.resultCount > group.items.length) {
moreLabel = LocaleUtils.tr("search.more", group.resultCount - group.items.length);
} else if (group.resultCount === -1) {
moreLabel = LocaleUtils.tr("search.unknownmore");
}
if (group.items.length === 0) {
return null;
}
var renderer = resultRenderers[(_group$type = group.type) !== null && _group$type !== void 0 ? _group$type : SearchResultType.PLACE];
if (!renderer) {
return null;
}
var priority = priorities[(_group$type2 = group.type) !== null && _group$type2 !== void 0 ? _group$type2 : SearchResultType.PLACE];
return {
priority: priority * 1000000 + (group.priority || 0),
title: (_group$title = group.title) !== null && _group$title !== void 0 ? _group$title : LocaleUtils.tr(group.titlemsgid),
tree: /*#__PURE__*/React.createElement("div", {
key: sectionId
}, /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-title",
onClick: function onClick() {
return _this.toggleSection(sectionId);
},
onMouseDown: MiscUtils.killEvent
}, /*#__PURE__*/React.createElement(Icon, {
icon: _this.isCollapsed(sectionId) ? "expand" : "collapse"
}), /*#__PURE__*/React.createElement("span", null, (_group$title2 = group.title) !== null && _group$title2 !== void 0 ? _group$title2 : LocaleUtils.tr(group.titlemsgid))), !_this.isCollapsed(sectionId) ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-results-section-body"
}, group.items.map(function (entry) {
return renderer(provider, group, entry);
}), moreLabel ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-more-results"
}, moreLabel) : null) : null)
};
}));
}, []).filter(Boolean);
results.sort(function (a, b) {
if (b.priority !== a.priority) {
return b.priority - a.priority;
} else {
return b.title.localeCompare(a.title);
}
});
return isEmpty(results) ? null : results.map(function (entry) {
return entry.tree;
});
});
_defineProperty(_this, "renderPlaceResult", function (provider, group, result) {
var _result$label;
var key = provider + ":" + group.id + ":" + result.id;
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-result",
key: key,
onClick: function onClick() {
_this.selectPlaceResult(provider, group, result);
_this.blur();
},
onMouseDown: MiscUtils.killEvent
}, result.thumbnail ? /*#__PURE__*/React.createElement("img", {
className: "searchbox-result-thumbnail",
onError: function onError(ev) {
return _this.loadFallbackResultImage(ev, result);
},
src: result.thumbnail
}) : null, /*#__PURE__*/React.createElement("span", {
className: "searchbox-result-label",
dangerouslySetInnerHTML: {
__html: result.text.replace(/<br\s*\/>/ig, ' ')
},
title: (_result$label = result.label) !== null && _result$label !== void 0 ? _result$label : result.text
}), result.externalLink ? /*#__PURE__*/React.createElement(Icon, {
icon: "info-sign",
onClick: function onClick(ev) {
var _result$label2;
MiscUtils.killEvent(ev);
_this.openUrl(result.externalLink, result.target, (_result$label2 = result.label) !== null && _result$label2 !== void 0 ? _result$label2 : result.text);
}
}) : null);
});
_defineProperty(_this, "renderThemeLayerResult", function (provider, group, result) {
var _result$label3, _result$layer;
var parent = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
var key = provider + ":" + group.id + ":" + result.id;
var addThemes = ConfigUtils.getConfigProp("allowAddingOtherThemes", _this.props.theme);
var icon = null;
if (result.sublayers) {
var toggleLayerGroup = function toggleLayerGroup() {
_this.setState(function (state) {
return {
expandedLayerGroup: state.expandedLayerGroup === key ? null : key
};
});
};
icon = /*#__PURE__*/React.createElement(Icon, {
className: "searchbox-result-thumbnail",
icon: _this.state.expandedLayerGroup === key ? "minus" : "plus",
onClick: function onClick(ev) {
MiscUtils.killEvent(ev);
toggleLayerGroup();
}
});
} else if (result.thumbnail) {
icon = /*#__PURE__*/React.createElement("img", {
className: "searchbox-result-thumbnail",
onError: function onError(ev) {
return _this.loadFallbackResultImage(ev, result);
},
src: result.thumbnail
});
}
var selectResult = result.theme ? _this.selectThemeResult : _this.selectThemeLayerResult;
return /*#__PURE__*/React.createElement("div", {
key: key
}, /*#__PURE__*/React.createElement("div", {
className: "searchbox-result",
onClick: function onClick() {
selectResult(provider, group, result);
_this.blur();
},
onMouseDown: MiscUtils.killEvent
}, icon, result.theme ? /*#__PURE__*/React.createElement(Icon, {
className: "searchbox-result-openicon",
icon: "open"
}) : null, /*#__PURE__*/React.createElement("span", {
className: "searchbox-result-label",
dangerouslySetInnerHTML: {
__html: result.text.replace(/<br\s*\/>/ig, ' ')
},
title: (_result$label3 = result.label) !== null && _result$label3 !== void 0 ? _result$label3 : result.text
}), result.theme && addThemes ? /*#__PURE__*/React.createElement(Icon, {
icon: "plus",
onClick: function onClick(ev) {
MiscUtils.killEvent(ev);
_this.selectThemeLayerResult(provider, group, result);
_this.blur();
},
title: LocaleUtils.tr("themeswitcher.addtotheme")
}) : null, result.info ? /*#__PURE__*/React.createElement(Icon, {
icon: "info-sign",
onClick: function onClick(ev) {
MiscUtils.killEvent(ev);
_this.toggleLayerInfo(provider, group, result, key, parent);
}
}) : null), _this.state.activeLayerInfo === key ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-result-abstract",
dangerouslySetInnerHTML: {
__html: MiscUtils.addLinkAnchors(((_result$layer = result.layer) === null || _result$layer === void 0 ? void 0 : _result$layer["abstract"]) || "") || LocaleUtils.tr("search.nodescription")
}
}) : null, _this.state.expandedLayerGroup === key ? /*#__PURE__*/React.createElement("div", {
className: "searchbox-result-group"
}, result.sublayers.map(function (sublayer) {
return _this.renderThemeLayerResult(provider, group, sublayer, result.id);
})) : null);
});
_defineProperty(_this, "renderThemeResult", function (provider, group, result) {
var _result$label4;
var addThemes = ConfigUtils.getConfigProp("allowAddingOtherThemes", _this.props.theme);
return /*#__PURE__*/React.createElement("div", {
className: "searchbox-result",
key: provider + ":" + group.id + ":" + result.id,
onClick: function onClick() {
_this.selectThemeResult(provider, group, result);
_this.blur();
},
onMouseDown: MiscUtils.killEvent
}, result.thumbnail ? /*#__PURE__*/React.createElement("img", {
className: "searchbox-result-thumbnail",
onError: function onError(ev) {
return _this.loadFallbackResultImage(ev, result);
},
src: result.thumbnail
}) : null, /*#__PURE__*/React.createElement(Icon, {
className: "searchbox-result-openicon",
icon: "open"
}), /*#__PURE__*/React.createElement("span", {
className: "searchbox-result-label",
dangerouslySetInnerHTML: {
__html: result.text.replace(/<br\s*\/>/ig, ' ')
},
title: (_result$label4 = result.label) !== null && _result$label4 !== void 0 ? _result$label4 : result.text
}), result.theme && addThemes ? /*#__PURE__*/React.createElement(Icon, {
icon: "plus",
onClick: function onClick(ev) {
MiscUtils.killEvent(ev);
_this.addThemeLayers(result.layer);
_this.blur();
},
title: LocaleUtils.tr("themeswitcher.addtotheme")
}) : null);
});
_defineProperty(_this, "selectPlaceResult", function (provider, group, result) {
var resultText = result.text.replace(/<\/?\w+\s*\/?>/g, '');
if (_this.props.searchOptions.showResultInSearchText !== false) {
// Show selected result text in search field
_this.setState({
searchText: resultText,
searchResults: _defineProperty({
query_text: resultText
}, provider, {
results: [_objectSpread(_objectSpread({}, group), {}, {
items: [result]
})],
tot_result_count: 1
})
});
}
_this.updateRecentSearches();
if (_this.props.searchProviders[provider].getResultGeometry) {
_this.props.searchProviders[provider].getResultGeometry(result, function (response) {
_this.showResultGeometry(result, response);
}, axios);
} else {
// Display marker
_this.showResultGeometry(result, {
feature: {
type: "Feature",
geometry: {
type: "Point",
coordinates: [result.x, result.y]
}
},
crs: result.crs
});
}
if (result.dataproduct_id) {
var quot = typeof result.id === 'string' ? '"' : '';
var filter = "[[\"".concat(result.id_field_name, "\",\"=\", ").concat(quot).concat(result.id).concat(quot, "]]");
UrlParams.updateParams({
hp: result.dataproduct_id,
hf: filter,
st: resultText
});
} else {
UrlParams.updateParams({
hp: undefined,
hf: undefined,
st: resultText
});
}
_this.props.logAction("SEARCH_TEXT", {
searchText: _this.state.searchText
});
_this.props.logAction("SEARCH_RESULT_SELECTED", {
place: resultText
});
});
_defineProperty(_this, "selectThemeLayerResult", function (provider, group, result) {
if (result.layer) {
if (result.theme) {
_this.addThemeLayers(result.layer);
} else {
_this.props.addThemeSublayer(result.layer);
}
// Show layer tree to notify user that something has happened
_this.props.setCurrentTask('LayerTree');
} else if (_this.props.searchProviders[provider].getLayerDefinition) {
_this.props.searchProviders[provider].getLayerDefinition(result, function (layer) {
if (layer) {
if (result.theme) {
_this.addThemeLayers(layer);
} else {
_this.props.addThemeSublayer({
sublayers: [layer]
});
}
// Show layer tree to notify user that something has happened
_this.props.setCurrentTask('LayerTree');
}
}, axios);
}
});
_defineProperty(_this, "selectThemeResult", function (provider, group, result) {
_this.props.setCurrentTheme(result.theme, _this.props.themes);
if (_this.props.searchOptions.showLayerAfterChangeTheme) {
_this.props.setCurrentTask('LayerTree');
}
});
_defineProperty(_this, "loadFallbackResultImage", function (ev, item) {
var _item$type;
if (((_item$type = item.type) !== null && _item$type !== void 0 ? _item$type : SearchResultType.PLACE) === SearchResultType.PLACE) {
var iconPath = ConfigUtils.getAssetsPath() + '/img/search/';
if (!ev.target.src.endsWith(iconPath + "feature.svg")) {
ev.target.src = iconPath + "feature.svg";
}
}
});
_defineProperty(_this, "toggleLayerInfo", function (provider, group, result, key, parent) {
var setResultLayerAndActiveInfo = function setResultLayerAndActiveInfo(layer) {
// Embed returned layer into result item, so that layer info is read from item.layer.abstract
_this.setState(function (state) {
return {
searchResults: _objectSpread(_objectSpread({}, state.searchResults), {}, _defineProperty({}, provider, _objectSpread(_objectSpread({}, state.searchResults[provider]), {}, {
results: state.searchResults[provider].results.map(function (g) {
if (g.id === group.id) {
return _objectSpread(_objectSpread({}, g), {}, {
items: g.items.map(function (item) {
if (item.id === result.id) {
return _objectSpread(_objectSpread({}, item), {}, {
layer: layer
});
} else if (item.id === parent) {
return _objectSpread(_objectSpread({}, item), {}, {
sublayers: item.sublayers.map(function (sublayer) {
if (sublayer.id === result.id) {
return _objectSpread(_objectSpread({}, sublayer), {}, {
layer: layer
});
} else {
return sublayer;
}
})
});
} else {
return item;
}
})
});
} else {
return g;
}
})
}))),
activeLayerInfo: key
};
});
};
_this.setState(function (state) {
if (state.activeLayerInfo === key) {
return {
activeLayerInfo: null
};
} else {
if (!result.layer && _this.props.searchProviders[provider].getLayerDefinition) {
_this.props.searchProviders[provider].getLayerDefinition(result, setResultLayerAndActiveInfo, axios);
return {};
} else {
return {
activeLayerInfo: key
};
}
}
});
});
_defineProperty(_this, "setPreventBlur", function () {
_this.preventBlur = true;
setTimeout(function () {
_this.preventBlur = false;
return false;
}, 100);
});
_defineProperty(_this, "toggleSection", function (key) {
return _this.setState(function (state) {
var _newCollapsedSections;
var newCollapsedSections = _objectSpread({}, state.collapsedSections);
var deflt = _this.props.searchOptions.sectionsDefaultCollapsed || false;
newCollapsedSections[key] = !((_newCollapsedSections = newCollapsedSections[key]) !== null && _newCollapsedSections !== void 0 ? _newCollapsedSections : deflt);
return {
collapsedSections: newCollapsedSections
};
});
});
_defineProperty(_this, "isCollapsed", function (section) {
var _this$state$collapsed;
var deflt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
deflt = deflt !== null && deflt !== void 0 ? deflt : _this.props.searchOptions.sectionsDefaultCollapsed || false;
return (_this$state$collapsed = _this.state.collapsedSections[section]) !== null && _this$state$collapsed !== void 0 ? _this$state$collapsed : deflt;
});
_defineProperty(_this, "toggleFilterOptions", function (visible) {
_this.setState({
filterOptionsVisible: visible
});
});
_defineProperty(_this, "searchTextChanged", function (text) {
var expandSections = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var provider = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
if (_this.props.layers.find(function (layer) {
return layer.id === 'searchselection';
})) {
_this.props.removeLayer('searchselection');
}
var newState = {
searchText: text,
expandedLayerGroup: null,
activeLayerInfo: null,
pendingSearches: [],
searchSession: null
};
if (expandSections) {
newState.collapsedSections = {};
}
_this.setState(newState);
clearTimeout(_this.searchTimeout);
_this.searchTimeout = setTimeout(function () {
return _this.startSearch(provider);
}, 250);
});
_defineProperty(_this, "onFocus", function () {
_this.setState({
resultsVisible: true
});
if (_this.searchBox) {
_this.searchBox.select();
}
if (isEmpty(_this.state.searchResults) && _this.props.theme) {
_this.startSearch();
}
if (_this.props.searchOptions.allowSearchFilters) {
_this.toggleFilterOptions(false);
}
});
_defineProperty(_this, "onBlur", function () {
if (_this.preventBlur && _this.searchBox) {
_this.searchBox.focus();
} else {
_this.setState({
resultsVisible: false,
collapsedSections: {},
expandedLayerGroup: null,
activeLayerInfo: null
});
}
});
_defineProperty(_this, "clear", function () {
_this.blur();
_this.setState({
searchText: '',
searchResults: {},
selectedProvider: '',
filterRegionName: "",
filterGeometry: null
});
_this.props.removeLayer('searchselection');
UrlParams.updateParams({
hp: undefined,
hf: undefined,
st: undefined
});
});
_defineProperty(_this, "startSearch", function () {
var _this$state$filterGeo2;
var provider = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
var uniquePlaceResult = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var availableProviders = _this.props.searchProviders;
var selectedProvider = provider !== null && provider !== void 0 ? provider : _this.state.selectedProvider;
if (selectedProvider) {
availableProviders = _defineProperty({}, selectedProvider, _this.props.searchProviders[selectedProvider]);
}
// eslint-disable-next-line
var searchText = _this.state.searchText.trim();
if (isEmpty(searchText)) {
_this.setState({
searchResults: {}
});
return;
}
var searchSession = uuidv1();
_this.setState({
searchResults: {
query_text: searchText
},
searchSession: searchSession,
pendingSearches: Object.keys(availableProviders)
});
var searchParams = {
mapcrs: _this.props.map.projection,
displaycrs: _this.props.map.displayCrs,
lang: LocaleUtils.lang(),
limit: _this.props.searchOptions.resultLimit,
filterPoly: (_this$state$filterGeo2 = _this.state.filterGeometry) === null || _this$state$filterGeo2 === void 0 || (_this$state$filterGeo2 = _this$state$filterGeo2.coordinates) === null || _this$state$filterGeo2 === void 0 ? void 0 : _this$state$filterGeo2[0],
filterBBox: _this.state.filterGeometry ? VectorLayerUtils.computeFeatureBBox(_this.state.filterGeometry) : null
};
Object.entries(availableProviders).forEach(function (_ref5) {
var _ref6 = _slicedToArray(_ref5, 2),
provKey = _ref6[0],
prov = _ref6[1];
prov.onSearch(searchText, _objectSpread(_objectSpread({
cfgParams: prov.cfgParams
}, prov.params), searchParams), function (response) {
var results = prov.handlesGeomFilter ? response.results : _this.filterProviderResults(response.results);
var totResultCount = results.reduce(function (tot, group) {
var _group$resultCount;
return tot + ((_group$resultCount = group.resultCount) !== null && _group$resultCount !== void 0 ? _group$resultCount : group.items.length);
}, 0);
if (uniquePlaceResult) {
// If looking for unique place result, filter non-place results
results = results.filter(function (group) {
var _group$type3;
return ((_group$type3 = group.type) !== null && _group$type3 !== void 0 ? _group$type3 : SearchResultType.PLACE) === SearchResultType.PLACE;
});
}
_this.setState(function (state) {
if (searchSession !== state.searchSession) {
return {};
}
var searchResults = _objectSpread(_objectSpread({}, state.searchResults), {}, _defineProperty({}, provKey, {
results: results,
result_counts: response.result_counts,
tot_result_count: totResultCount
}));
var newPendingSearches = state.pendingSearches.filter(function (entry) {
return entry !== provKey;
});
if (isEmpty(newPendingSearches) && uniquePlaceResult) {
// eslint-disable-next-line no-unused-vars
var providersWithResults = Object.entries(searchResults).filter(function (_ref7) {
var _ref8 = _slicedToArray(_ref7, 2),
_ = _ref8[0],
providerResults = _ref8[1];
return providerResults.tot_result_count > 0;
});
if (providersWithResults.length === 1 && providersWithResults[0][1].tot_result_count === 1) {
var group = providersWithResults[0][1].results[0];
_this.selectPlaceResult(providersWithResults[0][0], group, group.items[0]);
}
}
return {
searchResults: searchResults,
pendingSearches: newPendingSearches
};
});
}, axios);
});
});
_defineProperty(_this, "filterProviderResults", function (results) {
if (!_this.state.filterGeometry) {
return results;
}
var filterPolygon = _this.state.filterGeometry.coordinates[0];
return results.map(function (group) {
var _group$type4;
var resultType = (_group$type4 = group.type) !== null && _group$type4 !== void 0 ? _group$type4 : SearchResultType.PLACE;
if (resultType !== SearchResultType.PLACE) {
return group;
}
var newItems = group.items.filter(function (item) {
var _item$crs;
var geometry = null;
var itemCrs = (_item$crs = item.crs) !== null && _item$crs !== void 0 ? _item$crs : _this.props.map.projection;
if (item.geometry) {
geometry = VectorLayerUtils.reprojectGeometry(item.geometry, itemCrs, _this.props.map.projection);
} else {
geometry = {
type: 'Point',
coordinates: CoordinatesUtils.reproject([item.x, item.y], itemCrs, _this.props.map.projection)
};
}
if (geometry.type === 'Polygon') {
return polygonIntersectTest(geometry.coordinates[0], filterPolygon);
} else if (item.bbox) {
var _CoordinatesUtils$rep = CoordinatesUtils.reprojectBbox(item.bbox, itemCrs, _this.props.map.projection),
_CoordinatesUtils$rep2 = _slicedToArray(_CoordinatesUtils$rep, 4),
xmin = _CoordinatesUtils$rep2[0],
ymin = _CoordinatesUtils$rep2[1],
xmax = _CoordinatesUtils$rep2[2],
ymax = _CoordinatesUtils$rep2[3];
return polygonIntersectTest([[xmin, ymin], [xmax, ymin], [xmax, ymax], [xmin, ymax], [xmin, ymin]], filterPolygon);
} else if (geometry.type === 'Point') {
return pointInPolygon(geometry.coordinates, filterPolygon);
}
return true;
});
return newItems.length > 0 ? _objectSpread(_objectSpread({}, group), {}, {
items: newItems
}) : null;
}).filter(Boolean);
});
_defineProperty(_this, "updateRecentSearches", function () {
var text = _this.state.searchResults.query_text;
if (text && !_this.state.recentSearches.includes(text)) {
_this.setState(function (state) {
return {
recentSearches: [text].concat(_toConsumableArray(state.recentSearches.slice(0, 4)))
};
});
}
});
_defineProperty(_this, "blur", function () {
if (_this.searchBox) {
_this.searchBox.blur();
}
});
_defineProperty(_this, "addThemeLayers", function (layer) {
// Check if layer is already in the LayerTree
var sublayers = LayerUtils.getSublayerNames(layer);
var existing = _this.props.layers.find(function (l) {
return l.type === layer.type && l.url === layer.url && !isEmpty(LayerUtils.getSublayerNames(l).filter(function (v) {
return sublayers.includes(v);
}));
});
if (existing) {
var existingLayerName = (layer.sublayers || []).length === 1 ? layer.sublayers[0].title : layer.title;
var text = LocaleUtils.tr("search.existinglayer") + ": " + existingLayerName;
_this.props.showNotification("existinglayer", text);
} else {
_this.props.addLayer(_objectSpread(_objectSpread({}, layer), {}, {
role: LayerRole.USERLAYER
}));
}
if (_this.props.searchOptions.zoomToLayers && layer.bbox) {
_this.props.zoomToExtent(layer.bbox.bounds, layer.bbox.crs);
}
// Show layer tree to notify user that something has happened
_this.props.setCurrentTask('LayerTree');
});
_defineProperty(_this, "showResultGeometry", function (item, response) {
var _item$bbox, _item$crs3;
var scale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
if (response !== null && response !== void 0 && response.feature) {
var _response$feature$fea;
var features = (_response$feature$fea = response.feature.features) !== null && _response$feature$fea !== void 0 ? _response$feature$fea : [response.feature];
var layer = {
id: "searchselection",
role: LayerRole.SELECTION
};
features.forEach(function (feature) {
var _response$crs, _feature$geometry, _feature$crs;
feature.geometry = VectorLayerUtils.reprojectGeometry(feature.geometry, (_response$crs = response.crs) !== null && _response$crs !== void 0 ? _response$crs : _this.props.map.projection, _this.props.map.projection);
feature.styleName = ((_feature$geometry = feature.geometry) === null || _feature$geometry === void 0 ? void 0 : _feature$geometry.type) === 'Point' ? 'marker' : 'default';
feature.styleOptions = _this.props.searchOptions.highlightStyle || {};
if ((_feature$crs = feature.crs) !== null && _feature$crs !== void 0 && (_feature$crs = _feature$crs.properties) !== null && _feature$crs !== void 0 && _feature$crs.name) {
feature.crs = CoordinatesUtils.fromOgcUrnCrs(feature.crs.properties.name);
}
});
// If first feature is not a point(=marker), add a marker
if (features[0].styleName !== "marker" && !response.hidemarker) {
var _item$crs2;
features.unshift({
geometry: {
type: 'Point',
coordinates: CoordinatesUtils.reproject([item.x, item.y], (_item$crs2 = item.crs) !== null && _item$crs2 !== void 0 ? _item$crs2 : _this.props.map.projection, _this.props.map.projection)
},
styleName: 'marker'
});
}
// Label first feature
if (!_this.props.searchOptions.hideResultLabels) {
var _ref9, _item$label;
var label = ((_ref9 = (_item$label = item.label) !== null && _item$label !== void 0 ? _item$label : item.text) !== null && _ref9 !== void 0 ? _ref9 : '').replace(/<\/?\w+\s*\/?>/g, '');
features[0].properties = _objectSpread(_objectSpread({}, features[0].properties), {}, {
label: label
});
}
// Mark first feature as searchmarker
features[0].id = 'searchmarker';
_this.props.addLayerFeatures(layer, features, true);
}
var bbox = (_item$bbox = item.bbox) !== null && _item$bbox !== void 0 ? _item$bbox : [item.x, item.y, item.x, item.y];
bbox = CoordinatesUtils.reprojectBbox(bbox, (_item$crs3 = item.crs) !== null && _item$crs3 !== void 0 ? _item$crs3 : _this.props.map.projection, _this.props.map.projection);
_this.zoomToResultBBox(bbox, scale);
});
_defineProperty(_this, "zoomToResultBBox", function (bbox, scale) {
var zoom = 0;
if (scale) {
zoom = MapUtils.computeZoom(_this.props.map.scales, scale);
} else {
var maxZoom = MapUtils.computeZoom(_this.props.map.scales, _this.props.theme.minSearchScaleDenom || _this.props.searchOptions.minScaleDenom);
if (bbox[0] !== bbox[2] && bbox[1] !== bbox[3]) {
zoom = Math.max(0, MapUtils.getZoomForExtent(bbox, _this.props.map.resolutions, _this.props.map.size, 0, maxZoom + 1) - 1);
} else {
zoom = maxZoom;
}
}
var x = 0.5 * (bbox[0] + bbox[2]);
var y = 0.5 * (bbox[1] + bbox[3]);
_this.props.zoomToPoint([x, y], zoom, _this.props.map.projection);
});
_defineProperty(_this, "showFeatureGeometry", function (dat