From f38de97cf4560c43fc4138145af479455170f317 Mon Sep 17 00:00:00 2001
From: mpeltriaux <michel.peltriaux@sgdnord.rlp.de>
Date: Wed, 5 Oct 2022 11:01:11 +0200
Subject: [PATCH] Netgis client update

* fixes address search results placement in scrollable context
* fixes import issues for gml and geojson
* updates basic configuration for map layers
---
 templates/map/client/config.json              |  15 +-
 .../map/client/libs/netgis/MapOpenLayers.js   | 188 ++++++++++++++++--
 templates/map/client/libs/netgis/Toolbar.css  |   8 +-
 3 files changed, 177 insertions(+), 34 deletions(-)

diff --git a/templates/map/client/config.json b/templates/map/client/config.json
index f2907d67..805f7e3f 100644
--- a/templates/map/client/config.json
+++ b/templates/map/client/config.json
@@ -36,11 +36,13 @@
 		{ "folder": 2, "type": "WMS", "title": "Verbandsgemeinden", "url": "http://geo5.service24.rlp.de/wms/verwaltungsgrenzen_rp.fcgi?", "name": "Verbandsgemeinden" },
 		{ "folder": 2, "type": "WMS", "title": "Gemeinden", "url": "http://geo5.service24.rlp.de/wms/verwaltungsgrenzen_rp.fcgi?", "name": "Gemeinden" },
 
-		{ "folder": 0, "type": "WMS", "title": "Webatlas farbig", "attribution": "LVermGeo", "url": "https://maps.service24.rlp.de/gisserver/services/RP/RP_WebAtlasRP/MapServer/WmsServer?", "name": "RP_WebAtlasRP", "active": true },
-		{ "folder": 0, "type": "WMS", "title": "Webatlas grau", "attribution": "LVermGeo", "url": "https://maps.service24.rlp.de/gisserver/services/RP/RP_ETRS_Gt/MapServer/WmsServer?", "name": "0", "active": false },
+		{ "folder": 15, "type": "WMS", "title": "farbig", "attribution": "LVermGeo", "url": "https://maps.service24.rlp.de/gisserver/services/RP/RP_WebAtlasRP/MapServer/WmsServer?", "name": "RP_WebAtlasRP", "active": true },
+		{ "folder": 15, "type": "WMS", "title": "grau", "attribution": "LVermGeo", "url": "https://maps.service24.rlp.de/gisserver/services/RP/RP_ETRS_Gt/MapServer/WmsServer?", "name": "0", "active": false },
 		{ "folder": 0, "type": "WMS", "title": "Luftbilder", "attribution": "LVermGeo", "url": "http://geo4.service24.rlp.de/wms/dop_basis.fcgi?", "name": "rp_dop", "active": false },
-		{ "folder": 0, "type": "WMS", "title": "TopPlusOpen", "attribution": "BKG", "url": "https://sgx.geodatenzentrum.de/wms_topplus_open?", "name": "web", "active": false },
-		{ "folder": 0, "type": "OSM", "title": "Open Street Map", "attribution": "OSM", "active":  false }
+		{ "folder": 14, "type": "WMS", "title": "farbig", "attribution": "BKG", "url": "https://sgx.geodatenzentrum.de/wms_basemapde?", "name": "de_basemapde_web_raster_farbe", "active": false },
+		{ "folder": 14, "type": "WMS", "title": "grau", "attribution": "BKG", "url": "https://sgx.geodatenzentrum.de/wms_basemapde?", "name": "de_basemapde_web_raster_grau", "active": false },
+		{ "folder": 13, "type": "WMS", "title": "farbig", "attribution": "LVermGeo", "url": "https://geo4.service24.rlp.de/wms/dtk5_rp.fcgi?", "name": "rp_dtk5", "active": false },
+		{ "folder": 13, "type": "WMS", "title": "grau", "attribution": "LVermGeo", "url": "https://geo4.service24.rlp.de/wms/dtk5_rp.fcgi?", "name": "rp_dtk5_grau", "active": false }
 	],
 	
 	"folders":
@@ -57,7 +59,10 @@
 		{ "title": "MAE", "parent": 4 },
 		{ "title": "Schutzgebiete", "parent": 3 },
 		{ "title": "Nationalparke", "parent": 10 },
-		{ "title": "Naturräume", "parent": 10 }
+		{ "title": "Naturräume", "parent": 10 },
+		{ "title": "Topographisch (DTK5)", "parent": 0 },
+		{ "title": "BaseMap", "parent": 0 },
+		{ "title": "Webatlas", "parent": 0 }
 	],
 	
 	"projections":
diff --git a/templates/map/client/libs/netgis/MapOpenLayers.js b/templates/map/client/libs/netgis/MapOpenLayers.js
index 392b1c71..640b39ec 100644
--- a/templates/map/client/libs/netgis/MapOpenLayers.js
+++ b/templates/map/client/libs/netgis/MapOpenLayers.js
@@ -1116,10 +1116,15 @@ netgis.MapOpenLayers.prototype.updateEditOutput = function()
 {
 	var features = this.editLayer.getSource().getFeatures();
 	
-	// Output
+	var proj = this.client.config.map.projection;
 	var format = new ol.format.GeoJSON();
-	//var output = format.writeFeatures( features );
-	var output = format.writeFeaturesObject( features );
+	var output = format.writeFeaturesObject( features, { dataProjection: proj, featureProjection: proj } );
+	
+	output[ "crs" ] =
+	{
+		"type": "name",
+		"properties": { "name": "urn:ogc:def:crs:" + proj.replace( ":", "::" ) }
+	};
 	
 	if ( ! this.editEventsSilent )
 		this.client.invoke( netgis.Events.EDIT_FEATURES_CHANGE, output );
@@ -1254,7 +1259,6 @@ netgis.MapOpenLayers.prototype.onImportShapefile = function( e )
 
 netgis.MapOpenLayers.prototype.createLayerGeoJSON = function( title, data )
 {	
-	//var format = new ol.format.GeoJSON( { dataProjection: "EPSG:4326", featureProjection: this.client.config.map.projection /*"EPSG:3857"*/ } );
 	var format = new ol.format.GeoJSON();
 	var projection = format.readProjection( data );
 	var features = format.readFeatures( data, { featureProjection: this.client.config.map.projection } );
@@ -1262,7 +1266,25 @@ netgis.MapOpenLayers.prototype.createLayerGeoJSON = function( title, data )
 	//NOTE: proj4.defs[ "EPSG:4326" ]
 	//NOTE: netgis.util.foreach( proj4.defs, function( k,v ) { console.info( "DEF:", k, v ); } )
 	
-	//console.info( "Projection:", projection.getCode() );
+	var projcode = projection.getCode();
+	switch ( projcode )
+	{
+		case "EPSG:3857":
+		case "EPSG:4326":
+		case this.client.config.map.projection:
+		{
+			// Projection OK
+			//console.info( "Import Projection:", projcode );
+			break;
+		}
+
+		default:
+		{
+			// Projection Not Supported
+			console.warn( "Unsupported Import Projection:", projcode );
+			break;
+		}
+	}
 
 	this.addImportedFeatures( features );
 };
@@ -1274,19 +1296,142 @@ netgis.MapOpenLayers.prototype.createLayerGML = function( title, data )
 	
 	console.warn( "GML support is experimental!" );
 	
-	var format = new ol.format.WFS( /*{ srsName: "EPSG:4326", featureType: "ogr:RLP_OG_utf8_epsg4326" }*/ );
+	//var format = new ol.format.GML3( { srsName: "EPSG::25832", featureType: "Test", featureNS: "http://www.opengis.net/gml" } );
+	//var format = new ol.format.GML( { featureNS: "ogr" } );
+	//var format = new ol.format.WFS( /*{ srsName: "EPSG:4326", featureType: "ogr:RLP_OG_utf8_epsg4326" }*/ );
 	//var format = new ol.format.GML( { featureNS: "ogr", featureType: "ogr:RLP_OG_utf8_epsg4326" } );
 	//var format = new ol.format.WFS();
 	//var format = new ol.format.WFS( { featureNS: "ogr", featureType: "RLP_OG_utf8_epsg4326" } );
-	var projection = format.readProjection( data );
+	//var projection = format.readProjection( data );
 	//var features = format.readFeatures( data, { dataProjection: "EPSG:4326", featureProjection: "EPSG:3857" } );
-	var features = format.readFeatures( data, { featureProjection: this.client.config.map.projection } );
 
-	console.info( "GML:", projection, features );
+	//var features = format.readFeatures( data, { dataProjection: this.client.config.map.projection, featureProjection: this.client.config.map.projection } );
+
+	//console.info( "GML:", projection, features, features[ 0 ].getGeometry() );
+
+	var features = [];
+
+	var parser = new DOMParser();
+	var xml = parser.parseFromString( data, "text/xml" );
+
+	// Features
+	var featureMembers = xml.getElementsByTagName( "gml:featureMember" );
+
+	for ( var f = 0; f < featureMembers.length; f++ )
+	{
+		var props = {};
+
+		var node = featureMembers[ f ];
+		var child = node.children[ 0 ];
+
+		// Attributes
+		for ( var a = 0; a < child.attributes.length; a++ )
+		{
+			var attribute = child.attributes[ a ];
+			props[ attribute.nodeName ] = attribute.nodeValue;
+		}
+
+		for ( var c = 0; c < child.children.length; c++ )
+		{
+			var childNode = child.children[ c ];
+
+			if ( childNode.nodeName === "ogr:geometryProperty" ) continue;
+
+			var parts = childNode.nodeName.split( ":" );
+			var k = parts[ parts.length - 1 ];
+			var v = childNode.innerHTML;
+
+			props[ k ] = v;
+		}
+
+		// Geometry
+		var geomprop = child.getElementsByTagName( "ogr:geometryProperty" )[ 0 ];
+
+		//for ( var g = 0; g < geomprop.children.length; g++ )
+		{
+			var geom = geomprop.children[ 0 ];
+			var proj = geom.getAttribute( "srsName" );
+
+			if ( proj && proj !== "EPSG:4326" && proj !== this.client.config.map.projection )
+				console.warn( "Unsupported Import Projection:", proj );
+
+			switch ( geom.nodeName )
+			{
+				case "gml:Polygon":
+				{
+					props[ "geometry" ] = this.gmlParsePolygon( geom, proj );
+					break;
+				}
+
+				case "gml:MultiPolygon":
+				{
+					props[ "geometry" ] = this.gmlParseMultiPolygon( geom, proj );
+					break;
+				}
+			}
+		}
+
+		var feature = new ol.Feature( props );
+		features.push( feature );
+	}
 
 	this.addImportedFeatures( features );
 };
 
+netgis.MapOpenLayers.prototype.gmlParsePolygon = function( node, proj )
+{
+	var rings = [];
+	
+	var linearRings = node.getElementsByTagName( "gml:LinearRing" );
+	
+	for ( var r = 0; r < linearRings.length; r++ )
+	{
+		var ring = linearRings[ r ];
+		var coords = ring.getElementsByTagName( "gml:coordinates" )[ 0 ].innerHTML;
+		rings.push( this.gmlParseCoordinates( coords, proj ) );
+	}
+	
+	return new ol.geom.Polygon( rings );
+};
+
+netgis.MapOpenLayers.prototype.gmlParseMultiPolygon = function( node, proj )
+{
+	var polygons = [];
+					
+	var polygonMembers = node.getElementsByTagName( "gml:polygonMember" );
+
+	for ( var p = 0; p < polygonMembers.length; p++ )
+	{
+		var polygonMember = polygonMembers[ p ];
+		var polygonNode = polygonMember.getElementsByTagName( "gml:Polygon" )[ 0 ];
+		polygons.push( this.gmlParsePolygon( polygonNode, proj ) );
+	}
+	
+	return new ol.geom.MultiPolygon( polygons );
+};
+
+netgis.MapOpenLayers.prototype.gmlParseCoordinates = function( s, proj )
+{
+	var coords = s.split( " " );
+						
+	for ( var c = 0; c < coords.length; c++ )
+	{
+		// Split
+		coords[ c ] = coords[ c ].split( "," );
+
+		// Parse
+		for ( var xy = 0; xy < coords[ c ].length; xy++ )
+		{
+			coords[ c ][ xy ] = Number.parseFloat( coords[ c ][ xy ] );
+		}
+		
+		// Transform
+		if ( proj ) coords[ c ] = ol.proj.transform( coords[ c ], proj, this.client.config.map.projection );
+	}
+	
+	return coords;
+};
+
 netgis.MapOpenLayers.prototype.createLayerShapefile = function( title, shapeData )
 {
 	var self = this;
@@ -1307,27 +1452,26 @@ netgis.MapOpenLayers.prototype.createLayerShapefile = function( title, shapeData
 
 netgis.MapOpenLayers.prototype.addImportedFeatures = function( features )
 {
+	// ToDO: Changes in here problematic on initial data loading
 	// Add To Edit Layer
 	this.editEventsSilent = true;
 	this.editLayer.getSource().addFeatures( features );
 	this.editEventsSilent = false;
 	this.updateEditOutput();
 
-	/*
-	// Create New Layer
-	var id = this.importLayerID;
-	this.importLayerID += 1;
-
-	var layer = new ol.layer.Vector( { source: new ol.source.Vector( { features: features } ), zIndex: id } );
-	this.map.addLayer( layer );
-	this.layers[ id ] = layer;
-	this.addSnapLayer( layer );
-
+	// Zoom Imported Features
 	if ( features.length > 0 )
-		this.view.fit( layer.getSource().getExtent(), {} );
+	{
+		var extent = features[ 0 ].getGeometry().getExtent();
 
-	this.client.invoke( netgis.Events.LAYER_CREATED, { id: id, title: title, checked: true, folder: "import" } );
-	*/
+		for ( var f = 1; f < features.length; f++ )
+		{
+			ol.extent.extend( extent, features[ f ].getGeometry().getExtent() );
+		}
+
+		var padding = 40;
+		this.view.fit( extent, { duration: 300, padding: [ padding, padding, padding, padding ] } );
+	}
 };
 
 netgis.MapOpenLayers.prototype.onImportWKT = function( e )
diff --git a/templates/map/client/libs/netgis/Toolbar.css b/templates/map/client/libs/netgis/Toolbar.css
index 84ce61bd..2bcfff4d 100644
--- a/templates/map/client/libs/netgis/Toolbar.css
+++ b/templates/map/client/libs/netgis/Toolbar.css
@@ -17,8 +17,6 @@
 	line-height: 12mm;
 	font-size: 0mm;
 	white-space: nowrap;
-	overflow-x: auto;
-	overflow-y: hidden;
 	z-index: 1;
 	
 	-webkit-transform: none;
@@ -108,12 +106,8 @@
 
 .netgis-toolbar .netgis-search-list
 {
-	position: fixed;
+	position: absolute;
 	min-width: 68mm; /* 60mm + 4mm + 4mm ( input width + padding ) */
-	/*osition: absolute;
-	left: 0mm;
-	min-width: 100%;*/
-	/*height: 5.0em;*/
 	padding: 0mm;
 	margin: 0mm;
 	margin-left: -4mm;