Widget:Ol10EditLocationMap

<includeonly>

	<link rel="stylesheet" href="/scripts/ol-10/ol.css" type="text/css">
	<script src="/scripts/ol-10/ol.js"></script>
	
	<link rel="stylesheet" href="/scripts/ol-ext-10/dist/ol-ext.min.css" type="text/css">
	<script src="/scripts/ol-ext-10/dist/ol-ext.min.js"></script>

	<script src="/scripts/proj4js/dist/proj4.js"></script>

	<script src="/scripts/jwol10js/jwol10.js"></script>

	<script type="text/javascript">
	
		//global memory for widget instance			
		var <!--{$id|default:CommonObsMap|escape:'html'}-->_memo =  { 'SitesO': {}, 'TypesO': {}, 'obsTypeToShow': '' };

		function <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() {
	if ( typeof window.jQuery == 'undefined' ) {
    		setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);
  	} else {
  		<!--{$id|default:CommonObsMap|escape:'html'}-->_func();
  	}
}
setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);

		function <!--{$id|default:CommonObsMap|escape:'html'}-->_func() {
		
			//widget globals
			var memo = <!--{$id|default:CommonObsMap|escape:'html'}-->_memo;
			memo.g = { 'sizeFactor': 1.5, 'lang': '<!--{$lang|default:fi|escape:'html'}-->' };

			var lang = '<!--{$lang|default:fi|escape:'html'}-->';
			var orgHeight = <!--{$height|default:500|escape:'html'}-->;
			var mapId = '<!--{$id|default:geocodemapdiv|escape:'html'}-->';
			var lon = <!--{$lon|default:25.15|escape:'html'}-->;
			var lat = <!--{$lat|default:65.36|escape:'html'}-->;
			var base = '<!--{$base|default:mmlTausta|escape:'html'}-->';
			var zoom = <!--{$zoom|default:5|escape:'html'}-->;
			var locate = <!--{$locate|default:0|escape:'html'}-->;
			var tools = '<!--{$tools|default:drag_0point_polygon_edit|escape:'html'}-->';
			var toolsArr = tools.split('_');
			var zoomTo = '<!--{$zoomTo|default:current|escape:'html'}-->';
			
			var lonF = jQuery('.jwLon').first().val().replace(',', ',');
			var latF = jQuery('.jwLat').first().val().replace(',', ',');
			var zoomF = jQuery('.jwZoom').first().val();
			var baseF = jQuery('.jwBase').first().val();
			var parent = jQuery('.jwParent').first().val().split(' ').join('_');
			var sitename = jQuery('.jwName').first().val();
			
			var edit = (!!sitename);
			
			var layersArr = []; 
			memo.annotateLrs = [];

			//annotate muni
			layersArr.push( { 
				'id': 'muni', 
				'type': 'anyrest', 
				'restUrl': '//paikkatieto.ymparisto.fi/arcgis/rest/services/sykemaps/GISAineistot2/MapServer/0/query', 
				'search': "KuntaNro LIKE '%'", 
				'name': 'Kunnat', 
				'maxResolution': 100, 
				'zoomTo': false, 
				'fillColor': 'rgba(255, 255, 255, 0)', 
				'strokeColor': 'rgba(50, 50, 50, 0.1)', 
				'strokeWidth': 4, 
				'annotateField': 'KuntaNimi', 
				'annotateTag': 'KuntaNimi', 
				'annotateDistance': 0,
				'displayInLayerSwitcher': false
			});
			memo.annotateLrs.push(layersArr[layersArr.length-1]); 

			function drawMap() {	
			
				// do the base map with these settings
				if (!!zoomF) { zoom = zoomF; }
				if (!!baseF) { base = baseF; }
					
				var map = ol3_jwMakeMap({ 
					'container': '<!--{$id|default:CommonObsMap|escape:'html'}-->_container', 
					'base': base, 
					'lon':  lon, 
					'lat': lat, 
					'zoom': zoom, 
					'layers': layersArr,
					'geolocation': true,
					'memo': memo
				});
	/*			
				var geocoderCtrl = new Geocoder('nominatim', {
					provider: 'osm', //'photon', //'osm', //'mapquest',
					//key: '__some_key__',
					lang: 'fi-FI', //en-US, fr-FR
					placeholder: 'Kirjoita osoite ...',
					targetType: 'glass-button', //'text-input',
					//featureStyle: iconStyle,  
					limit: 5,
					countrycodes: 'fi', 
					autoComplete: true,
					autoCompleteMinLength: 2,
					keepOpen: false,
					preventDefault: true 
				});
*/
				//map.addControl(geocoderCtrl);
/*
				geocoderCtrl.on('addresschosen', function(evt){

					//var feature = evt.feature,
					coord = evt.coordinate,
					address = evt.address,
					city = evt.address.details.city;
					if (typeof city == 'undefined') { city = evt.address.details.name; }

					map.setView(new ol.View({ center: coord, zoom: 16 }));
				});
*/								
				targetCtrl = new ol.control.Target();
				map.addControl(targetCtrl);					

				var infoBar = new ol.control.Bar();
				var fieldEl = document.createElement('div');
				fieldEl.id = 'jwMapInfoContainer'
				var fieldCtrl = new ol.control.Control({ element: fieldEl });
				infoBar.addControl(fieldCtrl);
				map.addControl(infoBar);
				infoBar.setPosition('bottom-left');
				jQuery('#jwMapInfoContainer').html('<div class="jwMapInfoText">Zoomaa l&auml;hemm&auml;s ja siirr&auml; karttaa niin, ett&auml; risti osoittaa tarkoittamaasi paikkaan</div>');
				
				//console.log(memo);
				
				map.getLayers().forEach(function(layer) {
					if(layer instanceof ol.layer.Group) {
        					layer.getLayers().forEach(function(groupLayer) {
        												
							groupLayer.on('change:visible', function() {
				
								if (groupLayer.get('visible')) {
								
									title = groupLayer.get('title');
									
									if (title == 'MML Taustakartta') {
										jQuery('.jwBase').first().val('mmlTausta');
									} else if (title == 'MML Ortokuva') {
										jQuery('.jwBase').first().val('mmlOrto');
									} else if (title == 'MML Maastokartta') {
										jQuery('.jwBase').first().val('mmlMaasto');
									} else {
										jQuery('.jwBase').first().val('osm');
									}
								
								}
				
							});
							
						});
					}
				});

				function doAnnotating() {

					var resolution = (map.getView().getResolution());

					memo.annotateTags = [];
					memo.chosenCoords = null;

					jQuery('.jwLon').first().val('');
					jQuery('.jwLat').first().val('');
					jQuery('.jwCoords').first().val('');										
					jQuery('.jwZoom').first().val('');
					//jQuery('.jwBase').first().val('');					
					jQuery('.jwWKT').first().val('');										
					jQuery('.jwMuni').first().val('');										
					jQuery('.jwAreaVal').first().val('');										
					jQuery('.jwAreaUnit').first().val('');										
	
					if (resolution < 50) {
					
						var coord = map.getView().getCenter();
						var lonlat = ol.proj.transform(coord, 'EPSG:3857', 'EPSG:4326');
						var lon = Math.round(lonlat[0]*10000)/10000;
						var lat = Math.round(lonlat[1]*10000)/10000;
						memo.chosenCoords = lonlat;
						
						jQuery('.jwLon').first().val(lonlat[0].toString().replace('.', ','));
						jQuery('.jwLat').first().val(lonlat[1].toString().replace('.', ','));
						jQuery('.jwCoords').first().val(lonlat[1] + ', ' + lonlat[0]);
						jQuery('.jwZoom').first().val(map.getView().getZoom());
						

						output = '<div class="jwMapInfoText">Valittu sijainti:&nbsp;</div>';
						output += '<div class="jwMapInfoTag">' + lat + '&deg;, ' + lon + '&deg;</div>';						

						for (var l in memo.annotateLrs) {

							var tolerance = memo.annotateLrs[l].annotateDistance * 1/resolution;

							map.forEachFeatureAtPixel(map.getPixelFromCoordinate(coord), 

								function(feature, layer) {

									tag = feature.get(memo.annotateLrs[l].annotateField);
									output += '<div class="jwMapInfoTag">' + tag + '</div>';

									memo.annotateTags.push('#_' + memo.annotateLrs[l].annotateTag + '_' + feature.get(memo.annotateLrs[l].annotateTag));
									
									if (memo.annotateLrs[l].id == 'muni') {
									
										var jwMuniName = '';
										switch (feature.get(memo.annotateLrs[l].annotateTag)) {
											case 'Alajärvi':
											case 'Evijärvi':
											case 'Haapajärvi':
											case 'Hartola':											
											case 'Heinävesi':
											case 'Jalasjärvi':
											case 'Jämijärvi':
											case 'Järvenpää':											
											case 'Karvia':						
											case 'Kaustinen':
											case 'Keitele':
											case 'Kemijärvi':											
											case 'Kiuruvesi':											
											case 'Kivijärvi':											
											case 'Kokkola':											
											case 'Konnevesi':											
											case 'Kyyjärvi':											
											case 'Lapinjärvi':											
											case 'Lappajärvi':											
											case 'Lestijärvi':											
											case 'Merijärvi':											
											case 'Nurmijärvi':											
											case 'Orivesi':											
											case 'Petäjävesi':																						
											case 'Pielavesi':																						
											case 'Polvijärvi':																						
											case 'Pudasjärvi':																						
											case 'Pyhäjärvi':																																	
											case 'Rautalampi':																						
											case 'Rautjärvi':																						
											case 'Reisjärvi':																						
											case 'Ristijärvi':																						
											case 'Ruokolahti':																																	
											case 'Ruovesi':																																	
											case 'Saarijärvi':
											case 'Siilinjärvi':																																	
											case 'Sonkajärvi':																						
											case 'Sulkava':																						
											case 'Sysmä':																						
											case 'Tervo':																																	
											case 'Tohmajärvi':																																	
											case 'Uurainen':																						
											case 'Vehmaa':																						
											case 'Virolahti':																																																																		
												jwMuniName = feature.get(memo.annotateLrs[l].annotateTag) + ' (kunta)';											
												break;											
											default:
												jwMuniName = feature.get(memo.annotateLrs[l].annotateTag);																				
										}
										jQuery('.jwMuni').first().val(jwMuniName);
										
									}

								}, { layerFilter: function(layer) { return layer === memo.annotateLrs[l].layer; }, hitTolerance: tolerance }
							);
						}

						jQuery('#jwMapInfoContainer').html( output );				

					} else {

						jQuery('#jwMapInfoContainer').html('<div class="jwMapInfoText">Zoomaa l&auml;hemm&auml;s ja siirr&auml; karttaa niin, ett&auml; risti osoittaa tarkoittamaasi paikkaan</div>');

					}
				}

				jQuery( document ).on( 'citobso311_allLoadingDoneForNow', function() {

					doAnnotating();		

				});
				
				map.on( 'click', function(e) {

					memo.popup.show(e.coordinate, '<b>Kartan käyttöliittymä<br />on muuttunut!</b><br /><br />Jatkossa sijainti valitaan<br /><i><b>vetämällä taustakarttaa</b></i>,<br />kunnes keskikohdan risti<br />osoittaa oikeaan paikkaan.');

				});

				map.on( 'movestart', function(e) {

					memo.popup.hide();

				});				


				map.on( 'moveend', function(e) {

					doAnnotating();					

				});
				
				map.getLayers().item(0).on('change', function(){
    					doAnnotating();	
				});			
				
			}
			
			
			if (!!lonF && !!latF) {
			
				//lon = lonF;
				//lat = latF;

				layersArr.push({ 
					'type': 'jwanypage', 
					'name': 'Paikan vanha sijainti', 
					'search': "[[" + decodeURI(parent + '/' + sitename) + "]]", 
					'opacitySlider': false,
					'selectable': false,
					'label': '+',
					'strokeColor': 'rgba(255, 100, 100, 0.75)',
					'fillColor': 'rgba(255, 255, 255, 0.5)',
					'zoomToExtent': true,
					'maxZoom': zoomF
				});
				
				//layersArr.push({ 'type': 'geoloc', 'name': 'Sijaintisi', 'show': true, 'center': false, 'zoom': 12, 'track': false });
				
				//drawMap();
			
			} 
			
			if (!!parent) {

				function gotCoords(request) {
				
					console.log(request);
				
					if (typeof request.query.results != 'undefined') {

						for (p in request.query.results) {

							printouts = request.query.results[p].printouts;

							var isLake = false;
							var isSea = false;
							var isShed = false;
							var isBasin = false;

							for (c in printouts["Luokka"]) {
												
								if (printouts["Luokka"][c].fulltext == "Luokka:Järvi") {
									isLake = true;
								} else if (printouts["Luokka"][c].fulltext == "Luokka:Merialue") {
									isSea = true;
								} else if (printouts["Luokka"][c].fulltext == "Luokka:Suomen merialue") {
									isSea = true;
								} else if (printouts["Luokka"][c].fulltext == "Luokka:Itämeren alue") {
									isSea = true;
								} else if (printouts["Luokka"][c].fulltext == "Luokka:Vesistöalue") {
									isShed = true;
								} else if (printouts["Luokka"][c].fulltext == "Luokka:Päävesistö") {
									isBasin = true;
								}
							}
							
							if (isLake ) {
							
								layersArr.push({ 
									'type': 'lake', 
									'name': 'Järvi', 
									'search': "JarviTunnus = '" + printouts.Jarvinumero[0] + "'", 
									'visible': true,
									'opacitySlider': true,
									'showLabels': false,
									'selectable': false,
									'zoomToExtent': !edit
								});							

								
							} else if (isSea && printouts.VPDTunnus.length > 0) {

								layersArr.push({ 
									'type': 'seabody', 
									'name': 'Merialue', 
									'search': "VPDTunnus = '" + printouts.VPDTunnus[0] + "'", 
									'visible': true,
									'opacitySlider': true,
									'showLabels': false,
									'selectable': false,
									'zoomToExtent': !edit
								});	
				
							} else if (isShed) {

								layersArr.push({ 
									'type': 'drainage', 
									'name': 'Vesistöalue', 
									'search': "Jako3Tunnus = '" + printouts.Vesistoaluenumero[0] + "'", 
									'visible': true,
									'opacitySlider': true,
									'showLabels': false,
									'selectable': false,
									'zoomToExtent': !edit
								});							
							
							}

							break;							
						}
					}
					
					layersArr.push({ 
						'type': 'sitesNobses', 
						'name': 'Nykyiset paikat', 						
						'siteSearch': "[[Alue::" + parent + "]]", 
						'obsSearch': '', //"[[Alue::" + parent + "]]", 
						'obsTypeBar': false,
						'visible': true,
						'opacitySlider': true,
						'showLabels': false,
						'selectable': true,
						'zoomToExtent': false
					});						


					//layersArr.push({ 'type': 'geoloc', 'name': 'Sijaintisi', 'show': true, 'center': false, 'zoom': 12, 'track': false });
					
					drawMap();

				}
				
				var searchStr = 'action=ask&query=[[' + parent + ']]';
				searchStr += '|?KoordPohj|?KoordIta|?Zoom|?Base|?Vesistö=Vesisto|?Järvinumero=Jarvinumero|?Vesistöaluenumero=Vesistoaluenumero|?VPDTunnus|?Luokka';
				searchStr += '&format=json';

				jQuery.ajax({
					type: 'GET',
					url: queryApi,
					data: searchStr,
					success: gotCoords,
					dataType: 'jsonp',
					cache: true
				});			
			
			} else {
			
				//layersArr.push({ 'type': 'geoloc', 'name': 'Sijaintisi', 'show': true, 'center': true, 'zoom': 12, 'track': false });
				
				drawMap();
				
			}
			
		}
	</script>
</includeonly>