//variables globales
var geocoder; // un objeto GClientGeocoder 
var map; //mapa
var mgr; //manager de puntos
var datos; //datos de las galerias visibles
var lista; //lista con los puntos del mapa, nos permite lanzar el evento de globo al pulsar en la lista
var id_lista; //necesito esta lista para asociar el id de la galeria con el indice del punto en la lista

//-- funcion que se carga al terminar de cargar la pagina ---
$(document).ready(function(){
	
   var api='ABQIAAAAxBNFUUVCwjBDN2eG2nt7IhQOg6XXtQJBEFsoqXt9hV1-o-0LqhRkLRxPNwWayyT3ISiY8npetVQI4Q';
   $.getScript('http://maps.google.com/maps?file=api&v=2.x&key='+api+'&async=2&callback=cargarManagerPuntos');
   
});

//-- funcion que carga al manager de puntos y acto seguido carga al mapa ---
function cargarManagerPuntos()
{
	$.getScript('http://gmaps-utility-library.googlecode.com/svn/trunk/markermanager/release/src/markermanager.js',cargarMapa);
}

//-- funcion que carga el mapa ---
function cargarMapa(){
	  
      map = new GMap2(document.getElementById("mapa"));
      map.setCenter(new GLatLng(40.4167413, -3.7032498),6);
	  map.addControl(new GLargeMapControl());

   //iniciamos los listeners
   	  listenersMapa();

   //iniciamos utilidades de googleMaps   
      geocoder = new GClientGeocoder(); //creamos un objeto GClientGeocoder 
      var mgrOptions = { borderPadding: 200, maxZoom: 15, trackMarkers: false };
	  mgr = new MarkerManager(map,mgrOptions);
   
   	  icono = crearIcono();
   
   //creamos puntos;
	  $.getJSON("/galeria/mapaRequest", cargarPuntosAjax);		
}

//-- funcion que activa los diferentes listeners ---
function listenersMapa()
{
   	GEvent.addListener(map, "moveend", cargarGalerias);
	GEvent.addListener(map, "zoomend", cargarGalerias); 	
}

//-- funcion que calcula las galerias que se ven en el mapa ---
function cargarGalerias()
{
	var coordenadas = map.getBounds();
	
	var p1=coordenadas.getSouthWest();
	var p2=coordenadas.getNorthEast();
	var dir = "/galeria/mapaRequest";	
	
	$.getJSON(dir,{p1x:p1.lng(),p1y:p1.lat(),p2x:p2.lng(),p2y:p2.lat()}, refrescarListaGalerias);
}

//-- funcion que refresca las galerias que se ven en el mapa ---
function refrescarListaGalerias(datosDevueltos)
{
	datos = datosDevueltos;
	
	var divLista = document.getElementById('listaGalerias');
	document.getElementById('listaGalerias').innerHTML = "";
	
	for(var i=0; i < datos.length; i++)
		{
			var html = '<div class="divGaleria"><span class="spanNombreGaleria" onClick="verGaleria('+i+','+datos[i].id+')" >'+datos[i].nombre+'</span>&nbsp;<span class="spanCiudadGaleria" onClick="verGaleria('+i+')" >'+datos[i].ciudad+'</span></div>';
			divLista.innerHTML +=  html;
		}
		
	// Permite sacar el scrollbar personalizado!
	$('#listaGalerias').jScrollPane({scrollbarWidth:3});
}

//-- funcion que recoje los datos enviados por ajax, los parsea y escribe los nuevos puntos ---
function cargarPuntosAjax(datosDevueltos)
{
	datos = datosDevueltos;
	lista=[];
	id_lista=[];
  	var icono = crearIcono("/images/ico_galeria.gif");

	for(var i=0; i < datos.length; i++)
		{
			$('.imgGaleria')[0].src = "/uploads/images/user/thumb/"+datos[i].avatar;
			$('.spanNombreGaleria')[0].innerHTML = datos[i].nombre;
			$('.spanNombreGaleria')[0].href = datos[i].link;
			$('.spanDireccionGaleria')[0].innerHTML = datos[i].direccion;
			$('.aVerMas')[0].href = datos[i].link;
			$('.aImgGaleria')[0].href = datos[i].link;
			
			var html = document.createElement('div');
			html.innerHTML = $('.htmlPuntoMapa')[0].innerHTML;
			
			var cordenadas = new GLatLng(datos[i].lat,datos[i].lng);
			var punto = crearPunto(cordenadas,html,icono);
			lista.push(punto);
			id_lista[datos[i].id]=i;	
		}
		
	ponerPuntos(lista,1);
	cargarGalerias();
}

//-- funcion que apartir de una lista de puntos, los crea para un zoom X ---
function ponerPuntos(lista,zoom)
	{
		  mgr.addMarkers(lista,zoom);
		  mgr.refresh();
	}


//-- funcion que centra el mapa en un lugar
function buscarLugar()
{
	centrarMapa($('#lugar')[0].value,10);	
}

//-- lanzar el click de un punto
function asociarClick(id) {
		var punto = lista[id_lista[id]];
        GEvent.trigger(punto, "click");
     }

//-- funcion que muestra informacion de una galeria, --deprecated--
function verGaleria(i,id){
	
	
	if (map.getZoom() < 10) {
		
		centrarMapaPosicion(datos[i].lat, datos[i].lng, 10);
		setTimeout("asociarClick(" + id + ")", 500);
	
	}
	else {
	
		asociarClick(id);
		
	}
	/*
	 var galeria = $('#infoGaleria');
	 galeria.show();
	 $('.aWeb')[0].innerHTML = datos[id].web;
	 $('.imgGaleria')[0].src = "/uploads/images/gallery/normal/_"+datos[id].avatar;
	 */
}
