qwc2-lts
Version:
QGIS Web Client
1,033 lines • 48.5 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 _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 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 _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); }
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; }
/**
* Copyright 2016-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 clone from 'clone';
import FileSaver from 'file-saver';
import htmlReactParser, { domToReact } from 'html-react-parser';
import JSZip from 'jszip';
import isEmpty from 'lodash.isempty';
import omit from 'lodash.omit';
import PropTypes from 'prop-types';
import { setActiveLayerInfo } from '../actions/layerinfo';
import { LayerRole, addLayerFeatures, removeLayer } from '../actions/layers';
import { zoomToExtent } from '../actions/map';
import { openExternalUrl } from '../actions/windows';
import ConfigUtils from '../utils/ConfigUtils';
import CoordinatesUtils from '../utils/CoordinatesUtils';
import LayerUtils from '../utils/LayerUtils';
import LocaleUtils from '../utils/LocaleUtils';
import MiscUtils from '../utils/MiscUtils';
import VectorLayerUtils from '../utils/VectorLayerUtils';
import Icon from './Icon';
import Spinner from './widgets/Spinner';
import './style/IdentifyViewer.css';
var BuiltinExporters = [{
id: 'json',
title: 'json',
allowClipboard: true,
"export": function _export(json, callback) {
var data = JSON.stringify(json, null, ' ');
callback({
data: data,
type: "text/plain;charset=utf-8",
filename: "results.json"
});
}
}, {
id: 'geojson',
title: 'geojson',
allowClipboard: true,
"export": function _export(json, callback) {
var featureCollection = {
type: "FeatureCollection",
features: Object.values(json).flat().map(function (entry) {
var feature = omit(entry, ['featurereport', 'displayfield', 'layername', 'layertitle', 'layerinfo', 'attribnames', 'clickPos', 'displayname', 'bbox']);
if (feature.geometry) {
feature.crs = {
type: "name",
properties: {
name: CoordinatesUtils.toOgcUrnCrs(entry.crs)
}
};
}
return feature;
})
};
var data = JSON.stringify(featureCollection, null, ' ');
callback({
data: data,
type: "application/geo+json;charset=utf-8",
filename: "results.json"
});
}
}, {
id: 'csv',
title: 'CSV',
allowClipboard: true,
"export": function _export(json, callback) {
var data = "";
Object.entries(json).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
layerName = _ref2[0],
features = _ref2[1];
features.forEach(function (feature) {
data += layerName + ": " + feature.displayname + "\n";
Object.entries(feature.properties || {}).forEach(function (_ref3) {
var _ref4 = _slicedToArray(_ref3, 2),
attrib = _ref4[0],
value = _ref4[1];
if (attrib !== "htmlContent" && attrib !== "htmlContentInline") {
data += '\t"' + attrib + '"\t"' + String(value).replace('"', '""') + '"\n';
}
});
if (feature.geometry) {
data += '\t"geometry"\t"' + VectorLayerUtils.geoJSONGeomToWkt(feature.geometry) + '"\n';
}
});
data += "\n";
});
callback({
data: data,
type: "text/plain;charset=utf-8",
filename: "results.csv"
});
}
}, {
id: 'csvzip',
title: 'CSV+ZIP',
allowClipboard: false,
"export": function _export(json, callback) {
var first = true;
var data = [];
var filenames = [];
Object.entries(json).forEach(function (_ref5) {
var _ref6 = _slicedToArray(_ref5, 2),
layerName = _ref6[0],
features = _ref6[1];
var csv = "";
if (first) {
Object.entries(features[0].properties || {}).forEach(function (_ref7) {
var _ref8 = _slicedToArray(_ref7, 1),
attrib = _ref8[0];
if (attrib !== "htmlContent" && attrib !== "htmlContentInline") {
csv += attrib + ';';
}
});
if (features[0].geometry) {
csv += 'geometry';
} else if (csv !== "") {
csv = csv.slice(0, -1); // Remove trailling semi column ;
}
first = false;
csv += '\n';
}
features.forEach(function (feature) {
Object.entries(feature.properties || {}).forEach(function (_ref9) {
var _ref10 = _slicedToArray(_ref9, 2),
attrib = _ref10[0],
value = _ref10[1];
if (attrib !== "htmlContent" && attrib !== "htmlContentInline") {
csv += String(value).replace('"', '""') + ';';
}
});
if (feature.geometry) {
csv += VectorLayerUtils.geoJSONGeomToWkt(feature.geometry);
} else if (csv !== "") {
csv = csv.slice(0, -1); // Remove trailling semi column ;
}
csv += '\n';
});
first = true;
data.push(csv);
filenames.push(layerName);
});
if (data.length > 1) {
var zip = new JSZip();
for (var i = 0; i < data.length; i++) {
var blob = new Blob([data[i]], {
type: "text/csv;charset=utf-8"
});
zip.file(filenames[i] + ".csv", blob);
}
zip.generateAsync({
type: "arraybuffer"
}).then(function (result) {
callback({
data: result,
type: "application/zip",
filename: "results.zip"
});
});
} else {
callback({
data: data[0],
type: "text/csv;charset=utf-8",
filename: filenames[0] + ".csv"
});
}
}
}];
var IdentifyViewer = /*#__PURE__*/function (_React$Component) {
function IdentifyViewer(props) {
var _this;
_classCallCheck(this, IdentifyViewer);
_this = _callSuper(this, IdentifyViewer, [props]);
_defineProperty(_this, "state", {
expanded: {},
expandedResults: {},
resultTree: {},
currentResult: null,
currentLayer: null,
exportFormat: 'geojson',
selectedAggregatedReport: null,
generatingReport: false,
selectedLayer: ''
});
_defineProperty(_this, "updateResultTree", function () {
var layers = Object.keys(_this.props.identifyResults);
var currentResult = null;
var currentLayer = null;
if (layers.length === 1 && _this.props.identifyResults[layers[0]].length === 1) {
currentResult = _this.props.identifyResults[layers[0]][0];
currentLayer = layers[0];
}
_this.setState({
resultTree: clone(_this.props.identifyResults),
currentResult: currentResult,
currentLayer: currentLayer
});
});
_defineProperty(_this, "setHighlightedResults", function (results, resultTree) {
if (!results && _this.props.highlightAllResults) {
var selectedLayer = _this.state.selectedLayer || '';
results = Object.keys(resultTree).reduce(function (res, layer) {
var layerData = resultTree[selectedLayer || layer];
return res.concat(layerData.map(function (result) {
return _objectSpread(_objectSpread({}, result), {}, {
id: "".concat(selectedLayer || layer, ".").concat(result.id)
});
}));
}, []);
}
results = (results || []).filter(function (result) {
return result.type.toLowerCase() === "feature";
}).map(function (feature) {
var newFeature = _objectSpread(_objectSpread({}, feature), {}, {
properties: {}
});
// Ensure selection style is used
delete newFeature.styleName;
delete newFeature.styleOptions;
return newFeature;
});
if (!isEmpty(results)) {
var layer = {
id: "__identifyviewerhighlight",
role: LayerRole.SELECTION
};
_this.props.addLayerFeatures(layer, results, true);
} else {
_this.props.removeLayer("__identifyviewerhighlight");
}
});
_defineProperty(_this, "getExpandedClass", function (path, deflt) {
var expanded = _this.state.expanded[path] !== undefined ? _this.state.expanded[path] : deflt;
return expanded ? "identify-layer-expandable identify-layer-expanded" : "identify-layer-expandable";
});
_defineProperty(_this, "toggleExpanded", function (path, deflt) {
var newstate = _this.state.expanded[path] !== undefined ? !_this.state.expanded[path] : !deflt;
var diff = {};
diff[path] = newstate;
if (_this.state.currentLayer === path && !newstate) {
_this.setState(function (state) {
return _objectSpread(_objectSpread({}, state), {}, {
expanded: _objectSpread(_objectSpread({}, state.expanded), diff),
currentResult: null,
currentLayer: null
});
});
} else {
_this.setState(function (state) {
return _objectSpread(_objectSpread({}, state), {}, {
expanded: _objectSpread(_objectSpread({}, state.expanded), diff)
});
});
}
});
_defineProperty(_this, "setCurrentResult", function (layer, result) {
if (_this.state.currentResult === result) {
_this.setState({
currentResult: null,
currentLayer: null
});
} else {
_this.setState({
currentResult: result,
currentLayer: layer
});
_this.scrollIntoView = true;
}
});
_defineProperty(_this, "removeResultLayer", function (layer) {
_this.setState(function (state) {
var newResultTree = _objectSpread({}, state.resultTree);
delete newResultTree[layer];
_this.setState({
resultTree: newResultTree,
currentResult: state.currentLayer === layer ? null : state.currentResult,
currentLayer: state.currentLayer === layer ? null : state.currentLayer
});
});
});
_defineProperty(_this, "removeResult", function (layer, result) {
_this.setState(function (state) {
var newResultTree = _objectSpread({}, state.resultTree);
newResultTree[layer] = state.resultTree[layer].filter(function (item) {
return item !== result;
});
if (isEmpty(newResultTree[layer])) {
delete newResultTree[layer];
}
var selectedLayer = isEmpty(newResultTree[layer]) ? '' : state.selectedLayer;
return {
resultTree: newResultTree,
currentResult: state.currentResult === result ? null : state.currentResult,
selectedLayer: selectedLayer
};
});
});
_defineProperty(_this, "exportResults", function () {
var clipboard = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var filteredResults = {};
Object.keys(_this.state.selectedLayer !== '' ? _defineProperty({}, _this.state.selectedLayer, _this.state.resultTree[_this.state.selectedLayer]) : _this.state.resultTree).map(function (key) {
if (!isEmpty(_this.state.resultTree[key])) {
filteredResults[key] = _this.state.resultTree[key];
}
});
_this["export"](filteredResults, clipboard);
});
_defineProperty(_this, "exportResultLayer", function (layer) {
_this["export"](_defineProperty({}, layer, _this.state.resultTree[layer]));
});
_defineProperty(_this, "exportResult", function (layer, result) {
_this["export"](_defineProperty({}, layer, [result]));
});
_defineProperty(_this, "export", function (json) {
var clipboard = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var exporter = _this.getExporters().find(function (entry) {
return entry.id === _this.state.exportFormat;
});
if (exporter) {
if (!_this.props.exportGeometry) {
json = Object.entries(json).reduce(function (res, _ref12) {
var _ref13 = _slicedToArray(_ref12, 2),
layerId = _ref13[0],
features = _ref13[1];
return _objectSpread(_objectSpread({}, res), {}, _defineProperty({}, layerId, features.map(function (feature) {
return omit(feature, ['geometry']);
})));
}, {});
}
exporter["export"](json, function (result) {
if (clipboard && exporter.allowClipboard) {
navigator.clipboard.writeText(result.data);
} else {
FileSaver.saveAs(new Blob([result.data], {
type: result.type
}), result.filename);
}
});
}
});
_defineProperty(_this, "renderLayer", function (layer) {
var results = _this.state.resultTree[layer];
if (results.length === 0) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
className: _this.getExpandedClass(layer, true),
key: layer
}, /*#__PURE__*/React.createElement("div", {
className: "identify-result-entry",
onMouseEnter: function onMouseEnter() {
return _this.setHighlightedResults(results, _this.state.resultTree);
},
onMouseLeave: function onMouseLeave() {
return _this.setHighlightedResults(_this.state.currentResult === null ? null : [_this.state.currentResult], _this.state.resultTree);
}
}, /*#__PURE__*/React.createElement("span", {
className: "clickable",
onClick: function onClick() {
return _this.toggleExpanded(layer, true);
}
}, /*#__PURE__*/React.createElement("b", null, results[0].layertitle)), /*#__PURE__*/React.createElement(Icon, {
className: "identify-remove-result",
icon: "minus-sign",
onClick: function onClick() {
return _this.removeResultLayer(layer);
}
}), _this.props.enableExport === true || !isEmpty(_this.props.enableExport) ? /*#__PURE__*/React.createElement(Icon, {
className: "identify-export-result",
icon: "export",
onClick: function onClick() {
return _this.exportResultLayer(layer);
}
}) : null), /*#__PURE__*/React.createElement("div", {
className: "identify-layer-entries"
}, results.map(function (result) {
return _this.renderResult(layer, result);
})));
});
_defineProperty(_this, "renderResult", function (layer, result) {
var ref = _this.state.currentResult === result && _this.scrollIntoView ? function (el) {
_this.currentResultElRef = el;
} : null;
return /*#__PURE__*/React.createElement("div", {
className: "identify-result-entry",
key: result.id,
onMouseEnter: function onMouseEnter() {
return _this.setHighlightedResults([result], _this.state.resultTree);
},
onMouseLeave: function onMouseLeave() {
return _this.setHighlightedResults(_this.state.currentResult === null ? null : [_this.state.currentResult], _this.state.resultTree);
}
}, /*#__PURE__*/React.createElement("span", {
className: _this.state.currentResult === result ? "active clickable" : "clickable",
onClick: function onClick() {
return _this.setCurrentResult(layer, result);
},
ref: ref
}, result.displayname), /*#__PURE__*/React.createElement(Icon, {
className: "identify-remove-result",
icon: "minus-sign",
onClick: function onClick() {
return _this.removeResult(layer, result);
}
}), _this.props.enableExport === true || !isEmpty(_this.props.enableExport) ? /*#__PURE__*/React.createElement(Icon, {
className: "identify-export-result",
icon: "export",
onClick: function onClick() {
return _this.exportResult(layer, result);
}
}) : null);
});
_defineProperty(_this, "renderResultAttributes", function (layer, result, resultClass, reportFeatures) {
if (!result) {
return null;
}
var resultbox = null;
var extraattribs = null;
var featureReportTemplate = null;
if (ConfigUtils.getConfigProp("documentServiceUrl")) {
featureReportTemplate = result.featurereport || _this.findFeatureReportTemplate(layer);
}
if (featureReportTemplate) {
reportFeatures[layer] = [].concat(_toConsumableArray(reportFeatures[layer] || []), [result]);
}
var inlineExtaAttribs = false;
if (result.type === "text") {
resultbox = /*#__PURE__*/React.createElement("pre", {
className: "identify-result-box"
}, result.text);
} else if (result.type === "html") {
resultbox = /*#__PURE__*/React.createElement("iframe", {
className: "identify-result-box",
onLoad: function onLoad(ev) {
return _this.setIframeContent(ev.target, result.text);
},
ref: function ref(el) {
return _this.pollIframe(el, result.text);
}
});
} else if (result.properties.htmlContent) {
if (result.properties.htmlContentInline) {
resultbox = /*#__PURE__*/React.createElement("div", {
className: "identify-result-box"
}, _this.parsedContent(result.properties.htmlContent));
} else {
resultbox = /*#__PURE__*/React.createElement("iframe", {
className: "identify-result-box",
onLoad: function onLoad(ev) {
return _this.setIframeContent(ev.target, result.properties.htmlContent);
},
ref: function ref(el) {
return _this.pollIframe(el, result.properties.htmlContent);
}
});
}
} else {
var _rows;
inlineExtaAttribs = true;
var properties = Object.keys(result.properties) || [];
var rows = [];
if (properties.length === 1 && result.properties.maptip) {
rows = properties.map(function (attrib) {
return /*#__PURE__*/React.createElement("tr", {
key: attrib
}, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value"
}, _this.attribValue(result.properties[attrib], attrib, layer, result)));
});
} else {
rows = properties.map(function (attrib) {
if (_this.props.theme.skipEmptyFeatureAttributes && (result.properties[attrib] === "" || result.properties[attrib] === null || result.properties[attrib] === "NULL")) {
return null;
}
return /*#__PURE__*/React.createElement("tr", {
key: attrib
}, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-title " + _this.props.longAttributesDisplay
}, /*#__PURE__*/React.createElement("i", null, attrib)), /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value " + _this.props.longAttributesDisplay
}, _this.attribValue(result.properties[attrib], attrib, layer, result)));
});
}
(_rows = rows).push.apply(_rows, _toConsumableArray(_this.computeExtraAttributes(layer, result)));
if (featureReportTemplate) {
rows = rows.concat(/*#__PURE__*/React.createElement("tr", {
key: "__featurereport"
}, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-title " + _this.props.longAttributesDisplay
}, /*#__PURE__*/React.createElement("i", null, LocaleUtils.tr("identify.featureReport"))), /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value " + _this.props.longAttributesDisplay
}, /*#__PURE__*/React.createElement("a", {
href: _this.getFeatureReportUrl(featureReportTemplate, result)
}, LocaleUtils.tr("identify.link")))));
}
if (isEmpty(rows)) {
rows = /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value"
}, /*#__PURE__*/React.createElement("i", null, LocaleUtils.tr("identify.noattributes"))));
}
resultbox = /*#__PURE__*/React.createElement("div", {
className: "identify-result-box"
}, /*#__PURE__*/React.createElement("table", {
className: "attribute-list"
}, /*#__PURE__*/React.createElement("tbody", null, rows)));
}
if (!inlineExtaAttribs && (_this.props.attributeCalculator || featureReportTemplate)) {
extraattribs = /*#__PURE__*/React.createElement("div", {
className: "identify-result-box"
}, /*#__PURE__*/React.createElement("table", {
className: "attribute-list"
}, /*#__PURE__*/React.createElement("tbody", null, _this.computeExtraAttributes(layer, result), featureReportTemplate ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-title " + _this.props.longAttributesDisplay
}, /*#__PURE__*/React.createElement("i", null, LocaleUtils.tr("identify.featureReport"))), /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value " + _this.props.longAttributesDisplay
}, /*#__PURE__*/React.createElement("a", {
href: _this.getFeatureReportUrl(featureReportTemplate, result),
rel: "noreferrer",
target: "_blank"
}, LocaleUtils.tr("identify.link")))) : null)));
}
var zoomToFeatureButton = null;
if (result.bbox && result.crs) {
zoomToFeatureButton = /*#__PURE__*/React.createElement(Icon, {
icon: "zoom",
onClick: function onClick() {
return _this.props.zoomToExtent(result.bbox, result.crs);
}
});
}
var key = result + ":" + result.id;
var expanded = _this.state.expandedResults[key];
return /*#__PURE__*/React.createElement("div", {
className: resultClass,
key: "results-attributes"
}, /*#__PURE__*/React.createElement("div", {
className: "identify-result-title"
}, _this.props.collapsible ? /*#__PURE__*/React.createElement(Icon, {
icon: expanded ? "tree_minus" : "tree_plus",
onClick: function onClick() {
return _this.setState(function (state) {
return {
expandedResults: _objectSpread(_objectSpread({}, state.expandedResults), {}, _defineProperty({}, key, !expanded))
};
});
}
}) : /*#__PURE__*/React.createElement(Icon, {
icon: "minus",
onClick: function onClick() {
return _this.removeResult(layer, result);
}
}), /*#__PURE__*/React.createElement("span", null, (_this.props.showLayerTitles ? result.layertitle + ": " : "") + result.displayname), zoomToFeatureButton, /*#__PURE__*/React.createElement(Icon, {
icon: "info-sign",
onClick: function onClick() {
return _this.showLayerInfo(result);
}
})), _this.props.collapsible && !expanded ? null : /*#__PURE__*/React.createElement("div", {
className: "identify-result-container"
}, resultbox, extraattribs));
});
_defineProperty(_this, "computeExtraAttributes", function (layer, result) {
var _window$qwc;
var rows = [];
Object.values(((_window$qwc = window.qwc2) === null || _window$qwc === void 0 ? void 0 : _window$qwc.__attributeCalculators) || {}).forEach(function (calc, idx) {
var row = calc(layer, result);
if (row.length === 2) {
rows.push(/*#__PURE__*/React.createElement("tr", {
key: "custom-attr-" + idx
}, /*#__PURE__*/React.createElement("td", {
className: "identify-attr-title"
}, /*#__PURE__*/React.createElement("i", null, row[0])), /*#__PURE__*/React.createElement("td", {
className: "identify-attr-value"
}, row[1])));
} else if (row.length === 1) {
rows.push(/*#__PURE__*/React.createElement("tr", {
key: "custom-attr-" + idx
}, /*#__PURE__*/React.createElement("td", {
colSpan: "2"
}, row[0])));
}
});
if (_this.props.attributeCalculator) {
rows.push.apply(rows, _toConsumableArray(_this.props.attributeCalculator(layer, result)));
}
return rows;
});
_defineProperty(_this, "getExporters", function () {
var _window$qwc2;
return [].concat(BuiltinExporters, _toConsumableArray(_this.props.customExporters), _toConsumableArray(Object.values(((_window$qwc2 = window.qwc2) === null || _window$qwc2 === void 0 ? void 0 : _window$qwc2.__identifyExportes) || [])));
});
_defineProperty(_this, "setIframeContent", function (iframe, html) {
if (iframe.getAttribute("identify-content-set")) {
return;
}
iframe.setAttribute("identify-content-set", true);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();
});
_defineProperty(_this, "pollIframe", function (iframe, html) {
if (iframe && !iframe.getAttribute("identify-content-set")) {
var interval = setInterval(function () {
if (iframe.getAttribute("identify-content-set")) {
return clearInterval(interval);
}
if (iframe.contentWindow && iframe.contentWindow.document) {
iframe.setAttribute("identify-content-set", true);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();
clearInterval(interval);
}
return true;
}, 500);
}
});
_defineProperty(_this, "collectFeatureReportTemplates", function (entry) {
var reports = {};
if (entry.sublayers) {
var _iterator = _createForOfIteratorHelper(entry.sublayers),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var sublayer = _step.value;
reports = _objectSpread(_objectSpread({}, reports), _this.collectFeatureReportTemplates(sublayer));
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
} else if (entry.featureReport) {
reports[entry.name] = entry.featureReport;
}
return reports;
});
_defineProperty(_this, "findFeatureReportTemplate", function (layer) {
var reports = {};
_this.props.layers.filter(function (l) {
return l.role === LayerRole.THEME;
}).forEach(function (themeLayer) {
reports = _objectSpread(_objectSpread({}, reports), _this.collectFeatureReportTemplates(themeLayer));
});
return reports[layer] || null;
});
_defineProperty(_this, "getFeatureReportUrl", function (template, result) {
var serviceUrl = ConfigUtils.getConfigProp("documentServiceUrl").replace(/\/$/, "");
var params = {
feature: result.id,
x: result.clickPos[0],
y: result.clickPos[1],
crs: _this.props.mapcrs
};
return serviceUrl + "/" + template + "?" + Object.keys(params).map(function (key) {
return encodeURIComponent(key) + "=" + encodeURIComponent(params[key]);
}).join("&");
});
_defineProperty(_this, "downloadAggregatedReport", function (layername, results) {
var serviceUrl = ConfigUtils.getConfigProp("documentServiceUrl").replace(/\/$/, "");
var params = {
feature: results.map(function (result) {
return result.id;
}).join(","),
x: results[0].clickPos[0],
y: results[0].clickPos[1],
crs: _this.props.mapcrs
};
_this.setState({
generatingReport: true
});
var template = results[0].featurereport || _this.findFeatureReportTemplate(layername);
var url = serviceUrl + "/" + template + "?" + Object.keys(params).map(function (key) {
return encodeURIComponent(key) + "=" + encodeURIComponent(params[key]);
}).join("&");
axios.get(url, {
responseType: "arraybuffer"
}).then(function (response) {
FileSaver.saveAs(new Blob([response.data], {
type: "application/pdf"
}), layername + ".pdf");
_this.setState({
generatingReport: false
});
})["catch"](function () {
/* eslint-disable-next-line */
alert(LocaleUtils.tr("identify.reportfail"));
_this.setState({
generatingReport: false
});
});
});
_defineProperty(_this, "showLayerInfo", function (result) {
var match = null;
// Search matching layer by technical name
for (var _i = 0, _arr = [result.layername, result.layerinfo]; _i < _arr.length; _i++) {
var name = _arr[_i];
match = LayerUtils.searchLayer(_this.props.layers, 'name', name);
if (match) {
break;
}
}
if (!match) {
// Search matching layer by title
match = LayerUtils.searchLayer(_this.props.layers, 'title', result.layertitle);
}
if (match) {
_this.props.setActiveLayerInfo(match.layer, match.sublayer);
}
});
_defineProperty(_this, "attribValue", function (text, attrName, layer, result) {
if (_typeof(text) === 'object') {
text = JSON.stringify(text);
}
if (_this.props.replaceImageUrls && /^https?:\/\/.*\.(jpg|jpeg|png|bmp)$/i.exec(text)) {
return /*#__PURE__*/React.createElement("a", {
href: text,
rel: "noreferrer",
target: "_blank"
}, /*#__PURE__*/React.createElement("img", {
src: text
}));
}
text = "" + text; // Ensure text is a string
text = _this.props.attributeTransform(attrName, text, layer, result);
text = MiscUtils.addLinkAnchors(text);
return _this.parsedContent(text);
});
_defineProperty(_this, "parsedContent", function (text) {
text = text.replace(' ', '<br />');
var options = {
replace: function replace(node) {
if (node.name === "a") {
return /*#__PURE__*/React.createElement("a", {
href: node.attribs.href,
onClick: node.attribs.onclick ? function (ev) {
return _this.evalOnClick(ev, node.attribs.onclick);
} : _this.attributeLinkClicked,
target: node.attribs.target || "_blank"
}, domToReact(node.children, options));
}
return undefined;
}
};
return htmlReactParser(text, options);
});
_defineProperty(_this, "evalOnClick", function (ev, onclick) {
// eslint-disable-next-line
eval(onclick);
ev.preventDefault();
});
_defineProperty(_this, "attributeLinkClicked", function (ev) {
_this.props.openExternalUrl(ev.target.href, ev.target.target, {
docked: _this.props.iframeDialogsInitiallyDocked
});
ev.preventDefault();
});
_this.currentResultElRef = null;
_this.scrollIntoView = false;
_this.state.exportFormat = !Array.isArray(props.enableExport) || props.enableExport.includes('geojson') ? 'geojson' : props.enableExport[0];
return _this;
}
_inherits(IdentifyViewer, _React$Component);
return _createClass(IdentifyViewer, [{
key: "componentDidMount",
value: function componentDidMount() {
this.updateResultTree();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (this.props.identifyResults !== prevProps.identifyResults) {
this.updateResultTree();
}
if (prevState.currentResult !== this.state.currentResult || prevState.resultTree !== this.state.resultTree) {
this.setHighlightedResults(this.state.currentResult === null ? null : [this.state.currentResult], this.state.resultTree);
}
// Scroll to selected result
if (this.state.currentResult && this.state.currentResult !== prevState.currentResult && this.currentResultElRef && this.scrollIntoView) {
this.currentResultElRef.parentNode.scrollTop = this.currentResultElRef.offsetTop - this.currentResultElRef.parentNode.offsetTop;
this.scrollIntoView = false;
this.currentResultElRef = null;
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.props.removeLayer("__identifyviewerhighlight");
}
}, {
key: "render",
value: function render() {
var _this2 = this,
_exporters$find;
var tree = this.props.displayResultTree;
var body = null;
var reportFeatures = {};
if (tree) {
var contents = Object.keys(this.state.resultTree).map(function (layer) {
return _this2.renderLayer(layer);
});
var attributes = this.renderResultAttributes(this.state.currentLayer, this.state.currentResult, 'identify-result-tree-frame', reportFeatures);
var resultsContainerStyle = {
maxHeight: attributes ? '10em' : 'initial'
};
body = [/*#__PURE__*/React.createElement("div", {
className: "identify-results-container",
key: "results-container",
style: resultsContainerStyle
}, contents), attributes];
} else {
body = /*#__PURE__*/React.createElement("div", {
className: "identify-flat-results-list"
}, this.props.showLayerSelector ? /*#__PURE__*/React.createElement("div", {
className: "identify-selectbox"
}, /*#__PURE__*/React.createElement("select", {
className: "identify-layer-select",
onChange: function onChange(e) {
var selectedLayer = e.target.value;
_this2.setState({
selectedLayer: selectedLayer
});
}
}, /*#__PURE__*/React.createElement("option", {
value: ""
}, LocaleUtils.tr("identify.layerall")), Object.keys(this.state.resultTree).sort().map(function (layer) {
return /*#__PURE__*/React.createElement("option", {
key: layer,
value: layer
}, layer);
})), /*#__PURE__*/React.createElement("span", {
className: "identify-buttonbox-spacer"
}), /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("identify.featurecount"), ": ", Object.values(this.state.selectedLayer !== '' ? this.state.resultTree[this.state.selectedLayer] : this.state.resultTree).flat().length)) : null, Object.keys(this.state.selectedLayer !== '' ? _defineProperty({}, this.state.selectedLayer, this.state.resultTree[this.state.selectedLayer]) : this.state.resultTree).map(function (layer) {
var layerResults = _this2.state.resultTree[layer];
return layerResults.map(function (result) {
var resultClass = _this2.state.currentResult === result ? 'identify-result-frame-highlighted' : 'identify-result-frame-normal';
return /*#__PURE__*/React.createElement("div", {
key: result.id,
onMouseEnter: function onMouseEnter() {
return _this2.setState({
currentResult: result,
currentLayer: layer
});
},
onMouseLeave: function onMouseLeave() {
return _this2.setState({
currentResult: null,
currentLayer: null
});
}
}, _this2.renderResultAttributes(layer, result, resultClass, reportFeatures));
});
}));
}
// "el.style.background='inherit'": HACK to trigger an additional repaint, since Safari/Chrome on iOS render the element cut off the first time
var exporters = this.getExporters();
var clipboardExportDisabled = ((_exporters$find = exporters.find(function (entry) {
return entry.id === _this2.state.exportFormat;
})) === null || _exporters$find === void 0 ? void 0 : _exporters$find.allowClipboard) !== true;
return /*#__PURE__*/React.createElement("div", {
className: "identify-body",
ref: function ref(el) {
if (el) el.style.background = 'inherit';
}
}, body, this.props.enableExport === true || !isEmpty(this.props.enableExport) ? /*#__PURE__*/React.createElement("div", {
className: "identify-buttonbox"
}, /*#__PURE__*/React.createElement("span", {
className: "identify-buttonbox-spacer"
}), /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("identify.export"), ":\xA0"), /*#__PURE__*/React.createElement("div", {
className: "controlgroup"
}, /*#__PURE__*/React.createElement("select", {
className: "combo identify-export-format",
onChange: function onChange(ev) {
return _this2.setState({
exportFormat: ev.target.value
});
},
value: this.state.exportFormat
}, exporters.filter(function (entry) {
return !Array.isArray(_this2.props.enableExport) || _this2.props.enableExport.includes(entry.id);
}).map(function (entry) {
var _entry$title;
return /*#__PURE__*/React.createElement("option", {
key: entry.id,
value: entry.id
}, (_entry$title = entry.title) !== null && _entry$title !== void 0 ? _entry$title : LocaleUtils.tr(entry.titleMsgId));
})), /*#__PURE__*/React.createElement("button", {
className: "button",
onClick: function onClick() {
return _this2.exportResults();
},
title: LocaleUtils.tr("identify.download")
}, /*#__PURE__*/React.createElement(Icon, {
icon: "export"
})), /*#__PURE__*/React.createElement("button", {
className: "button",
disabled: clipboardExportDisabled,
onClick: function onClick() {
return _this2.exportResults(true);
},
title: LocaleUtils.tr("identify.clipboard")
}, /*#__PURE__*/React.createElement(Icon, {
icon: "copy"
})))) : null, this.props.enableAggregatedReports && Object.values(reportFeatures).find(function (entry) {
return entry.length > 1;
}) !== undefined ? /*#__PURE__*/React.createElement("div", {
className: "identify-buttonbox"
}, /*#__PURE__*/React.createElement("span", {
className: "identify-buttonbox-spacer"
}), /*#__PURE__*/React.createElement("span", null, LocaleUtils.tr("identify.aggregatedreport"), ":\xA0"), /*#__PURE__*/React.createElement("div", {
className: "controlgroup"
}, /*#__PURE__*/React.createElement("select", {
className: "combo identify-export-format",
onChange: function onChange(ev) {
return _this2.setState({
selectedAggregatedReport: ev.target.value
});
},
value: this.state.selectedAggregatedReport || ""
}, /*#__PURE__*/React.createElement("option", {
disabled: true,
value: ""
}, LocaleUtils.tr("identify.selectlayer")), Object.entries(reportFeatures).map(function (_ref15) {
var _ref16 = _slicedToArray(_ref15, 2),
layername = _ref16[0],
results = _ref16[1];
if (results.length > 1) {
return /*#__PURE__*/React.createElement("option", {
key: layername,
value: layername
}, results[0].layertitle);
}
return null;
})), /*#__PURE__*/React.createElement("button", {
className: "button",
disabled: !this.state.selectedAggregatedReport || this.state.generatingReport,
onClick: function onClick() {
return _this2.downloadAggregatedReport(_this2.state.selectedAggregatedReport, reportFeatures[_this2.state.selectedAggregatedReport]);
}
}, this.state.generatingReport ? /*#__PURE__*/React.createElement(Spinner, null) : /*#__PURE__*/React.createElement(Icon, {
icon: "report"
})))) : null);
}
}]);
}(React.Component);
_defineProperty(IdentifyViewer, "propTypes", {
addLayerFeatures: PropTypes.func,
attributeCalculator: PropTypes.func,
attributeTransform: PropTypes.func,
collapsible: PropTypes.bool,
customExporters: PropTypes.array,
displayResultTree: PropTypes.bool,
enableAggregatedReports: PropTypes.bool,
enableExport: PropTypes.oneOfType([PropTypes.bool, PropTypes.array]),
exportGeometry: PropTypes.bool,
highlightAllResults: PropTypes.bool,
identifyResults: PropTypes.object,
iframeDialogsInitiallyDocked: PropTypes.bool,
layers: PropTypes.array,
longAttributesDisplay: PropTypes.oneOf(['ellipsis', 'wrap']),
mapcrs: PropTypes.string,
openExternalUrl: PropTypes.func,
removeLayer: PropTypes.func,
replaceImageUrls: PropTypes.bool,
setActiveLayerInfo: PropTypes.func,
showLayerSelector: PropTypes.bool,
showLayerTitles: PropTypes.bool,
theme: PropTypes.object,
zoomToExtent: PropTypes.func
});
_defineProperty(IdentifyViewer, "defaultProps", {
longAttributesDisplay: 'ellipsis',
customExporters: [],
displayResultTree: true,
attributeCalculator: function attributeCalculator(/* layer, feature */) {
return [];
},
attributeTransform: function attributeTransform(name, value /* , layer, feature */) {
return value;
},
enableAggregatedReports: true,
showLayerTitles: true,
showLayerSelector: true,
highlightAllResults: true
});
var selector = function selector(state) {
return {
theme: state.theme.current,
layers: state.layers.flat,
mapcrs: state.map.projection
};
};
export default connect(selector, {
addLayerFeatures: addLayerFeatures,
removeLayer: removeLayer,
setActiveLayerInfo: setActiveLayerInfo,
openExternalUrl: openExternalUrl,
zoomToExtent: zoomToExtent
})(IdentifyViewer);