thisImg=0;
path = "images/home/";
function rotate(){
	if (document.getElementById) {
		var theElement1 = document.getElementById('image1Wrapper');
		var theImage1 = document.getElementById('image1');
		var theElement2 = document.getElementById('image2Wrapper');		
		var theImage2 = document.getElementById('image2');		

		if (theElement1 && theElement2) {
			// make sure there aren't any animations running, before proceeding
			if (theElement1.animationTimer == null && theElement2.animationTimer == null) {		
				// make sure the next image has been preloaded before proceeding (or if it's the first one, just proceed)
				if (!rotatingImageArray[thisImg].complete && thisImg != 0) {
					// it's not ready, so set up to check again in a second, and jump out
					setTimeout("rotate()", 1000);
					return;
				}

				if (theElement1.style.zIndex > theElement2.style.zIndex) {
					fadeOut('image1Wrapper');				
					//theElement2.style.backgroundImage = "url("+rotatingImageArray[thisImg].src+")";
					theImage2.src = rotatingImageArray[thisImg].src;
					theImage2.alt = rotatingImageData[thisImg]['title'];
					theImage2.title = rotatingImageData[thisImg]['title'];

					// populate the title for the new product
					changeTitle(rotatingImageData[thisImg]['title_truncated']);
				}
				else {
					fadeOut('image2Wrapper');
					//theElement1.style.backgroundImage = "url("+rotatingImageArray[thisImg].src+")";
					theImage1.src = rotatingImageArray[thisImg].src;
					theImage1.alt = rotatingImageData[thisImg]['title'];
					theImage1.title = rotatingImageData[thisImg]['title'];

					// populate the title for the new product
					changeTitle(rotatingImageData[thisImg]['title_truncated']);
				}

				// setup for the next iteration
				thisImg++;
				// reset the index if we're past our array length
				if (thisImg >= rotatingImageArray.length) {
					thisImg = 0;
				}
				setTimeout("rotate()", 6*1000);
			}
			else {
				// looks like an animation is still running...so just try this again in a second
				setTimeout("rotate()", 1000);
			}
		}
	}
}

function changeTitle(theTitle) {
	var titleBar = document.getElementById('featuredProductTitle');
	if (titleBar) {
		titleBar.innerHTML = "<a href='products.sphp'>" + theTitle + "</a>";
	}
}

function fadeOut(elementId) {	
	if (document.getElementById) {	
		// change this value to affect performance
		var intervalStep = 30;

		var theElement = document.getElementById(elementId);		
		if (theElement) {
			initializeElement(elementId);
			
			// start up the animation timer			
			theElement.animationTimer = window.setInterval("fadeOutStep('"+elementId+"')", intervalStep);			
		}
	}
}

function fadeOutStep(elementId) {	
	if (document.getElementById) {	
		// change these values to affect performance
		var animationStep = 0.05;
		var animationStepIE = 5;
		var theElement = document.getElementById(elementId);		
		if (theElement) {			
			// check for IE filters, and deal with them
			if(theElement.filters) {
				if(theElement.filters.alpha.opacity <= 0) {	
					if (theElement.animationTimer) {
						window.clearInterval(theElement.animationTimer);
						theElement.animationTimer = null;
						//theElement.style.display = "none";
						theElement.style.zIndex = 1;
						// and reinitialize this element, so it's not hidden when we start again
						initializeElement(elementId);
	
						// bring the correct element to the forefront					
						if (elementId == 'image1Wrapper') {
							var theOtherElement = document.getElementById('image2Wrapper');
							if (theOtherElement) {
								theOtherElement.style.zIndex = 2;
							}
						}
						else {
							var theOtherElement = document.getElementById('image1Wrapper');
							if (theOtherElement) {
								theOtherElement.style.zIndex = 2;
							}
						}						
					}
				}
				else {		
					var currentOpacity = theElement.filters.alpha.opacity-0;
					currentOpacity -= animationStepIE;			
					theElement.filters.alpha.opacity = currentOpacity;			
				}
			}
			else {
				if(theElement.style.opacity != null) {
					if(theElement.style.opacity <= 0.0) {            
						window.clearInterval(theElement.animationTimer);
						theElement.animationTimer = null;
						//theElement.style.display = "none";
						theElement.style.zIndex = 1;
						// and reinitialize this element, so it's not hidden when we start again
						initializeElement(elementId);

						// bring the correct element to the forefront					
						if (elementId == 'image1Wrapper') {
							var theOtherElement = document.getElementById('image2Wrapper');
							if (theOtherElement) {
								theOtherElement.style.zIndex = 2;
							}
						}
						else {
							var theOtherElement = document.getElementById('image1Wrapper');
							if (theOtherElement) {
								theOtherElement.style.zIndex = 2;
							}
						}

					}
					else {
						var currentOpacity = theElement.style.opacity-0;
						currentOpacity -= animationStep;
						theElement.style.opacity = currentOpacity;
					}
				} 
			}
		}
	}
}

function initializeElement(elementId) {
	if (document.getElementById) {	
		var theElement = document.getElementById(elementId);		
		if (theElement) {
			// clear any timer that are currently running on this element
			if (theElement.animationTimer) {
				window.clearInterval(theElement.animationTimer);
				theElement.animationTimer = null;
			}

			// setup any initial style settings we'll need
			if (theElement.style.opacity != null) {
				theElement.style.opacity = 0.99;				
			}
			else if (theElement.filters) {
				theElement.style.filter = "alpha(opacity=100)";
				theElement.filters.alpha.opacity = 100;				
			}

			theElement.style.display = "block";			
		}
	}
}
