Event.onDOMReady(function()
{
	sucursales($F("proveedor"));
});

function loadMapa(json)
{
	if($F("latitud").isEmpty() || $F("longitud").isEmpty())
	{
		$("mapa").hide();
		return;
	}
	$("mapa").show();
	 if (GBrowserIsCompatible()) {
	    var map = new GMap2(document.getElementById("mapa"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GOverviewMapControl());
		map.addControl(new GMapTypeControl());
	    map.setCenter(new GLatLng($F("latitud").parseFloat(), $F("longitud").parseFloat()), 16);
		var marker=new GMarker(new GLatLng($F("latitud").parseFloat(), $F("longitud").parseFloat()));
		map.addOverlay(marker)
//		map.setCenter(new GLatLng(37.4419, -122.1419), 6);
		var mensaje="<div class=\"globoMaps\"><div class=\"imagenLogoGlobo\"><img src=\"/images/logos/preview/"+json.imagen+"\" /></div><div><b>"+$F("nombreComun")+"</b><br>";
		mensaje+="<div style=\"font-size:11px\">"+json.sCalle+" "+json.sNumeroExterior+"<br>";
		mensaje+="Col: "+json.sColonia+", CP: "+json.sCP+", "+json.sEstado+"</div></div>";
		marker.openInfoWindowHtml(mensaje);
		GEvent.addListener(marker, "click", function() {
		    marker.openInfoWindowHtml(mensaje);
		  });
	  }
}

function createMarker(point, index,message) {
	var baseIcon = new GIcon();
	baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
	baseIcon.iconSize = new GSize(20, 34);
	baseIcon.shadowSize = new GSize(37, 34);
	baseIcon.iconAnchor = new GPoint(9, 34);
	baseIcon.infoWindowAnchor = new GPoint(9, 2);
	baseIcon.infoShadowAnchor = new GPoint(18, 25);
  // Create a lettered icon for this point using our icon class
  var letter = String.fromCharCode("A".charCodeAt(0) + index);
  var letteredIcon = new GIcon(baseIcon);
  letteredIcon.image = "http://www.google.com/mapfiles/marker"+letter+".png";
  letteredIcon.image = "http://www.google.com/mapfiles/markerA.png";

  // Set up our GMarkerOptions object
  markerOptions = { icon:letteredIcon ,draggable: true};
  var marker = new GMarker(point, markerOptions);

  GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(message);
  });
  GEvent.addListener(marker, "dragstart", function() {
  map.closeInfoWindow();
  });


  
  return marker;
}

var noSucursal=-1;

function actualizarSucursal(json,lugar)
{
	if(json.length<=1)
	{
		$("listaSucursaless").hide();
	}
	else
	{
		$("listaSucursaless").show();
	}
	if(lugar==null)
	{
		var sucursal=noSucursal+1;
		sucursal=sucursal>=json.length?0:sucursal;
	}
	else
	{
		var sucursal=noSucursal-1;
		sucursal=sucursal<0?json.length-1:sucursal;
	}
	noSucursal=sucursal;
	var address=json[sucursal]["sCalle"]+" #"+json[sucursal]["sNumeroExterior"];
	address+=!json[sucursal]["sNumeroInterior"].isEmpty()?"-"+json[sucursal]["sNumeroInterior"]:"";
	address+=", Col. "+json[sucursal]["sColonia"]+", "+json[sucursal]["sMunicipio"]+", "+json[sucursal]["sEstado"];
	address+=", CP. "+json[sucursal]["sCP"];
	$("sucursales").down(".direccion").down("span").update(address);
	var horarios="";
	if(!json[sucursal]["sHorarios"].isEmpty())
	{
		horarios=json[sucursal]["sHorarios"].gsub("\n","<br />");
		$("horariosInfo").update(horarios);
		$("horariosInfo").show();
	}
	else
	{
		$("horariosInfo").hide();
	}
	
	$("sucursales").down(".telefono").down("span").update("("+json[sucursal]["sLada"]+") - "+json[sucursal]["sTelefono"]);
	if(!json[sucursal]["sLada2"].isEmpty())
	{
		$("tel2").show();
		$("sucursales").down(".telefono2").down("span").update("("+json[sucursal]["sLada2"]+") - "+json[sucursal]["sTelefono2"]);
	}
	else
	{
		$("tel2").hide();
	}
	//$("sucursales").down(".tipoServicio").down("span").update(json[sucursal]["sTipoServicio"]);
	var correo=json[sucursal]["sCorreoElectronico"].isEmpty()?"":"<a href=\"mailto:"+json[sucursal]["sCorreoElectronico"]+"\">"+json[sucursal]["sCorreoElectronico"]+"</a>";
	$("sucursales").down(".email").down("span").update(correo);
	$("latitud").value=json[sucursal]["sLatitud"];
	$("longitud").value=json[sucursal]["sLongitud"];
	if(!json[sucursal]["sPaginaWeb"].isEmpty())
	{
		$("divPagina").show();
		var pagina=json[sucursal]["sPaginaWeb"];
		if(!pagina.startsWith("http://"))
		{
			pagina="http://"+pagina;
		}
		$("divPagina").down("a").href=pagina;
	}
	else
	{
		$("divPagina").hide();
	}
	loadMapa(json[sucursal]);			
	if(json[sucursal].servicios)
	{
		$("iconosTiposServicio").update("");
		var divServicios=$("iconosTiposServicio");
		var ul=new Element("ul",{'class':'ulServicios'});
		divServicios.insert(ul);
		json[sucursal].servicios.each(function(item){
			var li=new Element("li");
			var imagen=new Element("img",{src:'/images/servicios/'+item.sImagen,title:item.sTipoServicio});
			li.insert(imagen);
			ul.insert(li);
		});
	}
}

function sucursales(proveedor,lugar)
{
	var direccion="/php/codes/scripts.php?action=sucursales";
	var parametros="proveedor="+proveedor;
	var funcion=function(resp)
	{
		var json=resp.responseText.evalJSON();
		if(json)
		{
			actualizarSucursal(json,lugar);
		}
	}
	new Ajax.Request(direccion,{method:'get',parameters:parametros,onSuccess:funcion});
}

function galeriaImagenes(path,imagenes,mensaje)
{
	var bg;
	if($$(".bg").length==0)
	{
		bg=new Element("div",{'class':'bg'});
		bg.setStyle({width:"100%",height:getFullScreenSize().y+"px"});
		$$("body")[0].insert(bg);
	}
	else
	{
		bg=$$(".bg")[0];
		bg.show();
		
	}
	var popup;	
	var actual=0;
	if($$(".popupImagen").length==0)
	{
		popup=new Element("div",{'class':'popupImagen'});
		$$("body")[0].insert(popup);
	}	
	else
	{
		popup=$$(".popup")[0];
	}	
	var tache=new Element("div",{'class':'tache'});
	var fondo=new Element("div",{'class':'fondo'});
	popup.insert(fondo);
	popup.insert(tache);
	popup.setStyle({left:document.viewport.getWidth()/2-popup.getWidth()/2+"px"});
	popup.setStyle({top:document.viewport.getScrollOffsets().top+document.viewport.getHeight()/2-popup.getHeight()/2+"px"});	
	mostrarImagen(path,imagenes[0],popup);
	var h1;
	var paginador=new Element("div",{'class':'pager'});
	var izq=new Element("div",{'class':'flechas izq'}).update("◄");
	var der=new Element("div",{'class':'flechas der'}).update("►");
	var numeroFoto=new Element("div",{'class':'numeroFoto'}).update("Foto <span class='actual'>"+(actual+1)+"</span> de "+imagenes.length+"");
	paginador.insert(izq);
	paginador.insert(numeroFoto);
	paginador.insert(der);
	fondo.insert(paginador);
	
	izq.observe("click",function(){
		actual=actual-1<0?imagenes.length-1:actual-1;
		numeroFoto.down(".actual").update(actual+1);
		mostrarImagen(path,imagenes[actual],popup);
	});
	
	der.observe("click",function(){
		actual=actual+1>=imagenes.length?0:actual+1;
		numeroFoto.down(".actual").update(actual+1);
		mostrarImagen(path,imagenes[actual],popup);
	});
	if(mensaje!=null)
	{
		h1=new Element("h1",{'class':'mensajePop'}).update(mensaje);
		popup.insert(h1);
	}
	var cerrar=function()
	{
		/*new Effect.Fade(popup,{duration:.5,queue: { position: 'end', scope: 'popin' }})
		new Effect.Fade(bg,{duration:.5,queue: { position: 'end', scope: 'popin',afterFinish:function(){
			bg.remove();
			popup.remove();
		}}});*/
		new Effect.Fade(popup,{duration:.5,queue: { position: 'end', scope: 'popin' }})
		new Effect.Fade(bg,{duration:.5,queue: { position: 'end', scope: 'popin'},afterFinish:function(){
			bg.remove();
			popup.remove();
		}});
	}	
	tache.observe("click",function(){
		cerrar();
	});
	Event.observe(document,"keyup",function(e){
		if(!bg)
		{
			return;
		}		
		var tecla=teclas(e);
		if(tecla==27)
		{
			cerrar();
		}
	});	
}

function galeriaImagenes2(path,imagenes,mensajes)
{
	var bg;
	if($$(".bg").length==0)
	{
		bg=new Element("div",{'class':'bg'});
		bg.setStyle({width:"100%",height:getFullScreenSize().y+"px"});
		$$("body")[0].insert(bg);
	}
	else
	{
		bg=$$(".bg")[0];
		bg.show();
		
	}
	var popup;	
	var actual=0;
	if($$(".popupImagen").length==0)
	{
		popup=new Element("div",{'class':'popupImagen'});
		$$("body")[0].insert(popup);
	}	
	else
	{
		popup=$$(".popup")[0];
	}	
	var tache=new Element("div",{'class':'tache'});
	var fondo=new Element("div",{'class':'fondo'});
	popup.insert(fondo);
	popup.insert(tache);
	popup.setStyle({left:document.viewport.getWidth()/2-popup.getWidth()/2+"px"});
	popup.setStyle({top:document.viewport.getScrollOffsets().top+document.viewport.getHeight()/2-popup.getHeight()/2+"px"});	
	mostrarImagen2(path,imagenes[0],popup,mensajes[0]);
	var h1;
	var paginador=new Element("div",{'class':'pager'});
	var izq=new Element("div",{'class':'flechas izq'}).update("◄");
	var der=new Element("div",{'class':'flechas der'}).update("►");
	var numeroFoto=new Element("div",{'class':'numeroFoto'}).update("Foto <span class='actual'>"+(actual+1)+"</span> de "+imagenes.length+"");
	paginador.insert(izq);
	paginador.insert(numeroFoto);
	paginador.insert(der);
	fondo.insert(paginador);
	
	izq.observe("click",function(){
		actual=actual-1<0?imagenes.length-1:actual-1;
		numeroFoto.down(".actual").update(actual+1);
		mostrarImagen2(path,imagenes[actual],popup,mensaje[actual]);
	});
	
	der.observe("click",function(){
		actual=actual+1>=imagenes.length?0:actual+1;
		numeroFoto.down(".actual").update(actual+1);
		mostrarImagen2(path,imagenes[actual],popup,mensajes[actual]);
	});
	if(mensajes!=null)
	{
		h1=new Element("h1",{'class':'mensajePop'}).update(mensajes[0]);
		popup.insert(h1);
	}
	var cerrar=function()
	{
		/*new Effect.Fade(popup,{duration:.5,queue: { position: 'end', scope: 'popin' }})
		new Effect.Fade(bg,{duration:.5,queue: { position: 'end', scope: 'popin',afterFinish:function(){
			bg.remove();
			popup.remove();
		}}});*/
		new Effect.Fade(popup,{duration:.5,queue: { position: 'end', scope: 'popin' }})
		new Effect.Fade(bg,{duration:.5,queue: { position: 'end', scope: 'popin'},afterFinish:function(){
			bg.remove();
			popup.remove();
		}});
	}	
	tache.observe("click",function(){
		cerrar();
	});
	Event.observe(document,"keyup",function(e){
		if(!bg)
		{
			return;
		}		
		var tecla=teclas(e);
		if(tecla==27)
		{
			cerrar();
		}
	});	
}

function mostrarImagen(path,imagen,popup,loader)
{
	var imagen=new Element("img",{src:path+imagen});
	var loader=new Element("div",{'class':'loader'});
	var fondo=popup.down(".fondo");
	fondo.insert(loader);
	cargandoImagen(imagen,function(){
		imagen.hide();
		loader.remove();		
		fondo.insert(imagen);
		var w=imagen.getWidth();
		var h=imagen.getHeight();		
		//popup.setStyle({width:w+"px",height:h+"px"});
		if(imagen.previous("img"))
		{
			imagen.previous("img").remove();
		}
		$(popup).morph('width:'+w+'px;height:'+h+'px;',{duration:.3,afterUpdate:function(){
			var topest=document.viewport.getScrollOffsets().top+document.viewport.getHeight()/2-popup.getHeight()/2;
			topest=topest<=30?30:topest;
			popup.setStyle({left:document.viewport.getWidth()/2-popup.getWidth()/2+"px"});
			popup.setStyle({top:topest+"px"});
		},
		afterFinish:function(){
			new Effect.Appear(imagen,{duration:.3,afterFinish:function(){				
			}});						
		}});
	});
}

function mostrarImagen2(path,imagen,popup,mensaje)
{
	var imagen=new Element("img",{src:path+imagen});
	var loader=new Element("div",{'class':'loader'});
	var fondo=popup.down(".fondo");
	fondo.insert(loader);
	cargandoImagen(imagen,function(){
		if(popup.down("h1.mensajePop"))
		{
			popup.down("h1.mensajePop").update(mensaje);	
		}		
		imagen.hide();
		loader.remove();		
		fondo.insert(imagen);
		var w=imagen.getWidth();
		var h=imagen.getHeight();		
		//popup.setStyle({width:w+"px",height:h+"px"});
		if(imagen.previous("img"))
		{
			imagen.previous("img").remove();
		}
		$(popup).morph('width:'+w+'px;height:'+h+'px;',{duration:.3,afterUpdate:function(){
			var topest=document.viewport.getScrollOffsets().top+document.viewport.getHeight()/2-popup.getHeight()/2;
			topest=topest<=30?30:topest;
			popup.setStyle({left:document.viewport.getWidth()/2-popup.getWidth()/2+"px"});
			popup.setStyle({top:topest+"px"});
		},
		afterFinish:function(){
			new Effect.Appear(imagen,{duration:.3,afterFinish:function(){				
			}});						
		}});
	});
}

function cargandoImagen(imagen,callback)
{
	imagen=$(imagen);
	if (imagen.complete)
	{
		callback(imagen);
	} 
	else 
	{
		setTimeout(function(){cargandoImagen(imagen,callback)}, 100);
	}
}