function Branquea(){
	this.Id;
	
	this.htmlDiv;
	this.htmlBrdLeft;
	this.htmlBrdRight;
	this.htmlFnd;
	this.htmlText;
	this.htmlImage;
	this.htmlBrdSombra;
	this.htmlContainer;
	
	this.Container;
	
	this.Timer;
	this.ms;
	
	this.Left;
	this.Width;
	this.Height;
	
	this.Link;
	
	this.Text;
	this.Image;
	this.LeftBorder;
	this.RightBorder;
	this.Background;
	this.cssClass;
	
	this.Position;
	this.Desplazamiento = 20;
	
	this.PonerEventos = function(){
	
		this.htmlContainer.setAttribute('BranqueaId', this.Id);
		
		this.htmlContainer.mover(function(me){
			
			var Branquea = BranqueasManager.Branqueas.GetObjectById(me.getAttribute('BranqueaId'));
		
			clearInterval(Branquea.Timer);
			
			Branquea.Open();
			
		});
		
		this.htmlContainer.mout(function(me){
			
			var Branquea = BranqueasManager.Branqueas.GetObjectById(me.getAttribute('BranqueaId'));
		
			clearInterval(Branquea.Timer);
			
			Branquea.Close();
			
		});
		
		this.htmlContainer.click(function(me){
			
			var Branquea = BranqueasManager.Branqueas.GetObjectById(me.getAttribute('BranqueaId'));
		
			if(!Branquea.Link)
				return;
			
			setTimeout(Branquea.Link, 0);
			
		});
		
	}
	
	this.Step = 2;
	
	if((Browser.IE8() == true) || (Browser.IE7() == true) || (Browser.IE6() == true)){
		this.Step = 5;
	}
	
	this.Open = function(){
			
		if(this.Position == 'Left') {
			if(this.Left>0) {
				if(Sum([this.Left, -this.Step]) > 0){
					this.Left-=this.Step;
					this.htmlContainer.setX(this.Left);
					this.Timer = setTimeout('BranqueasManager.Branqueas.GetObjectById(\''+this.Id+'\').Open()', this.ms);
				}else{
					this.htmlContainer.setX(0);
					clearInterval(this.Timer);
				}
			}else{
				this.htmlContainer.setX(0);
				clearInterval(this.Timer);
			}
		}
		
		if(this.Position == 'Right') {
			if(this.Left<0) {
				if(Sum([this.Left, this.Step]) < 0){
					this.Left = Sum([this.Left, this.Step]);
					this.htmlContainer.setX(this.Left);
					this.Timer = setTimeout('BranqueasManager.Branqueas.GetObjectById(\''+this.Id+'\').Open()', this.ms);
				}else{
					this.htmlContainer.setX(0);
					clearInterval(this.Timer);
				}
			}else{
				this.htmlContainer.setX(0);
				clearInterval(this.Timer);
			}
		}
		
	}
	
	this.Close = function(){
		
		if(this.Position == 'Left') {
			if(parseInt(this.Left) < parseInt(this.Desplazamiento)) {
				this.Left = Sum([this.Left, this.Step]);
				this.htmlContainer.setX(this.Left);
				this.Timer = setTimeout('BranqueasManager.Branqueas.GetObjectById(\''+this.Id+'\').Close()', this.ms);
			}
		}
		
		if(this.Position == 'Right') {
			if(parseInt(this.Left) > (-1)*parseInt(this.Desplazamiento)) {
				this.Left -=this.Step;
				this.htmlContainer.setX(this.Left);
				this.Timer = setTimeout('BranqueasManager.Branqueas.GetObjectById(\''+this.Id+'\').Close()', this.ms);
			}
		}
		
	}
	
	this.Init = function(){
		
		this.htmlDiv = go(this.Id);
		this.htmlDiv.css('position', 'absolute');
		this.htmlDiv.css('overflow', 'hidden');
		this.htmlDiv.css('cursor', 'pointer');
		
		this.htmlContainer = this.htmlDiv.newdiv(this.Id+'.htmlContainer');
		
		this.Container = go(this.htmlDiv.parentNode);
		
		this.Container.css('position', 'relative');
		this.Container.css('overflow', 'hidden');
		
		if(this.Position == 'Left'){
		
			this.htmlDiv.setX(0);
			this.htmlDiv.setW(this.Width);
			this.htmlDiv.setH(this.Height);
			
			this.Left = this.Desplazamiento;
			
			this.htmlContainer.css('position', 'absolute');
			this.htmlContainer.css('overflow', 'hidden');
			
			this.htmlContainer.setX(this.Left);
			this.htmlContainer.setY(0);
			this.htmlContainer.setW(this.Width);
			this.htmlContainer.setH(this.Height);
			
			
			this.htmlBrdLeft = this.htmlContainer.newdiv(this.Id+'.BrdLeft');
			
			this.htmlBrdLeft.css('position', 'absolute');
			this.htmlBrdLeft.css('overflow', 'hidden');
			this.htmlBrdLeft.setX(0);
			this.htmlBrdLeft.setY(0);
			this.htmlBrdLeft.setW(17);
			this.htmlBrdLeft.setH(this.Height);
			this.htmlBrdLeft.html('&nbsp;');
			this.htmlBrdLeft.css('background-image', 'url("'+this.LeftBorder+'")');
			
			this.htmlFnd = this.htmlContainer.newdiv(this.Id+'.Fnd');
			
			this.htmlFnd.css('position', 'absolute');
			this.htmlFnd.css('overflow', 'hidden');
			this.htmlFnd.css('background-image', 'url("'+this.Background+'")');
			this.htmlFnd.setX(17);
			this.htmlFnd.setY(0);
			this.htmlFnd.setW(this.Width-17*3-6);
			this.htmlFnd.setH(this.Height);
			this.htmlFnd.html('&nbsp;');
			
			//crea el borde con la muesca
			
			this.htmlBrdRight = this.htmlContainer.newdiv(this.Id+'.Container');
			
			this.htmlBrdRight.css('position', 'absolute');
			this.htmlBrdRight.css('overflow', 'hidden');
			this.htmlBrdRight.setX(0);
			this.htmlBrdRight.setY(0);
			this.htmlBrdRight.setW(this.Width-17);
			this.htmlBrdRight.setH(this.Height);
			this.htmlBrdRight.css('background-image', 'url("images/left-branquea-right-muesca.png")');
			this.htmlBrdRight.cssClass('BranqueaLeftMuesca');
			this.htmlBrdRight.html('&nbsp;');
			
			//crea el borde de la sombra
			
			this.htmlBrdSombra = this.htmlContainer.newdiv(this.Id+'.BrdRight');
			
			this.htmlBrdSombra.css('position', 'absolute');
			this.htmlBrdSombra.css('overflow', 'hidden');
			this.htmlBrdSombra.setX(this.Width - 21);
			this.htmlBrdSombra.setY(0);
			this.htmlBrdSombra.setW(21);
			this.htmlBrdSombra.setH(this.Height);
			this.htmlBrdSombra.css('background-image', 'url("'+this.Background+'")');
			this.htmlBrdSombra.html('&nbsp;');
			
			//creo el div donde ira el texto.
			
			this.htmlImage = this.htmlContainer.newdiv(this.Id+'.Texto');
			this.htmlImage.css('position', 'absolute');
			this.htmlImage.css('overflow', 'hidden');
			this.htmlImage.css('background-image', 'url("'+this.Image+'")');
			this.htmlImage.setX(0);
			this.htmlImage.setY(0);
			this.htmlImage.setW(this.Width-17-19);
			this.htmlImage.setH(this.Height);
			this.htmlImage.cssClass(this.cssClass);
			this.htmlImage.html("&nbsp;");
			
		}
		
		if(this.Position == 'Right'){
		
			this.htmlDiv.setX(0);
			this.htmlDiv.setW(this.Width);
			this.htmlDiv.setH(this.Height);
			
			this.Left = -this.Desplazamiento;
			
			this.htmlContainer.css('position', 'absolute');
			this.htmlContainer.css('overflow', 'hidden');
			this.htmlContainer.setX(this.Left);
			this.htmlContainer.setY(0);
			this.htmlContainer.setW(this.Width);
			this.htmlContainer.setH(this.Height);
			
			
			this.htmlBrdLeft = this.htmlContainer.newdiv(this.Id+'.BrdLeft');
			
			this.htmlBrdLeft.css('position', 'absolute');
			this.htmlBrdLeft.css('overflow', 'hidden');
			this.htmlBrdLeft.setX(this.Width-18);
			this.htmlBrdLeft.setY(0);
			this.htmlBrdLeft.setW(18)
			this.htmlBrdLeft.setH(this.Height);;
			this.htmlBrdLeft.css('background-image', 'url("'+this.LeftBorder+'")');
			this.htmlBrdLeft.html('&nbsp;');
			
			this.htmlFnd = this.htmlContainer.newdiv(this.Id+'.Fnd');
			
			this.htmlFnd.css('position', 'absolute');
			this.htmlFnd.css('overflow', 'hidden');
			this.htmlFnd.css('background-image', 'url("'+this.Background+'")');
			this.htmlFnd.setX(0);
			this.htmlFnd.setY(0);
			this.htmlFnd.setW(26);
			this.htmlFnd.setH(this.Height);
			this.htmlFnd.html('&nbsp;');
			
			//crea el borde con la muesca
			
			this.htmlBrdRight = this.htmlContainer.newdiv(this.Id+'.Container');
			
			this.htmlBrdRight.css('position', 'absolute');
			this.htmlBrdRight.css('overflow', 'hidden');
			this.htmlBrdRight.setX(17);
			this.htmlBrdRight.setY(0);
			this.htmlBrdRight.setW(this.Width-17);
			this.htmlBrdRight.setH(this.Height);
			this.htmlBrdRight.css('background-image', 'url("images/left-branquea-right-muesca.png")');
			this.htmlBrdRight.cssClass('BranqueaRightMuesca');
			this.htmlBrdRight.html('&nbsp;');
			
			//crea el borde de la sombra
			
			this.htmlBrdSombra = this.htmlDiv.newdiv(this.Id+'.BrdRight');
			
			this.htmlBrdSombra.css('position', 'absolute');
			this.htmlBrdSombra.css('overflow', 'hidden');
			this.htmlBrdSombra.setX(0);
			this.htmlBrdSombra.setY(0);
			this.htmlBrdSombra.setW(17);
			this.htmlBrdSombra.setH(this.Height);
			//this.htmlBrdSombra.css('background-image', 'url("images/right-branquea-left-brd.png")');
			this.htmlBrdSombra.html('&nbsp;');
			
			//creo el div donde ira el texto.
			
			this.htmlImage = this.htmlContainer.newdiv(this.Id+'.Texto');
			this.htmlImage.css('position', 'absolute');
			this.htmlImage.css('overflow', 'hidden');
			//this.htmlImage.css('background-image', 'url("'+this.Image+'")');
			this.htmlImage.css('background-image', 'url("'+this.Background+'")');
			this.htmlImage.setX(45);
			this.htmlImage.setY(0);
			this.htmlImage.setW(this.Width-17-46);
			this.htmlImage.setH(this.Height);
			//this.htmlImage.cssClass(this.cssClass);
			this.htmlImage.html('<div style="position:relative; top:18px;" ><img src="'+this.Image+'" /></div>');
		}
		
		this.htmlContainer.css('z-index', '5');//this.htmlContainer.raiseTop();
		this.htmlBrdLeft.css('z-index', '6');
		this.htmlBrdRight.css('z-index', '7');
		this.htmlBrdSombra.css('z-index', '8');
		this.htmlImage.css('z-index', '9');
		
		if(Browser.Engine.Trident() == true) {
			if(Browser.IE9() == true){
				this.ms = 13;
			}else{
				this.ms = 3;
			}
		}
		
		if(Browser.Engine.Webkit() == true){
			this.ms = 25;
		}
		
		if(Browser.Engine.Gecko() == true){
			this.ms = 20;
		}
		
		this.PonerEventos();
		
	}
	
}

function BranqueasMngr(){

	this.Branqueas = new ObjectsList();
	
	this.htmlBrdLeft;
	
	this.OrdenLeft;
	this.OrdenRight;
	this.CurrentTopLeft;
	this.CurrentTopRight;
	this.LeftHeight = 0;
	this.RightHeight = 0;
	
	this.Ordenar = function(){
	
		this.OrdenLeft = 0;
		this.OrdenRight = 0;
		this.CurrentTopLeft = 0;
		this.CurrentTopRight = 0;
		this.LeftHeight = 0;
		this.RightHeight = 0;
		
		this.Branqueas.Walk(function(pIndex, pObject, pMngr){
			
			if(pObject.Position == 'Left'){
				
				pObject.htmlDiv.setY(pMngr.CurrentTopLeft);
				
				pMngr.CurrentTopLeft = parseInt(pMngr.CurrentTopLeft) + parseInt(pObject.Height);
				pMngr.LeftHeight = parseInt(pMngr.LeftHeight) + parseInt(pObject.Height);
				pMngr.OrdenLeft++;
				
			}
			
			if(pObject.Position == 'Right'){
				
				pObject.htmlDiv.setY(pMngr.CurrentTopRight);
				
				pMngr.CurrentTopRight = parseInt(pMngr.CurrentTopRight) + parseInt(pObject.Height);
				pMngr.RightHeight = parseInt(pMngr.RightHeight) + parseInt(pObject.Height);
				pMngr.OrdenRight++;
				
			}
			
		}, this);
		
		go('divBranqueasLeft').setH(this.LeftHeight);
		go('divBranqueasRight').setH(this.RightHeight);
		
		/*
		//if(parseInt(Screen.Width) > Sum([990, 120*2])){
			if(Browser.Engine.Trident() == true){
				go('divBranqueasLeft').setX((Screen.Width-990)/2-120);
			}else{
				if(Browser.Engine.Presto() == true){
					go('divBranqueasLeft').setX((Screen.Width-990)/2-120);
				}else{
					go('divBranqueasLeft').setX((Screen.Width-990)/2-129);
				}
			}
		//}
		*/
		
	}
	
	this.Init = function(){
		
		go('div{Type}{Branquea}').Walk(function(pIndex, pObject, pBranqueas){
			
			var newBranquea = new Branquea();
			
			newBranquea.Id = pObject.id;
			
			if(pObject.getAttribute('Position')){
				newBranquea.Position = pObject.getAttribute('Position');
			}
			
			if(pObject.getAttribute('Width')){
				newBranquea.Width = pObject.getAttribute('Width');
			}
			
			if(pObject.getAttribute('Height')){
				newBranquea.Height = pObject.getAttribute('Height');
			}
			
			if(pObject.getAttribute('Text')){
				newBranquea.Text = pObject.getAttribute('Text');
			}
			
			if(pObject.getAttribute('Link')){
				newBranquea.Link = pObject.getAttribute('Link');
			}
			
			if(pObject.getAttribute('Image')){
				newBranquea.Image = pObject.getAttribute('Image');
			}
			
			if(pObject.getAttribute('LeftBorder')){
				newBranquea.LeftBorder = pObject.getAttribute('LeftBorder');
			}
			
			if(pObject.getAttribute('RightBorder')){
				newBranquea.RightBorder = pObject.getAttribute('RightBorder');
			}

			if(pObject.getAttribute('Background')){
				newBranquea.Background = pObject.getAttribute('Background');
			}
			
			if(pObject.getAttribute('cssClass')){
				newBranquea.cssClass = pObject.getAttribute('cssClass');
			}
			
			newBranquea.Init();
			
			pBranqueas.Add(newBranquea);
			
		}, this.Branqueas);
		
		this.Ordenar();
		
	}
	
}

var BranqueasManager = new BranqueasMngr();

Page.OnLoad(function(){
	
	BranqueasManager.Init();
	
});

Page.OnResize(function(){
	BranqueasManager.Ordenar();
});