var map=null;
  var bounds=null;
  var geocoder=null;
  var zindex = 1; 
  var Icon=null;
  var lugar_original=""; 
  var lugar_devuelto_recargaJS="";  
  //Funcion principal. Carga el mapa y los pinchos y todo según lo que haya en los arrays.
  function loadMapa() {    	
    if (GBrowserIsCompatible()) {
      map = new GMap2(document.getElementById('map_canvas'));
      geocoder = new GClientGeocoder();    
       Icon = new GIcon(G_DEFAULT_ICON);
       Icon.shadow = "http://maps.google.com/intl/es_ALL/mapfiles/shadow50.png";
	Icon.iconSize = new GSize(20, 34);    //Tamaños de los pinchos y cosas...
	Icon.shadowSize = new GSize(37, 34);
	Icon.iconAnchor = new GPoint(9, 34);
	Icon.infoWindowAnchor = new GPoint(9, 2);
	Icon.infoShadowAnchor = new GPoint(18, 25);
      map.addControl(new GSmallMapControl(),new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(7, 145)));
      map.addControl(new GMenuMapTypeControl());  //Este es el control de tipo de mapa (satelite,relieve,mapa...)
      //map.addControl(new GScaleControl());   //para mostrar la escala en el mapa
      map.enableScrollWheelZoom();       //Este es el control del zoom
      //Pone los pinchos segun array
      putPoints();
     }
    }
    function putPoints(){
	    bounds = new GLatLngBounds();   
	    bounds.extend(new GLatLng(init_lat,init_long));
	    var greenIcon = new GIcon(G_DEFAULT_ICON);
	    greenIcon.image = "http://maps.google.com/mapfiles/ms/micons/grn-pushpin.png";
	    greenIcon.shadow = "http://maps.google.com/mapfiles/ms/micons/pushpin_shadow.png";
	    // cosas raras del api:
	    markerOptions = { icon:greenIcon, zIndexProcess:get_zIndex };
	    var marker = new GMarker(new GLatLng(init_lat,init_long), markerOptions);
	    //Al pincho verde le añadimos texto explicativo
	    html_partida="La búsqueda se realiza desde este punto:<br/>";
	    if (lugar_devuelto_recargaJS){ //Ya hemos pedido a google que nos de la dirección del punto. no hace falta de nuevo llamar.
		    html_partida+=lugar_devuelto_recargaJS;
		    GEvent.addListener(marker, "click", function() {
		    marker.openInfoWindowHtml(html_partida);})
		    map.addOverlay(marker);
	    }else{  //pedir la dirección de partida
		    geocoder.getLocations(
		    	new GLatLng(init_lat,init_long), 
			function(response){
				if (response && response.Status.code == 200) {
					addr = response.Placemark[0].address;
					addr = addr.replace(", España","");
					html_partida+=addr;
				}else{
					html_partida = html_partida.replace(":","");
				}
				GEvent.addListener(marker, "click", function() {
				marker.openInfoWindowHtml(html_partida);})
				map.addOverlay(marker);
			});
	    }  
	    //Poner los pinchos de los negocios
	    for (var i=0; i< arrVals.length; i++) { //Recorrer los array formando los puntos
		    if (i < 3){
			    bounds.extend(new GLatLng(arrVals[i].lat,arrVals[i].long)); //añade el punto al bound para lo de calcular el centro
		    }
		    set_zIndex(i+3);  //cada punto en un zindex para que si se pisan sea en el orden que me conviene (quiza se puede cambiar para que lo haga en orden inverso)
		    var gmarker = createMarker(new GLatLng(arrVals[i].lat,arrVals[i].long), i+1, getHTMLmap(i));  //crear el objeto "punto". La funcion createMarker está abajo, devuelve un objeto de la clase GMarker
		    map.addOverlay(gmarker);  //Lo pintamos en el mapa
	    }
	    map.setCenter(bounds.getCenter());  //Una vez pintados centramos el mapa
	    map.setZoom(map.getBoundsZoomLevel(bounds)); //Y aplicamos el zoom conveniente
	    showRefreshOption=true;
    }
    function changePoints(){
	    map.clearOverlays();
	    putPoints();
    }
    function set_zIndex(value) {
    	zindex = value;
    }
    function get_zIndex() {
    	return zindex;
    }   
    function createMarker(point, index, html_str) {
  		// Crear la imagen para el punto
		var numberIcon = new GIcon(Icon);
		var letter = String.fromCharCode("A".charCodeAt(0) + index-1);

		numberIcon.image = "http://maps.google.com/intl/es_ALL/mapfiles/marker"+letter+".png"; 
		// cosas raras del api:
		markerOptions = { icon:numberIcon, zIndexProcess:get_zIndex };
		var marker = new GMarker(point, markerOptions);
		// Lo metemos en el array de markers
		arr_marker[letter]=marker;
		//En el punto, cuando se haga click abrir el html
		if (html_str != ""){
		  GEvent.addListener(marker, "click", function() {
		    marker.openInfoWindowHtml(html_str);
		  });
		  // metemos el html en el array apropiado
		  arr_html[letter]=html_str;
		}
  		return marker;
	}	
	// funcion para abrir capas
	function openHtml(letra) {
		map.closeInfoWindow();
		/*alert(arr_marker[letra]);*/
		/*num_marker = arr_marker.length - num - 1;*/
		if (arr_marker[letra].isHidden()){
			map.addOverlay(arr_marker[letra]);
			arr_marker[letra].openInfoWindowHtml(arr_html[letra]);
		}
		else {
			arr_marker[letra].openInfoWindowHtml(arr_html[letra]);
		}
		return true;
	}
var showRefreshOption=true;
//Dada una posición del array, devuelve el HTML a mostrar en resultados (No mapa)
function getHTMLresult(i){

	var content='<div id="negocio_'+arrVals[i].id+'" class="negocio">'+
				'<div id="pincho_negocio_'+arrVals[i].id+'" class="capa_pincho_negocio" onclick="openHtml(\''+arrVals[i].letra+'\')">'+
					'<img src="'+arrVals[i].pincho+'"/>'+
				'</div>'+
				'<div id="texto_negocio_'+arrVals[i].id+'" class="texto_negocio">'+	
				'<span><a href="'+arrVals[i].url+'"> '+arrVals[i].nombre+' </a></span>'+
				'<span class ="telefono">'+arrVals[i].tlf+'</span>'+
				'<span class ="direccion">'+arrVals[i].dir+'<span class="distancia">'+arrVals[i].distancia+'</span></span>';
		
	if (arrVals[i].numc > 0){
		content+='<span class="valoracion">'+
			   '<img alt="valoración" src="/images/'+arrVals[i].vfimg+'.png" >'+
			   '<span class="numerocomentarios"> '+arrVals[i].numc+' opiniones</span>'+
			 '</span>';
	}
	content+='</div></div>';
	return content;
}
//Dada una posicion del array devuelve el HTML para la capita del pincho del mapa
function getHTMLmap(i){
	html= '<div><span><a href="'+arrVals[i].url+'">'+arrVals[i].nombre+'</a></span><br/>'+
		'<span class ="telefono">'+arrVals[i].tlf+'</span><br/>'+
		'<span class ="direccion">'+arrVals[i].dir+'</span><br/>';
		if (arrVals[i].numc > 0){
		
		html=html+'<span class="valoracion">'+
			   '<img alt="valoración" src="/images/'+arrVals[i].vfimg+'.png" >'+
			   '<span class="numerocomentarios"> '+arrVals[i].numc+' opiniones</span>'+
			 '</span>';
		}		
		if (arrVals[i].video_id){
			html+='<div class="video_map">'+
			         '<a href="'+arrVals[i].url+'video_'+arrVals[i].video_id+'/" title="video"><img  src="'+arrVals[i].video_thumbnail+'" alt="video"></a>' +
			         '</div>';
		}		
		html=html+'</div>';		
	return html;
}
//Desaparecen los resultados y los vuelve a mostrar según el array
function changeResults(){
	$('#sup_resultados_busqueda').css('height',1000);
	$('#resultados_busqueda').fadeOut('slow', function(){
		$('#resultados_busqueda').html(null);
		if (arrVals.length > 0){ //Si hay resultados
		  for (var i = 0, l = arrVals.length; i < l; i++) {
			$('#resultados_busqueda').append(getHTMLresult(i));
		  }
		  $('#ordenar_busqueda').fadeIn('slow');
		}else{ //No hay resultados
			$('#ordenar_busqueda').fadeOut('slow');
			$('#resultados_busqueda').html('Lo sentimos, no hay resultados cercanos para tu búsqueda');
		}
		$('#resultados_busqueda').fadeIn('slow',
			function (){$('#sup_resultados_busqueda').css('height',$('#resultados_busqueda').height())}
		);
	}
	);
	return false;
}
//Ordenar el array de resultados según nombre o valor (u otros en su caso)
var actOrderVal="desc";
var actOrderNombre="asc";
var actOrderDis="asc";
function ordenar(tipo){
    
    switch(tipo){
	    case 'nombre':
	    if (actOrderNombre=="asc"){
		    arrVals.sort(function(a, b){
			    if (a.nombre < b.nombre){return -1}else{return 1}
			    
		    });
		    actOrderNombre="desc";
	    }else{
		    arrVals.sort(function(a, b){
			    if (a.nombre > b.nombre){return -1}else{return 1}
		    });
		    actOrderNombre="asc";
	    }
	    break;
	    case 'val':
	    if (actOrderVal=="asc"){
		    arrVals.sort(function(a, b){
			    return a.val - b.val;
		    });
		    actOrderVal="desc";
	    }else{
		    arrVals.sort(function(a, b){
			    return b.val - a.val;
		    });
		    actOrderVal="asc";
	    }
		break;
		
		case 'dis':
	    if (actOrderDis=="asc"){
		    arrVals.sort(function(a, b){
			    return a.dis - b.dis;
		    });
		    actOrderDis="desc";
	    }else{
		    arrVals.sort(function(a, b){
			    return b.dis - a.dis;
		    });
		    actOrderDis="asc";
	    }
		break;
    }
    return false;
}
function getResultsByCoords(long,lat){
	init_long=long;
	init_lat=lat;
	showRefreshOption=false;
	//var lat = map.getCenter().lat();
	//var long = map.getCenter().lng();
	var categoria=$('#categoria').val();
	var mutua=$('#mutua').val();
	//$("#recarga_resultados").html("cargando...");
	$.getJSON("/negocios/refresh/categoria/"+categoria+"/mutua/"+mutua+"/long/"+long+"/lat/"+lat,
        	function(data){
			//cargo los nuevos resultados en el array
			arrVals=data.items;
			//Cambio si viene link de "ampliar resultados"
			$('#amp_busqueda').fadeOut('slow');
			if (data.lnk_ampliar){
				
				$('#amp_busqueda').html('<a href="'+ data.lnk_ampliar+'&lugar='+lugar_original+'" rel="nofollow">Ampliar el radio de búsqueda a más de 60km</a>');
				$('#amp_busqueda').fadeIn('slow');
			}else{
				$('#amp_busqueda').fadeOut('slow');
				$('#amp_busqueda').html("");
			}
			changeResults();
			changePoints();
			$("#botonbuscar").val("Buscar");		
		});
	return false;
}
$(document).ready(
		function (){
 // funcion de ordenacion en el link de ordenar por nombre  
  $('a#lnk_ordenar_nombre').click(function() {
    ordenar('nombre');
    changeResults();
    return false;
  });  
  // funcion de ordenacion en el link de ordenar por valoracion  
  $('a#lnk_ordenar_valoracion').click(function() {
    ordenar('val');
    changeResults();
    return false;
  }); 
  // funcion de ordenacion en el link de ordenar por valoracion  
  $('a#lnk_ordenar_distancia').click(function() {
    ordenar('dis');
    changeResults();
    return false;
  });  
  //A la capa de "recargar" le asociamos su acción (Recargar resultados por ajax)
  $('#texto-recarga').click(function() {
    //Buscar si hay alguna direccion que coincida con ese punto
    geocoder.getLocations(
    	new GLatLng(map.getCenter().lat(),map.getCenter().lng()), 
	function(response){
		if (response && response.Status.code == 200) {
			addr = response.Placemark[0].address;
			addr = addr.replace(", España","");
			lugar_devuelto_recargaJS=addr;
		}else{
			addr = $("#lugar").val();
		}
		//cambiar el título
		if ($("#mutua").val() != 0)
		{
			$("h1").html(arrCategoriaPlural[$("#categoria").val()]+" <span class=\"suave\">de</span> "+arrMutuas[$("#mutua").val()]+" <span class=\"suave\">cerca de</span> \""+addr+"\"");
		}
		else
		{
			$("h1").html(arrCategoriaPlural[$("#categoria").val()]+" <span class=\"suave\">cerca de</span> \""+addr+"\"");
		}
		lugar_original=addr;		
		//Buscar resultado en esa coordenada
		getResultsByCoords(map.getCenter().lng(),map.getCenter().lat());		
		//cambiar el enlace de ampliar mapa
		$('#lnk_ampliar_mapa').attr("href", "/negocios/buscar/categoria/"+$("#categoria").val()+"/mutua/"+$("#mutua").val()+"/long/"+map.getCenter().lng()+"/lat/"+map.getCenter().lat()+"/map/1/");

	}
	);
  });
  //cargar el mapa
  //loadMapa();  
  //Cargar la api de google maps. tras la carga hará loadMapa()
  $.getScript('http://maps.google.com/maps?file=api&v=2&key='+google_maps_api_key+'&sensor=false&async=2&callback=loadMapa');
  $("#lnk_ampliar_mapa").colorbox({width:"755px", height:"570px", iframe:true});
});//End ready function