var MoveTimer;
var CarriageMoveing = false;

function MakePhotoMarquee(MarqueeID){
	var MarqueeObj = new Marquee(MarqueeID);
}

function Marquee(MarqueeID){
	this.MarqueeContainer = document.getElementById(MarqueeID);
	this.MarqueeFrame = document.getElementById("MarqueeFrame_"+MarqueeID);
	this.MarqueeCarriage = document.getElementById("Marquee_"+MarqueeID);
	this.MarqueeCarriage.style.position = "absolute";
	this.MarqueeFrame.style.position = "relative";

	if(this.MarqueeContainer){
		//Saco todos los elementos que componen la marquesina:
		var AllChild = this.MarqueeContainer.getElementsByTagName("DIV");
		
		this.MarqueeItems = new Array();

		for(var i=0; i<AllChild.length;i++){
			if(AllChild[i].className == "AlsoBoughtProductsItem"){this.MarqueeItems[this.MarqueeItems.length] = AllChild[i];}
		}
		
		//Tengo localizados los Items de la marquesina. Ahora saco su anchura total
		var TotalWidth = 0;
		for(var i=0; i<this.MarqueeItems.length;i++){
			if(window.getComputedStyle){
				var ItemMargin = window.getComputedStyle(this.MarqueeItems[i],null).getPropertyValue("margin-right");
				ItemMargin = parseFloat(ItemMargin);
			}
			else if(this.MarqueeItems[i].currentStyle){
				var ItemMargin = this.MarqueeItems[i].currentStyle.marginRight;
				ItemMargin = parseFloat(ItemMargin)*16;
				ItemMargin = Math.round(ItemMargin);
				//alert(ItemMargin);
			}
			
			TotalWidth = TotalWidth + (this.MarqueeItems[i].offsetWidth / 1) + ItemMargin;
			
		}
		//TotalWidth = TotalWidth + 20;
		this.MarqueeCarriage.style.width = TotalWidth + "px";

		//Saco los px que debo mover el carro en cada avance:
		var PixelsToMove = (this.MarqueeItems[0].offsetWidth / 1) + ItemMargin;
		PixelsToMove = Math.round(PixelsToMove);
		
		this.LeftButton = document.getElementById("LeftButton_"+MarqueeID);
		this.RightButton = document.getElementById("RightButton_"+MarqueeID);
		
		var MarqueeFrameWidth = this.MarqueeFrame.offsetWidth;
		var MarqueeCarriage = this.MarqueeCarriage;

		this.LeftButton.onclick = function(){
			
			var CarriageX = MarqueeCarriage.offsetLeft;
			var CarriageOverflow = MarqueeCarriage.offsetLeft;
			
			

			var NextMovePx = PixelsToMove;
			if(NextMovePx > Math.abs(CarriageOverflow)){NextMovePx = Math.abs(CarriageOverflow);}
			
			var DestCarriageX = CarriageX + NextMovePx;
			
			if(!CarriageMoveing){
				CarriageMoveing = true;
				clearInterval(MoveTimer);
				MoveTimer = setInterval("MoveCarriage('"+MarqueeCarriage.id+"',"+DestCarriageX+");",10);
			}
		}
		this.RightButton.onclick = function(){
			var CarriageX = MarqueeCarriage.offsetLeft;
			var CarriageOverflow = MarqueeCarriage.offsetWidth - MarqueeFrameWidth + CarriageX;
			
			if(CarriageOverflow > 0){
				var NextMovePx = PixelsToMove;
				if(NextMovePx > CarriageOverflow){NextMovePx = CarriageOverflow;}
				
				var DestCarriageX = CarriageX - NextMovePx;
				
				if(!CarriageMoveing){
					CarriageMoveing = true;
					clearInterval(MoveTimer);
					MoveTimer = setInterval("MoveCarriage('"+MarqueeCarriage.id+"',"+DestCarriageX+");",30);
				}
			}
		}
	}
}

function MoveCarriage(CarriageID, XDest){
	var Carriage = document.getElementById(CarriageID);
	var CarriageX = parseInt(Carriage.style.left);
	if(isNaN(CarriageX)){CarriageX = Carriage.offsetLeft;}

	if(CarriageX > XDest){
		var NextAv = (Math.abs(XDest) - Math.abs(CarriageX)) / 5;
		if(NextAv < 2){NextAv = 1;}
		Carriage.style.left = (CarriageX-NextAv) + "px";
	}
	else if(CarriageX < XDest){
		var NextAv = (Math.abs(CarriageX) - Math.abs(XDest)) / 5;
		if(NextAv < 1){NextAv = 1;}
		Carriage.style.left = (CarriageX + NextAv) + "px";
	}
	else{
		clearInterval(MoveTimer);
		CarriageMoveing = false;
	}
}

function SetBigImage(CarriageID, ImageIndexSrc, BigImg){

	var BigImageObj = document.getElementById('BigImage_'+CarriageID);
	var BigImageRefObj = document.getElementById('BigImage_'+CarriageID+'_Hidden_'+ImageIndexSrc);
	
	if(BigImageObj && BigImageRefObj){
		BigImageObj.src = BigImageRefObj.src;
		BigImageObj.alt = BigImageRefObj.alt;
		BigImageObj.title = BigImageRefObj.title;
		BigImageObj.onclick = function(){
			LoadSingleImage(BigImg);
		}
	}
}
