var numLogos; //will be set later
var usedLogos = 0; //counter

//Will hold ids of div tags that hold the logos.
var holdersArray = new Array();
//Will put an image url to the availableLogos array
function addHolder(divID)
{
	holdersArray.push(divID);
}

//Will hold all available logos
var availableLogos = new Array();

//Will hold urls which will be the links.
var logosLinks = new Array();

//Will put an image url to the availableLogos array
function addLogo(srcImg,linkURL)
{
	availableLogos.push(srcImg);
	logosLinks.push(linkURL);
}

//Will assign the first available logos into the logo holders
//Will use as many logos as the number of holders.
function initLogos()
{
	var holderCount = holdersArray.length;
	numLogos = availableLogos.length;
	
	for(var i=0;i<holderCount;i++)
	{
		var holder = holdersArray[i];
		var imgHolder = "img_"+holdersArray[i];
		var linkHolder = "link_"+holdersArray[i];
		
		if(availableLogos[i] != null)
		{
			document.getElementById(imgHolder).src = availableLogos[i];
			document.getElementById(linkHolder).href = logosLinks[i];
			
			//Indicate that this logo has been used
			usedLogos ++;
			
			//Reset if we've used all of them.
			if(usedLogos > numLogos - 1) usedLogos = 0;
			
			resizeImage(IMAGE_MAX_HEIGHT,IMAGE_MAX_WIDTH,imgHolder);
		}
		 
		//Initiatiate rotation of logos for that holder.
		transitionImage(holder);
	}
}

function transitionImage(holder)
{
	setInterval(function(){doTransition(holder);},onTime);
}

function doTransition(holder)
{
	var imgHolder = "img_"+holder;
	var linkHolder = "link_" + holder;
	
	var nextLink = logosLinks[usedLogos];
	document.getElementById(linkHolder).href = nextLink;
	
	var imgElement = document.getElementById(imgHolder);
	imgElement.style.height = "auto";
	imgElement.style.width = "auto";
	
	var nextAvalaibleLogo = availableLogos[usedLogos];
	
	blendimage(holder, imgHolder, nextAvalaibleLogo, transitionTime);
	resizeImage(IMAGE_MAX_HEIGHT,IMAGE_MAX_WIDTH,imgHolder);
	
	
	usedLogos ++;
	//Reset if we've used all of them.
	if(usedLogos > numLogos - 1) usedLogos = 0;
}

function resizeImage(maxHeight, maxWidth , imageID)
{
	var imgW = 0;
	var imgH = 0;
	

	var imgElement = document.getElementById(imageID);
	imgElement.style.height = "auto";
	imgElement.style.width = "auto";

	imgW = imgElement.scrollWidth;
	imgH = imgElement.scrollHeight;
	
	if (imgH  > imgW)
	{
		if (imgH < maxHeight) maxHeight = imgH;
		imgElement.style.height = maxHeight+"px";
		var new_width = Math.ceil((maxHeight*imgW)/imgH);
		imgElement.style.width = new_width+"px";
	}
	else if(imgW > imgH)
	{
		if (imgW < maxWidth) maxWidth = imgW;
		imgElement.style.width = maxWidth+"px";
		var new_height = Math.ceil((maxWidth*imgH)/imgW);
		imgElement.style.height = new_height+"px";
	}
	else 
	{
		if (imgH < maxHeight) maxHeight = imgH;
		if (imgW < maxWidth) maxWidth = imgW;
		
		imgElement.style.height = maxHeight+"px";
		imgElement.style.width = maxWidth+"px";
	}
}