qwc2 2025.5.16 → 2025.5.23

package/plugins/Cyclomedia.js

@@ -6,6 +6,6 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
  * 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,changeLayerProperty,removeLayer,LayerRole}from"../actions/layers";import{setCurrentTask}from"../actions/task";import ResizeableWindow from"../components/ResizeableWindow";import Spinner from"../components/widgets/Spinner";import CoordinatesUtils from"../utils/CoordinatesUtils";import LocaleUtils from"../utils/LocaleUtils";import MapUtils from"../utils/MapUtils";import ResourceRegistry from"../utils/ResourceRegistry";import"./style/Cyclomedia.css";var Status={LOGIN:0,INITIALIZING:1,INITIALIZED:2,ERROR:3,LOADPOS:4,HAVEPOS:5};/**
  * Cyclomedia integration for QWC2.
- */var Cyclomedia=/*#__PURE__*/function(_React$Component){function Cyclomedia(props){var _this;_classCallCheck(this,Cyclomedia);_this=_callSuper(this,Cyclomedia,[props]);_defineProperty(_this,"state",{status:Status.LOGIN,message:"",username:"",password:"",loginFailed:false});_defineProperty(_this,"onClose",function(){_this.props.setCurrentTask(null);_this.setState({status:Status.LOGIN,loginFailed:false});_this.iframe=null});_defineProperty(_this,"setIframeRef",function(iframe){if(iframe&&iframe!==_this.iframe){_this.iframe=iframe;clearInterval(_this.iframePollIntervall);_this.iframePollIntervall=setInterval(function(){return _this.setupIframe(iframe)},500)}});_defineProperty(_this,"setupIframe",function(iframe){if(!iframe.getAttribute("content-set")){if(iframe.contentWindow&&iframe.contentWindow.document){iframe.setAttribute("content-set",true);iframe.contentWindow.document.open();iframe.contentWindow.document.write(_this.cyclomediaIndexHtml());iframe.contentWindow.document.close();_this.iframe=iframe}}else if(!iframe.getAttribute("callback-registered")){if(iframe.contentWindow&&iframe.contentWindow.registerCallbacks){iframe.setAttribute("callback-registered",true);iframe.contentWindow.registerCallbacks(_this.apiInitialized,_this.panoramaPositionChanged,_this.measurementChanged)}}else if(!iframe.getAttribute("init-called")){if(iframe.contentWindow&&iframe.contentWindow.StreetSmartApi){iframe.setAttribute("init-called",true);iframe.contentWindow.initApi()}}else{clearInterval(_this.iframePollIntervall)}});_defineProperty(_this,"apiInitialized",function(success){var message=arguments.length>1&&arguments[1]!==undefined?arguments[1]:"";_this.setState({status:success?Status.INITIALIZED:Status.LOGIN,message:message,loginFailed:!success})});_defineProperty(_this,"panoramaPositionChanged",function(posData){if(_this.state.status!==Status.HAVEPOS){_this.setState({status:Status.HAVEPOS})}var scale=50;var angle=posData.hFov/2;var width=Math.sin(angle);var length=Math.sqrt(1-width*width);var size=scale/Math.sqrt(width*length);var coordinates=[[0,0],[size*width*2,0],[size*width,size*length]];var dimensions=[coordinates[1][0]+0.5,coordinates[2][1]+0.5];var canvas=document.createElement("canvas");canvas.width=dimensions[0];canvas.height=dimensions[1];var context=canvas.getContext("2d");context.fillStyle="rgba(255, 0, 0, 0.5)";context.strokeStyle="#FF0000";context.lineWidth=1;context.beginPath();context.moveTo(coordinates[0][0],coordinates[0][1]);coordinates.slice(1).forEach(function(coo){return context.lineTo(coo[0],coo[1])});context.closePath();context.fill();ResourceRegistry.addResource("cyclomedia-cone",context.canvas.toDataURL());var feature={geometry:{type:"Point",coordinates:posData.pos},crs:posData.crs,styleName:"image",styleOptions:{img:"cyclomedia-cone",rotation:posData.yaw,size:dimensions}};var layer={id:"cyclomedia-cone",role:LayerRole.MARKER};_this.props.addLayerFeatures(layer,[feature],true)});_defineProperty(_this,"measurementChanged",function(measurement){if(_this.props.displayMeasurements){if(measurement){var layer={id:"cyclomedia-measurements",role:LayerRole.MARKER,crs:measurement.crs.properties.name,styleOptions:{strokeColor:"red",strokeWidth:4,fillColor:[255,0,0,0.25],strokeDash:[]}};_this.props.addLayerFeatures(layer,measurement.features,true)}else{_this.props.removeLayer("cyclomedia-measurements")}}});_defineProperty(_this,"cyclomediaIndexHtml",function(){var supportedLang=["de","en-GB","en-US","fi","fr","nl","tr","pl"];var lang=LocaleUtils.lang();if(supportedLang.indexOf(lang)<0){lang=lang.slice(0,2);if(supportedLang.indexOf(lang)<0){lang="en-US"}}var loginOauth=!!_this.props.clientId&&!_this.state.loginFailed;return"\n            <!DOCTYPE html>\n            <html>\n            <head>\n            <script type=\"text/javascript\" src=\"https://unpkg.com/react@16.12.0/umd/react.production.min.js\"></script>\n            <script type=\"text/javascript\" src=\"https://unpkg.com/react-dom@16.12.0/umd/react-dom.production.min.js\"></script>\n            <script type=\"text/javascript\" src=\"https://streetsmart.cyclomedia.com/api/v".concat(_this.props.cyclomediaVersion,"/StreetSmartApi.js\"></script>\n            <script type=\"text/javascript\">\n            let apiInitialized = false;\n            let initCallback = null;\n            let posCallback = null;\n            let measureCallback = null;\n\n            function initApi() {\n                StreetSmartApi.init({\n                    targetElement: document.getElementById(\"streetsmartApi\"),\n                    username: \"").concat(_this.state.username||undefined,"\",\n                    password: \"").concat(_this.state.password||undefined,"\",\n                    apiKey: \"").concat(_this.props.apikey,"\",\n                    clientId: \"").concat(_this.props.clientId,"\",\n                    loginOauth: ").concat(loginOauth,",\n                    loginRedirectUri: \"").concat(_this.props.loginRedirectUri,"\",\n                    logoutRedirectUri: \"").concat(_this.props.logoutRedirectUri,"\",\n                    srs: \"").concat(_this.props.projection,"\",\n                    locale: \"").concat(lang,"\",\n                    configurationUrl: 'https://atlas.cyclomedia.com/configuration',\n                    addressSettings: {\n                        locale: \"us\",\n                        database: \"Nokia\"\n                    }\n                }).then(() => {\n                    apiInitialized = true;\n                    if (initCallback) {\n                        initCallback(true);\n                    }\n                }, (e) => {\n                    apiInitialized = false;\n                    if (initCallback) {\n                        initCallback(false, e.message);\n                    }\n                });\n            }\n            function openImage(posStr, crs) {\n                if (!apiInitialized) {\n                    return;\n                }\n                StreetSmartApi.open(posStr, {\n                    viewerType: StreetSmartApi.ViewerType.PANORAMA,\n                    srs: crs,\n                    panoramaViewer: {\n                         closable: false,\n                         maximizable: true,\n                         replace: true,\n                         recordingsVisible: true,\n                         navbarVisible: true,\n                         timeTravelVisible: true,\n                         measureTypeButtonVisible: true,\n                         measureTypeButtonStart: true,\n                         measureTypeButtonToggle: true,\n                     },\n                }).then((result) => {\n                    if (result && result[0]){\n                        window.panoramaViewer = result[0];\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.IMAGE_CHANGE, changeView);\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.VIEW_CHANGE, changeView);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_CHANGED, changeMeasurement);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_STOPPED, stopMeasurement);\n                    }\n                }).catch((reason) => {\n                    console.log('Failed to create component(s) through API: ' + reason);\n                });\n            }\n            function changeView() {\n                if (posCallback) {\n                    const recording = window.panoramaViewer.getRecording();\n                    const orientation = window.panoramaViewer.getOrientation();\n                    const pos = recording.xyz;\n                    const posData = {\n                        pos: [pos[0], pos[1]],\n                        crs: recording.srs,\n                        yaw: orientation.yaw * Math.PI / 180,\n                        hFov: orientation.hFov * Math.PI / 180.0\n                    }\n                    posCallback(posData);\n                }\n            }\n            function changeMeasurement(e) {\n                measureCallback(e.detail.activeMeasurement);\n            }\n            function stopMeasurement() {\n                measureCallback(null);\n            }\n            function registerCallbacks(_initCallback, _posCallback, _measureCallback) {\n                initCallback = _initCallback;\n                posCallback = _posCallback;\n                measureCallback = _measureCallback;\n            }\n            </script>\n            <style>\n              html, body, #streetsmartApi {height: 100%;}\n            </style>\n            </head>\n            <body style=\"margin: 0\">\n            <div id=\"streetsmartApi\">\n            </div>\n            </body>\n            </html>\n        ")});_defineProperty(_this,"addRecordingsWFS",function(){var layer={uuid:"cyclomedia-recordings",id:"cyclomedia-recordings",type:"wfs",loader:function loader(vectorSource,extent,resolution,projection,success,failure){var bbox=CoordinatesUtils.reprojectBbox(extent,projection.getCode(),_this.props.mapCrs);var bboxstr=bbox.join(",");var reqUrl="https://atlasapi.cyclomedia.com/api/recording/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=atlas:Recording&srsname=".concat(_this.props.mapCrs,"&bbox=").concat(bboxstr,"&maxFeatures=10000000");var xhr=new XMLHttpRequest;xhr.open("GET",reqUrl);xhr.setRequestHeader("Authorization","Basic "+btoa(_this.state.username+":"+_this.state.password));var onError=function onError(){vectorSource.removeLoadedExtent(extent);failure()};xhr.onerror=onError;xhr.onload=function(){if(xhr.status===200){var features=vectorSource.getFormat().readFeatures(xhr.responseText,{dataProjection:_this.props.mapCrs,featureProjection:projection.getCode()});vectorSource.addFeatures(features);success(features)}else{onError()}};xhr.send()},name:"atlas:Recording",version:"1.1.0",projection:_this.props.mapCrs,formats:["text/xml; subtype=gml/3.1.1"],invertAxisOrientation:true,role:LayerRole.SELECTION,color:"#6666FF",visibility:_this.props.mapScale<=_this.props.maxMapScale};_this.props.addLayer(layer)});_defineProperty(_this,"queryPoint",function(prevProps){if(_this.props.click===prevProps.click){return null}var cmFeature=_this.props.click.features.find(function(feature){return feature.layerId==="cyclomedia-recordings"});return cmFeature?cmFeature.geometry.coordinates:null});_this.iframe=null;_this.iframePollIntervall=null;if(props.credentialUserInfoFields){_this.state.username=props.userInfos[props.credentialUserInfoFields.username];_this.state.password=props.userInfos[props.credentialUserInfoFields.password]}return _this}_inherits(Cyclomedia,_React$Component);return _createClass(Cyclomedia,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(!prevProps.active&&this.props.active){this.setState({status:this.props.clientId?Status.INITIALIZING:Status.LOGIN,loginFailed:false})}else if(prevProps.active&&!this.props.active||prevProps.theme&&!this.props.theme){this.onClose()}// Load WFS when loading
+ */var Cyclomedia=/*#__PURE__*/function(_React$Component){function Cyclomedia(props){var _this;_classCallCheck(this,Cyclomedia);_this=_callSuper(this,Cyclomedia,[props]);_defineProperty(_this,"state",{status:Status.LOGIN,message:"",username:"",password:"",loginFailed:false});_defineProperty(_this,"onClose",function(){_this.props.setCurrentTask(null);_this.setState({status:Status.LOGIN,loginFailed:false});_this.iframe=null});_defineProperty(_this,"setIframeRef",function(iframe){if(iframe&&iframe!==_this.iframe){_this.iframe=iframe;clearInterval(_this.iframePollIntervall);_this.iframePollIntervall=setInterval(function(){return _this.setupIframe(iframe)},500)}});_defineProperty(_this,"setupIframe",function(iframe){if(!iframe.getAttribute("content-set")){if(iframe.contentWindow&&iframe.contentWindow.document){iframe.setAttribute("content-set",true);iframe.contentWindow.document.open();iframe.contentWindow.document.write(_this.cyclomediaIndexHtml());iframe.contentWindow.document.close();_this.iframe=iframe}}else if(!iframe.getAttribute("callback-registered")){if(iframe.contentWindow&&iframe.contentWindow.registerCallbacks){iframe.setAttribute("callback-registered",true);iframe.contentWindow.registerCallbacks(_this.apiInitialized,_this.panoramaPositionChanged,_this.measurementChanged)}}else if(!iframe.getAttribute("init-called")){if(iframe.contentWindow&&iframe.contentWindow.StreetSmartApi){iframe.setAttribute("init-called",true);iframe.contentWindow.initApi()}}else{clearInterval(_this.iframePollIntervall)}});_defineProperty(_this,"apiInitialized",function(success){var message=arguments.length>1&&arguments[1]!==undefined?arguments[1]:"";_this.setState({status:success?Status.INITIALIZED:Status.LOGIN,message:message,loginFailed:!success})});_defineProperty(_this,"panoramaPositionChanged",function(posData){if(_this.state.status!==Status.HAVEPOS){_this.setState({status:Status.HAVEPOS})}var scale=50;var angle=posData.hFov/2;var width=Math.sin(angle);var length=Math.sqrt(1-width*width);var size=scale/Math.sqrt(width*length);var coordinates=[[0,0],[size*width*2,0],[size*width,size*length]];var dimensions=[coordinates[1][0]+0.5,coordinates[2][1]+0.5];var canvas=document.createElement("canvas");canvas.width=dimensions[0];canvas.height=dimensions[1];var context=canvas.getContext("2d");context.fillStyle="rgba(255, 0, 0, 0.5)";context.strokeStyle="#FF0000";context.lineWidth=1;context.beginPath();context.moveTo(coordinates[0][0],coordinates[0][1]);coordinates.slice(1).forEach(function(coo){return context.lineTo(coo[0],coo[1])});context.closePath();context.fill();ResourceRegistry.addResource("cyclomedia-cone",context.canvas.toDataURL());var feature={geometry:{type:"Point",coordinates:posData.pos},crs:posData.crs,styleName:"image",styleOptions:{img:"cyclomedia-cone",rotation:posData.yaw,size:dimensions}};var layer={id:"cyclomedia-cone",role:LayerRole.MARKER};_this.props.addLayerFeatures(layer,[feature],true)});_defineProperty(_this,"measurementChanged",function(measurement){if(_this.props.displayMeasurements){if(measurement){var layer={id:"cyclomedia-measurements",role:LayerRole.MARKER,crs:measurement.crs.properties.name,styleOptions:{strokeColor:"red",strokeWidth:4,fillColor:[255,0,0,0.25],strokeDash:[]}};_this.props.addLayerFeatures(layer,measurement.features,true)}else{_this.props.removeLayer("cyclomedia-measurements")}}});_defineProperty(_this,"cyclomediaIndexHtml",function(){var supportedLang=["de","en-GB","en-US","fi","fr","nl","tr","pl"];var lang=LocaleUtils.lang();if(supportedLang.indexOf(lang)<0){lang=lang.slice(0,2);if(supportedLang.indexOf(lang)<0){lang="en-US"}}var loginOauth=!!_this.props.clientId&&!_this.state.loginFailed;return"\n            <!DOCTYPE html>\n            <html>\n            <head>\n            <script type=\"text/javascript\" src=\"https://unpkg.com/react@16.12.0/umd/react.production.min.js\"></script>\n            <script type=\"text/javascript\" src=\"https://unpkg.com/react-dom@16.12.0/umd/react-dom.production.min.js\"></script>\n            <script type=\"text/javascript\" src=\"https://streetsmart.cyclomedia.com/api/v".concat(_this.props.cyclomediaVersion,"/StreetSmartApi.js\"></script>\n            <script type=\"text/javascript\">\n            let apiInitialized = false;\n            let initCallback = null;\n            let posCallback = null;\n            let measureCallback = null;\n\n            function initApi() {\n                StreetSmartApi.init({\n                    targetElement: document.getElementById(\"streetsmartApi\"),\n                    username: \"").concat(_this.state.username||undefined,"\",\n                    password: \"").concat(_this.state.password||undefined,"\",\n                    apiKey: \"").concat(_this.props.apikey,"\",\n                    clientId: \"").concat(_this.props.clientId,"\",\n                    loginOauth: ").concat(loginOauth,",\n                    loginRedirectUri: \"").concat(_this.props.loginRedirectUri,"\",\n                    logoutRedirectUri: \"").concat(_this.props.logoutRedirectUri,"\",\n                    srs: \"").concat(_this.props.projection,"\",\n                    locale: \"").concat(lang,"\",\n                    configurationUrl: 'https://atlas.cyclomedia.com/configuration',\n                    addressSettings: {\n                        locale: \"us\",\n                        database: \"Nokia\"\n                    }\n                }).then(() => {\n                    apiInitialized = true;\n                    if (initCallback) {\n                        initCallback(true);\n                    }\n                }, (e) => {\n                    apiInitialized = false;\n                    if (initCallback) {\n                        initCallback(false, e.message);\n                    }\n                });\n            }\n            function openImage(posStr, crs) {\n                if (!apiInitialized) {\n                    return;\n                }\n                StreetSmartApi.open(posStr, {\n                    viewerType: StreetSmartApi.ViewerType.PANORAMA,\n                    srs: crs,\n                    panoramaViewer: {\n                         closable: false,\n                         maximizable: true,\n                         replace: true,\n                         recordingsVisible: true,\n                         navbarVisible: true,\n                         timeTravelVisible: true,\n                         measureTypeButtonVisible: true,\n                         measureTypeButtonStart: true,\n                         measureTypeButtonToggle: true,\n                     },\n                }).then((result) => {\n                    if (result && result[0]){\n                        window.panoramaViewer = result[0];\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.IMAGE_CHANGE, changeView);\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.VIEW_CHANGE, changeView);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_CHANGED, changeMeasurement);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_STOPPED, stopMeasurement);\n                    }\n                }).catch((reason) => {\n                    console.log('Failed to create component(s) through API: ' + reason);\n                });\n            }\n            function changeView() {\n                if (posCallback) {\n                    const recording = window.panoramaViewer.getRecording();\n                    const orientation = window.panoramaViewer.getOrientation();\n                    const pos = recording.xyz;\n                    const posData = {\n                        pos: [pos[0], pos[1]],\n                        crs: recording.srs,\n                        yaw: orientation.yaw * Math.PI / 180,\n                        hFov: orientation.hFov * Math.PI / 180.0\n                    }\n                    posCallback(posData);\n                }\n            }\n            function changeMeasurement(e) {\n                measureCallback(e.detail.activeMeasurement);\n            }\n            function stopMeasurement() {\n                measureCallback(null);\n            }\n            function registerCallbacks(_initCallback, _posCallback, _measureCallback) {\n                initCallback = _initCallback;\n                posCallback = _posCallback;\n                measureCallback = _measureCallback;\n            }\n            </script>\n            <style>\n              html, body, #streetsmartApi {height: 100%;}\n            </style>\n            </head>\n            <body style=\"margin: 0\">\n            <div id=\"streetsmartApi\">\n            </div>\n            </body>\n            </html>\n        ")});_defineProperty(_this,"addRecordingsWFS",function(){var layer={id:"cyclomedia-recordings",type:"wfs",loader:function loader(vectorSource,extent,resolution,projection,success,failure){var bbox=CoordinatesUtils.reprojectBbox(extent,projection.getCode(),_this.props.mapCrs);var bboxstr=bbox.join(",");var reqUrl="https://atlasapi.cyclomedia.com/api/recording/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=atlas:Recording&srsname=".concat(_this.props.mapCrs,"&bbox=").concat(bboxstr,"&maxFeatures=10000000");var xhr=new XMLHttpRequest;xhr.open("GET",reqUrl);xhr.setRequestHeader("Authorization","Basic "+btoa(_this.state.username+":"+_this.state.password));var onError=function onError(){vectorSource.removeLoadedExtent(extent);failure()};xhr.onerror=onError;xhr.onload=function(){if(xhr.status===200){var features=vectorSource.getFormat().readFeatures(xhr.responseText,{dataProjection:_this.props.mapCrs,featureProjection:projection.getCode()});vectorSource.addFeatures(features);success(features)}else{onError()}};xhr.send()},name:"atlas:Recording",version:"1.1.0",projection:_this.props.mapCrs,formats:["text/xml; subtype=gml/3.1.1"],invertAxisOrientation:true,role:LayerRole.SELECTION,color:"#6666FF",visibility:_this.props.mapScale<=_this.props.maxMapScale};_this.props.addLayer(layer)});_defineProperty(_this,"queryPoint",function(prevProps){if(_this.props.click===prevProps.click){return null}var cmFeature=_this.props.click.features.find(function(feature){return feature.layerId==="cyclomedia-recordings"});return cmFeature?cmFeature.geometry.coordinates:null});_this.iframe=null;_this.iframePollIntervall=null;if(props.credentialUserInfoFields){_this.state.username=props.userInfos[props.credentialUserInfoFields.username];_this.state.password=props.userInfos[props.credentialUserInfoFields.password]}return _this}_inherits(Cyclomedia,_React$Component);return _createClass(Cyclomedia,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(!prevProps.active&&this.props.active){this.setState({status:this.props.clientId?Status.INITIALIZING:Status.LOGIN,loginFailed:false})}else if(prevProps.active&&!this.props.active||prevProps.theme&&!this.props.theme){this.onClose()}// Load WFS when loading
 if(this.state.status===Status.INITIALIZING&&prevState.status<Status.INITIALIZING){this.addRecordingsWFS()}// Handle map click events
 if((this.state.status===Status.INITIALIZED||this.state.status===Status.HAVEPOS)&&this.iframe){var clickPoint=this.queryPoint(prevProps);if(clickPoint){var posStr=clickPoint[0]+","+clickPoint[1];this.iframe.contentWindow.openImage(posStr,this.props.mapCrs);if(this.state.status!==Status.LOADPOS){this.setState({status:Status.LOADPOS});this.props.removeLayer("cyclomedia-cone");this.props.removeLayer("cyclomedia-measurements");ResourceRegistry.removeResource("cyclomedia-cone")}}}if(this.props.active&&this.props.mapScale!==prevProps.mapScale){this.props.changeLayerProperty("cyclomedia-recordings","visibility",this.props.mapScale<=this.props.maxMapScale)}if(this.state.status===Status.LOGIN&&prevState.status>Status.LOGIN){this.props.removeLayer("cyclomedia-recordings");this.props.removeLayer("cyclomedia-cone");this.props.removeLayer("cyclomedia-measurements");ResourceRegistry.removeResource("cyclomedia-cone")}}},{key:"render",value:function render(){var _this2=this;if(!this.props.active){return null}var overlay=null;if(this.state.status===Status.LOGIN){overlay=/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body-overlay"},/*#__PURE__*/React.createElement("div",{className:"cyclomedia-login"},/*#__PURE__*/React.createElement("table",null,/*#__PURE__*/React.createElement("tbody",null,/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,"Username:"),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("input",{onChange:function onChange(ev){return _this2.setState({username:ev.target.value})},type:"text",value:this.state.username}))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",null,"Password:"),/*#__PURE__*/React.createElement("td",null,/*#__PURE__*/React.createElement("input",{onChange:function onChange(ev){return _this2.setState({password:ev.target.value})},type:"password",value:this.state.password}))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",{colSpan:"2"},/*#__PURE__*/React.createElement("button",{className:"button",disabled:!this.state.username,onClick:function onClick(){return _this2.setState({status:Status.INITIALIZING})},type:"button"},LocaleUtils.tr("cyclomedia.login")))),/*#__PURE__*/React.createElement("tr",null,/*#__PURE__*/React.createElement("td",{className:"cyclomedia-login-message",colSpan:"2"},this.state.message))))))}else if(this.state.status===Status.INITIALIZING){overlay=/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body-overlay"},/*#__PURE__*/React.createElement(Spinner,null),/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("cyclomedia.initializing")))}else if(this.state.status===Status.ERROR){overlay=/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body-overlay"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("cyclomedia.loaderror")))}else if(this.state.status===Status.INITIALIZED){overlay=/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body-overlay"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("cyclomedia.clickonmap")))}else if(this.state.status===Status.LOADPOS){overlay=/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body-overlay"},/*#__PURE__*/React.createElement(Spinner,null),/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("cyclomedia.loading")))}return/*#__PURE__*/React.createElement(ResizeableWindow,{dockable:this.props.geometry.side,icon:"cyclomedia",initialHeight:this.props.geometry.initialHeight,initialWidth:this.props.geometry.initialWidth,initialX:this.props.geometry.initialX,initialY:this.props.geometry.initialY,initiallyDocked:this.props.geometry.initiallyDocked,onClose:this.onClose,splitScreenWhenDocked:true,title:LocaleUtils.tr("cyclomedia.title"),usePortal:false},/*#__PURE__*/React.createElement("div",{className:"cyclomedia-body",role:"body"},this.props.mapScale>this.props.maxMapScale&&this.state.status>Status.LOGIN?/*#__PURE__*/React.createElement("div",{className:"cyclomedia-scale-hint"},LocaleUtils.tr("cyclomedia.scalehint",this.props.maxMapScale)):null,this.state.status>Status.LOGIN?/*#__PURE__*/React.createElement("iframe",{className:"cyclomedia-frame",onLoad:function onLoad(ev){return _this2.setupIframe(ev.target)},ref:function ref(el){return _this2.setIframeRef(el)}}):null,overlay))}}])}(React.Component);_defineProperty(Cyclomedia,"propTypes",{active:PropTypes.bool,addLayer:PropTypes.func,addLayerFeatures:PropTypes.func,/** The Cyclomedia API key */apikey:PropTypes.string,changeLayerProperty:PropTypes.func,click:PropTypes.object,/** OAuth client ID. */clientId:PropTypes.string,/** Fields from user_infos which contain username and password which will be pre-inserted into the login form. */credentialUserInfoFields:PropTypes.shape({username:PropTypes.string,password:PropTypes.string}),/** The cyclomedia version. */cyclomediaVersion:PropTypes.string,/** Whether to display Cyclomedia measurement geometries on the map. */displayMeasurements:PropTypes.bool,/** Default window geometry with size, position and docking status. Positive position values (including '0') are related to top (InitialY) and left (InitialX), negative values (including '-0') to bottom (InitialY) and right (InitialX). */geometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool,side:PropTypes.string}),/** The relative path to the redirect login handling of oauth. */loginRedirectUri:PropTypes.string,/** The relative path to the redirect logout handling of oauth. */logoutRedirectUri:PropTypes.string,mapCrs:PropTypes.string,mapScale:PropTypes.number,/** The maximum map scale above which the recordings WFS won't be displayed. */maxMapScale:PropTypes.number,/** The projection to use for Cyclomedia. */projection:PropTypes.string,removeLayer:PropTypes.func,setCurrentTask:PropTypes.func,theme:PropTypes.object,userInfos:PropTypes.object});_defineProperty(Cyclomedia,"defaultProps",{cyclomediaVersion:"24.1",displayMeasurements:true,geometry:{initialWidth:480,initialHeight:640,initialX:0,initialY:0,initiallyDocked:false,side:"left"},maxMapScale:5000,projection:"EPSG:3857"});export default connect(function(state){return{active:state.task.id==="Cyclomedia",click:state.map.click,mapCrs:state.map.projection,mapScale:MapUtils.computeForZoom(state.map.scales,state.map.zoom),theme:state.theme.current,userInfos:state.localConfig.user_infos}},{addLayer:addLayer,addLayerFeatures:addLayerFeatures,changeLayerProperty:changeLayerProperty,removeLayer:removeLayer,setCurrentTask:setCurrentTask})(Cyclomedia);

package/plugins/Editing.js

@@ -11,11 +11,10 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
  *
  * This plugin queries the dataset via the editing service specified by
  * `editServiceUrl` in `config.json` (by default the `qwc-data-service`).
- */var Editing=/*#__PURE__*/function(_React$Component){function Editing(){var _this;_classCallCheck(this,Editing);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,Editing,[].concat(args));_defineProperty(_this,"state",{selectedLayer:null,selectedLayerVisibility:null,pickedFeatures:null,busy:false,minimized:false,drawPick:false});_defineProperty(_this,"onShow",function(){if(_this.props.taskData){_this.changeSelectedLayer(_this.props.taskData.layer,"Pick",_this.props.taskData.feature)}else{_this.changeSelectedLayer(_this.state.selectedLayer,"Pick")}_this.props.setSnappingConfig(_this.props.snapping,_this.props.snappingActive)});_defineProperty(_this,"onHide",function(){_this.props.clearEditContext("Editing");_this.setLayerVisibility(_this.state.selectedLayer,_this.state.selectedLayerVisibility);_this.setState({minimized:false,drawPick:false})});_defineProperty(_this,"renderBody",function(){if(!_this.props.theme||isEmpty(_this.props.theme.editConfig)){return/*#__PURE__*/React.createElement("div",{role:"body",style:{padding:"1em"}},LocaleUtils.tr("editing.noeditablelayers"))}var editConfig=_this.props.theme.editConfig;var curConfig=editConfig[_this.state.selectedLayer];if(!curConfig){return/*#__PURE__*/React.createElement("div",{role:"body",style:{padding:"1em"}},LocaleUtils.tr("editing.noeditablelayers"))}var editPermissions=curConfig.permissions||{};var actionButtons=[];actionButtons.push({key:"Pick",icon:"pick",label:LocaleUtils.tr("editing.pick"),data:{action:"Pick",geomReadOnly:false,feature:null}});if(editPermissions.creatable!==false){// Draw button will appear by default if no permissions are defined in theme editConfig or when creatable permission is set
-actionButtons.push({key:"Draw",icon:"editdraw",label:LocaleUtils.tr("editing.draw"),data:{action:"Draw",geomReadOnly:false}})}if(ConfigUtils.havePlugin("AttributeTable")){actionButtons.push({key:"AttribTable",icon:"editing",label:LocaleUtils.tr("editing.attrtable"),data:{action:"AttrTable"}})}var featureSelection=null;if(_this.state.pickedFeatures){var featureText=LocaleUtils.tr("editing.feature");featureSelection=/*#__PURE__*/React.createElement("div",{className:"editing-feature-selection"},/*#__PURE__*/React.createElement("select",{className:"combo editing-feature-select",disabled:_this.props.editContext.changed===true||_this.props.editContext.id!==_this.props.currentEditContext,onChange:function onChange(ev){return _this.setEditFeature(ev.target.value)},value:(_this.props.editContext.feature||{}).id||""},_this.state.pickedFeatures.map(function(feature){return/*#__PURE__*/React.createElement("option",{key:feature.id,value:feature.id},curConfig.displayField?feature.properties[curConfig.displayField]:featureText+" "+feature.id)})))}var pickBar=null;if(_this.props.allowCloneGeometry&&(_this.props.editContext.action==="Draw"||_this.state.drawPick)&&!(_this.props.editContext.feature||{}).geometry){var pickButtons=[{key:"DrawPick",icon:"pick",label:LocaleUtils.tr("editing.pickdrawfeature")}];pickBar=/*#__PURE__*/React.createElement(ButtonBar,{active:_this.state.drawPick?"DrawPick":null,buttons:pickButtons,onClick:_this.toggleDrawPick})}var attributeForm=null;if(_this.props.editContext.feature&&(_this.props.editContext.action==="Pick"||_this.props.editContext.feature.geometry)){attributeForm=/*#__PURE__*/React.createElement(AttributeForm,{editConfig:curConfig,editContext:_this.props.editContext,iface:_this.props.iface})}var themeSublayers=_this.props.layers.reduce(function(accum,layer){return layer.role===LayerRole.THEME?accum.concat(LayerUtils.getSublayerNames(layer)):accum},[]);return/*#__PURE__*/React.createElement("div",{className:"editing-body"},/*#__PURE__*/React.createElement("div",{className:"editing-layer-selection"},/*#__PURE__*/React.createElement("select",{className:"combo editing-layer-select",disabled:_this.props.editContext.changed===true||_this.props.editContext.id!==_this.props.currentEditContext,onChange:function onChange(ev){return _this.changeSelectedLayer(ev.target.value)},value:_this.state.selectedLayer||""},Object.keys(editConfig).filter(function(layerId){return themeSublayers.includes(layerId)}).map(function(layerId){var layerName=editConfig[layerId].layerName;var match=LayerUtils.searchLayer(_this.props.layers,"name",layerName,[LayerRole.THEME]);return/*#__PURE__*/React.createElement("option",{key:layerId,value:layerId},match?match.sublayer.title:layerName)}))),/*#__PURE__*/React.createElement(ButtonBar,{active:_this.state.drawPick?"Draw":_this.props.editContext.action,buttons:actionButtons,disabled:_this.props.editContext.changed||_this.props.editContext.id!==_this.props.currentEditContext,onClick:_this.actionClicked}),featureSelection,pickBar,attributeForm)});_defineProperty(_this,"actionClicked",function(action,data){_this.setState({drawPick:false,pickedFeatures:null});if(action==="AttribTable"){_this.props.setCurrentTask("AttributeTable",null,null,{layer:_this.state.selectedLayer})}else if(action==="Draw"){var editConfig=_this.props.theme.editConfig;var curConfig=editConfig[_this.state.selectedLayer];var featureSkel={type:"Feature",properties:{}};var mapPrefix=(curConfig.editDataset.match(/^[^.]+\./)||[""])[0];getFeatureTemplate(curConfig,featureSkel,_this.props.iface,mapPrefix,_this.props.map.projection,function(feature){_this.props.setEditContext("Editing",_objectSpread(_objectSpread({},data),{},{feature:feature,geomReadOnly:false}))})}else{_this.props.setEditContext("Editing",_objectSpread({},data))}});_defineProperty(_this,"pickFilter",function(feature){var _this$props$theme$edi;var geomType=(_this$props$theme$edi=_this.props.theme.editConfig[_this.state.selectedLayer])===null||_this$props$theme$edi===void 0?void 0:_this$props$theme$edi.geomType;return feature.geometry&&(feature.geometry.type===geomType||"Multi"+feature.geometry.type===geomType||feature.geometry.type.replace(/^Multi/,"")===geomType&&feature.geometry.coordinates.length===1)});_defineProperty(_this,"geomPicked",function(layer,feature){var _this$props$theme$edi2;var geomType=(_this$props$theme$edi2=_this.props.theme.editConfig[_this.state.selectedLayer])===null||_this$props$theme$edi2===void 0?void 0:_this$props$theme$edi2.geomType;var geometry=feature.geometry;if(geometry.type!==geomType){if("Multi"+feature.geometry.type===geomType){// Convert picked geometry to multi-type
+ */var Editing=/*#__PURE__*/function(_React$Component){function Editing(){var _this;_classCallCheck(this,Editing);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,Editing,[].concat(args));_defineProperty(_this,"state",{selectedLayer:null,selectedLayerVisibility:null,pickedFeatures:null,busy:false,minimized:false,drawPick:false});_defineProperty(_this,"onShow",function(){if(_this.props.taskData){_this.changeSelectedLayer(_this.props.taskData.layer,"Pick",_this.props.taskData.feature)}else{_this.changeSelectedLayer(_this.state.selectedLayer,"Pick")}_this.props.setSnappingConfig(_this.props.snapping,_this.props.snappingActive)});_defineProperty(_this,"onHide",function(){_this.props.clearEditContext("Editing");_this.setLayerVisibility(_this.state.selectedLayer,_this.state.selectedLayerVisibility);_this.setState({minimized:false,drawPick:false})});_defineProperty(_this,"renderBody",function(){if(!_this.props.theme||isEmpty(_this.props.theme.editConfig)){return/*#__PURE__*/React.createElement("div",{role:"body",style:{padding:"1em"}},LocaleUtils.tr("editing.noeditablelayers"))}var editConfig=_this.props.theme.editConfig;var curConfig=editConfig[_this.state.selectedLayer];if(!curConfig){return/*#__PURE__*/React.createElement("div",{role:"body",style:{padding:"1em"}},LocaleUtils.tr("editing.noeditablelayers"))}var editPermissions=curConfig.permissions||{};var actionButtons=[];actionButtons.push({key:"Pick",icon:"pick",label:LocaleUtils.tr("editing.pick"),data:{action:"Pick",feature:null}});if(editPermissions.creatable!==false&&!_this.props.editContext.geomReadOnly){actionButtons.push({key:"Draw",icon:"editdraw",label:LocaleUtils.tr("editing.draw"),data:{action:"Draw"}})}if(ConfigUtils.havePlugin("AttributeTable")){actionButtons.push({key:"AttribTable",icon:"editing",label:LocaleUtils.tr("editing.attrtable"),data:{action:"AttrTable"}})}var featureSelection=null;if(_this.state.pickedFeatures&&_this.state.pickedFeatures.length>1){var featureText=LocaleUtils.tr("editing.feature");featureSelection=/*#__PURE__*/React.createElement("div",{className:"editing-feature-selection"},/*#__PURE__*/React.createElement("select",{className:"combo editing-feature-select",disabled:_this.props.editContext.changed===true||_this.props.editContext.id!==_this.props.currentEditContext,onChange:function onChange(ev){return _this.setEditFeature(ev.target.value)},value:(_this.props.editContext.feature||{}).id||""},_this.state.pickedFeatures.map(function(feature){return/*#__PURE__*/React.createElement("option",{key:feature.id,value:feature.id},curConfig.displayField?feature.properties[curConfig.displayField]:featureText+" "+feature.id)})))}var pickBar=null;if(_this.props.allowCloneGeometry&&(_this.props.editContext.action==="Draw"||_this.state.drawPick)&&!(_this.props.editContext.feature||{}).geometry){var pickButtons=[{key:"DrawPick",icon:"pick",label:LocaleUtils.tr("editing.pickdrawfeature")}];pickBar=/*#__PURE__*/React.createElement(ButtonBar,{active:_this.state.drawPick?"DrawPick":null,buttons:pickButtons,onClick:_this.toggleDrawPick})}var attributeForm=null;if(_this.props.editContext.feature&&(_this.props.editContext.action==="Pick"||_this.props.editContext.feature.geometry)){attributeForm=/*#__PURE__*/React.createElement(AttributeForm,{editConfig:curConfig,editContext:_this.props.editContext,iface:_this.props.iface,onCommit:_this.updatePickedFeatures})}var themeSublayers=_this.props.layers.reduce(function(accum,layer){return layer.role===LayerRole.THEME?accum.concat(LayerUtils.getSublayerNames(layer)):accum},[]);return/*#__PURE__*/React.createElement("div",{className:"editing-body"},/*#__PURE__*/React.createElement("div",{className:"editing-layer-selection"},/*#__PURE__*/React.createElement("select",{className:"combo editing-layer-select",disabled:_this.props.editContext.changed===true||_this.props.editContext.id!==_this.props.currentEditContext,onChange:function onChange(ev){return _this.changeSelectedLayer(ev.target.value)},value:_this.state.selectedLayer||""},Object.keys(editConfig).filter(function(layerId){return themeSublayers.includes(layerId)}).map(function(layerId){var _match$sublayer$title,_match$sublayer;var layerName=editConfig[layerId].layerName;var match=LayerUtils.searchLayer(_this.props.layers,_this.props.theme.url,layerName);return/*#__PURE__*/React.createElement("option",{key:layerId,value:layerId},(_match$sublayer$title=match===null||match===void 0||(_match$sublayer=match.sublayer)===null||_match$sublayer===void 0?void 0:_match$sublayer.title)!==null&&_match$sublayer$title!==void 0?_match$sublayer$title:layerName)}))),/*#__PURE__*/React.createElement(ButtonBar,{active:_this.state.drawPick?"Draw":_this.props.editContext.action,buttons:actionButtons,disabled:_this.props.editContext.changed||_this.props.editContext.id!==_this.props.currentEditContext,onClick:_this.actionClicked}),featureSelection,pickBar,attributeForm)});_defineProperty(_this,"actionClicked",function(action,data){_this.setState({drawPick:false,pickedFeatures:null});if(action==="AttribTable"){_this.props.setCurrentTask("AttributeTable",null,null,{layer:_this.state.selectedLayer})}else if(action==="Draw"){var editConfig=_this.props.theme.editConfig;var curConfig=editConfig[_this.state.selectedLayer];var featureSkel={type:"Feature",properties:{}};var mapPrefix=(curConfig.editDataset.match(/^[^.]+\./)||[""])[0];getFeatureTemplate(curConfig,featureSkel,_this.props.iface,mapPrefix,_this.props.map.projection,function(feature){_this.props.setEditContext("Editing",_objectSpread(_objectSpread({},data),{},{feature:feature,geomReadOnly:false}))})}else{_this.props.setEditContext("Editing",_objectSpread({},data))}});_defineProperty(_this,"pickFilter",function(feature){var _this$props$theme$edi;var geomType=(_this$props$theme$edi=_this.props.theme.editConfig[_this.state.selectedLayer])===null||_this$props$theme$edi===void 0?void 0:_this$props$theme$edi.geomType;return feature.geometry&&(feature.geometry.type===geomType||"Multi"+feature.geometry.type===geomType||feature.geometry.type.replace(/^Multi/,"")===geomType&&feature.geometry.coordinates.length===1)});_defineProperty(_this,"geomPicked",function(layer,feature){var _this$props$theme$edi2;var geomType=(_this$props$theme$edi2=_this.props.theme.editConfig[_this.state.selectedLayer])===null||_this$props$theme$edi2===void 0?void 0:_this$props$theme$edi2.geomType;var geometry=feature.geometry;if(geometry.type!==geomType){if("Multi"+feature.geometry.type===geomType){// Convert picked geometry to multi-type
 geometry={type:"Multi"+geometry.type,coordinates:[geometry.coordinates]}}else if(geometry.type.replace(/^Multi/,"")===geomType&&geometry.coordinates.length===1){// Convert picked geometry to single type
 geometry={type:geometry.type.replace(/^Multi/,""),coordinates:geometry.coordinates[0]}}else{// Should not happen, mismatching geometries should already have been filtered from the list of choices
-return}}var editFeature={type:"Feature",geometry:geometry,id:uuidv1()};_this.props.setEditContext("Editing",{action:"Draw",feature:editFeature,changed:true});_this.setState({drawPick:false})});_defineProperty(_this,"setLayerVisibility",function(selectedLayer,visibility){if(selectedLayer!==null){var path=[];var sublayer=null;var layer=_this.props.layers.find(function(l){return l.role===LayerRole.THEME&&(sublayer=LayerUtils.searchSubLayer(l,"name",selectedLayer,path))});if(layer&&sublayer){var oldvisibility=sublayer.visibility;if(oldvisibility!==visibility&&visibility!==null){var recurseDirection=!oldvisibility?"both":"children";_this.props.changeLayerProperty(layer.uuid,"visibility",visibility,path,recurseDirection)}return oldvisibility}}return null});_defineProperty(_this,"changeSelectedLayer",function(selectedLayer){var action=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var feature=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;var curConfig=_this.props.theme&&_this.props.theme.editConfig&&selectedLayer?_this.props.theme.editConfig[selectedLayer]:null;var editPermissions=curConfig?curConfig.permissions||{}:{};_this.props.setEditContext("Editing",{action:action||(_this.state.drawPick?"Draw":_this.props.editContext.action),feature:feature,geomType:curConfig?curConfig.geomType:null,geomReadOnly:editPermissions.updatable===false});var prevLayerVisibility=null;if(_this.state.selectedLayer!==null){_this.setLayerVisibility(_this.state.selectedLayer,_this.state.selectedLayerVisibility);prevLayerVisibility=_this.setLayerVisibility(selectedLayer,true)}_this.setState({selectedLayer:selectedLayer,selectedLayerVisibility:prevLayerVisibility,drawPick:false})});_defineProperty(_this,"setEditFeature",function(featureId){var feature=_this.state.pickedFeatures.find(function(f){return f.id.toString()===featureId});var editConfig=_this.props.theme.editConfig[_this.state.selectedLayer];var editPermissions=editConfig.permissions||{};_this.props.setEditContext("Editing",{feature:feature,changed:false,geomReadOnly:editPermissions.updatable===false})});_defineProperty(_this,"toggleDrawPick",function(){_this.setState(function(state){var pickActive=!state.drawPick;_this.props.setEditContext("Editing",{action:pickActive?null:"Draw"});return{drawPick:pickActive}})});return _this}_inherits(Editing,_React$Component);return _createClass(Editing,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var _this2=this;var themeSublayers=this.props.layers.reduce(function(accum,layer){return layer.role===LayerRole.THEME?accum.concat(LayerUtils.getSublayerNames(layer)):accum},[]);// Update selected layer on layers change
+return}}var editFeature={type:"Feature",geometry:geometry,id:uuidv1()};_this.props.setEditContext("Editing",{action:"Draw",feature:editFeature,changed:true});_this.setState({drawPick:false})});_defineProperty(_this,"setLayerVisibility",function(selectedLayer,visibility){if(selectedLayer!==null){var path=[];var sublayer=null;var layer=_this.props.layers.find(function(l){return l.role===LayerRole.THEME&&(sublayer=LayerUtils.searchSubLayer(l,"name",selectedLayer,path))});if(layer&&sublayer){var oldvisibility=sublayer.visibility;if(oldvisibility!==visibility&&visibility!==null){var recurseDirection=!oldvisibility?"both":"children";_this.props.changeLayerProperty(layer.id,"visibility",visibility,path,recurseDirection)}return oldvisibility}}return null});_defineProperty(_this,"changeSelectedLayer",function(selectedLayer){var action=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;var feature=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;var curConfig=_this.props.theme&&_this.props.theme.editConfig&&selectedLayer?_this.props.theme.editConfig[selectedLayer]:null;var editPermissions=curConfig?curConfig.permissions||{}:{};var canEditGeometry=["Point","LineString","Polygon"].includes(((curConfig===null||curConfig===void 0?void 0:curConfig.geomType)||"").replace(/^Multi/,"").replace(/Z$/,""));var geomReadOnly=editPermissions.updatable===false||!canEditGeometry;if(geomReadOnly){action="Pick"}_this.props.setEditContext("Editing",{action:action||(_this.state.drawPick?"Draw":_this.props.editContext.action),feature:feature,geomType:(curConfig===null||curConfig===void 0?void 0:curConfig.geomType)||null,geomReadOnly:geomReadOnly});var prevLayerVisibility=null;if(_this.state.selectedLayer!==null){_this.setLayerVisibility(_this.state.selectedLayer,_this.state.selectedLayerVisibility);prevLayerVisibility=_this.setLayerVisibility(selectedLayer,true)}_this.setState({selectedLayer:selectedLayer,selectedLayerVisibility:prevLayerVisibility,drawPick:false})});_defineProperty(_this,"setEditFeature",function(featureId){var feature=_this.state.pickedFeatures.find(function(f){return f.id.toString()===featureId});_this.props.setEditContext("Editing",{feature:feature,changed:false})});_defineProperty(_this,"toggleDrawPick",function(){_this.setState(function(state){var pickActive=!state.drawPick;_this.props.setEditContext("Editing",{action:pickActive?null:"Draw"});return{drawPick:pickActive}})});_defineProperty(_this,"updatePickedFeatures",function(newfeature){if(_this.state.pickedFeatures){_this.setState(function(state){return{pickedFeatures:state.pickedFeatures.map(function(feature){return feature.id===newfeature.id?newfeature:feature})}})}});return _this}_inherits(Editing,_React$Component);return _createClass(Editing,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var _this2=this;var themeSublayers=this.props.layers.reduce(function(accum,layer){return layer.role===LayerRole.THEME?accum.concat(LayerUtils.getSublayerNames(layer)):accum},[]);// Update selected layer on layers change
 if(this.props.enabled&&(this.props.layers!==prevProps.layers||!prevProps.enabled)){var layerIds=Object.keys(this.props.theme&&this.props.theme.editConfig||{}).filter(function(layerId){return themeSublayers.includes(layerId)});if(!isEmpty(layerIds)){if(!layerIds.includes(this.state.selectedLayer)){this.changeSelectedLayer(layerIds[0],"Pick")}}else if(this.state.selectedLayer){this.changeSelectedLayer(null)}}// If click point changed and in pick mode with a selected layer, trigger a pick
-var isCurrentContext=this.props.editContext.id===this.props.currentEditContext;if(this.props.enabled&&isCurrentContext&&this.props.editContext.action==="Pick"&&this.state.selectedLayer&&!this.props.editContext.changed){var newPoint=this.props.map.click||{};var oldPoint=prevProps.map.click||{};if(newPoint.coordinate&&!isEqual(newPoint.coordinate,oldPoint.coordinate)){var _this$props$filter$fi;var scale=Math.round(MapUtils.computeForZoom(this.props.map.scales,this.props.map.zoom));var editConfig=this.props.theme.editConfig[this.state.selectedLayer];var editPermissions=editConfig.permissions||{};var editDataset=editConfig.editDataset;this.props.iface.getFeature(editDataset,newPoint.coordinate,this.props.map.projection,scale,96,function(featureCollection){var features=featureCollection?featureCollection.features:null;_this2.setState({pickedFeatures:features});var feature=features?features[0]:null;_this2.props.setEditContext("Editing",{feature:feature,changed:false,geomReadOnly:editPermissions.updatable===false})},(_this$props$filter$fi=this.props.filter.filterParams)===null||_this$props$filter$fi===void 0?void 0:_this$props$filter$fi[this.state.selectedLayer],this.props.filter.filterGeom)}}if(prevProps.editContext.changed!==this.props.editContext.changed){this.props.setCurrentTaskBlocked(this.props.editContext.changed===true,LocaleUtils.tr("editing.unsavedchanged"))}if(!this.props.editContext.feature&&prevState.pickedFeatures){this.setState({pickedFeatures:null})}}},{key:"render",value:function render(){var _this3=this;var minMaxTooltip=this.state.minimized?LocaleUtils.tr("editing.maximize"):LocaleUtils.tr("editing.minimize");var extraTitlebarContent=/*#__PURE__*/React.createElement(Icon,{className:"editing-minimize-maximize",icon:this.state.minimized?"chevron-down":"chevron-up",onClick:function onClick(){return _this3.setState(function(state){return{minimized:!state.minimized}})},title:minMaxTooltip});var attribFormVisible=!!(this.props.editContext.feature&&(this.props.editContext.action==="Pick"||this.props.editContext.feature.geometry));return[/*#__PURE__*/React.createElement(SideBar,{extraTitlebarContent:extraTitlebarContent,heightResizeable:!this.state.minimized&&attribFormVisible,icon:"editing",id:"Editing",key:"EditingSidebar",onHide:this.onHide,onShow:this.onShow,side:this.props.side,title:LocaleUtils.tr("appmenu.items.Editing"),width:this.props.width},function(){return{body:_this3.state.minimized?null:_this3.renderBody()}}),this.state.drawPick?/*#__PURE__*/React.createElement(PickFeature,{featureFilter:this.pickFilter,featurePicked:this.geomPicked,key:"FeaturePicker"}):null]}}])}(React.Component);_defineProperty(Editing,"propTypes",{addLayerFeatures:PropTypes.func,/** Whether to enable the "Clone existing geometry" functionality. */allowCloneGeometry:PropTypes.bool,changeLayerProperty:PropTypes.func,clearEditContext:PropTypes.func,currentEditContext:PropTypes.string,editContext:PropTypes.object,enabled:PropTypes.bool,filter:PropTypes.object,iface:PropTypes.object,layers:PropTypes.array,map:PropTypes.object,refreshLayer:PropTypes.func,removeLayer:PropTypes.func,setCurrentTask:PropTypes.func,setCurrentTaskBlocked:PropTypes.func,setEditContext:PropTypes.func,setSnappingConfig:PropTypes.func,/** The side of the application on which to display the sidebar. */side:PropTypes.string,/** Whether snapping is available when editing. */snapping:PropTypes.bool,/** Whether snapping is enabled by default when editing.
+var isCurrentContext=this.props.editContext.id===this.props.currentEditContext;if(this.props.enabled&&isCurrentContext&&this.props.editContext.action==="Pick"&&this.state.selectedLayer&&!this.props.editContext.changed){var newPoint=this.props.map.click||{};var oldPoint=prevProps.map.click||{};if(newPoint.coordinate&&!isEqual(newPoint.coordinate,oldPoint.coordinate)){var _this$props$filter$fi;var scale=Math.round(MapUtils.computeForZoom(this.props.map.scales,this.props.map.zoom));var editConfig=this.props.theme.editConfig[this.state.selectedLayer];var editDataset=editConfig.editDataset;this.props.iface.getFeature(editDataset,newPoint.coordinate,this.props.map.projection,scale,96,function(featureCollection){var features=featureCollection?featureCollection.features:null;_this2.setState({pickedFeatures:features});var feature=features?features[0]:null;_this2.props.setEditContext("Editing",{feature:feature,changed:false})},(_this$props$filter$fi=this.props.filter.filterParams)===null||_this$props$filter$fi===void 0?void 0:_this$props$filter$fi[this.state.selectedLayer],this.props.filter.filterGeom)}}if(prevProps.editContext.changed!==this.props.editContext.changed){this.props.setCurrentTaskBlocked(this.props.editContext.changed===true,LocaleUtils.tr("editing.unsavedchanged"))}if(!this.props.editContext.feature&&prevState.pickedFeatures){this.setState({pickedFeatures:null})}}},{key:"render",value:function render(){var _this3=this;var minMaxTooltip=this.state.minimized?LocaleUtils.tr("editing.maximize"):LocaleUtils.tr("editing.minimize");var extraTitlebarContent=/*#__PURE__*/React.createElement(Icon,{className:"editing-minimize-maximize",icon:this.state.minimized?"chevron-down":"chevron-up",onClick:function onClick(){return _this3.setState(function(state){return{minimized:!state.minimized}})},title:minMaxTooltip});var attribFormVisible=!!(this.props.editContext.feature&&(this.props.editContext.action==="Pick"||this.props.editContext.feature.geometry));return[/*#__PURE__*/React.createElement(SideBar,{extraTitlebarContent:extraTitlebarContent,heightResizeable:!this.state.minimized&&attribFormVisible,icon:"editing",id:"Editing",key:"EditingSidebar",onHide:this.onHide,onShow:this.onShow,side:this.props.side,title:LocaleUtils.tr("appmenu.items.Editing"),width:this.props.width},function(){return{body:_this3.state.minimized?null:_this3.renderBody()}}),this.state.drawPick?/*#__PURE__*/React.createElement(PickFeature,{featureFilter:this.pickFilter,featurePicked:this.geomPicked,key:"FeaturePicker"}):null]}}])}(React.Component);_defineProperty(Editing,"propTypes",{addLayerFeatures:PropTypes.func,/** Whether to enable the "Clone existing geometry" functionality. */allowCloneGeometry:PropTypes.bool,changeLayerProperty:PropTypes.func,clearEditContext:PropTypes.func,currentEditContext:PropTypes.string,editContext:PropTypes.object,enabled:PropTypes.bool,filter:PropTypes.object,iface:PropTypes.object,layers:PropTypes.array,map:PropTypes.object,refreshLayer:PropTypes.func,removeLayer:PropTypes.func,setCurrentTask:PropTypes.func,setCurrentTaskBlocked:PropTypes.func,setEditContext:PropTypes.func,setSnappingConfig:PropTypes.func,/** The side of the application on which to display the sidebar. */side:PropTypes.string,/** Whether snapping is available when editing. */snapping:PropTypes.bool,/** Whether snapping is enabled by default when editing.
          *  Either `false`, `edge`, `vertex` or `true` (i.e. both vertex and edge). */snappingActive:PropTypes.oneOfType([PropTypes.bool,PropTypes.string]),taskData:PropTypes.object,theme:PropTypes.object,/** The default width of the editing sidebar, as a CSS width string. */width:PropTypes.string});_defineProperty(Editing,"defaultProps",{width:"30em",side:"right",snapping:true,snappingActive:true,allowCloneGeometry:true});export default(function(){var iface=arguments.length>0&&arguments[0]!==undefined?arguments[0]:EditingInterface;return connect(function(state){return{enabled:state.task.id==="Editing",theme:state.theme.current,layers:state.layers.flat,filter:state.layers.filter,map:state.map,iface:iface,editContext:state.editing.contexts.Editing||{},currentEditContext:state.editing.currentContext,taskData:state.task.id==="Editing"?state.task.data:null}},{addLayerFeatures:addLayerFeatures,removeLayer:removeLayer,clearEditContext:clearEditContext,setEditContext:setEditContext,setSnappingConfig:setSnappingConfig,setCurrentTask:setCurrentTask,setCurrentTaskBlocked:setCurrentTaskBlocked,refreshLayer:refreshLayer,changeLayerProperty:changeLayerProperty})(Editing)});

package/plugins/FeatureForm.js

@@ -18,4 +18,4 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
  *
  * Can be used as default identify tool by setting `"identifyTool": "FeatureForm"` in `config.json`.
  */var FeatureForm=/*#__PURE__*/function(_React$Component){function FeatureForm(props){var _this;_classCallCheck(this,FeatureForm);_this=_callSuper(this,FeatureForm,[props]);_defineProperty(_this,"queryPoint",function(prevProps){if(_this.props.click.button!==0||_this.props.click===prevProps.click||(_this.props.click.features||[]).find(function(feature){return feature.id==="startupposmarker"})){return null}var searchMarker=(_this.props.click.features||[]).find(function(feature){return feature.id==="searchmarker"});if(searchMarker&&searchMarker.geometry.type==="Point"){return searchMarker.geometry.coordinates}return _this.props.click.coordinate});_defineProperty(_this,"queryFeatures",function(pos){var pendingRequests=0;Object.entries(_this.props.theme.editConfig||{}).forEach(function(_ref){var _this$props$filter$fi;var _ref2=_slicedToArray(_ref,2),layerId=_ref2[0],editConfig=_ref2[1];if(!editConfig.geomType){// Skip geometryless datasets
-return}var path=[];var sublayer=null;var mapScale=MapUtils.computeForZoom(_this.props.map.scales,_this.props.map.zoom);var layer=_this.props.layers.find(function(l){return l.role===LayerRole.THEME&&(sublayer=LayerUtils.searchSubLayer(l,"name",layerId,path))});if(!layer||!sublayer||!LayerUtils.sublayerVisible(layer,path)||!LayerUtils.layerScaleInRange(sublayer,mapScale)){return}var layerOrder=layer.params.LAYERS.split(",");++pendingRequests;var editDataset=editConfig.editDataset||layerId;var scale=Math.round(MapUtils.computeForZoom(_this.props.map.scales,_this.props.map.zoom));_this.props.iface.getFeature(editDataset,pos,_this.props.map.projection,scale,96,function(featureCollection){if(featureCollection&&!isEmpty(featureCollection.features)){_this.setState(function(state){var newPickedFeatures=Object.fromEntries(Object.entries(_objectSpread(_objectSpread({},state.pickedFeatures),featureCollection.features.reduce(function(res,feature){return _objectSpread(_objectSpread({},res),{},_defineProperty({},layerId+"::"+feature.id,feature))},{}))).sort(function(a,b){var partsA=a[0].split("::");var partsB=b[0].split("::");var diff=layerOrder.indexOf(partsB[0])-layerOrder.indexOf(partsA[0]);return diff===0?partsA[1].localeCompare(partsB[1]):diff}));var selectedFeature=state.pendingRequests<=1&&!state.selectedFeature?Object.keys(newPickedFeatures)[0]:"";return{pickedFeatures:newPickedFeatures,pendingRequests:state.pendingRequests-1,selectedFeature:selectedFeature}})}else{_this.setState(function(state){var _Object$keys$;var selectedFeature=state.pendingRequests<=1&&!state.selectedFeature?(_Object$keys$=Object.keys(state.pickedFeatures)[0])!==null&&_Object$keys$!==void 0?_Object$keys$:"":"";return{pendingRequests:state.pendingRequests-1,selectedFeature:selectedFeature}})}},(_this$props$filter$fi=_this.props.filter.filterParams)===null||_this$props$filter$fi===void 0?void 0:_this$props$filter$fi[sublayer.name],_this.props.filter.filterGeom)});_this.setState({pendingRequests:pendingRequests,pickedFeatures:{},selectedFeature:""})});_defineProperty(_this,"setSelectedFeature",function(ev){_this.setState({selectedFeature:ev.target.value})});_defineProperty(_this,"onWindowClose",function(){_this.clearResults();if(_this.props.exitTaskOnResultsClose){_this.props.setCurrentTask(null)}});_defineProperty(_this,"clearResults",function(){if(!_this.props.editContext.changed){_this.setState(FeatureForm.defaultState)}});_this.state=FeatureForm.defaultState;return _this}_inherits(FeatureForm,_React$Component);return _createClass(FeatureForm,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(this.props.enabled&&!prevProps.enabled){this.props.setEditContext("FeatureForm",{action:"Pick"})}var isCurrentContext=this.props.editContext.id===this.props.currentEditContext;if(this.props.enabled&&isCurrentContext&&!this.props.editContext.changed&&this.state.pendingRequests===0){var clickPoint=this.queryPoint(prevProps);if(clickPoint){this.queryFeatures(clickPoint)}}if(this.props.enabled&&this.state.selectedFeature!==prevState.selectedFeature){var feature=this.state.pickedFeatures?this.state.pickedFeatures[this.state.selectedFeature]:null;var curLayerId=this.state.selectedFeature.split("::")[0];var curConfig=this.props.theme.editConfig[curLayerId]||{};var editPermissions=curConfig.permissions||{};this.props.setEditContext("FeatureForm",{action:"Pick",feature:feature,changed:false,geomType:curConfig.geomType||null,geomReadOnly:editPermissions.updatable===false})}if(!this.props.enabled&&prevProps.enabled){this.props.clearEditContext("FeatureForm");this.setState(FeatureForm.defaultState)}}},{key:"render",value:function render(){var _this2=this;var resultWindow=null;if(this.state.pickedFeatures!==null){var body=null;if(this.state.pendingRequests>0){body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("featureform.querying")))}else if(isEmpty(this.state.pickedFeatures)){body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("featureform.noresults")))}else{var featureText=LocaleUtils.tr("featureform.feature");var curLayerId=this.state.selectedFeature.split("::")[0];var curConfig=this.props.theme.editConfig[curLayerId];body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},Object.keys(this.state.pickedFeatures).length>1?/*#__PURE__*/React.createElement("div",{className:"feature-query-selection"},/*#__PURE__*/React.createElement("select",{onChange:this.setSelectedFeature,value:this.state.selectedFeature},Object.entries(this.state.pickedFeatures).map(function(_ref3){var _ref4=_slicedToArray(_ref3,2),id=_ref4[0],feature=_ref4[1];var _id$split=id.split("::"),_id$split2=_slicedToArray(_id$split,2),layerId=_id$split2[0],featureId=_id$split2[1];var editConfig=_this2.props.theme.editConfig[layerId];var match=LayerUtils.searchLayer(_this2.props.layers,"name",editConfig.layerName,[LayerRole.THEME]);var layerName=match?match.sublayer.title:editConfig.layerName;var featureName=editConfig.displayField?feature.properties[editConfig.displayField]:featureText+" "+featureId;return/*#__PURE__*/React.createElement("option",{key:id,value:id},layerName+": "+featureName)}))):null,this.props.editContext.feature?/*#__PURE__*/React.createElement(AttributeForm,{editConfig:curConfig,editContext:this.props.editContext,iface:this.props.iface}):null)}resultWindow=/*#__PURE__*/React.createElement(ResizeableWindow,{dockable:this.props.geometry.side,icon:"featureform",initialHeight:this.props.geometry.initialHeight,initialWidth:this.props.geometry.initialWidth,initialX:this.props.geometry.initialX,initialY:this.props.geometry.initialY,initiallyDocked:this.props.geometry.initiallyDocked,key:"FeatureForm",onClose:this.onWindowClose,title:LocaleUtils.tr("featureform.title")},body)}return[resultWindow,/*#__PURE__*/React.createElement(TaskBar,{key:"FeatureFormTaskBar",task:"FeatureForm"},function(){return{body:LocaleUtils.tr("infotool.clickhelpPoint")}})]}}])}(React.Component);_defineProperty(FeatureForm,"propTypes",{clearEditContext:PropTypes.func,click:PropTypes.object,currentEditContext:PropTypes.string,editContext:PropTypes.object,enabled:PropTypes.bool,/** Whether to clear the task when the results window is closed. */exitTaskOnResultsClose:PropTypes.bool,filter:PropTypes.object,/** Default window geometry with size, position and docking status. Positive position values (including '0') are related to top (InitialY) and left (InitialX), negative values (including '-0') to bottom (InitialY) and right (InitialX). */geometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool,side:PropTypes.string}),iface:PropTypes.object,layers:PropTypes.array,map:PropTypes.object,setCurrentTask:PropTypes.func,setEditContext:PropTypes.func,theme:PropTypes.object});_defineProperty(FeatureForm,"defaultProps",{geometry:{initialWidth:320,initialHeight:480,initialX:0,initialY:0,initiallyDocked:false,side:"left"}});_defineProperty(FeatureForm,"defaultState",{pendingRequests:0,pickedFeatures:null,selectedFeature:""});export default(function(){var iface=arguments.length>0&&arguments[0]!==undefined?arguments[0]:EditingInterface;return connect(function(state){var enabled=state.task.id==="FeatureForm"||state.task.identifyEnabled&&ConfigUtils.getConfigProp("identifyTool",state.theme.current,"Identify")==="FeatureForm";return{click:state.map.click||{modifiers:{}},enabled:enabled,editContext:state.editing.contexts.FeatureForm||{},currentEditContext:state.editing.currentContext,iface:iface,layers:state.layers.flat,filter:state.layers.filter,map:state.map,theme:state.theme.current}},{setCurrentTask:setCurrentTask,clearEditContext:clearEditContext,setEditContext:setEditContext})(FeatureForm)});
+return}var path=[];var sublayer=null;var mapScale=MapUtils.computeForZoom(_this.props.map.scales,_this.props.map.zoom);var layer=_this.props.layers.find(function(l){return l.role===LayerRole.THEME&&(sublayer=LayerUtils.searchSubLayer(l,"name",layerId,path))});if(!layer||!sublayer||!LayerUtils.sublayerVisible(layer,path)||!LayerUtils.layerScaleInRange(sublayer,mapScale)){return}var layerOrder=layer.params.LAYERS.split(",");++pendingRequests;var editDataset=editConfig.editDataset||layerId;var scale=Math.round(MapUtils.computeForZoom(_this.props.map.scales,_this.props.map.zoom));_this.props.iface.getFeature(editDataset,pos,_this.props.map.projection,scale,96,function(featureCollection){if(featureCollection&&!isEmpty(featureCollection.features)){_this.setState(function(state){var newPickedFeatures=Object.fromEntries(Object.entries(_objectSpread(_objectSpread({},state.pickedFeatures),featureCollection.features.reduce(function(res,feature){return _objectSpread(_objectSpread({},res),{},_defineProperty({},layerId+"::"+feature.id,feature))},{}))).sort(function(a,b){var partsA=a[0].split("::");var partsB=b[0].split("::");var diff=layerOrder.indexOf(partsB[0])-layerOrder.indexOf(partsA[0]);return diff===0?partsA[1].localeCompare(partsB[1]):diff}));var selectedFeature=state.pendingRequests<=1&&!state.selectedFeature?Object.keys(newPickedFeatures)[0]:"";return{pickedFeatures:newPickedFeatures,pendingRequests:state.pendingRequests-1,selectedFeature:selectedFeature}})}else{_this.setState(function(state){var _Object$keys$;var selectedFeature=state.pendingRequests<=1&&!state.selectedFeature?(_Object$keys$=Object.keys(state.pickedFeatures)[0])!==null&&_Object$keys$!==void 0?_Object$keys$:"":"";return{pendingRequests:state.pendingRequests-1,selectedFeature:selectedFeature}})}},(_this$props$filter$fi=_this.props.filter.filterParams)===null||_this$props$filter$fi===void 0?void 0:_this$props$filter$fi[sublayer.name],_this.props.filter.filterGeom)});_this.setState({pendingRequests:pendingRequests,pickedFeatures:{},selectedFeature:""})});_defineProperty(_this,"setSelectedFeature",function(ev){_this.setState({selectedFeature:ev.target.value})});_defineProperty(_this,"onWindowClose",function(){_this.clearResults();if(_this.props.exitTaskOnResultsClose){_this.props.setCurrentTask(null)}});_defineProperty(_this,"clearResults",function(){if(!_this.props.editContext.changed){_this.setState(FeatureForm.defaultState)}});_defineProperty(_this,"updatePickedFeatures",function(newfeature){_this.setState(function(state){return{pickedFeatures:Object.entries(state.pickedFeatures).reduce(function(res,_ref3){var _ref4=_slicedToArray(_ref3,2),key=_ref4[0],feature=_ref4[1];res[key]=feature.id===newfeature.id?newfeature:feature;return res},{})}})});_this.state=FeatureForm.defaultState;return _this}_inherits(FeatureForm,_React$Component);return _createClass(FeatureForm,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(this.props.enabled&&!prevProps.enabled){this.props.setEditContext("FeatureForm",{action:"Pick"})}var isCurrentContext=this.props.editContext.id===this.props.currentEditContext;if(this.props.enabled&&isCurrentContext&&!this.props.editContext.changed&&this.state.pendingRequests===0){var clickPoint=this.queryPoint(prevProps);if(clickPoint){this.queryFeatures(clickPoint)}}if(this.props.enabled&&this.state.selectedFeature!==prevState.selectedFeature){var feature=this.state.pickedFeatures?this.state.pickedFeatures[this.state.selectedFeature]:null;var curLayerId=this.state.selectedFeature.split("::")[0];var curConfig=this.props.theme.editConfig[curLayerId]||{};var canEditGeometry=["Point","LineString","Polygon"].includes((curConfig.geomType||"").replace(/^Multi/,"").replace(/Z$/,""));var editPermissions=curConfig.permissions||{};this.props.setEditContext("FeatureForm",{action:"Pick",feature:feature,changed:false,geomType:curConfig.geomType||null,geomReadOnly:editPermissions.updatable===false||!canEditGeometry})}if(!this.props.enabled&&prevProps.enabled){this.props.clearEditContext("FeatureForm");this.setState(FeatureForm.defaultState)}}},{key:"render",value:function render(){var _this2=this;var resultWindow=null;if(this.state.pickedFeatures!==null){var body=null;if(this.state.pendingRequests>0){body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("featureform.querying")))}else if(isEmpty(this.state.pickedFeatures)){body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("featureform.noresults")))}else{var featureText=LocaleUtils.tr("featureform.feature");var curLayerId=this.state.selectedFeature.split("::")[0];var curConfig=this.props.theme.editConfig[curLayerId];body=/*#__PURE__*/React.createElement("div",{className:"feature-query-body",role:"body"},Object.keys(this.state.pickedFeatures).length>1?/*#__PURE__*/React.createElement("div",{className:"feature-query-selection"},/*#__PURE__*/React.createElement("select",{onChange:this.setSelectedFeature,value:this.state.selectedFeature},Object.entries(this.state.pickedFeatures).map(function(_ref5){var _match$sublayer$title,_match$sublayer;var _ref6=_slicedToArray(_ref5,2),id=_ref6[0],feature=_ref6[1];var _id$split=id.split("::"),_id$split2=_slicedToArray(_id$split,2),layerId=_id$split2[0],featureId=_id$split2[1];var editConfig=_this2.props.theme.editConfig[layerId];var match=LayerUtils.searchLayer(_this2.props.layers,_this2.props.theme.url,editConfig.layerName);var layerName=(_match$sublayer$title=match===null||match===void 0||(_match$sublayer=match.sublayer)===null||_match$sublayer===void 0?void 0:_match$sublayer.title)!==null&&_match$sublayer$title!==void 0?_match$sublayer$title:editConfig.layerName;var featureName=editConfig.displayField?feature.properties[editConfig.displayField]:featureText+" "+featureId;return/*#__PURE__*/React.createElement("option",{key:id,value:id},layerName+": "+featureName)}))):null,this.props.editContext.feature?/*#__PURE__*/React.createElement(AttributeForm,{editConfig:curConfig,editContext:this.props.editContext,iface:this.props.iface,onCommit:this.updatePickedFeatures}):null)}resultWindow=/*#__PURE__*/React.createElement(ResizeableWindow,{dockable:this.props.geometry.side,icon:"featureform",initialHeight:this.props.geometry.initialHeight,initialWidth:this.props.geometry.initialWidth,initialX:this.props.geometry.initialX,initialY:this.props.geometry.initialY,initiallyDocked:this.props.geometry.initiallyDocked,key:"FeatureForm",onClose:this.onWindowClose,title:LocaleUtils.tr("featureform.title")},body)}return[resultWindow,/*#__PURE__*/React.createElement(TaskBar,{key:"FeatureFormTaskBar",task:"FeatureForm"},function(){return{body:LocaleUtils.tr("infotool.clickhelpPoint")}})]}}])}(React.Component);_defineProperty(FeatureForm,"propTypes",{clearEditContext:PropTypes.func,click:PropTypes.object,currentEditContext:PropTypes.string,editContext:PropTypes.object,enabled:PropTypes.bool,/** Whether to clear the task when the results window is closed. */exitTaskOnResultsClose:PropTypes.bool,filter:PropTypes.object,/** Default window geometry with size, position and docking status. Positive position values (including '0') are related to top (InitialY) and left (InitialX), negative values (including '-0') to bottom (InitialY) and right (InitialX). */geometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool,side:PropTypes.string}),iface:PropTypes.object,layers:PropTypes.array,map:PropTypes.object,setCurrentTask:PropTypes.func,setEditContext:PropTypes.func,theme:PropTypes.object});_defineProperty(FeatureForm,"defaultProps",{geometry:{initialWidth:320,initialHeight:480,initialX:0,initialY:0,initiallyDocked:false,side:"left"}});_defineProperty(FeatureForm,"defaultState",{pendingRequests:0,pickedFeatures:null,selectedFeature:""});export default(function(){var iface=arguments.length>0&&arguments[0]!==undefined?arguments[0]:EditingInterface;return connect(function(state){var enabled=state.task.id==="FeatureForm"||state.task.identifyEnabled&&ConfigUtils.getConfigProp("identifyTool",state.theme.current,"Identify")==="FeatureForm";return{click:state.map.click||{modifiers:{}},enabled:enabled,editContext:state.editing.contexts.FeatureForm||{},currentEditContext:state.editing.currentContext,iface:iface,layers:state.layers.flat,filter:state.layers.filter,map:state.map,theme:state.theme.current}},{setCurrentTask:setCurrentTask,clearEditContext:clearEditContext,setEditContext:setEditContext})(FeatureForm)});

package/plugins/Identify.js

@@ -14,5 +14,5 @@ function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof
  * Extendable in combination with the `qwc-feature-info-service`, which provides support
  * for customized queries and templates for the result presentation.
  */var Identify=/*#__PURE__*/function(_React$Component){function Identify(){var _this;_classCallCheck(this,Identify);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key]}_this=_callSuper(this,Identify,[].concat(args));_defineProperty(_this,"state",{mode:"Point",identifyResults:null,pendingRequests:0,radius:0,radiusUnits:_this.props.initialRadiusUnits,exitTaskOnResultsClose:null,filterGeom:null,filterGeomModifiers:{}});_defineProperty(_this,"identifyPoint",function(clickPoint){if(clickPoint){_this.setState(function(state){// Remove any search selection layer to avoid confusion
-_this.props.removeLayer("searchselection");var pendingRequests=0;var identifyResults=_this.props.click.modifiers.ctrl!==true?{}:state.identifyResults;var queryableLayers=[];queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);queryableLayers.forEach(function(l){var request=IdentifyUtils.buildRequest(l,l.queryLayers.join(","),clickPoint,_this.props.map,_this.props.params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state2){return{pendingRequests:state2.pendingRequests-1}});if(response){_this.parseResult(response,l,request.params.info_format,clickPoint)}})});if(!isEmpty(_this.props.click.features)){_this.props.click.features.forEach(function(feature){var layer=_this.props.layers.find(function(l){return l.id===feature.layerId});if((layer===null||layer===void 0?void 0:layer.role)===LayerRole.USERLAYER){var _layer$features$find,_layer$features,_layer$features$find2,_layer$projection;var queryFeature=_objectSpread({},(_layer$features$find=(_layer$features=layer.features)===null||_layer$features===void 0||(_layer$features$find2=_layer$features.find)===null||_layer$features$find2===void 0?void 0:_layer$features$find2.call(_layer$features,function(f){return f.id===feature.id}))!==null&&_layer$features$find!==void 0?_layer$features$find:feature);if(!(queryFeature!==null&&queryFeature!==void 0&&queryFeature.properties)){return}if(!identifyResults[layer.name]){identifyResults[layer.name]=[]}queryFeature.crs=(_layer$projection=layer.projection)!==null&&_layer$projection!==void 0?_layer$projection:_this.props.map.projection;queryFeature.displayname=queryFeature.properties.name||queryFeature.properties.Name||queryFeature.properties.NAME||queryFeature.properties.label||queryFeature.properties.id||queryFeature.id;queryFeature.layertitle=layer.title||layer.name||layer.id;queryFeature.properties=Object.entries(queryFeature.properties).reduce(function(res,_ref){var _ref2=_slicedToArray(_ref,2),key=_ref2[0],val=_ref2[1];return _objectSpread(_objectSpread({},res),{},_defineProperty({},key,_typeof(val)==="object"?JSON.stringify(val):val))},{});identifyResults[layer.name].push(queryFeature)}})}_this.props.addMarker("identify",clickPoint,"",_this.props.map.projection);return{identifyResults:identifyResults,pendingRequests:pendingRequests}})}});_defineProperty(_this,"queryPoint",function(prevProps){if(_this.props.click.button!==0||_this.props.click===prevProps.click||(_this.props.click.features||[]).find(function(feature){return feature.id==="startupposmarker"})){return null}var searchMarker=(_this.props.click.features||[]).find(function(feature){return feature.id==="searchmarker"});if(searchMarker&&searchMarker.geometry.type==="Point"){return searchMarker.geometry.coordinates}return _this.props.click.coordinate});_defineProperty(_this,"identifyRegion",function(){var queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);var poly=_this.state.filterGeom.coordinates[0];if(poly.length<3||isEmpty(queryableLayers)){return}var identifyResults=_this.state.filterGeomModifiers.ctrl!==true?{}:_this.state.identifyResults;var center=[0,0];poly.forEach(function(point){center[0]+=point[0];center[1]+=point[1]});center[0]/=poly.length;center[1]/=poly.length;var filter=VectorLayerUtils.geoJSONGeomToWkt(_this.state.filterGeom);var pendingRequests=0;var params=_objectSpread({},_this.props.params);if(_this.props.params.region_feature_count){params.feature_count=_this.props.params.region_feature_count;delete params.region_feature_count}queryableLayers.forEach(function(layer){var request=IdentifyUtils.buildFilterRequest(layer,layer.queryLayers.join(","),filter,_this.props.map,params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state){return{pendingRequests:state.pendingRequests-1}});if(response){_this.parseResult(response,layer,request.params.info_format,center)}});_this.setState({identifyResults:identifyResults,pendingRequests:pendingRequests})})});_defineProperty(_this,"identifyRadius",function(){var clickPoint=_this.state.filterGeom.center;var queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);if(isEmpty(queryableLayers)){return}var identifyResults=_this.state.filterGeomModifiers.ctrl!==true?{}:_this.state.identifyResults;var filter=VectorLayerUtils.geoJSONGeomToWkt(_this.state.filterGeom);var pendingRequests=0;var params=_objectSpread({},_this.props.params);if(_this.props.params.radius_feature_count){params.feature_count=_this.props.params.radius_feature_count;delete params.radius_feature_count}queryableLayers.forEach(function(layer){var request=IdentifyUtils.buildFilterRequest(layer,layer.queryLayers.join(","),filter,_this.props.map,params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state){return{pendingRequests:state.pendingRequests-1}});if(response){_this.parseResult(response,layer,request.params.info_format,clickPoint)}});_this.setState({identifyResults:identifyResults,pendingRequests:pendingRequests})});_this.props.addMarker("identify",clickPoint,"",_this.props.map.projection)});_defineProperty(_this,"changeBufferUnit",function(ev){_this.setState({radiusUnits:ev.target.value})});_defineProperty(_this,"parseResult",function(response,layer,format,clickPoint){var newResults=IdentifyUtils.parseResponse(response,layer,format,clickPoint,_this.props.map.projection,_this.props.featureInfoReturnsLayerName,_this.props.layers);// Merge with previous
-_this.setState(function(state){var identifyResults=_objectSpread({},state.identifyResults);Object.keys(newResults).forEach(function(layername){var existingFeatures=identifyResults[layername]||[];newResults[layername].forEach(function(newFeature){var featureIndex=existingFeatures.findIndex(function(feature){return feature.id===newFeature.id});if(featureIndex===-1){existingFeatures.push(newFeature)}});identifyResults[layername]=existingFeatures});return{identifyResults:identifyResults}})});_defineProperty(_this,"onShow",function(mode,data){_this.setState({mode:mode||"Point",exitTaskOnResultsClose:data===null||data===void 0?void 0:data.exitTaskOnResultsClose});if(mode==="Point"&&data!==null&&data!==void 0&&data.pos){_this.identifyPoint(data.pos)}});_defineProperty(_this,"onToolClose",function(){_this.setState({mode:"Point",exitTaskOnResultsClose:null,filterGeom:null});if(_this.props.clearResultsOnClose){_this.clearResults()}});_defineProperty(_this,"onWindowClose",function(){_this.clearResults();if(_this.state.exitTaskOnResultsClose||_this.props.exitTaskOnResultsClose){_this.props.setCurrentTask(null)}});_defineProperty(_this,"clearResults",function(){_this.props.removeMarker("identify");_this.props.removeLayer("identifyslection");_this.props.removeLayer("identifyradiusbuffer");_this.setState({identifyResults:null,pendingRequests:0})});_defineProperty(_this,"updateRadius",function(radius,units){_this.setState(function(state){return{radius:radius,radiusUnits:units,filterGeom:_objectSpread(_objectSpread({},state.filterGeom),{},{radius:MeasureUtils.convertLength(radius,units,"m")})}})});_defineProperty(_this,"renderBody",function(){if(_this.state.mode==="Point"){return LocaleUtils.tr("infotool.clickhelpPoint")}else if(_this.state.mode==="Region"){return LocaleUtils.tr("infotool.clickhelpPolygon")}else if(_this.state.mode==="Radius"){var text=LocaleUtils.tr("infotool.clickhelpRadius");return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement("div",null,text),/*#__PURE__*/React.createElement("div",{className:"identify-radius-controls controlgroup"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("infotool.radius"),":\xA0"),/*#__PURE__*/React.createElement(NumberInput,{disabled:!_this.state.filterGeom,max:1000000,min:1,mobile:true,onChange:function onChange(rad){return _this.updateRadius(rad,_this.state.radiusUnits)},value:_this.state.radius}),/*#__PURE__*/React.createElement("select",{onChange:function onChange(ev){return _this.updateRadius(_this.state.radius,ev.target.value)},value:_this.state.radiusUnits},/*#__PURE__*/React.createElement("option",{value:"m"},"m"),/*#__PURE__*/React.createElement("option",{value:"ft"},"ft"),/*#__PURE__*/React.createElement("option",{value:"km"},"km"),/*#__PURE__*/React.createElement("option",{value:"mi"},"mi"))))}return null});return _this}_inherits(Identify,_React$Component);return _createClass(Identify,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(this.props.theme!==prevProps.theme){this.clearResults()}else if(!this.props.enabled&&prevProps.enabled){if(this.props.clearResultsOnClose){this.clearResults()}}if(this.props.enabled){if(this.state.mode==="Point"){var clickPoint=this.queryPoint(prevProps);this.identifyPoint(clickPoint)}else if(this.state.mode==="Region"){if(this.state.filterGeom&&this.state.filterGeom!==prevState.filterGeom){this.identifyRegion()}}else if(this.state.mode==="Radius"){if(this.state.filterGeom&&this.state.filterGeom!==prevState.filterGeom){this.setState(function(state){return{radius:MeasureUtils.convertLength(state.filterGeom.radius,"m",state.radiusUnits)}});this.identifyRadius()}}}}},{key:"render",value:function render(){var _this2=this;var resultWindow=null;if(this.state.pendingRequests>0||this.state.identifyResults!==null){var body=null;if(isEmpty(this.state.identifyResults)){if(this.state.pendingRequests>0){body=/*#__PURE__*/React.createElement("div",{className:"identify-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("identify.querying")))}else{body=/*#__PURE__*/React.createElement("div",{className:"identify-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("identify.noresults")))}}else{body=/*#__PURE__*/React.createElement(IdentifyViewer,{attributeCalculator:this.props.attributeCalculator,attributeTransform:this.props.attributeTransform,customExporters:this.props.customExporters,displayResultTree:this.props.displayResultTree,enableAggregatedReports:this.props.enableAggregatedReports,enableExport:this.props.enableExport,exportGeometry:this.props.exportGeometry,highlightAllResults:this.props.highlightAllResults,identifyResults:this.state.identifyResults,iframeDialogsInitiallyDocked:this.props.iframeDialogsInitiallyDocked,longAttributesDisplay:this.props.longAttributesDisplay,replaceImageUrls:this.props.replaceImageUrls,role:"body",showLayerSelector:this.props.showLayerSelector})}resultWindow=/*#__PURE__*/React.createElement(ResizeableWindow,{busyIcon:this.state.pendingRequests>0,dockable:this.props.geometry.side,icon:"info-sign",initialHeight:this.props.geometry.initialHeight,initialWidth:this.props.geometry.initialWidth,initialX:this.props.geometry.initialX,initialY:this.props.geometry.initialY,initiallyDocked:this.props.geometry.initiallyDocked,key:"IdentifyWindow",onClose:this.onWindowClose,title:LocaleUtils.tr("identify.title")},body)}return[resultWindow,/*#__PURE__*/React.createElement(TaskBar,{key:"IdentifyTaskBar",onHide:this.onToolClose,onShow:this.onShow,task:"Identify"},function(){return{body:_this2.renderBody()}}),this.state.mode==="Region"||this.state.mode==="Radius"?/*#__PURE__*/React.createElement(MapSelection,{active:true,geomType:this.state.mode==="Radius"?"Circle":"Polygon",geometry:this.state.filterGeom,geometryChanged:function geometryChanged(geom,mod){return _this2.setState({filterGeom:geom,filterGeomModifiers:mod})},key:"MapSelection",measure:this.state.mode==="Radius"}):null]}}])}(React.Component);_defineProperty(Identify,"propTypes",{addLayerFeatures:PropTypes.func,addMarker:PropTypes.func,/** Optional function for computing derived attributes. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */attributeCalculator:PropTypes.func,/** Optional function for transforming attribute values. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */attributeTransform:PropTypes.func,/** Whether to clear the identify results when exiting the identify tool. */clearResultsOnClose:PropTypes.bool,click:PropTypes.object,currentIdentifyTool:PropTypes.string,currentTask:PropTypes.string,/** Optional list of custom exporters to offer along with the built-in exporters. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */customExporters:PropTypes.array,/** Whether to display a tree overview of results (as opposed to a flat list of results). */displayResultTree:PropTypes.bool,/** Whether to enable the aggregated report download button. */enableAggregatedReports:PropTypes.bool,/** Whether to enable the export functionality. Either `true|false` or a list of single allowed formats (builtin formats: `json`, `geojson`, `csv`, `csvzip`) */enableExport:PropTypes.oneOfType([PropTypes.bool,PropTypes.array]),enabled:PropTypes.bool,/** Whether to clear the task when the results window is closed. */exitTaskOnResultsClose:PropTypes.bool,/** Whether to include the geometry in exported features. Default: `true`. */exportGeometry:PropTypes.bool,/** Whether to assume that XML GetFeatureInfo responses specify the technical layer name in the `name` attribute, rather than the layer title. */featureInfoReturnsLayerName:PropTypes.bool,/** Default window geometry with size, position and docking status. Positive position values (including '0') are related to top (InitialY) and left (InitialX), negative values (including '-0') to bottom (InitialY) and right (InitialX). */geometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool,side:PropTypes.string}),/** Whether to highlight all results if no result is hovered */highlightAllResults:PropTypes.bool,iframeDialogsInitiallyDocked:PropTypes.bool,/** The initial radius units of the identify dialog in radius mode. One of 'm', 'ft', 'km', 'mi'. */initialRadiusUnits:PropTypes.string,layers:PropTypes.array,longAttributesDisplay:PropTypes.string,map:PropTypes.object,/** Extra params to append to the GetFeatureInfo request (i.e. `FI_POINT_TOLERANCE`, `FI_LINE_TOLERANCE`, `feature_count`, ...). Additionally, `region_feature_count` and `radius_feature_count` are supported. */params:PropTypes.object,removeLayer:PropTypes.func,removeMarker:PropTypes.func,/** Whether to replace an attribute value containing an URL to an image with an inline image. */replaceImageUrls:PropTypes.bool,selection:PropTypes.object,setCurrentTask:PropTypes.func,/** Whether to show a layer selector to filter the identify results by layer. */showLayerSelector:PropTypes.bool,theme:PropTypes.object});_defineProperty(Identify,"defaultProps",{enableAggregatedReports:true,enableExport:true,exportGeometry:true,clearResultsOnClose:true,customExporters:[],longAttributesDisplay:"ellipsis",displayResultTree:true,replaceImageUrls:true,featureInfoReturnsLayerName:true,geometry:{initialWidth:240,initialHeight:320,initialX:0,initialY:0,initiallyDocked:false,side:"left"},initialRadiusUnits:"m",highlightAllResults:true,showLayerSelector:true});export default connect(function(state){var enabled=state.task.id==="Identify"||state.task.identifyEnabled&&ConfigUtils.getConfigProp("identifyTool",state.theme.current,"Identify")==="Identify";return{click:state.map.click||{modifiers:{}},enabled:enabled,layers:state.layers.flat,map:state.map,selection:state.selection,theme:state.theme.current}},{addLayerFeatures:addLayerFeatures,addMarker:addMarker,removeMarker:removeMarker,removeLayer:removeLayer,setCurrentTask:setCurrentTask})(Identify);
+_this.props.removeLayer("searchselection");var pendingRequests=0;var identifyResults=_this.props.click.modifiers.ctrl!==true?{}:state.identifyResults;var queryableLayers=[];queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);queryableLayers.forEach(function(l){var request=IdentifyUtils.buildRequest(l,l.queryLayers.join(","),clickPoint,_this.props.map,_this.props.params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state2){return{pendingRequests:state2.pendingRequests-1}});if(response){_this.parseResult(response,l,request.params.info_format,clickPoint)}})});if(!isEmpty(_this.props.click.features)){_this.props.click.features.forEach(function(feature){var layer=_this.props.layers.find(function(l){return l.id===feature.layerId});if((layer===null||layer===void 0?void 0:layer.role)===LayerRole.USERLAYER){var _layer$features$find,_layer$features,_layer$features$find2,_layer$projection;var queryFeature=_objectSpread({},(_layer$features$find=(_layer$features=layer.features)===null||_layer$features===void 0||(_layer$features$find2=_layer$features.find)===null||_layer$features$find2===void 0?void 0:_layer$features$find2.call(_layer$features,function(f){return f.id===feature.id}))!==null&&_layer$features$find!==void 0?_layer$features$find:feature);if(!(queryFeature!==null&&queryFeature!==void 0&&queryFeature.properties)){return}if(!identifyResults[layer.name]){identifyResults[layer.name]=[]}queryFeature.crs=(_layer$projection=layer.projection)!==null&&_layer$projection!==void 0?_layer$projection:_this.props.map.projection;queryFeature.displayname=queryFeature.properties.name||queryFeature.properties.Name||queryFeature.properties.NAME||queryFeature.properties.label||queryFeature.properties.id||queryFeature.id;queryFeature.layertitle=layer.title||layer.name||layer.id;queryFeature.properties=Object.entries(queryFeature.properties).reduce(function(res,_ref){var _ref2=_slicedToArray(_ref,2),key=_ref2[0],val=_ref2[1];return _objectSpread(_objectSpread({},res),{},_defineProperty({},key,_typeof(val)==="object"?JSON.stringify(val):val))},{});identifyResults[layer.name].push(queryFeature)}})}_this.props.addMarker("identify",clickPoint,"",_this.props.map.projection);return{identifyResults:identifyResults,pendingRequests:pendingRequests}})}});_defineProperty(_this,"queryPoint",function(prevProps){if(_this.props.click.button!==0||_this.props.click===prevProps.click||(_this.props.click.features||[]).find(function(feature){return feature.id==="startupposmarker"})){return null}var searchMarker=(_this.props.click.features||[]).find(function(feature){return feature.id==="searchmarker"});if(searchMarker&&searchMarker.geometry.type==="Point"){return searchMarker.geometry.coordinates}return _this.props.click.coordinate});_defineProperty(_this,"identifyRegion",function(){var queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);var poly=_this.state.filterGeom.coordinates[0];if(poly.length<3||isEmpty(queryableLayers)){return}var identifyResults=_this.state.filterGeomModifiers.ctrl!==true?{}:_this.state.identifyResults;var center=[0,0];poly.forEach(function(point){center[0]+=point[0];center[1]+=point[1]});center[0]/=poly.length;center[1]/=poly.length;var filter=VectorLayerUtils.geoJSONGeomToWkt(_this.state.filterGeom);var pendingRequests=0;var params=_objectSpread({},_this.props.params);if(_this.props.params.region_feature_count){params.feature_count=_this.props.params.region_feature_count;delete params.region_feature_count}queryableLayers.forEach(function(layer){var request=IdentifyUtils.buildFilterRequest(layer,layer.queryLayers.join(","),filter,_this.props.map,params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state){return{pendingRequests:state.pendingRequests-1}});if(response){_this.parseResult(response,layer,request.params.info_format,center)}});_this.setState({identifyResults:identifyResults,pendingRequests:pendingRequests})})});_defineProperty(_this,"identifyRadius",function(){var clickPoint=_this.state.filterGeom.center;var queryableLayers=IdentifyUtils.getQueryLayers(_this.props.layers,_this.props.map);if(isEmpty(queryableLayers)){return}var identifyResults=_this.state.filterGeomModifiers.ctrl!==true?{}:_this.state.identifyResults;var filter=VectorLayerUtils.geoJSONGeomToWkt(_this.state.filterGeom);var pendingRequests=0;var params=_objectSpread({},_this.props.params);if(_this.props.params.radius_feature_count){params.feature_count=_this.props.params.radius_feature_count;delete params.radius_feature_count}queryableLayers.forEach(function(layer){var request=IdentifyUtils.buildFilterRequest(layer,layer.queryLayers.join(","),filter,_this.props.map,params);++pendingRequests;IdentifyUtils.sendRequest(request,function(response){_this.setState(function(state){return{pendingRequests:state.pendingRequests-1}});if(response){_this.parseResult(response,layer,request.params.info_format,clickPoint)}});_this.setState({identifyResults:identifyResults,pendingRequests:pendingRequests})});_this.props.addMarker("identify",clickPoint,"",_this.props.map.projection)});_defineProperty(_this,"changeBufferUnit",function(ev){_this.setState({radiusUnits:ev.target.value})});_defineProperty(_this,"parseResult",function(response,layer,format,clickPoint){var newResults=IdentifyUtils.parseResponse(response,layer,format,clickPoint,_this.props.map.projection,_this.props.featureInfoReturnsLayerName);// Merge with previous
+_this.setState(function(state){var identifyResults=_objectSpread({},state.identifyResults);Object.entries(newResults).forEach(function(_ref3){var _ref4=_slicedToArray(_ref3,2),layername=_ref4[0],features=_ref4[1];var key=layer.url+"#"+layername;identifyResults[key]=features.reduce(function(result,feature){if(result.find(function(f){return f.id===feature.id})===undefined){result.push(feature)}return result},identifyResults[key]||[])});return{identifyResults:identifyResults}})});_defineProperty(_this,"onShow",function(mode,data){_this.setState({mode:mode||"Point",exitTaskOnResultsClose:data===null||data===void 0?void 0:data.exitTaskOnResultsClose});if(mode==="Point"&&data!==null&&data!==void 0&&data.pos){_this.identifyPoint(data.pos)}});_defineProperty(_this,"onToolClose",function(){_this.setState({mode:"Point",exitTaskOnResultsClose:null,filterGeom:null});if(_this.props.clearResultsOnClose){_this.clearResults()}});_defineProperty(_this,"onWindowClose",function(){_this.clearResults();if(_this.state.exitTaskOnResultsClose||_this.props.exitTaskOnResultsClose){_this.props.setCurrentTask(null)}});_defineProperty(_this,"clearResults",function(){_this.props.removeMarker("identify");_this.props.removeLayer("identifyslection");_this.props.removeLayer("identifyradiusbuffer");_this.setState({identifyResults:null,pendingRequests:0})});_defineProperty(_this,"updateRadius",function(radius,units){_this.setState(function(state){return{radius:radius,radiusUnits:units,filterGeom:_objectSpread(_objectSpread({},state.filterGeom),{},{radius:MeasureUtils.convertLength(radius,units,"m")})}})});_defineProperty(_this,"renderBody",function(){if(_this.state.mode==="Point"){return LocaleUtils.tr("infotool.clickhelpPoint")}else if(_this.state.mode==="Region"){return LocaleUtils.tr("infotool.clickhelpPolygon")}else if(_this.state.mode==="Radius"){var text=LocaleUtils.tr("infotool.clickhelpRadius");return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement("div",null,text),/*#__PURE__*/React.createElement("div",{className:"identify-radius-controls controlgroup"},/*#__PURE__*/React.createElement("span",null,LocaleUtils.tr("infotool.radius"),":\xA0"),/*#__PURE__*/React.createElement(NumberInput,{disabled:!_this.state.filterGeom,max:1000000,min:1,mobile:true,onChange:function onChange(rad){return _this.updateRadius(rad,_this.state.radiusUnits)},value:_this.state.radius}),/*#__PURE__*/React.createElement("select",{onChange:function onChange(ev){return _this.updateRadius(_this.state.radius,ev.target.value)},value:_this.state.radiusUnits},/*#__PURE__*/React.createElement("option",{value:"m"},"m"),/*#__PURE__*/React.createElement("option",{value:"ft"},"ft"),/*#__PURE__*/React.createElement("option",{value:"km"},"km"),/*#__PURE__*/React.createElement("option",{value:"mi"},"mi"))))}return null});return _this}_inherits(Identify,_React$Component);return _createClass(Identify,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){if(this.props.theme!==prevProps.theme){this.clearResults()}else if(!this.props.enabled&&prevProps.enabled){if(this.props.clearResultsOnClose){this.clearResults()}}if(this.props.enabled){if(this.state.mode==="Point"){var clickPoint=this.queryPoint(prevProps);this.identifyPoint(clickPoint)}else if(this.state.mode==="Region"){if(this.state.filterGeom&&this.state.filterGeom!==prevState.filterGeom){this.identifyRegion()}}else if(this.state.mode==="Radius"){if(this.state.filterGeom&&this.state.filterGeom!==prevState.filterGeom){this.setState(function(state){return{radius:MeasureUtils.convertLength(state.filterGeom.radius,"m",state.radiusUnits)}});this.identifyRadius()}}}}},{key:"render",value:function render(){var _this2=this;var resultWindow=null;if(this.state.pendingRequests>0||this.state.identifyResults!==null){var body=null;if(isEmpty(this.state.identifyResults)){if(this.state.pendingRequests>0){body=/*#__PURE__*/React.createElement("div",{className:"identify-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("identify.querying")))}else{body=/*#__PURE__*/React.createElement("div",{className:"identify-body",role:"body"},/*#__PURE__*/React.createElement("span",{className:"identify-body-message"},LocaleUtils.tr("identify.noresults")))}}else{body=/*#__PURE__*/React.createElement(IdentifyViewer,{attributeCalculator:this.props.attributeCalculator,attributeTransform:this.props.attributeTransform,customExporters:this.props.customExporters,displayResultTree:this.props.displayResultTree,enableAggregatedReports:this.props.enableAggregatedReports,enableExport:this.props.enableExport,exportGeometry:this.props.exportGeometry,highlightAllResults:this.props.highlightAllResults,identifyResults:this.state.identifyResults,iframeDialogsInitiallyDocked:this.props.iframeDialogsInitiallyDocked,longAttributesDisplay:this.props.longAttributesDisplay,replaceImageUrls:this.props.replaceImageUrls,role:"body",showLayerSelector:this.props.showLayerSelector})}resultWindow=/*#__PURE__*/React.createElement(ResizeableWindow,{busyIcon:this.state.pendingRequests>0,dockable:this.props.geometry.side,icon:"info-sign",initialHeight:this.props.geometry.initialHeight,initialWidth:this.props.geometry.initialWidth,initialX:this.props.geometry.initialX,initialY:this.props.geometry.initialY,initiallyDocked:this.props.geometry.initiallyDocked,key:"IdentifyWindow",onClose:this.onWindowClose,title:LocaleUtils.tr("identify.title")},body)}return[resultWindow,/*#__PURE__*/React.createElement(TaskBar,{key:"IdentifyTaskBar",onHide:this.onToolClose,onShow:this.onShow,task:"Identify"},function(){return{body:_this2.renderBody()}}),this.state.mode==="Region"||this.state.mode==="Radius"?/*#__PURE__*/React.createElement(MapSelection,{active:true,geomType:this.state.mode==="Radius"?"Circle":"Polygon",geometry:this.state.filterGeom,geometryChanged:function geometryChanged(geom,mod){return _this2.setState({filterGeom:geom,filterGeomModifiers:mod})},key:"MapSelection",measure:this.state.mode==="Radius"}):null]}}])}(React.Component);_defineProperty(Identify,"propTypes",{addLayerFeatures:PropTypes.func,addMarker:PropTypes.func,/** Optional function for computing derived attributes. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */attributeCalculator:PropTypes.func,/** Optional function for transforming attribute values. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */attributeTransform:PropTypes.func,/** Whether to clear the identify results when exiting the identify tool. */clearResultsOnClose:PropTypes.bool,click:PropTypes.object,currentIdentifyTool:PropTypes.string,currentTask:PropTypes.string,/** Optional list of custom exporters to offer along with the built-in exporters. See js/IdentifyExtensions.js for details. This prop can be specified in the appConfig.js cfg section. */customExporters:PropTypes.array,/** Whether to display a tree overview of results (as opposed to a flat list of results). */displayResultTree:PropTypes.bool,/** Whether to enable the aggregated report download button. */enableAggregatedReports:PropTypes.bool,/** Whether to enable the export functionality. Either `true|false` or a list of single allowed formats (builtin formats: `json`, `geojson`, `csv`, `csvzip`) */enableExport:PropTypes.oneOfType([PropTypes.bool,PropTypes.array]),enabled:PropTypes.bool,/** Whether to clear the task when the results window is closed. */exitTaskOnResultsClose:PropTypes.bool,/** Whether to include the geometry in exported features. Default: `true`. */exportGeometry:PropTypes.bool,/** Whether to assume that XML GetFeatureInfo responses specify the technical layer name in the `name` attribute, rather than the layer title. */featureInfoReturnsLayerName:PropTypes.bool,/** Default window geometry with size, position and docking status. Positive position values (including '0') are related to top (InitialY) and left (InitialX), negative values (including '-0') to bottom (InitialY) and right (InitialX). */geometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool,side:PropTypes.string}),/** Whether to highlight all results if no result is hovered */highlightAllResults:PropTypes.bool,iframeDialogsInitiallyDocked:PropTypes.bool,/** The initial radius units of the identify dialog in radius mode. One of 'm', 'ft', 'km', 'mi'. */initialRadiusUnits:PropTypes.string,layers:PropTypes.array,longAttributesDisplay:PropTypes.string,map:PropTypes.object,/** Extra params to append to the GetFeatureInfo request (i.e. `FI_POINT_TOLERANCE`, `FI_LINE_TOLERANCE`, `feature_count`, ...). Additionally, `region_feature_count` and `radius_feature_count` are supported. */params:PropTypes.object,removeLayer:PropTypes.func,removeMarker:PropTypes.func,/** Whether to replace an attribute value containing an URL to an image with an inline image. */replaceImageUrls:PropTypes.bool,selection:PropTypes.object,setCurrentTask:PropTypes.func,/** Whether to show a layer selector to filter the identify results by layer. */showLayerSelector:PropTypes.bool,theme:PropTypes.object});_defineProperty(Identify,"defaultProps",{enableAggregatedReports:true,enableExport:true,exportGeometry:true,clearResultsOnClose:true,customExporters:[],longAttributesDisplay:"ellipsis",displayResultTree:true,replaceImageUrls:true,featureInfoReturnsLayerName:true,geometry:{initialWidth:240,initialHeight:320,initialX:0,initialY:0,initiallyDocked:false,side:"left"},initialRadiusUnits:"m",highlightAllResults:true,showLayerSelector:true});export default connect(function(state){var enabled=state.task.id==="Identify"||state.task.identifyEnabled&&ConfigUtils.getConfigProp("identifyTool",state.theme.current,"Identify")==="Identify";return{click:state.map.click||{modifiers:{}},enabled:enabled,layers:state.layers.flat,map:state.map,selection:state.selection,theme:state.theme.current}},{addLayerFeatures:addLayerFeatures,addMarker:addMarker,removeMarker:removeMarker,removeLayer:removeLayer,setCurrentTask:setCurrentTask})(Identify);

package/plugins/LayerTree.js

@@ -1,15 +1,15 @@
-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 _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 _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 _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)}/**
+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 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 _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 _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 _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 _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 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 Sortable from"react-sortablejs";import classnames from"classnames";import FileSaver from"file-saver";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{setActiveLayerInfo}from"../actions/layerinfo";import{LayerRole,changeLayerProperty,removeLayer,reorderLayer,setSwipe,addLayerSeparator}from"../actions/layers";import{toggleMapTips,zoomToExtent}from"../actions/map";import{setActiveServiceInfo}from"../actions/serviceinfo";import{setCurrentTask}from"../actions/task";import Icon from"../components/Icon";import ImportLayer from"../components/ImportLayer";import LayerInfoWindow from"../components/LayerInfoWindow";import ResizeableWindow from"../components/ResizeableWindow";import ServiceInfoWindow from"../components/ServiceInfoWindow";import SideBar from"../components/SideBar";import{Image}from"../components/widgets/Primitives";import Spinner from"../components/widgets/Spinner";import ConfigUtils from"../utils/ConfigUtils";import LayerUtils from"../utils/LayerUtils";import LocaleUtils from"../utils/LocaleUtils";import MapUtils from"../utils/MapUtils";import MiscUtils from"../utils/MiscUtils";import VectorLayerUtils from"../utils/VectorLayerUtils";import"./style/LayerTree.css";/**
+ */import React from"react";import{connect}from"react-redux";import Sortable from"react-sortablejs";import classnames from"classnames";import FileSaver from"file-saver";import isEmpty from"lodash.isempty";import PropTypes from"prop-types";import{setActiveLayerInfo}from"../actions/layerinfo";import{LayerRole,changeLayerProperty,removeLayer,reorderLayer,setSwipe,addLayerSeparator,setThemeLayersVisibilityPreset}from"../actions/layers";import{toggleMapTips,zoomToExtent}from"../actions/map";import{setActiveServiceInfo}from"../actions/serviceinfo";import{setCurrentTask}from"../actions/task";import Icon from"../components/Icon";import ImportLayer from"../components/ImportLayer";import LayerInfoWindow from"../components/LayerInfoWindow";import ResizeableWindow from"../components/ResizeableWindow";import ServiceInfoWindow from"../components/ServiceInfoWindow";import SideBar from"../components/SideBar";import{Image}from"../components/widgets/Primitives";import Spinner from"../components/widgets/Spinner";import ConfigUtils from"../utils/ConfigUtils";import LayerUtils from"../utils/LayerUtils";import LocaleUtils from"../utils/LocaleUtils";import MapUtils from"../utils/MapUtils";import MiscUtils from"../utils/MiscUtils";import VectorLayerUtils from"../utils/VectorLayerUtils";import"./style/LayerTree.css";/**
  * Displays the map layer tree in a sidebar.
  *
  * The print legend functionality requires a template located by default at assets/templates/legendprint.html
  * with containing a container element with id=legendcontainer.
- */var LayerTree=/*#__PURE__*/function(_React$Component){function LayerTree(props){var _this;_classCallCheck(this,LayerTree);_this=_callSuper(this,LayerTree,[props]);_defineProperty(_this,"state",{activemenu:null,activestylemenu:null,legendTooltip:null,sidebarwidth:null,importvisible:false,filtervisiblelayers:false,legendPrintVisible:false});_defineProperty(_this,"renderSubLayers",function(layer,group,path,enabled){var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;return(group.sublayers||[]).map(function(sublayer,idx){var subpath=[].concat(_toConsumableArray(path),[idx]);if(sublayer.sublayers){return _this.renderLayerGroup(layer,sublayer,subpath,enabled,inMutuallyExclusiveGroup)}else{return _this.renderLayer(layer,sublayer,subpath,enabled,inMutuallyExclusiveGroup)}})});_defineProperty(_this,"renderLayerGroup",function(layer,group,path,enabled){var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;if(flattenGroups){return _this.renderSubLayers(layer,group,path,enabled,false)}var subtreevisibility=LayerUtils.computeLayerVisibility(group);if(subtreevisibility===0&&_this.state.filtervisiblelayers){return null}var visibility=true;var checkboxstate="";if(_this.props.groupTogglesSublayers&&!inMutuallyExclusiveGroup){visibility=subtreevisibility>0;if(subtreevisibility===1){checkboxstate="checked"}else if(subtreevisibility===0){checkboxstate="unchecked"}else{checkboxstate="tristate"}}else{visibility=group.visibility===undefined?subtreevisibility>0:group.visibility;if(visibility){checkboxstate=subtreevisibility===1?"checked":"tristate"}else{checkboxstate="unchecked"}}var omitqueryable;var identifyableClassName="";var subtreequeryable=LayerUtils.computeLayerQueryable(group);if(subtreequeryable===1){identifyableClassName="layertree-item-identifyable-checked";omitqueryable=false}else if(subtreequeryable===0){identifyableClassName="layertree-item-identifyable-unchecked";omitqueryable=true}else{identifyableClassName="layertree-item-identifyable-tristate";omitqueryable=true}if(inMutuallyExclusiveGroup){checkboxstate="radio_"+checkboxstate}var expanderstate=group.expanded?"tree_minus":"tree_plus";var showExpander=!_this.props.onlyGroups||(group.sublayers||[]).some(function(sublayer){return sublayer.sublayers});var itemclasses={"layertree-item":true,"layertree-item-disabled":!_this.props.groupTogglesSublayers&&!enabled||_this.props.grayUnchecked&&!visibility};var sublayersContent=null;if(group.expanded){sublayersContent=_this.renderSubLayers(layer,group,path,enabled&&visibility,group.mutuallyExclusive===true)}var optMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activemenu===group.uuid});var styleMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activestylemenu===group.uuid});var allowRemove=ConfigUtils.getConfigProp("allowRemovingThemeLayers",_this.props.theme)===true||layer.role!==LayerRole.THEME;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true&&!_this.state.filtervisiblelayers;var sortable=allowReordering&&ConfigUtils.getConfigProp("preventSplittingGroupsWhenReordering",_this.props.theme)===true;var styles=layer.type==="wms"&&path.length===0?_this.getLayerStyles(layer):null;return/*#__PURE__*/React.createElement("div",{className:"layertree-item-container","data-id":JSON.stringify({layer:layer.uuid,path:path}),key:group.uuid},/*#__PURE__*/React.createElement("div",{className:classnames(itemclasses)},showExpander?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-expander",icon:expanderstate,onClick:function onClick(){return _this.groupExpandedToggled(layer,path,group.expanded)}}):/*#__PURE__*/React.createElement("span",{className:"layertree-item-expander"}),/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-checkbox",icon:checkboxstate,onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,visibility)}}),/*#__PURE__*/React.createElement("span",{className:"layertree-item-title",onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,visibility)},title:group.title},group.title),LayerUtils.hasQueryableSublayers(group)&&_this.props.allowSelectIdentifyableLayers?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-identifyable "+identifyableClassName,icon:"info-sign",onClick:function onClick(){return _this.itemOmitQueryableToggled(layer,path,omitqueryable)}}):null,/*#__PURE__*/React.createElement("span",{className:"layertree-item-spacer"}),!isEmpty(styles)?/*#__PURE__*/React.createElement(Icon,{className:styleMenuClasses,icon:"paint",onClick:function onClick(){return _this.layerStyleMenuToggled(group.uuid)}}):null,/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(group.uuid)}}),allowRemove?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-remove",icon:"trash",onClick:function onClick(){return _this.props.removeLayer(layer.id,path)}}):null),_this.state.activemenu===group.uuid?_this.renderOptionsMenu(layer,group,path,allowRemove):null,_this.state.activestylemenu===group.uuid?_this.renderStyleMenu(styles,_this.getSelectedStyles(layer),function(style){return _this.applyLayerStyle(style,layer)}):null,/*#__PURE__*/React.createElement(Sortable,{onChange:_this.onSortChange,options:{disabled:sortable===false,ghostClass:"drop-ghost",delay:200,forceFallback:_this.props.fallbackDrag}},sublayersContent))});_defineProperty(_this,"renderLayer",function(layer,sublayer,path){var enabled=arguments.length>3&&arguments[3]!==undefined?arguments[3]:true;var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;var skipExpanderPlaceholder=arguments.length>5&&arguments[5]!==undefined?arguments[5]:false;if(_this.props.onlyGroups){return null}if(_this.state.filtervisiblelayers&&!sublayer.visibility){return null}if(Array.isArray(layer.layerTreeHiddenSublayers)&&layer.layerTreeHiddenSublayers.includes(sublayer.name)){return null}var allowRemove=ConfigUtils.getConfigProp("allowRemovingThemeLayers",_this.props.theme)===true||layer.role!==LayerRole.THEME;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true;var checkboxstate=sublayer.visibility===true?"checked":"unchecked";if(inMutuallyExclusiveGroup){checkboxstate="radio_"+checkboxstate}var optMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activemenu===sublayer.uuid});var styleMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activestylemenu===sublayer.uuid});var itemclasses={"layertree-item":true,"layertree-item-disabled":layer.type!=="separator"&&(!_this.props.groupTogglesSublayers&&!enabled||_this.props.grayUnchecked&&!sublayer.visibility),"layertree-item-separator":layer.type==="separator","layertree-item-outsidescalerange":sublayer.minScale!==undefined&&_this.props.mapScale<sublayer.minScale||sublayer.maxScale!==undefined&&_this.props.mapScale>sublayer.maxScale};var infoButton=null;if(layer.type==="wms"||layer.type==="wfs"||layer.type==="wmts"){infoButton=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-metadata",icon:"info-sign",onClick:function onClick(){return _this.props.setActiveLayerInfo(layer,sublayer)}})}var legendicon=null;if(_this.props.showLegendIcons){var legendUrl=LayerUtils.getLegendUrl(layer,sublayer,_this.props.mapScale,_this.props.map,_this.props.bboxDependentLegend,_this.props.scaleDependentLegend,_this.props.extraLegendParameters);if(legendUrl){legendicon=/*#__PURE__*/React.createElement(Image,{className:"layertree-item-legend-thumbnail",onMouseOut:_this.hideLegendTooltip,onMouseOver:function onMouseOver(ev){return _this.showLegendTooltip(ev,legendUrl)},onTouchStart:function onTouchStart(ev){return _this.showLegendTooltip(ev,legendUrl)},src:legendUrl+"&TYPE=thumbnail"})}else if(layer.color){legendicon=/*#__PURE__*/React.createElement("span",{className:"layertree-item-legend-coloricon",style:{backgroundColor:layer.color}})}}var checkbox=null;if(layer.type==="placeholder"){checkbox=/*#__PURE__*/React.createElement(Spinner,null)}else if(layer.type==="separator"){checkbox=null}else{checkbox=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-checkbox",icon:checkboxstate,onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,sublayer.visibility)}})}var title=null;if(layer.type==="separator"){title=/*#__PURE__*/React.createElement("input",{onChange:function onChange(ev){return _this.props.changeLayerProperty(layer.uuid,"title",ev.target.value)},value:sublayer.title})}else{title=/*#__PURE__*/React.createElement("span",{className:"layertree-item-title",onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,sublayer.visibility)},title:sublayer.title},sublayer.title)}var queryableicon=null;if(_this.props.allowSelectIdentifyableLayers){var identifyableClassName=!sublayer.omitFromQueryLayers?"layertree-item-identifyable-checked":"layertree-item-identifyable-unchecked";queryableicon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-identifyable "+identifyableClassName,icon:"info-sign",onClick:function onClick(){return _this.itemOmitQueryableToggled(layer,path,sublayer.omitFromQueryLayers)}})}else{queryableicon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-queryable",icon:"info-sign"})}var allowOptions=layer.type!=="placeholder"&&layer.type!=="separator";var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var allowSeparators=flattenGroups&&allowReordering&&ConfigUtils.getConfigProp("allowLayerTreeSeparators",_this.props.theme);var separatorTitle=LocaleUtils.tr("layertree.separator");var separatorTooltip=LocaleUtils.tr("layertree.separatortooltip");return/*#__PURE__*/React.createElement("div",{className:"layertree-item-container","data-id":JSON.stringify({layer:layer.uuid,path:path}),key:sublayer.uuid},allowSeparators?/*#__PURE__*/React.createElement("div",{className:"layertree-item-addsep",onClick:function onClick(){return _this.props.addLayerSeparator(separatorTitle,layer.id,path)},title:separatorTooltip}):null,/*#__PURE__*/React.createElement("div",{className:classnames(itemclasses)},flattenGroups||skipExpanderPlaceholder?null:/*#__PURE__*/React.createElement("span",{className:"layertree-item-expander"}),checkbox,legendicon,title,sublayer.queryable&&_this.props.showQueryableIcon?queryableicon:null,sublayer.name in(_this.props.filter.filterParams||{})||_this.props.filter.filterGeom?/*#__PURE__*/React.createElement(Icon,{icon:"filter"}):null,_this.props.loadingLayers.includes(layer.id)?/*#__PURE__*/React.createElement(Spinner,null):null,/*#__PURE__*/React.createElement("span",{className:"layertree-item-spacer"}),allowOptions&&!_this.props.infoInSettings?infoButton:null,Object.keys(sublayer.styles||{}).length>1?/*#__PURE__*/React.createElement(Icon,{className:styleMenuClasses,icon:"paint",onClick:function onClick(){return _this.layerStyleMenuToggled(sublayer.uuid)}}):null,allowOptions?/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(sublayer.uuid)}}):null,allowRemove?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-remove",icon:"trash",onClick:function onClick(){return _this.props.removeLayer(layer.id,path)}}):null),_this.state.activemenu===sublayer.uuid?_this.renderOptionsMenu(layer,sublayer,path,allowRemove):null,_this.state.activestylemenu===sublayer.uuid?_this.renderStyleMenu(sublayer.styles,[sublayer.style],function(style){return _this.layerStyleChanged(layer,path,style)}):null)});_defineProperty(_this,"renderOptionsMenu",function(layer,sublayer,path){var marginRight=arguments.length>3&&arguments[3]!==undefined?arguments[3]:0;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true;var reorderButtons=null;if(allowReordering&&!_this.state.filtervisiblelayers){reorderButtons=[/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-move",icon:"arrow-down",key:"layertree-item-move-down",onClick:function onClick(){return _this.props.reorderLayer(layer,path,+1)}}),/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-move",icon:"arrow-up",key:"layertree-item-move-up",onClick:function onClick(){return _this.props.reorderLayer(layer,path,-1)}})]}var zoomToLayerButton=null;if(sublayer.bbox&&sublayer.bbox.bounds){var zoomToLayerTooltip=LocaleUtils.tr("layertree.zoomtolayer");var crs=sublayer.bbox.crs||_this.props.map.projection;zoomToLayerButton=/*#__PURE__*/React.createElement(Icon,{icon:"zoom",onClick:function onClick(){return _this.props.zoomToExtent(sublayer.bbox.bounds,crs)},title:zoomToLayerTooltip})}var infoButton=null;if(_this.props.infoInSettings&&(layer.type==="wms"||layer.type==="wfs"||layer.type==="wmts")){infoButton=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-metadata",icon:"info-sign",onClick:function onClick(){return _this.props.setActiveLayerInfo(layer,sublayer)}})}var attrTableButton=null;if(_this.props.showAttributeTableLink&&ConfigUtils.havePlugin("AttributeTable")&&layer.role===LayerRole.THEME&&_this.props.theme.editConfig[sublayer.name]){attrTableButton=/*#__PURE__*/React.createElement(Icon,{icon:"editing",onClick:function onClick(){return _this.props.setCurrentTask("AttributeTable",null,null,{layer:sublayer.name})}})}return/*#__PURE__*/React.createElement("div",{className:"layertree-item-optionsmenu",onMouseDown:_this.preventLayerTreeItemDrag,style:{marginRight:marginRight*1.75+"em"}},zoomToLayerButton,_this.props.transparencyIcon?/*#__PURE__*/React.createElement(Icon,{icon:"transparency"}):LocaleUtils.tr("layertree.transparency"),/*#__PURE__*/React.createElement("input",{className:"layertree-item-transparency-slider",max:"255",min:"0",onChange:function onChange(ev){return _this.layerTransparencyChanged(layer,path,ev.target.value,!isEmpty(sublayer.sublayers)?"children":null)},step:"1",type:"range",value:255-LayerUtils.computeLayerOpacity(sublayer)}),reorderButtons,infoButton,attrTableButton,layer.type==="vector"?/*#__PURE__*/React.createElement(Icon,{icon:"export",onClick:function onClick(){return _this.exportRedliningLayer(layer)}}):null)});_defineProperty(_this,"renderStyleMenu",function(styles,selectedStyles,onStyleChange){var marginRight=arguments.length>3&&arguments[3]!==undefined?arguments[3]:0;var checkedIcon=selectedStyles.length===1?"radio_checked":"radio_tristate";return/*#__PURE__*/React.createElement("div",{className:"layertree-item-stylemenu",style:{marginRight:marginRight*1.75+"em"}},Object.entries(styles).map(function(_ref){var _ref2=_slicedToArray(_ref,2),name=_ref2[0],title=_ref2[1];return/*#__PURE__*/React.createElement("div",{key:name,onClick:function onClick(){return onStyleChange(name)}},/*#__PURE__*/React.createElement(Icon,{icon:selectedStyles.includes(name)?checkedIcon:"radio_unchecked"}),/*#__PURE__*/React.createElement("div",null,title))}))});_defineProperty(_this,"preventLayerTreeItemDrag",function(ev){var draggableEl=ev.currentTarget.parentNode;if(draggableEl.draggable){draggableEl.draggable=false;document.addEventListener("mouseup",function(){draggableEl.draggable=true},{once:true})}});_defineProperty(_this,"renderLayerTree",function(layers){var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var haveGroups=!flattenGroups&&layers.find(function(layer){if(!_this.props.showRootEntry){return(layer.sublayers||[]).find(function(sublayer){return!isEmpty(sublayer.sublayers)})}else{return!isEmpty(layer.sublayers)}});return layers.map(function(layer){if(isEmpty(layer.sublayers)&&layer.role!==LayerRole.THEME){return _this.renderLayer(layer,layer,[],layer.visibility,false,!haveGroups)}else if(_this.props.showRootEntry){return _this.renderLayerGroup(layer,layer,[],layer.visibility)}else{return layer.sublayers.map(function(sublayer,idx){var subpath=[idx];if(sublayer.sublayers){return _this.renderLayerGroup(layer,sublayer,subpath,layer.visibility)}else{return _this.renderLayer(layer,sublayer,subpath,layer.visibility,false,!haveGroups)}})}})});_defineProperty(_this,"renderBody",function(){var maptipcheckboxstate=_this.props.mapTipsEnabled===true?"checked":"unchecked";var maptipCheckbox=null;var maptipsEnabled=false;if(_this.props.theme.mapTips!==undefined){maptipsEnabled=_this.props.theme.mapTips!==null&&_this.props.allowMapTips}else{maptipsEnabled=_this.props.allowMapTips}if(!ConfigUtils.isMobile()&&maptipsEnabled){maptipCheckbox=/*#__PURE__*/React.createElement("div",{className:"layertree-option"},/*#__PURE__*/React.createElement(Icon,{icon:maptipcheckboxstate,onClick:_this.toggleMapTips}),/*#__PURE__*/React.createElement("span",{onClick:_this.toggleMapTips},LocaleUtils.tr("layertree.maptip")))}var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true&&!_this.state.filtervisiblelayers;var haveMapCompare=ConfigUtils.havePlugin("MapCompare");var compareCheckbox=null;if(haveMapCompare&&_this.props.allowCompare&&allowReordering){var swipecheckboxstate=_this.props.swipe||_this.props.swipe===0?"checked":"unchecked";compareCheckbox=/*#__PURE__*/React.createElement("div",{className:"layertree-option"},/*#__PURE__*/React.createElement(Icon,{icon:swipecheckboxstate,onClick:_this.toggleSwipe}),/*#__PURE__*/React.createElement("span",{onClick:_this.toggleSwipe},LocaleUtils.tr("layertree.compare")))}var layerImportExpander=null;if(_this.props.allowImport){layerImportExpander=/*#__PURE__*/React.createElement("div",{className:"layertree-option",onClick:_this.toggleImportLayers},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.importvisible?"collapse":"expand"})," ",LocaleUtils.tr("layertree.importlayer"))}var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var sortable=allowReordering&&(ConfigUtils.getConfigProp("preventSplittingGroupsWhenReordering",_this.props.theme)===true||flattenGroups===true);var treelayers=_this.props.layers.filter(function(layer){return layer.role!==LayerRole.BACKGROUND&&!layer.layertreehidden});return/*#__PURE__*/React.createElement("div",{className:"layertree-container-wrapper",role:"body"},/*#__PURE__*/React.createElement("div",{className:"layertree-container"},/*#__PURE__*/React.createElement("div",{className:"layertree-tree",onContextMenuCapture:function onContextMenuCapture(ev){// Prevent context menu on drag-sort
+ */var LayerTree=/*#__PURE__*/function(_React$Component){function LayerTree(props){var _this;_classCallCheck(this,LayerTree);_this=_callSuper(this,LayerTree,[props]);_defineProperty(_this,"state",{activemenu:null,activestylemenu:null,legendTooltip:null,sidebarwidth:null,importvisible:false,filterinvisiblelayers:false,legendPrintVisible:false,visibilityMenu:false,activePreset:null});_defineProperty(_this,"renderSubLayers",function(layer,group,path,enabled){var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;return(group.sublayers||[]).map(function(sublayer,idx){var subpath=[].concat(_toConsumableArray(path),[idx]);if(sublayer.sublayers){return _this.renderLayerGroup(layer,sublayer,subpath,enabled,inMutuallyExclusiveGroup)}else{return _this.renderLayer(layer,sublayer,subpath,enabled,inMutuallyExclusiveGroup)}})});_defineProperty(_this,"renderLayerGroup",function(layer,group,path,enabled){var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;if(flattenGroups){return _this.renderSubLayers(layer,group,path,enabled,false)}var subtreevisibility=LayerUtils.computeLayerVisibility(group);if(subtreevisibility===0&&_this.state.filterinvisiblelayers){return null}var groupId=layer.id+":"+group.name;var visibility=true;var checkboxstate="";if(_this.props.groupTogglesSublayers&&!inMutuallyExclusiveGroup){visibility=subtreevisibility>0;if(subtreevisibility===1){checkboxstate="checked"}else if(subtreevisibility===0){checkboxstate="unchecked"}else{checkboxstate="tristate"}}else{visibility=group.visibility===undefined?subtreevisibility>0:group.visibility;if(visibility){checkboxstate=subtreevisibility===1?"checked":"tristate"}else{checkboxstate="unchecked"}}var omitqueryable;var identifyableClassName="";var subtreequeryable=LayerUtils.computeLayerQueryable(group);if(subtreequeryable===1){identifyableClassName="layertree-item-identifyable-checked";omitqueryable=false}else if(subtreequeryable===0){identifyableClassName="layertree-item-identifyable-unchecked";omitqueryable=true}else{identifyableClassName="layertree-item-identifyable-tristate";omitqueryable=true}if(inMutuallyExclusiveGroup){checkboxstate="radio_"+checkboxstate}var expanderstate=group.expanded?"tree_minus":"tree_plus";var showExpander=!_this.props.onlyGroups||(group.sublayers||[]).some(function(sublayer){return sublayer.sublayers});var itemclasses={"layertree-item":true,"layertree-item-disabled":!_this.props.groupTogglesSublayers&&!enabled||_this.props.grayUnchecked&&!visibility};var sublayersContent=null;if(group.expanded){sublayersContent=_this.renderSubLayers(layer,group,path,enabled&&visibility,group.mutuallyExclusive===true)}var optMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activemenu===groupId});var styleMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activestylemenu===groupId});var allowRemove=ConfigUtils.getConfigProp("allowRemovingThemeLayers",_this.props.theme)===true||layer.role!==LayerRole.THEME;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true&&!_this.state.filterinvisiblelayers;var sortable=allowReordering&&ConfigUtils.getConfigProp("preventSplittingGroupsWhenReordering",_this.props.theme)===true;var styles=layer.type==="wms"&&path.length===0?_this.getLayerStyles(layer):null;return/*#__PURE__*/React.createElement("div",{className:"layertree-item-container","data-id":JSON.stringify({layer:layer.id,path:path}),key:groupId},/*#__PURE__*/React.createElement("div",{className:classnames(itemclasses)},showExpander?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-expander",icon:expanderstate,onClick:function onClick(){return _this.groupExpandedToggled(layer,path,group.expanded)}}):/*#__PURE__*/React.createElement("span",{className:"layertree-item-expander"}),/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-checkbox",icon:checkboxstate,onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,visibility)}}),/*#__PURE__*/React.createElement("span",{className:"layertree-item-title",onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,visibility)},title:group.title},group.title),LayerUtils.hasQueryableSublayers(group)&&_this.props.allowSelectIdentifyableLayers?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-identifyable "+identifyableClassName,icon:"info-sign",onClick:function onClick(){return _this.itemOmitQueryableToggled(layer,path,omitqueryable)}}):null,/*#__PURE__*/React.createElement("span",{className:"layertree-item-spacer"}),!isEmpty(styles)?/*#__PURE__*/React.createElement(Icon,{className:styleMenuClasses,icon:"paint",onClick:function onClick(){return _this.layerStyleMenuToggled(groupId)}}):null,/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(groupId)}}),allowRemove?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-remove",icon:"trash",onClick:function onClick(){return _this.props.removeLayer(layer.id,path)}}):null),_this.state.activemenu===groupId?_this.renderOptionsMenu(layer,group,path,allowRemove):null,_this.state.activestylemenu===groupId?_this.renderStyleMenu(styles,_this.getSelectedStyles(layer),function(style){return _this.applyLayerStyle(style,layer)}):null,/*#__PURE__*/React.createElement(Sortable,{onChange:_this.onSortChange,options:{disabled:sortable===false,ghostClass:"drop-ghost",delay:200,forceFallback:_this.props.fallbackDrag}},sublayersContent))});_defineProperty(_this,"renderLayer",function(layer,sublayer,path){var enabled=arguments.length>3&&arguments[3]!==undefined?arguments[3]:true;var inMutuallyExclusiveGroup=arguments.length>4&&arguments[4]!==undefined?arguments[4]:false;var skipExpanderPlaceholder=arguments.length>5&&arguments[5]!==undefined?arguments[5]:false;if(_this.props.onlyGroups){return null}if(_this.state.filterinvisiblelayers&&!sublayer.visibility){return null}if(Array.isArray(layer.layerTreeHiddenSublayers)&&layer.layerTreeHiddenSublayers.includes(sublayer.name)){return null}var sublayerId=layer.id+":"+sublayer.name;var allowRemove=ConfigUtils.getConfigProp("allowRemovingThemeLayers",_this.props.theme)===true||layer.role!==LayerRole.THEME;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true;var checkboxstate=sublayer.visibility===true?"checked":"unchecked";if(inMutuallyExclusiveGroup){checkboxstate="radio_"+checkboxstate}var optMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activemenu===sublayerId});var styleMenuClasses=classnames({"layertree-item-menubutton":true,"layertree-item-menubutton-active":_this.state.activestylemenu===sublayerId});var itemclasses={"layertree-item":true,"layertree-item-disabled":layer.type!=="separator"&&(!_this.props.groupTogglesSublayers&&!enabled||_this.props.grayUnchecked&&!sublayer.visibility),"layertree-item-separator":layer.type==="separator","layertree-item-outsidescalerange":sublayer.minScale!==undefined&&_this.props.mapScale<sublayer.minScale||sublayer.maxScale!==undefined&&_this.props.mapScale>sublayer.maxScale};var infoButton=null;if(layer.type==="wms"||layer.type==="wfs"||layer.type==="wmts"){infoButton=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-metadata",icon:"info-sign",onClick:function onClick(){return _this.props.setActiveLayerInfo(layer,sublayer)}})}var legendicon=null;if(_this.props.showLegendIcons){var legendUrl=LayerUtils.getLegendUrl(layer,sublayer,_this.props.mapScale,_this.props.map,_this.props.bboxDependentLegend,_this.props.scaleDependentLegend,_this.props.extraLegendParameters);if(legendUrl){legendicon=/*#__PURE__*/React.createElement(Image,{className:"layertree-item-legend-thumbnail",onMouseOut:_this.hideLegendTooltip,onMouseOver:function onMouseOver(ev){return _this.showLegendTooltip(ev,legendUrl)},onTouchStart:function onTouchStart(ev){return _this.showLegendTooltip(ev,legendUrl)},src:legendUrl+"&TYPE=thumbnail"})}else if(layer.color){legendicon=/*#__PURE__*/React.createElement("span",{className:"layertree-item-legend-coloricon",style:{backgroundColor:layer.color}})}}var checkbox=null;if(layer.type==="placeholder"){checkbox=/*#__PURE__*/React.createElement(Spinner,null)}else if(layer.type==="separator"){checkbox=null}else{checkbox=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-checkbox",icon:checkboxstate,onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,sublayer.visibility)}})}var title=null;if(layer.type==="separator"){title=/*#__PURE__*/React.createElement("input",{onChange:function onChange(ev){return _this.props.changeLayerProperty(layer.id,"title",ev.target.value)},value:sublayer.title})}else{title=/*#__PURE__*/React.createElement("span",{className:"layertree-item-title",onClick:function onClick(){return _this.itemVisibilityToggled(layer,path,sublayer.visibility)},title:sublayer.title},sublayer.title)}var queryableicon=null;if(_this.props.allowSelectIdentifyableLayers){var identifyableClassName=!sublayer.omitFromQueryLayers?"layertree-item-identifyable-checked":"layertree-item-identifyable-unchecked";queryableicon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-identifyable "+identifyableClassName,icon:"info-sign",onClick:function onClick(){return _this.itemOmitQueryableToggled(layer,path,sublayer.omitFromQueryLayers)}})}else{queryableicon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-queryable",icon:"info-sign"})}var allowOptions=layer.type!=="placeholder"&&layer.type!=="separator";var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var allowSeparators=flattenGroups&&allowReordering&&ConfigUtils.getConfigProp("allowLayerTreeSeparators",_this.props.theme);var separatorTitle=LocaleUtils.tr("layertree.separator");var separatorTooltip=LocaleUtils.tr("layertree.separatortooltip");return/*#__PURE__*/React.createElement("div",{className:"layertree-item-container","data-id":JSON.stringify({layer:layer.id,path:path}),key:sublayerId},allowSeparators?/*#__PURE__*/React.createElement("div",{className:"layertree-item-addsep",onClick:function onClick(){return _this.props.addLayerSeparator(separatorTitle,layer.id,path)},title:separatorTooltip}):null,/*#__PURE__*/React.createElement("div",{className:classnames(itemclasses)},flattenGroups||skipExpanderPlaceholder?null:/*#__PURE__*/React.createElement("span",{className:"layertree-item-expander"}),checkbox,legendicon,title,sublayer.queryable&&_this.props.showQueryableIcon?queryableicon:null,sublayer.name in(_this.props.filter.filterParams||{})||_this.props.filter.filterGeom?/*#__PURE__*/React.createElement(Icon,{icon:"filter"}):null,_this.props.loadingLayers.includes(layer.id)?/*#__PURE__*/React.createElement(Spinner,null):null,/*#__PURE__*/React.createElement("span",{className:"layertree-item-spacer"}),allowOptions&&!_this.props.infoInSettings?infoButton:null,Object.keys(sublayer.styles||{}).length>1?/*#__PURE__*/React.createElement(Icon,{className:styleMenuClasses,icon:"paint",onClick:function onClick(){return _this.layerStyleMenuToggled(sublayerId)}}):null,allowOptions?/*#__PURE__*/React.createElement(Icon,{className:optMenuClasses,icon:"cog",onClick:function onClick(){return _this.layerMenuToggled(sublayerId)}}):null,allowRemove?/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-remove",icon:"trash",onClick:function onClick(){return _this.props.removeLayer(layer.id,path)}}):null),_this.state.activemenu===sublayerId?_this.renderOptionsMenu(layer,sublayer,path,allowRemove):null,_this.state.activestylemenu===sublayerId?_this.renderStyleMenu(sublayer.styles,[sublayer.style],function(style){return _this.layerStyleChanged(layer,path,style)}):null)});_defineProperty(_this,"renderOptionsMenu",function(layer,sublayer,path){var marginRight=arguments.length>3&&arguments[3]!==undefined?arguments[3]:0;var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true;var reorderButtons=null;if(allowReordering&&!_this.state.filterinvisiblelayers){reorderButtons=[/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-move",icon:"arrow-down",key:"layertree-item-move-down",onClick:function onClick(){return _this.props.reorderLayer(layer,path,+1)}}),/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-move",icon:"arrow-up",key:"layertree-item-move-up",onClick:function onClick(){return _this.props.reorderLayer(layer,path,-1)}})]}var zoomToLayerButton=null;if(sublayer.bbox&&sublayer.bbox.bounds){var zoomToLayerTooltip=LocaleUtils.tr("layertree.zoomtolayer");var crs=sublayer.bbox.crs||_this.props.map.projection;zoomToLayerButton=/*#__PURE__*/React.createElement(Icon,{icon:"zoom",onClick:function onClick(){return _this.props.zoomToExtent(sublayer.bbox.bounds,crs)},title:zoomToLayerTooltip})}var infoButton=null;if(_this.props.infoInSettings&&(layer.type==="wms"||layer.type==="wfs"||layer.type==="wmts")){infoButton=/*#__PURE__*/React.createElement(Icon,{className:"layertree-item-metadata",icon:"info-sign",onClick:function onClick(){return _this.props.setActiveLayerInfo(layer,sublayer)}})}var attrTableButton=null;if(_this.props.showAttributeTableLink&&ConfigUtils.havePlugin("AttributeTable")&&layer.role===LayerRole.THEME&&_this.props.theme.editConfig[sublayer.name]){attrTableButton=/*#__PURE__*/React.createElement(Icon,{icon:"editing",onClick:function onClick(){return _this.props.setCurrentTask("AttributeTable",null,null,{layer:sublayer.name})}})}return/*#__PURE__*/React.createElement("div",{className:"layertree-item-optionsmenu",onMouseDown:_this.preventLayerTreeItemDrag,style:{marginRight:marginRight*1.75+"em"}},zoomToLayerButton,_this.props.transparencyIcon?/*#__PURE__*/React.createElement(Icon,{icon:"transparency"}):LocaleUtils.tr("layertree.transparency"),/*#__PURE__*/React.createElement("input",{className:"layertree-item-transparency-slider",max:"255",min:"0",onChange:function onChange(ev){return _this.layerTransparencyChanged(layer,path,ev.target.value,!isEmpty(sublayer.sublayers)?"children":null)},step:"1",type:"range",value:255-LayerUtils.computeLayerOpacity(sublayer)}),reorderButtons,infoButton,attrTableButton,layer.type==="vector"?/*#__PURE__*/React.createElement(Icon,{icon:"export",onClick:function onClick(){return _this.exportRedliningLayer(layer)}}):null)});_defineProperty(_this,"renderStyleMenu",function(styles,selectedStyles,onStyleChange){var marginRight=arguments.length>3&&arguments[3]!==undefined?arguments[3]:0;var checkedIcon=selectedStyles.length===1?"radio_checked":"radio_tristate";return/*#__PURE__*/React.createElement("div",{className:"layertree-item-stylemenu",style:{marginRight:marginRight*1.75+"em"}},Object.entries(styles).map(function(_ref){var _ref2=_slicedToArray(_ref,2),name=_ref2[0],title=_ref2[1];return/*#__PURE__*/React.createElement("div",{key:name,onClick:function onClick(){return onStyleChange(name)}},/*#__PURE__*/React.createElement(Icon,{icon:selectedStyles.includes(name)?checkedIcon:"radio_unchecked"}),/*#__PURE__*/React.createElement("div",null,title))}))});_defineProperty(_this,"preventLayerTreeItemDrag",function(ev){var draggableEl=ev.currentTarget.parentNode;if(draggableEl.draggable){draggableEl.draggable=false;document.addEventListener("mouseup",function(){draggableEl.draggable=true},{once:true})}});_defineProperty(_this,"renderLayerTree",function(layers){var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var haveGroups=!flattenGroups&&layers.find(function(layer){if(!_this.props.showRootEntry){return(layer.sublayers||[]).find(function(sublayer){return!isEmpty(sublayer.sublayers)})}else{return!isEmpty(layer.sublayers)}});return layers.map(function(layer){if(isEmpty(layer.sublayers)&&layer.role!==LayerRole.THEME){return _this.renderLayer(layer,layer,[],layer.visibility,false,!haveGroups)}else if(_this.props.showRootEntry){return _this.renderLayerGroup(layer,layer,[],layer.visibility)}else{return layer.sublayers.map(function(sublayer,idx){var subpath=[idx];if(sublayer.sublayers){return _this.renderLayerGroup(layer,sublayer,subpath,layer.visibility)}else{return _this.renderLayer(layer,sublayer,subpath,layer.visibility,false,!haveGroups)}})}})});_defineProperty(_this,"renderBody",function(){var maptipcheckboxstate=_this.props.mapTipsEnabled===true?"checked":"unchecked";var maptipCheckbox=null;var maptipsEnabled=false;if(_this.props.theme.mapTips!==undefined){maptipsEnabled=_this.props.theme.mapTips!==null&&_this.props.allowMapTips}else{maptipsEnabled=_this.props.allowMapTips}if(!ConfigUtils.isMobile()&&maptipsEnabled){maptipCheckbox=/*#__PURE__*/React.createElement("div",{className:"layertree-option"},/*#__PURE__*/React.createElement(Icon,{icon:maptipcheckboxstate,onClick:_this.toggleMapTips}),/*#__PURE__*/React.createElement("span",{onClick:_this.toggleMapTips},LocaleUtils.tr("layertree.maptip")))}var allowReordering=ConfigUtils.getConfigProp("allowReorderingLayers",_this.props.theme)===true&&!_this.state.filterinvisiblelayers;var haveMapCompare=ConfigUtils.havePlugin("MapCompare");var compareCheckbox=null;if(haveMapCompare&&_this.props.allowCompare&&allowReordering){var swipecheckboxstate=_this.props.swipe||_this.props.swipe===0?"checked":"unchecked";compareCheckbox=/*#__PURE__*/React.createElement("div",{className:"layertree-option"},/*#__PURE__*/React.createElement(Icon,{icon:swipecheckboxstate,onClick:_this.toggleSwipe}),/*#__PURE__*/React.createElement("span",{onClick:_this.toggleSwipe},LocaleUtils.tr("layertree.compare")))}var layerImportExpander=null;if(_this.props.allowImport){layerImportExpander=/*#__PURE__*/React.createElement("div",{className:"layertree-option",onClick:_this.toggleImportLayers},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.importvisible?"collapse":"expand"})," ",LocaleUtils.tr("layertree.importlayer"))}var flattenGroups=ConfigUtils.getConfigProp("flattenLayerTreeGroups",_this.props.theme)||_this.props.flattenGroups;var sortable=allowReordering&&(ConfigUtils.getConfigProp("preventSplittingGroupsWhenReordering",_this.props.theme)===true||flattenGroups===true);var treelayers=_this.props.layers.filter(function(layer){return layer.role!==LayerRole.BACKGROUND&&!layer.layertreehidden});return/*#__PURE__*/React.createElement("div",{className:"layertree-container-wrapper",role:"body"},/*#__PURE__*/React.createElement("div",{className:"layertree-container"},/*#__PURE__*/React.createElement("div",{className:"layertree-tree",onContextMenuCapture:function onContextMenuCapture(ev){// Prevent context menu on drag-sort
 ev.stopPropagation();ev.preventDefault();return false},onTouchEnd:function onTouchEnd(ev){var target=ev.currentTarget;clearTimeout(target.preventScrollTimeout);target.preventScrollTimeout=null;target.removeEventListener("touchmove",MiscUtils.killEvent)},onTouchStart:function onTouchStart(ev){// Prevent touch-scroll after sortable trigger delay
-var target=ev.currentTarget;target.preventScrollTimeout=setTimeout(function(){target.addEventListener("touchmove",MiscUtils.killEvent,{passive:false})},200)},ref:MiscUtils.setupKillTouchEvents},/*#__PURE__*/React.createElement(Sortable,{onChange:_this.onSortChange,options:{disabled:sortable===false,ghostClass:"drop-ghost",delay:200,forceFallback:_this.props.fallbackDrag}},_this.renderLayerTree(treelayers))),maptipCheckbox,compareCheckbox,layerImportExpander,_this.state.importvisible?/*#__PURE__*/React.createElement(ImportLayer,{theme:_this.props.theme}):null))});_defineProperty(_this,"renderLegendPrintWindow",function(){if(!_this.state.legendPrintVisible){return null}var setLegendPrintContents=function setLegendPrintContents(el){if(!el){return}el.addEventListener("load",function(){var container=el.contentWindow.document.getElementById("legendcontainer");if(container){var body="<p id=\"legendcontainerbody\">";body+=_this.props.layers.map(function(layer){if(!layer.visibility){return""}else if(layer.legendUrl){return _this.printLayerLegend(layer,layer)}else if(layer.color){return"<div class=\"legend-entry\"><span style=\"display: inline-block; width: 1em; height: 1em; box-shadow: inset 0 0 0 1000px "+layer.color+"; margin: 0.25em; border: 1px solid black;\">&nbsp;</span>"+(layer.title||layer.name)+"</div>"}else{return""}}).join("");body+="</p>";container.innerHTML=body}else{_this.legendPrintWindow.document.body.innerHTML="Broken template. An element with id=legendcontainer must exist."}})};var printLegend=function printLegend(ev){ev.target.parentElement.parentElement.getElementsByTagName("iframe")[0].contentWindow.print()};return/*#__PURE__*/React.createElement(ResizeableWindow,{icon:"print",initialHeight:0.75*window.innerHeight,initialWidth:0.5*window.innerWidth,onClose:function onClose(){return _this.setState({legendPrintVisible:false})},title:LocaleUtils.tr("layertree.printlegend")},/*#__PURE__*/React.createElement("div",{className:"layertree-legend-print-body",role:"body"},/*#__PURE__*/React.createElement("iframe",{ref:setLegendPrintContents,src:MiscUtils.resolveAssetsPath(_this.props.templatePath)}),/*#__PURE__*/React.createElement("div",{className:"layertree-legend-print-body-buttonbar"},/*#__PURE__*/React.createElement("button",{onClick:printLegend},LocaleUtils.tr("layertree.printlegend")))))});_defineProperty(_this,"legendTooltipLoaded",function(ev){if(ev.target.naturalWidth>1){ev.target.style.visibility="visible"}});_defineProperty(_this,"onSortChange",function(order,sortable,ev){var moved=JSON.parse(order[ev.newIndex]);var layer=_this.props.layers.find(function(l){return l.uuid===moved.layer});if(layer){_this.props.reorderLayer(layer,moved.path,ev.newIndex-ev.oldIndex)}});_defineProperty(_this,"toggleImportLayers",function(){_this.setState(function(state){var visible=!state.importvisible;return{importvisible:visible,sidebarwidth:visible?"40em":null}})});_defineProperty(_this,"propagateOptions",function(layer,options){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;if(layer.sublayers){layer.sublayers=layer.sublayers.map(function(sublayer,idx){if(path===null||!isEmpty(path)&&path[0]===idx){var newsublayer=_objectSpread(_objectSpread({},sublayer),options);_this.propagateOptions(newsublayer,options,path?path.slice(1):null);return newsublayer}else{return sublayer}})}});_defineProperty(_this,"groupExpandedToggled",function(layer,grouppath,oldexpanded){_this.props.changeLayerProperty(layer.uuid,"expanded",!oldexpanded,grouppath)});_defineProperty(_this,"itemVisibilityToggled",function(layer,grouppath,oldvisibility){var recurseDirection=null;// If item becomes visible, also make parents visible
-if(_this.props.groupTogglesSublayers){recurseDirection=!oldvisibility?"both":"children"}else{recurseDirection=!oldvisibility?"parents":null}_this.props.changeLayerProperty(layer.uuid,"visibility",!oldvisibility,grouppath,recurseDirection)});_defineProperty(_this,"itemOmitQueryableToggled",function(layer,grouppath,oldomitqueryable){_this.props.changeLayerProperty(layer.uuid,"omitFromQueryLayers",!oldomitqueryable,grouppath,"children")});_defineProperty(_this,"layerTransparencyChanged",function(layer,sublayerpath,value){var recurse=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;_this.props.changeLayerProperty(layer.uuid,"opacity",Math.max(1,255-value),sublayerpath,recurse)});_defineProperty(_this,"layerStyleChanged",function(layer,sublayerpath,value){var recurseDirection=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;_this.props.changeLayerProperty(layer.uuid,"style",value,sublayerpath,recurseDirection)});_defineProperty(_this,"layerMenuToggled",function(sublayeruuid){_this.setState(function(state){return{activemenu:state.activemenu===sublayeruuid?null:sublayeruuid,activestylemenu:null}})});_defineProperty(_this,"layerStyleMenuToggled",function(sublayeruuid){_this.setState(function(state){return{activestylemenu:state.activestylemenu===sublayeruuid?null:sublayeruuid,activemenu:null}})});_defineProperty(_this,"showLegendTooltip",function(ev,request){_this.setState({legendTooltip:{x:ev.target.getBoundingClientRect().right,y:ev.target.getBoundingClientRect().top,img:request+"&TYPE=tooltip"}})});_defineProperty(_this,"hideLegendTooltip",function(){_this.setState({legendTooltip:undefined})});_defineProperty(_this,"toggleMapTips",function(){_this.props.toggleMapTips(!_this.props.mapTipsEnabled)});_defineProperty(_this,"toggleSwipe",function(){_this.props.setSwipe(_this.props.swipe!==null?null:50)});_defineProperty(_this,"printLayerLegend",function(layer,sublayer){var body="";if(sublayer.sublayers){if(sublayer.visibility){body="<div class=\"legend-group\">"+"<h3 class=\"legend-group-title\">"+(sublayer.title||sublayer.name)+"</h3>"+"<div class=\"legend-group-body\">"+sublayer.sublayers.map(function(subsublayer){return _this.printLayerLegend(layer,subsublayer)}).join("\n")+"</div>"+"</div>"}}else{if(sublayer.visibility&&LayerUtils.layerScaleInRange(sublayer,_this.props.mapScale)){var request=LayerUtils.getLegendUrl(layer,{name:sublayer.name},_this.props.mapScale,_this.props.map,_this.props.bboxDependentLegend,_this.props.scaleDependentLegend,_this.props.extraLegendParameters);body=request?"<div class=\"legend-entry\"><img src=\""+request+"\" /></div>":""}}return body});_defineProperty(_this,"deleteAllLayers",function(){var _iterator=_createForOfIteratorHelper(_this.props.layers),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var layer=_step.value;if(layer.role===LayerRole.THEME){var sublayers=layer.sublayers||[];for(var i=sublayers.length-1;i>=0;--i){_this.props.removeLayer(layer.id,[i])}}else if(layer.role===LayerRole.USERLAYER){_this.props.removeLayer(layer.id)}}}catch(err){_iterator.e(err)}finally{_iterator.f()}});_defineProperty(_this,"toggleLayerTreeVisibility",function(visibile){var _iterator2=_createForOfIteratorHelper(_this.props.layers),_step2;try{for(_iterator2.s();!(_step2=_iterator2.n()).done;){var layer=_step2.value;if(layer.role===LayerRole.THEME||layer.role===LayerRole.USERLAYER){_this.props.changeLayerProperty(layer.uuid,"visibility",visibile,[],_this.props.groupTogglesSublayers?"children":null)}}}catch(err){_iterator2.e(err)}finally{_iterator2.f()}});_defineProperty(_this,"exportRedliningLayer",function(layer){var data=JSON.stringify({type:"FeatureCollection",features:layer.features.map(function(feature){var newFeature=_objectSpread(_objectSpread({},feature),{},{geometry:VectorLayerUtils.reprojectGeometry(feature.geometry,feature.crs||_this.props.map.projection,"EPSG:4326")});delete newFeature.crs;return newFeature})},null," ");FileSaver.saveAs(new Blob([data],{type:"text/plain;charset=utf-8"}),layer.title+".json")});_defineProperty(_this,"getSelectedStyles",function(layer){var _layer$params;return _toConsumableArray(new Set((((_layer$params=layer.params)===null||_layer$params===void 0?void 0:_layer$params.STYLES)||"").split(",").filter(Boolean)))});_defineProperty(_this,"getLayerStyles",function(layer){var _layer$sublayers;return layer===null||layer===void 0||(_layer$sublayers=layer.sublayers)===null||_layer$sublayers===void 0?void 0:_layer$sublayers.reduce(function(styleList,sublayer){Object.assign(styleList,_this.getLayerStyles(sublayer.sublayers));return Object.assign(styleList,sublayer.styles)},{})});_defineProperty(_this,"applyLayerStyle",function(style,layer){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:[];var layerUuid=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;layerUuid=layerUuid!==null&&layerUuid!==void 0?layerUuid:layer.uuid;(layer.sublayers||[]).forEach(function(sublayer,idx){_this.applyLayerStyle(style,sublayer,[].concat(_toConsumableArray(path),[idx]),layerUuid);if(style in(sublayer.styles||{})){_this.props.changeLayerProperty(layerUuid,"style",style,[].concat(_toConsumableArray(path),[idx]))}})});_this.legendPrintWindow=null;window.addEventListener("beforeunload",function(){if(_this.legendPrintWindow&&!_this.legendPrintWindow.closed){_this.legendPrintWindow.close()}});return _this}_inherits(LayerTree,_React$Component);return _createClass(LayerTree,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(this.props.theme.mapTips!==undefined&&this.props.theme.mapTips!==prevProps.theme.mapTips){this.props.toggleMapTips(this.props.theme.mapTips&&!ConfigUtils.isMobile())}}},{key:"render",value:function render(){var _this2=this;var legendTooltip=null;if(this.state.legendTooltip){var style={left:this.state.legendTooltip.x,top:this.state.legendTooltip.y,maxWidth:window.innerWidth-this.state.legendTooltip.x-2,maxHeight:window.innerHeight-this.state.legendTooltip.y-2,visibility:"hidden"};legendTooltip=/*#__PURE__*/React.createElement(Image,{className:"layertree-item-legend-tooltip",onLoad:this.legendTooltipLoaded,onTouchStart:this.hideLegendTooltip,src:this.state.legendTooltip.img,style:style})}var legendPrintIcon=null;if(this.props.enableLegendPrint){legendPrintIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-print-legend",icon:"print",onClick:function onClick(){return _this2.setState({legendPrintVisible:true})},title:LocaleUtils.tr("layertree.printlegend")})}var visibleFilterIcon=null;if(this.props.enableVisibleFilter){var visibleFilterTooltip=LocaleUtils.tr("layertree.visiblefilter");var classes=classnames({"layertree-visible-filter":true,"layertree-visible-filter-active":this.state.filtervisiblelayers});visibleFilterIcon=/*#__PURE__*/React.createElement(Icon,{className:classes,icon:"eye",onClick:function onClick(){return _this2.setState(function(state){return{filtervisiblelayers:!state.filtervisiblelayers}})},title:visibleFilterTooltip})}var deleteAllLayersIcon=null;if(ConfigUtils.getConfigProp("allowRemovingThemeLayers")===true){var deleteAllLayersTooltip=LocaleUtils.tr("layertree.deletealllayers");deleteAllLayersIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-delete-legend",icon:"trash",onClick:this.deleteAllLayers,title:deleteAllLayersTooltip})}var serviceInfoIcon=null;if(this.props.enableServiceInfo){serviceInfoIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-theme-metadata",icon:"info-sign",onClick:function onClick(){return _this2.props.setActiveServiceInfo(_this2.props.theme)}})}var extraTitlebarContent=null;if(legendPrintIcon||deleteAllLayersIcon||visibleFilterIcon){extraTitlebarContent=/*#__PURE__*/React.createElement("span",null,legendPrintIcon,visibleFilterIcon,deleteAllLayersIcon,serviceInfoIcon)}var visibilities=[];var _iterator3=_createForOfIteratorHelper(this.props.layers),_step3;try{for(_iterator3.s();!(_step3=_iterator3.n()).done;){var layer=_step3.value;if(layer.role===LayerRole.THEME||layer.role===LayerRole.USERLAYER){visibilities.push(LayerUtils.computeLayerVisibility(layer))}}}catch(err){_iterator3.e(err)}finally{_iterator3.f()}var vis=visibilities.reduce(function(sum,x){return sum+x},0)/(visibilities.length||1);var visibilityIcon="tristate";if(vis===0){visibilityIcon="unchecked"}else if(vis===1){visibilityIcon="checked"}var visibilityCheckbox=this.props.showToggleAllLayersCheckbox?/*#__PURE__*/React.createElement(Icon,{className:"layertree-tree-visibility",icon:visibilityIcon,onClick:function onClick(){return _this2.toggleLayerTreeVisibility(vis===0)}}):null;return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement(SideBar,{extraBeforeContent:visibilityCheckbox,extraTitlebarContent:extraTitlebarContent,icon:"layers",id:"LayerTree",onHide:this.hideLegendTooltip,side:this.props.side,title:LocaleUtils.tr("appmenu.items.LayerTree"),width:this.state.sidebarwidth||this.props.width},function(){return{body:_this2.renderBody()}}),legendTooltip,this.renderLegendPrintWindow(),/*#__PURE__*/React.createElement(LayerInfoWindow,{bboxDependentLegend:this.props.bboxDependentLegend,layerInfoGeometry:this.props.layerInfoGeometry,scaleDependentLegend:this.props.scaleDependentLegend}),/*#__PURE__*/React.createElement(ServiceInfoWindow,{layerInfoGeometry:this.props.layerInfoGeometry}))}}])}(React.Component);_defineProperty(LayerTree,"propTypes",{/** Whether to allow adding separator entries in the layer tree, useful for organizing the tree. */addLayerSeparator:PropTypes.func,/** Whether to enable the compare function. Requires the `MapCompare` plugin. */allowCompare:PropTypes.bool,/** Whether to allow importing external layers. */allowImport:PropTypes.bool,/** Whether to allow enabling map tips. */allowMapTips:PropTypes.bool,/** Whether to allow selection of identifyable layers. The `showQueryableIcon` property should be `true` to be able to select identifyable layers. */allowSelectIdentifyableLayers:PropTypes.bool,/** Whether to display a BBOX dependent legend. Can be `true|false|"theme"`, latter means only for theme layers. */bboxDependentLegend:PropTypes.oneOfType([PropTypes.bool,PropTypes.string]),changeLayerProperty:PropTypes.func,/** Whether to enable the legend print functionality. */enableLegendPrint:PropTypes.bool,/** Whether to display a service info button to display the WMS service metadata. */enableServiceInfo:PropTypes.bool,/** Whether to display a button to filter invisible layers from the layertree. */enableVisibleFilter:PropTypes.bool,/** Additional parameters to pass to the GetLegendGraphics request. */extraLegendParameters:PropTypes.string,/** Whether to use the fallback logic for drag-and-drop. */fallbackDrag:PropTypes.bool,filter:PropTypes.object,/** Whether to display a flat layer tree, omitting any groups. */flattenGroups:PropTypes.bool,/** Whether to display unchecked layers gray in the layertree. */grayUnchecked:PropTypes.bool,/** Whether toggling a group also toggles all sublayers. */groupTogglesSublayers:PropTypes.bool,/** Whether to display the layer info button inside the layer settings menu rather than next to the layer title. */infoInSettings:PropTypes.bool,/** Default layer info window geometry with size, position and docking status. */layerInfoGeometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool}),layers:PropTypes.array,loadingLayers:PropTypes.array,map:PropTypes.object,mapScale:PropTypes.number,mapTipsEnabled:PropTypes.bool,mobile:PropTypes.bool,/** Whether to only display layer groups but not individual layers in layertree. */onlyGroups:PropTypes.bool,removeLayer:PropTypes.func,reorderLayer:PropTypes.func,/** Whether to display a scale dependent legend. Can be `true|false|"theme"`, latter means only for theme layers. */scaleDependentLegend:PropTypes.oneOfType([PropTypes.bool,PropTypes.string]),setActiveLayerInfo:PropTypes.func,setActiveServiceInfo:PropTypes.func,setCurrentTask:PropTypes.func,setSwipe:PropTypes.func,/** Whether to display an icon linking to the layer attribute table in the layer options menu.  */showAttributeTableLink:PropTypes.bool,/** Whether to display legend icons. */showLegendIcons:PropTypes.bool,/** Whether to display the queryable icon to indicate that a layer is identifyable. */showQueryableIcon:PropTypes.bool,/** Whether to display the root entry of the layertree. */showRootEntry:PropTypes.bool,/** Whether to display a checkbox to toggle all layers. */showToggleAllLayersCheckbox:PropTypes.bool,/** The side of the application on which to display the sidebar. */side:PropTypes.string,swipe:PropTypes.number,/** Template location for the legend print functionality */templatePath:PropTypes.string,theme:PropTypes.object,toggleMapTips:PropTypes.func,transparencyIcon:PropTypes.bool,/** The initial width of the layertree, as a CSS width string. */width:PropTypes.string,zoomToExtent:PropTypes.func});_defineProperty(LayerTree,"defaultProps",{layers:[],showLegendIcons:true,showRootEntry:true,showQueryableIcon:true,allowMapTips:true,allowCompare:true,allowImport:true,allowSelectIdentifyableLayers:false,groupTogglesSublayers:false,grayUnchecked:true,layerInfoGeometry:{initialWidth:480,initialHeight:480,initialX:null,initialY:null,initiallyDocked:false},bboxDependentLegend:false,flattenGroups:false,onlyGroups:false,width:"25em",enableLegendPrint:true,enableVisibleFilter:true,enableServiceInfo:true,infoInSettings:true,showToggleAllLayersCheckbox:true,transparencyIcon:true,side:"right",templatePath:":/templates/legendprint.html"});var selector=function selector(state){return{layers:state.layers.flat,filter:state.layers.filter,loadingLayers:state.layers.loading,map:state.map,mapScale:MapUtils.computeForZoom(state.map.scales,state.map.zoom),swipe:state.layers.swipe,theme:state.theme.current||{},mapTipsEnabled:state.map.maptips}};export default connect(selector,{addLayerSeparator:addLayerSeparator,changeLayerProperty:changeLayerProperty,removeLayer:removeLayer,reorderLayer:reorderLayer,toggleMapTips:toggleMapTips,setSwipe:setSwipe,setActiveLayerInfo:setActiveLayerInfo,setActiveServiceInfo:setActiveServiceInfo,setCurrentTask:setCurrentTask,zoomToExtent:zoomToExtent})(LayerTree);
+var target=ev.currentTarget;target.preventScrollTimeout=setTimeout(function(){target.addEventListener("touchmove",MiscUtils.killEvent,{passive:false})},200)},ref:MiscUtils.setupKillTouchEvents},/*#__PURE__*/React.createElement(Sortable,{onChange:_this.onSortChange,options:{disabled:sortable===false,ghostClass:"drop-ghost",delay:200,forceFallback:_this.props.fallbackDrag}},_this.renderLayerTree(treelayers))),maptipCheckbox,compareCheckbox,layerImportExpander,_this.state.importvisible?/*#__PURE__*/React.createElement(ImportLayer,{theme:_this.props.theme}):null))});_defineProperty(_this,"renderVisibilityButton",function(){var vis=0;var count=0;var _iterator=_createForOfIteratorHelper(_this.props.layers),_step;try{for(_iterator.s();!(_step=_iterator.n()).done;){var layer=_step.value;if(layer.role===LayerRole.THEME||layer.role===LayerRole.USERLAYER){count+=1;vis+=layer.visibility}}}catch(err){_iterator.e(err)}finally{_iterator.f()}vis/=Math.min(1,count);var buttonClasses=classnames({"layertree-visibility-button":true,"layertree-visibility-button-active":_this.state.visibilityMenu});return/*#__PURE__*/React.createElement("span",{className:buttonClasses,onClick:function onClick(){return _this.setState(function(state){return{visibilityMenu:!state.visibilityMenu}})}},/*#__PURE__*/React.createElement(Icon,{icon:"eye"}),/*#__PURE__*/React.createElement(Icon,{icon:"chevron-down"}),_this.state.visibilityMenu?/*#__PURE__*/React.createElement("div",{className:"layertree-visibility-menu"},/*#__PURE__*/React.createElement("div",{onClick:function onClick(){return _this.toggleLayerTreeVisibility(vis===0)}},/*#__PURE__*/React.createElement(Icon,{icon:vis===0?"checked":"unchecked"})," ",LocaleUtils.tr("layertree.hidealllayers")),/*#__PURE__*/React.createElement("div",{onClick:function onClick(){return _this.setState(function(state){return{filterinvisiblelayers:!state.filterinvisiblelayers}})}},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.filterinvisiblelayers?"checked":"unchecked"})," ",LocaleUtils.tr("layertree.visiblefilter")),Object.entries(_this.props.theme.visibilityPresets||{}).map(function(_ref3){var _ref4=_slicedToArray(_ref3,2),name=_ref4[0],preset=_ref4[1];return/*#__PURE__*/React.createElement("div",{key:name,onClick:function onClick(){return _this.props.setThemeLayersVisibilityPreset(preset)}},/*#__PURE__*/React.createElement(Icon,{icon:_this.state.activePreset===name?"radio_checked":"radio_unchecked"})," ",name)})):null)});_defineProperty(_this,"renderLegendPrintWindow",function(){if(!_this.state.legendPrintVisible){return null}var setLegendPrintContents=function setLegendPrintContents(el){if(!el){return}el.addEventListener("load",function(){var container=el.contentWindow.document.getElementById("legendcontainer");if(container){var body="<p id=\"legendcontainerbody\">";body+=_this.props.layers.map(function(layer){if(!layer.visibility){return""}else if(layer.legendUrl){return _this.printLayerLegend(layer,layer)}else if(layer.color){return"<div class=\"legend-entry\"><span style=\"display: inline-block; width: 1em; height: 1em; box-shadow: inset 0 0 0 1000px "+layer.color+"; margin: 0.25em; border: 1px solid black;\">&nbsp;</span>"+(layer.title||layer.name)+"</div>"}else{return""}}).join("");body+="</p>";container.innerHTML=body}else{_this.legendPrintWindow.document.body.innerHTML="Broken template. An element with id=legendcontainer must exist."}})};var printLegend=function printLegend(ev){ev.target.parentElement.parentElement.getElementsByTagName("iframe")[0].contentWindow.print()};return/*#__PURE__*/React.createElement(ResizeableWindow,{icon:"print",initialHeight:0.75*window.innerHeight,initialWidth:0.5*window.innerWidth,onClose:function onClose(){return _this.setState({legendPrintVisible:false})},title:LocaleUtils.tr("layertree.printlegend")},/*#__PURE__*/React.createElement("div",{className:"layertree-legend-print-body",role:"body"},/*#__PURE__*/React.createElement("iframe",{ref:setLegendPrintContents,src:MiscUtils.resolveAssetsPath(_this.props.templatePath)}),/*#__PURE__*/React.createElement("div",{className:"layertree-legend-print-body-buttonbar"},/*#__PURE__*/React.createElement("button",{onClick:printLegend},LocaleUtils.tr("layertree.printlegend")))))});_defineProperty(_this,"legendTooltipLoaded",function(ev){if(ev.target.naturalWidth>1){ev.target.style.visibility="visible"}});_defineProperty(_this,"onSortChange",function(order,sortable,ev){var moved=JSON.parse(order[ev.newIndex]);var layer=_this.props.layers.find(function(l){return l.id===moved.layer});if(layer){_this.props.reorderLayer(layer,moved.path,ev.newIndex-ev.oldIndex)}});_defineProperty(_this,"toggleImportLayers",function(){_this.setState(function(state){var visible=!state.importvisible;return{importvisible:visible,sidebarwidth:visible?"40em":null}})});_defineProperty(_this,"propagateOptions",function(layer,options){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:null;if(layer.sublayers){layer.sublayers=layer.sublayers.map(function(sublayer,idx){if(path===null||!isEmpty(path)&&path[0]===idx){var newsublayer=_objectSpread(_objectSpread({},sublayer),options);_this.propagateOptions(newsublayer,options,path?path.slice(1):null);return newsublayer}else{return sublayer}})}});_defineProperty(_this,"groupExpandedToggled",function(layer,grouppath,oldexpanded){_this.props.changeLayerProperty(layer.id,"expanded",!oldexpanded,grouppath)});_defineProperty(_this,"itemVisibilityToggled",function(layer,grouppath,oldvisibility){var recurseDirection=null;// If item becomes visible, also make parents visible
+if(_this.props.groupTogglesSublayers){recurseDirection=!oldvisibility?"both":"children"}else{recurseDirection=!oldvisibility?"parents":null}_this.props.changeLayerProperty(layer.id,"visibility",!oldvisibility,grouppath,recurseDirection)});_defineProperty(_this,"itemOmitQueryableToggled",function(layer,grouppath,oldomitqueryable){_this.props.changeLayerProperty(layer.id,"omitFromQueryLayers",!oldomitqueryable,grouppath,"children")});_defineProperty(_this,"layerTransparencyChanged",function(layer,sublayerpath,value){var recurse=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;_this.props.changeLayerProperty(layer.id,"opacity",Math.max(1,255-value),sublayerpath,recurse)});_defineProperty(_this,"layerStyleChanged",function(layer,sublayerpath,value){var recurseDirection=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;_this.props.changeLayerProperty(layer.id,"style",value,sublayerpath,recurseDirection)});_defineProperty(_this,"layerMenuToggled",function(sublayerid){_this.setState(function(state){return{activemenu:state.activemenu===sublayerid?null:sublayerid,activestylemenu:null}})});_defineProperty(_this,"layerStyleMenuToggled",function(sublayerid){_this.setState(function(state){return{activestylemenu:state.activestylemenu===sublayerid?null:sublayerid,activemenu:null}})});_defineProperty(_this,"showLegendTooltip",function(ev,request){_this.setState({legendTooltip:{x:ev.target.getBoundingClientRect().right,y:ev.target.getBoundingClientRect().top,img:request+"&TYPE=tooltip"}})});_defineProperty(_this,"onHide",function(){_this.setState({legendTooltip:undefined,visibilityMenu:false})});_defineProperty(_this,"hideLegendTooltip",function(){_this.setState({legendTooltip:undefined})});_defineProperty(_this,"toggleMapTips",function(){_this.props.toggleMapTips(!_this.props.mapTipsEnabled)});_defineProperty(_this,"toggleSwipe",function(){_this.props.setSwipe(_this.props.swipe!==null?null:50)});_defineProperty(_this,"printLayerLegend",function(layer,sublayer){var body="";if(sublayer.sublayers){if(sublayer.visibility){body="<div class=\"legend-group\">"+"<h3 class=\"legend-group-title\">"+(sublayer.title||sublayer.name)+"</h3>"+"<div class=\"legend-group-body\">"+sublayer.sublayers.map(function(subsublayer){return _this.printLayerLegend(layer,subsublayer)}).join("\n")+"</div>"+"</div>"}}else{if(sublayer.visibility&&LayerUtils.layerScaleInRange(sublayer,_this.props.mapScale)){var request=LayerUtils.getLegendUrl(layer,{name:sublayer.name},_this.props.mapScale,_this.props.map,_this.props.bboxDependentLegend,_this.props.scaleDependentLegend,_this.props.extraLegendParameters);body=request?"<div class=\"legend-entry\"><img src=\""+request+"\" /></div>":""}}return body});_defineProperty(_this,"deleteAllLayers",function(){var _iterator2=_createForOfIteratorHelper(_this.props.layers),_step2;try{for(_iterator2.s();!(_step2=_iterator2.n()).done;){var layer=_step2.value;if(layer.role===LayerRole.THEME){var sublayers=layer.sublayers||[];for(var i=sublayers.length-1;i>=0;--i){_this.props.removeLayer(layer.id,[i])}}else if(layer.role===LayerRole.USERLAYER){_this.props.removeLayer(layer.id)}}}catch(err){_iterator2.e(err)}finally{_iterator2.f()}});_defineProperty(_this,"toggleLayerTreeVisibility",function(visibile){var _iterator3=_createForOfIteratorHelper(_this.props.layers),_step3;try{for(_iterator3.s();!(_step3=_iterator3.n()).done;){var layer=_step3.value;if(layer.role===LayerRole.THEME||layer.role===LayerRole.USERLAYER){_this.props.changeLayerProperty(layer.id,"visibility",visibile,[],null)}}}catch(err){_iterator3.e(err)}finally{_iterator3.f()}});_defineProperty(_this,"exportRedliningLayer",function(layer){var data=JSON.stringify({type:"FeatureCollection",features:layer.features.map(function(feature){var newFeature=_objectSpread(_objectSpread({},feature),{},{geometry:VectorLayerUtils.reprojectGeometry(feature.geometry,feature.crs||_this.props.map.projection,"EPSG:4326")});delete newFeature.crs;return newFeature})},null," ");FileSaver.saveAs(new Blob([data],{type:"text/plain;charset=utf-8"}),layer.title+".json")});_defineProperty(_this,"getSelectedStyles",function(layer){var _layer$params;return _toConsumableArray(new Set((((_layer$params=layer.params)===null||_layer$params===void 0?void 0:_layer$params.STYLES)||"").split(",").filter(Boolean)))});_defineProperty(_this,"getLayerStyles",function(layer){var _layer$sublayers;return layer===null||layer===void 0||(_layer$sublayers=layer.sublayers)===null||_layer$sublayers===void 0?void 0:_layer$sublayers.reduce(function(styleList,sublayer){Object.assign(styleList,_this.getLayerStyles(sublayer.sublayers));return Object.assign(styleList,sublayer.styles)},{})});_defineProperty(_this,"applyLayerStyle",function(style,layer){var path=arguments.length>2&&arguments[2]!==undefined?arguments[2]:[];var layerId=arguments.length>3&&arguments[3]!==undefined?arguments[3]:null;layerId=layerId!==null&&layerId!==void 0?layerId:layer.id;(layer.sublayers||[]).forEach(function(sublayer,idx){_this.applyLayerStyle(style,sublayer,[].concat(_toConsumableArray(path),[idx]),layerId);if(style in(sublayer.styles||{})){_this.props.changeLayerProperty(layerId,"style",style,[].concat(_toConsumableArray(path),[idx]))}})});_this.legendPrintWindow=null;window.addEventListener("beforeunload",function(){if(_this.legendPrintWindow&&!_this.legendPrintWindow.closed){_this.legendPrintWindow.close()}});return _this}_inherits(LayerTree,_React$Component);return _createClass(LayerTree,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(this.props.theme.mapTips!==undefined&&this.props.theme.mapTips!==prevProps.theme.mapTips){this.props.toggleMapTips(this.props.theme.mapTips&&!ConfigUtils.isMobile())}if(this.props.layers!==prevProps.layers){this.setState({activePreset:LayerUtils.getActiveVisibilityPreset(this.props.layers,this.props.theme.visibilityPresets)})}}},{key:"render",value:function render(){var _this2=this;var legendTooltip=null;if(this.state.legendTooltip){var style={left:this.state.legendTooltip.x,top:this.state.legendTooltip.y,maxWidth:window.innerWidth-this.state.legendTooltip.x-2,maxHeight:window.innerHeight-this.state.legendTooltip.y-2,visibility:"hidden"};legendTooltip=/*#__PURE__*/React.createElement(Image,{className:"layertree-item-legend-tooltip",onLoad:this.legendTooltipLoaded,onTouchStart:this.hideLegendTooltip,src:this.state.legendTooltip.img,style:style})}var legendPrintIcon=null;if(this.props.enableLegendPrint){legendPrintIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-print-legend",icon:"print",onClick:function onClick(){return _this2.setState({legendPrintVisible:true})},title:LocaleUtils.tr("layertree.printlegend")})}var deleteAllLayersIcon=null;if(ConfigUtils.getConfigProp("allowRemovingThemeLayers")===true){var deleteAllLayersTooltip=LocaleUtils.tr("layertree.deletealllayers");deleteAllLayersIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-delete-legend",icon:"trash",onClick:this.deleteAllLayers,title:deleteAllLayersTooltip})}var serviceInfoIcon=null;if(this.props.enableServiceInfo){var serviceInfoTooltip=LocaleUtils.tr("serviceinfo.title");serviceInfoIcon=/*#__PURE__*/React.createElement(Icon,{className:"layertree-theme-metadata",icon:"info-sign",onClick:function onClick(){return _this2.props.setActiveServiceInfo(_this2.props.theme)},title:serviceInfoTooltip})}var extraTitlebarContent=/*#__PURE__*/React.createElement("span",null,this.renderVisibilityButton(),legendPrintIcon,deleteAllLayersIcon,serviceInfoIcon);return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement(SideBar,{extraTitlebarContent:extraTitlebarContent,icon:"layers",id:"LayerTree",onHide:this.onHide,side:this.props.side,title:LocaleUtils.tr("appmenu.items.LayerTree"),width:this.state.sidebarwidth||this.props.width},function(){return{body:_this2.renderBody()}}),legendTooltip,this.renderLegendPrintWindow(),/*#__PURE__*/React.createElement(LayerInfoWindow,{bboxDependentLegend:this.props.bboxDependentLegend,layerInfoGeometry:this.props.layerInfoGeometry,scaleDependentLegend:this.props.scaleDependentLegend}),/*#__PURE__*/React.createElement(ServiceInfoWindow,{layerInfoGeometry:this.props.layerInfoGeometry}))}}])}(React.Component);_defineProperty(LayerTree,"propTypes",{/** Whether to allow adding separator entries in the layer tree, useful for organizing the tree. */addLayerSeparator:PropTypes.func,/** Whether to enable the compare function. Requires the `MapCompare` plugin. */allowCompare:PropTypes.bool,/** Whether to allow importing external layers. */allowImport:PropTypes.bool,/** Whether to allow enabling map tips. */allowMapTips:PropTypes.bool,/** Whether to allow selection of identifyable layers. The `showQueryableIcon` property should be `true` to be able to select identifyable layers. */allowSelectIdentifyableLayers:PropTypes.bool,/** Whether to display a BBOX dependent legend. Can be `true|false|"theme"`, latter means only for theme layers. */bboxDependentLegend:PropTypes.oneOfType([PropTypes.bool,PropTypes.string]),changeLayerProperty:PropTypes.func,/** Whether to enable the legend print functionality. */enableLegendPrint:PropTypes.bool,/** Whether to display a service info button to display the WMS service metadata. */enableServiceInfo:PropTypes.bool,/** Additional parameters to pass to the GetLegendGraphics request. */extraLegendParameters:PropTypes.string,/** Whether to use the fallback logic for drag-and-drop. */fallbackDrag:PropTypes.bool,filter:PropTypes.object,/** Whether to display a flat layer tree, omitting any groups. */flattenGroups:PropTypes.bool,/** Whether to display unchecked layers gray in the layertree. */grayUnchecked:PropTypes.bool,/** Whether toggling a group also toggles all sublayers. */groupTogglesSublayers:PropTypes.bool,/** Whether to display the layer info button inside the layer settings menu rather than next to the layer title. */infoInSettings:PropTypes.bool,/** Default layer info window geometry with size, position and docking status. */layerInfoGeometry:PropTypes.shape({initialWidth:PropTypes.number,initialHeight:PropTypes.number,initialX:PropTypes.number,initialY:PropTypes.number,initiallyDocked:PropTypes.bool}),layers:PropTypes.array,loadingLayers:PropTypes.array,map:PropTypes.object,mapScale:PropTypes.number,mapTipsEnabled:PropTypes.bool,mobile:PropTypes.bool,/** Whether to only display layer groups but not individual layers in layertree. */onlyGroups:PropTypes.bool,removeLayer:PropTypes.func,reorderLayer:PropTypes.func,/** Whether to display a scale dependent legend. Can be `true|false|"theme"`, latter means only for theme layers. */scaleDependentLegend:PropTypes.oneOfType([PropTypes.bool,PropTypes.string]),setActiveLayerInfo:PropTypes.func,setActiveServiceInfo:PropTypes.func,setCurrentTask:PropTypes.func,setSwipe:PropTypes.func,setThemeLayersVisibilityPreset:PropTypes.func,/** Whether to display an icon linking to the layer attribute table in the layer options menu.  */showAttributeTableLink:PropTypes.bool,/** Whether to display legend icons. */showLegendIcons:PropTypes.bool,/** Whether to display the queryable icon to indicate that a layer is identifyable. */showQueryableIcon:PropTypes.bool,/** Whether to display the root entry of the layertree. */showRootEntry:PropTypes.bool,/** The side of the application on which to display the sidebar. */side:PropTypes.string,swipe:PropTypes.number,/** Template location for the legend print functionality */templatePath:PropTypes.string,theme:PropTypes.object,toggleMapTips:PropTypes.func,transparencyIcon:PropTypes.bool,/** The initial width of the layertree, as a CSS width string. */width:PropTypes.string,zoomToExtent:PropTypes.func});_defineProperty(LayerTree,"defaultProps",{layers:[],showLegendIcons:true,showRootEntry:true,showQueryableIcon:true,allowMapTips:true,allowCompare:true,allowImport:true,allowSelectIdentifyableLayers:false,groupTogglesSublayers:false,grayUnchecked:true,layerInfoGeometry:{initialWidth:480,initialHeight:480,initialX:null,initialY:null,initiallyDocked:false},bboxDependentLegend:false,flattenGroups:false,onlyGroups:false,width:"25em",enableLegendPrint:true,enableServiceInfo:true,infoInSettings:true,transparencyIcon:true,side:"right",templatePath:":/templates/legendprint.html"});var selector=function selector(state){return{layers:state.layers.flat,filter:state.layers.filter,loadingLayers:state.layers.loading,map:state.map,mapScale:MapUtils.computeForZoom(state.map.scales,state.map.zoom),swipe:state.layers.swipe,theme:state.theme.current||{},mapTipsEnabled:state.map.maptips}};export default connect(selector,{addLayerSeparator:addLayerSeparator,changeLayerProperty:changeLayerProperty,removeLayer:removeLayer,reorderLayer:reorderLayer,toggleMapTips:toggleMapTips,setSwipe:setSwipe,setActiveLayerInfo:setActiveLayerInfo,setActiveServiceInfo:setActiveServiceInfo,setCurrentTask:setCurrentTask,setThemeLayersVisibilityPreset:setThemeLayersVisibilityPreset,zoomToExtent:zoomToExtent})(LayerTree);