﻿// Funzioni
var initGMaps;
var toggleLayer;
var loadMarker;
var showhideMarker;
var checkUncheckCheckboxes;

// Oggetti
var map;
var layers = [];
var layerControl;
var imageCache;
var gmarkers = [];

(function($){
	var urlBaseMarker;
	
	var IDChecked = [750,763,767,768,769,770,771,772];
	var IDServizi = [747,758,748,746,749,752,751,759,760,761,762,753,757,754,755,756,750];
	var IDPuntiInteresse = [769,770,772,767,768,771];
	
	G_DEFAULT_ICON.iconSize=new GSize(24, 32);
	G_DEFAULT_ICON.iconAnchor=new GPoint(12, 32);
	G_DEFAULT_ICON.infoWindowAnchor=new GPoint(12, 18);

	showhideMarker = function(nID){
		$.each(gmarkers[nID],function(i,v){
			if(v.marker.isHidden()) v.marker.show()
			else v.marker.hide()
		});
	}

	var markerClick = function(nIndex){
		gmarkers[nIndex].marker.openInfoWindowHtml(htmls[nIndex]);
	}
	
	checkUncheckCheckboxes = function(o){
		if($(o).attr('checked')) $(o).parent().parent().find('ul li input').click()
		else $(o).parent().parent().find('ul li input:checked').click()
	}
	  
	var Gmaps_onmove = function() {
		//var sQuery = 'OLat=' + map.getBounds().getSouthWest().lat() + '&ELat=' + map.getBounds().getNorthEast().lat() + '&NLng=' + map.getBounds().getNorthEast().lng() + '&SLng=' + map.getBounds().getSouthWest().lng()  
		if ($('#gmap_info')){
			//$.ajax({type: "GET",url:urlBaseMarker,dataType:"json",data:sQuery,success:loadMarker});
			$('#mbincaricamento').css('display','block');
			$.ajax({type: "GET",url:urlBaseMarker,dataType:"json",success:loadMarker});
			$('#gmap_info').empty();
		}
	}

	var Gmaps_onzoom = function() {
		if ($('#gmap_info')){
			if (map.getZoom() >= 15)
				$('#gmap_info').empty();
			else
				$('#gmap_info').html('A queto livello di zoom non è possibile visulizzare le fermate');
		}
	}
	
	var isChecked = function(id){
		if($.inArray(id,IDChecked) > -1) return true;
		else return false;
	}
	
	var createElementList = function(id,label,imgsrc){
		var html = '';
		
		// Aggiunto la categoria alla lista
		html += '<li id="li-gicon-'+id+'"><div class="contentli">';
		html += '<img src="'+imgsrc+'" /><input type="checkbox" id="chk'+id+'" name="chk'+id+'" '+((isChecked(id)) ? 'checked="checked"' : '')+' onClick="showhideMarker('+id+');$(this).parents(\'li\').find(\'>ul.list\').toggleClass(\'show\')" /><label for="chk'+id+'"><span>'+label+'</span></label></div>';
		
		// Stampo i vari punti per ogni tipologia - Abilitare questo pezzo di codice se si vuole stampare i figli delle tipologie
		/*html += '<ul>';
		$.each(gmarkers[v.id],function(i,v){html += '<li><a href="javascript:markerClick('+v.id+');"><span>'+v.label+'</span></a></li>';});
		html += '</ul>';*/
		
		html += '</li>';
		return html;
	}
		
	loadMarker = function(jsonData){
		if ($('#side_bar_tipologie')){
			var html_servizi = '<label><input type="checkbox" id="chkServizi" name="chkServizi" checked="checked" onClick="checkUncheckCheckboxes(this)"/>Servizi</label><ul>';
			var html_puntiinteresse = '<label><input type="checkbox" id="chkPuntiInteresse" name="chkPuntiInteresse" checked="checked" onClick="checkUncheckCheckboxes(this)"/>Punti di Interesse Turistico</label><ul>';
			var html_altro = '<label><input type="checkbox" id="chkAltro" name="chkAltro" checked="checked" onClick="checkUncheckCheckboxes(this)"/>Altro</label><ul>';
			side_bar_tipologie_html = '<ul id="nav">';
			$.each(jsonData.icontype,function(i,v){
				var idicona = v.id;
				
				// Setto l'icona del punto
				var cGIcon = new GIcon(G_DEFAULT_ICON, v.url) ;
				cGIcon.printImage = v.url;
				cGIcon.mozPrintImage = v.url;
				
				// Setto il punto
				$.each(jsonData.markers,function(i,v){
					if(v.idicona == idicona){
						var marker;
						var point = new GLatLng(v.lat, v.lng);
						
						if(!isChecked(v.idicona))marker = new GMarker(point,{icon:cGIcon,hide:true});
						else marker = new GMarker(point,{icon:cGIcon});
						if(v.html!='') GEvent.addListener(marker, "click", function(){
							// Precaching dell'immagine prima di caricare il palloncino
							var s = v.html.match(/<\s*img[^>]+src\s*=\s*("(.*?)"|'(.*?)')/i);
							var t;
							if(s) t = (s[2]) ? s[2] : s[3];
							if(t){
								// Queste istruzioni servono per mantenere le immagini, sennò il garbage collector di Firefox pensa che siano cose che non servono più
								if(imageCache) imageCache = $('body').append('<div id="img-cache" style="display:none/>').children('#img-cache');
								$('<img/>').attr('src', t).appendTo(imageCache);
							}
							// Istruzione per aprire il palloncino
							marker.openInfoWindowHtml(v.html);
						});
						if(!gmarkers[v.idicona])gmarkers[v.idicona] = [];
						gmarkers[v.idicona].push({marker:marker,id:v.idmarker,html:v.html,label:v.label});
						
						map.addOverlay(marker);
					}
				});
				
				// Categoria Servizi
				if($.inArray(v.id,IDServizi) > -1) html_servizi += createElementList(v.id,v.label,v.url);
				// Categoria Punti di Interesse Turistico
				else if($.inArray(v.id,IDPuntiInteresse) > -1) html_puntiinteresse += createElementList(v.id,v.label,v.url);
				// Altri
				else html_altro += createElementList(v.id,v.label,v.url);
			});
			html_servizi += '</ul>';
			html_puntiinteresse += '</ul>';
			side_bar_tipologie_html += '<li>' + html_servizi + '</li>';
			side_bar_tipologie_html += '<li>' + html_puntiinteresse + '</li>';
			side_bar_tipologie_html += '<li>' + html_altro + '</li>';
			side_bar_tipologie_html += '</ul>';
			$('#side_bar_tipologie').html(side_bar_tipologie_html);
		}
		
		$('#mbincaricamento').css('display','none');
	}

	initGMaps = function(sDivMap,dLat,dLng,dZoom,sUrlBaseMarkers,nIDIcona){
		if (GBrowserIsCompatible()){
			window.unload = GUnload();
			map = new GMap2(document.getElementById(sDivMap)); 
			map.enableScrollWheelZoom();
			map.setCenter(new GLatLng(dLat,dLng),dZoom);
			//GEvent.addListener(map, "moveend", Gmaps_onmove);
			//GEvent.addListener(map, "zoomend", Gmaps_onzoom);
			urlBaseMarker = sUrlBaseMarkers;
			if (sUrlBaseMarkers!=''){
				map.addControl(new GLargeMapControl3D());
				map.addMapType(G_PHYSICAL_MAP);
				map.addMapType(G_SATELLITE_3D_MAP);
				map.addControl(new GScaleControl()); // impongo che i comandi per selezionare la mappa si visualizzino in una tendina
				map.addControl(new GMenuMapTypeControl());
				//Overlay Wikipedia e panoramio
				// ==== The "More..." control simply accepts a mouseover to reveal the "Layer" control ===
				var MoreControl = function(){}
				MoreControl.prototype = new GControl();
				MoreControl.prototype.initialize = function(map){
					var container = document.createElement("div");
					container.style.border = "1px solid #000000";
					container.style.padding = "1px";
					container.style.fontSize = "12px";
					container.style.fontFamily = "Arial, sans-serif";
					container.style.width="90px";
					container.style.backgroundColor = "#ffffff";
					container.style.textAlign = "center";
					container.innerHTML = "Altro...";
					map.getContainer().appendChild(container);
					GEvent.addDomListener(container, "mouseover", function() {
					  map.addControl(layerControl);
					});
					return container;
				}
				MoreControl.prototype.getDefaultPosition = function() {
					return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(98, 7));
				}
	  
				// ==== The "Layer" control displays the "More..." plus the checkboxes ====
				// ==== The checkbox info is passed in the "opts" parameter ====

				var LayerControl = function(opts){this.opts = opts;}
				LayerControl.prototype = new GControl();
				LayerControl.prototype.initialize = function(map){
					var container = document.createElement("div");
					container.style.border = "1px solid #000000";
					container.style.padding = "1px";
					container.style.fontSize = "12px";
					container.style.fontFamily = "Arial, sans-serif";
					container.style.width="90px";
					container.style.backgroundColor = "#ffffff";
					container.innerHTML = '<center><b>Altro...<\/b><\/center>';
					for (var i=0; i<this.opts.length; i++) {
						var c = '';
						if(layers[i].Visible) c = 'checked';
						container.innerHTML += '<input type="checkbox" onclick="toggleLayer('+i+')" ' +c+ ' /> '+this.opts[i]+'<br>';
					}
					map.getContainer().appendChild(container);
					// === This doesn't do what I want. It kills the control if I mouseover a checkbox ===
					// === If you know how to do this better, let me know ===

					//GEvent.addDomListener(container, "mouseout", function() {
					//  map.removeControl(layerControl);
					//});
			
					setTimeout("map.removeControl(layerControl)",5000);
			
					return container;
				}
				LayerControl.prototype.getDefaultPosition = function(){return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(98, 7));}

				// ==== toggleLayer adds and removes the layers ====
				toggleLayer = function(i) {
					if (layers[i].Visible) layers[i].hide();
					else{
						if(layers[i].Added) layers[i].show();
						else{
							map.addOverlay(layers[i]);
							layers[i].Added = true;
						}
					}
					layers[i].Visible = !layers[i].Visible;
				}
				//Fine Overlay Wikipedia e Panoramio
				//Attivo il controllo per wikipedia e panoramio

				// ==== Create the GLayer()s, and set them  Visible=false Added=false ====
				// If you want a GLayer open by default, addOverlay() it and set it  Visible=true Added=true
								
				layers[0] = new GLayer("com.panoramio.all");
				layers[0].Visible = false;
				layers[0].Added = false;

				layers[1] = new GLayer("com.youtube.all");
				layers[1].Visible = false;
				layers[1].Added = false;
				   
				layers[2] = new GLayer("org.wikipedia.it");
				layers[2].Visible = false;
				layers[2].Added = false;

				layers[3] = new GLayer("com.google.webcams");
				layers[3].Visible = false;
				layers[3].Added = false;
				
				// layers[3] = new GLayer("com.panoramio.popular");
				// map.addOverlay(layers[3]);  // This one open by default
				// layers[3].Visible = true;
				// layers[3].Added = true;
			  
				// === Create the layerControl, but don't addControl() it ===
				// = Pass it an array of names for the checkboxes =
				layerControl = new LayerControl(["Foto", "Video", "Wikipedia", "Webcam"]);

				// === Create the MoreControl(), and do addControl() it ===
				map.addControl(new MoreControl());

				//fine comandi per attivazione controllo wikipedia e panoramio
				Gmaps_onmove()
			}
			else{
				map.addControl(new GSmallZoomControl3D());
				var cGIcon = 	new GIcon(G_DEFAULT_ICON, nIDIcona ) ;
				cGIcon.printImage =  nIDIcona ;
				cGIcon.mozPrintImage =  nIDIcona ;
				marker = new GMarker(new GLatLng(dLat,dLng),{icon:cGIcon});
				map.addOverlay(marker);
			}
		}
		else alert("Sorry, the Google Maps API is not compatible with this browser");
	}
})(jQuery);
