var clientX = 0;
var clientY = 0;
var actual;

function mostrar(elemento)
{
	if(actual && (actual != elemento))
		
		$(actual).style.display = 'none';		
		actual = elemento;
		setTimeout(fadeIn,200);
}

function ocultar(elemento)
{
	actual = elemento;
	setTimeout(fadeOut,300);	
}

function fadeIn()
{	
	$(actual).style.display = 'block';			
}

function fadeOut()
{
	if(mouseFuera(actual))
		$(actual).style.display = 'none';		
}

//verifica si el cursor esta fuera del div elemento
function mouseFuera(elemento)
{
	//$(elemento).style.display = 'block';
		
	var ancho = $(elemento).getWidth();
	var alto = $(elemento).getHeight();	
	var top = $(elemento).offsetTop;
	var left = $(elemento).offsetLeft;	
	
	var scrollTop = document.documentElement.scrollTop;
	var scrollLeft = document.documentElement.scrollLeft;
	
	if((clientX + scrollLeft) < left || (clientX + scrollLeft) > (left + ancho) )
		return true;
	if((clientY + scrollTop) < top || (clientY + scrollTop) > (top + alto) )
		return true;
		
	return false;
}

//obtiene la posicion del mouse
Event.observe(document,'mousemove',function(event){ clientX = event.clientX; clientY = event.clientY })

//jonas programer
var OPEN = [];
var efecto = false;
function openMenu(id,idReferenc,position,left,top)
{
	
	if(!paginaCargada)
		return false;
		
	posMenu(id,idReferenc,position,left,top);
	
	
		$(idReferenc).onmouseout = function(){ };
	if(Effect)
	{

		var div = $(id).getElementsBySelector('div')[0];
		if(!div)
		{
			div = new Element('div');	
			
			var links = $(id).getElementsBySelector('a');
			for(var i = 0; i< links.length ; i++)
			{
				div.appendChild(links[i])
			}
			$(id).appendChild(div);
			
			
		}
//debugger;
		var alto = $(id).select("div.contboton")[0].getStyle("height");
		if(alto || alto != ""  ){ $(id).setStyle({ height:alto }); }
		
		if($(id).style.display == 'none')
		efecto = new Effect.Parallel([
		  Effect.Appear($(id),{ sync: true }), 
		  Effect.SlideDown($(id),{ sync: true,scaleX:false,scaleContent:false,scaleMode:'contents' })
		], { 
		  duration: 0.8,
		  afterFinish:function(){ if(alto  || alto != "") { $(id).setStyle({ height:alto }); /*$(idReferenc).onmouseout = function(){ OPEN = 0; }; closeAll.delay(0.2);*/ };  },
		  afterUpdate:function(){ OPEN = 1; }
		});

	}
	else
	{
		$(id).toggle();
	}
	

	setTimeout("closeMenu('"+id+"')",1);
}

function posMenu(id, idReferenc, position,left,top )
{
	var position_ref = Element.cumulativeOffset($(idReferenc));
	var dimensions = Element.getDimensions($(idReferenc));
	
	var menu_dim = Element.getDimensions($(id));
	var Left = position_ref[0];
	var Top = position_ref[1];
	
	$( id ).style.position = "absolute";
	
	if(left)Left += left;
	if(top)Top += top;
	
	switch(position)
	{
		
	case "TopLeft":
					$( id ).style.top = Top+"px";
					$( id ).style.left = Left+"px";
					break;
	case "BottomLeft":
						$( id ).style.top = (Top+dimensions.height)+"px";
						$( id ).style.left = Left+"px";
					break;
	case "TopRigth":
						$( id ).style.top = Top+"px";
						$( id ).style.left = (Left-dimensions.width)+"px";
	break;
	case "BottomRigth":
						$( id ).style.top = (Top+dimensions.height)+"px";
						$( id ).style.left = (Left-dimensions.width)+"px";
	break;
	case "Center":break;
		
	}
	
	
	
}

function closeAll( id )
{
	//console.log(new Date.now() );
	try{

	['menu1','menu2','menu3','menu4','menu5'].each(function( item ){  if(id!=item){closeMenu( item );} });
	
	}catch(e){ }
}

function closeMenu( id )
{
	//debugger;

	if($( id ).style.display != "none" && OPEN == 0)
		$(id).toggle();//Effect.toggle($(id),'blind');	
	else if($( id ).style.display != "none")
		setTimeout("closeMenu('"+id+"')",1000);
	
}

function POS_MENUS()
{
	if($('menuBuyer'))
	posMenu('menuBuyer','link_menuBuyer','BottomLeft',15,-0)
	
	if($('menuSupplier'))
	posMenu('menuSupplier','link_menuSupplier','BottomRigth',10,-0)	
	
	if($('loginMenu'))
	posMenu('loginMenu','Referencia1','TopRigth')	
	
}
var paginaCargada = false;
var paginaCargada02 = false;
Event.observe(window, 'resize', POS_MENUS, false);
Event.observe(window, 'load', function(){ paginaCargada = true; }, false);
//Event.observe(document, 'dom:loaded', function(){ paginaCargada02 = true; }, false);
/*sub menu*/

/* menu effect */
// JavaScript Document
//Menu class using Prototype framework

var Opcion = Class.create({
	initialize: function(id,variable)
	{
		this.id = id;
		this.name = id;
		this.status = '';			
		this.duration = 200; //miliseconds
		this.delay = 5; //miliseconds
		this.start = 0;
		this.variable = variable;
		
		this.maxHeight = $(this.id).getHeight();
		this.actual = $(this.id+'_h').getHeight();			
		
	},
	
	Open: function(){
		
		this.status = 'open';				
		if(this.actual==0)
		{
			var newDuration = this.duration;
		}
		else
			var newDuration = this.actual / this.maxHeight * this.duration;
							
		this.start = new Date().getTime();
		var end = this.start + newDuration;		
		this.moveOutside(end);	
	},
	
	moveOutside: function(end){	
	
		var now = new Date().getTime();			
		if(now < end && this.status == 'open')
		{
			this.actual = (now - this.start) * this.maxHeight / (end - this.start);	
			$(this.id+'_h').setStyle({'height':this.actual+'px'});
		
			//Moves the div and its background to the center
			var center = this.maxHeight / 2;
			var top = (center - (this.actual / 2));	
			if(Prototype.Browser.IE)
				if(top > parseInt(top))
					top = parseInt(top)+1;
				else
					top = parseInt(top);			
					
			$(this.id+'_h').setStyle({'top':top+'px'});
			$(this.id+'_h').setStyle({'backgroundPosition':'0 -'+(33+top)+'px'});	
			
			var fn = this.variable+'.moveOutside('+end+')';
			setTimeout(fn,this.delay);
		}
		else
		{
			this.actual = this.maxHeight;
			$(this.id+'_h').setStyle({'height':this.actual+'px'});
			$(this.id+'_h').setStyle({'top':'0'});	
			$(this.id+'_h').setStyle({'backgroundPosition':'0 -33px'});	
		}
			
	},
	
	Close: function(){

		this.status = 'close';			
		if(this.actual<this.maxHeight && this.actual != 0)
			var newDuration = this.actual * this.duration / this.maxHeight;
		else
			var newDuration = this.duration;
			
		this.start = new Date().getTime();			
		var end = this.start + newDuration;		
		this.moveInside(end);			
	},
	
	moveInside: function(end){
		var now = new Date().getTime(); 
		
		if( (now < end) && (this.status == 'close') )
		{
			this.actual = (now - this.start) * this.maxHeight / (end - this.start);
			this.actual = this.maxHeight - this.actual;
			
			/*var temp = this.actual;
			this.actual = (now - this.start) * this.maxHeight / (end - this.start);
			console.log(this.actual);
			this.actual = this.maxHeight - (this.actual<=0?temp:this.actual);
			*/
			//debugger;
			
			
			
			$(this.id+'_h').setStyle({'height':this.actual+'px'});
			
			//Moves the div and its background to the center
			var center = this.maxHeight / 2;
			var top = (center - (this.actual / 2));
			if(Prototype.Browser.IE)
				if(top > parseInt(top))
					top = parseInt(top)+1;			
				else
					top = parseInt(top);			
			
			$(this.id+'_h').setStyle({'top':top+'px'});
			$(this.id+'_h').setStyle({'backgroundPosition':'0 -'+(33+top)+'px'});	
			
			var fn =this.variable+'.moveInside('+end+')';
			setTimeout(fn,this.delay);				
		}
		else
		{
			this.actual = 0;
			$(this.id+'_h').setStyle({'height':this.actual+'px'});
			//$(this.id+'_h').setStyle({'top':this.maxHeight / 2});
			$(this.id+'_h').setStyle({'backgroundPosition':'0 0'});	
		}
	}
						  
});

/* end menu effect */
var ImageTransition = Class.create( {
		
		 contenedor: "",	
		 imagenes: [], 
		 path: "",
		 frequency: 1.5,
		 actual: 1,
		 sig: 0,

		initialize: function( idContenedor, imagenes, options ){
				
				options = Object.extend({path:"",frequency:1.5,actual:1},options ||{ });
				this.contenedor = idContenedor;
				this.imagenes = imagenes;
				this.path = options.path;
				this.frequency = options.frequency;
				this.actual = options.actual -1;
				
				var img = $(this.contenedor).getElementsByTagName("img")[0];
				img.src = this.path + this.imagenes[this.actual];
				$(img).show();
				this.sig = this.actual+1;
				if(this.sig > this.imagenes.length-1)
				this.sig = 0;
				
				this.start();
			},
		
		transition: function(){
			
			if(!this.onTransition){
					var elemento = $(this.contenedor).getElementsByTagName("img")[0];
					var height = $(elemento).getHeight();
		
					
					if(this.sig > this.imagenes.length-1)
						this.sig = 0;
									
					var src = this.path + this.imagenes[this.sig];
					var img = new Element("img",{ src:src, style:"position:relative; top:-"+height+"px; " });
					
					img.setOpacity( 0 );
					$(this.contenedor).appendChild(img);
					
					var transicion = this;
					new Effect.Opacity( elemento, { from: 1.0, to: 0, duration: (this.frequency-0.0099),
					afterFinish: function(){
							transicion.eliminarImgs();
							transicion.onTransition = false;
							img.setStyle({ top:0+"px"});
						}				   
					});	
					new Effect.Opacity(img,{ from: 0, to: 1.0, duration: (this.frequency-0.0099)})
					this.sig += 1;
					this.onTransition = true;
				
				}
			
			
			
			
			
			},
			
			eliminarImgs: function()
			{
				var imagenes = $(this.contenedor).getElementsByTagName("img");
				var num = imagenes.length-1;
				for(var i=0;i< num; i++)
				{
					$(imagenes[i]).remove();
				}
			},
			
			start: function(){
					this.timer = new PeriodicalExecuter(this.transition.bind(this), this.frequency);
				}
			
			
								   
});