var x_final=630;
var y_final=60;
var mitad_ancho_mapa=498;
var mitad_alto_mapa=410; //+top


function cierraBocadillo(point)
{
 	var CDivPixel = map.fromLatLngToDivPixel(map.getCenter());
	var pointDivPixel = map.fromLatLngToDivPixel(point);
	var punto = subGPoints(pointDivPixel, CDivPixel); 
	punto.x=punto.x+mitad_ancho_mapa;
	punto.y=punto.y+mitad_alto_mapa;
		
	var bocata=document.getElementById("bocata");
	
	var efecto=document.getElementById("efecto");	
	myEffectsCierra = new Fx.Styles(efecto, {duration: 500,transition: Fx.Transitions.Back.easeIn,onComplete: completaTransacionCierre});

	efecto.style.display='none';
	efecto.style.width=bocata.scrollWidth+'px';
	efecto.style.height=bocata.scrollHeight+'px';
	efecto.style.display='block';
	var ancho=bocata.scrollWidth;
	var alto=bocata.scrollHeight;
	bocata.style.display='none';
	myEffectsCierra.start({
		left: [x_final,punto.x],
		top: [y_final,punto.y],
		width: [ancho,0],
		height:[alto,0],
		opacity: [1,0.2]
	});	

	//bocata.style.display='none';
}
function completaTransacionCierre()
{
	var efecto=document.getElementById("efecto");
	efecto.style.display='none';
}


function subGPoints(a,b) 
{
	return new GPoint(a.x-b.x, a.y-b.y);
}      
function completaTransacion()
{
	var contenidoBocata=document.getElementById("contenidoBocata");
	contenidoBocata.style.display='block';
	var bocata=document.getElementById("bocata");
	bocata.style.display='block';
	var efecto=document.getElementById("efecto");
	efecto.style.display='none';
}

function efectoBocata(point, codigoHTML,conpanto)
{
	   	var CDivPixel = map.fromLatLngToDivPixel(map.getCenter());
	    var pointDivPixel = map.fromLatLngToDivPixel(point);
	    var punto = subGPoints(pointDivPixel, CDivPixel); 
		//Se le suma la mitad del ancho y alto del mapa
		punto.x=punto.x+mitad_ancho_mapa;
		punto.y=punto.y+mitad_alto_mapa;
		var bocata=document.getElementById("bocata");
		bocata.style.top=y_final;
		bocata.style.left=x_final;	
	
		var contenidoBocata=document.getElementById("contenidoBocata");
		contenidoBocata.style.display='none';
		contenidoBocata.innerHTML=codigoHTML;
	
	 	var efecto=document.getElementById("bocata");
	 	efecto.style.display='none';
	 	
		var efecto=document.getElementById("efecto");
		efecto.style.left=punto.x+"px";
		efecto.style.top=punto.y+"px";
		efecto.style.display='block';
		efecto.style.height='0px';
		efecto.style.width='0px';
	
		myEffects = new Fx.Styles(efecto, {duration: 1000,transition: Fx.Transitions.Back.easeInOut,onComplete: completaTransacion});
	 
	 	if(conpanto==true)
		{
			map.panTo(point);
			setTimeout("myEffects.start({left: ["+punto.x+", "+x_final+"],top: ["+punto.y+", "+y_final+"],width: [15,300],height:[10,200]});",200);
	    }
		else
		{
			myEffects.start({
			left: [punto.x, x_final],
			top: [punto.y, y_final],
			width: [15,300],
			height:[10,200],
			opacity: [0.2,1]
			});	
		}
}