// function to rotate through the images in an div.
// =============================================================================
function RotateImages(sImagePanel, iImageNumber, iPause)
{

	// get object from name of id
	var objImagePanel = document.getElementById(sImagePanel);
	
	// set all images of div in an array
	var aImages = objImagePanel.getElementsByTagName("img");


	// loop through all images
	for (i = 0; i < aImages.length; i++)
	{
		// if image is current
		if (i == iImageNumber)
		{
			
			// set images visible, 
			// fade from blank to no transparancy, 
			// set on top
			aImages[i].style.display = 'block';
			FadeOpacity(aImages[i].id, 0, 100, 1000, 15);
			aImages[i].style.zIndex = 3;

			Resize(aImages[i], objImagePanel.offsetWidth, objImagePanel.offsetHeight)

		}
		else
		{
			// if image is before current set just below top
			if (i < iImageNumber)
			{
				aImages[i].style.zIndex = 2;
			}
			// if image is after current set below
			if (i >= iImageNumber)
			{
				aImages[i].style.zIndex =  1;
			}
		}
	}
	
	// set current image to the next
	iImageNumber++

	// check if there are stille images in the array. If not, start again
	if (iImageNumber < aImages.length)
	{
		setTimeout(function() { RotateImages(sImagePanel, iImageNumber, iPause) }, iPause);
	}
	else
	{
		setTimeout(function() { RotateImages(sImagePanel, 0, iPause) }, iPause);
	}
}


// Proportional resize Image
// =============================================================================
function Resize(img, maxw, maxh)
{
	var ratio = maxh / maxw;
	if (img.height / img.width > ratio)
	{
		img.width = Math.round(img.width * (maxh / img.height));
		img.height = maxh;
		img.style.left = (maxw - img.width) / 2 + "px";
	} 
	else
	{
		img.height = Math.round(img.height * (maxw / img.width));
		img.width = maxw;
		img.style.top = (maxh - img.height) / 2 + "px";
	}
}



// =================================================================================
// 3d Party thanks to 
// Functions for fading images
// =================================================================================

// function to start the fading of an image
// =================================================================================
function FadeOpacity(elemId, fromOpacity, toOpacity, time, fps)
{
    var iSteps = Math.ceil(fps * (time / 1000));
    var iDelta = (toOpacity - fromOpacity) / iSteps;
    var iTimeStep = time / iSteps

    FadeOpacityStep(elemId, 0, iSteps, fromOpacity, iDelta, iTimeStep);
}


// function to cycle through the fading steps.
// =================================================================================
function FadeOpacityStep(elemId, stepNum, steps, fromOpacity, delta, timePerStep)
{
	var eElement = document.getElementById(elemId)
	var iOpacity = Math.round(parseInt(fromOpacity) + (delta * stepNum));

	SetOpacity(eElement, iOpacity);

	if (stepNum < steps)
		setTimeout("FadeOpacityStep('" + elemId + "', " + (stepNum + 1)
                 + ", " + steps + ", " + fromOpacity + ", "
                 + delta + ", " + timePerStep + ");", timePerStep);
}

// function to set the opacity (transparancy)
// =================================================================================
function SetOpacity(elem, opacityAsInt)
{
	var opacityAsDecimal = opacityAsInt;

	if (opacityAsInt > 100)
		opacityAsInt = opacityAsDecimal = 100;
	else if (opacityAsInt < 0)
		opacityAsInt = opacityAsDecimal = 0;

	opacityAsDecimal /= 100;
	if (opacityAsInt < 1)
		opacityAsInt = 1; // IE7 bug, text smoothing cuts out if 0

	elem.style.opacity = (opacityAsDecimal);
	elem.style.filter = "alpha(opacity=" + opacityAsInt + ")";
}