/*
 * Update featured map thumbnails - this downloads the images into these
 * hidden image objects, ensuring they are preloaded and ready for display.
 */

function updateCachedThumbnails() {
	
	nextThumbnails[0].src = 
		featuredThumbnails[(thumbnailIndex+4 < numThumbnails) ? (thumbnailIndex+4) : (thumbnailIndex+4-numThumbnails)];
	nextThumbnails[1].src = 
		featuredThumbnails[(thumbnailIndex+5 < numThumbnails) ? (thumbnailIndex+5) : (thumbnailIndex+5-numThumbnails)];
	nextThumbnails[2].src = 
		featuredThumbnails[(thumbnailIndex+6 < numThumbnails) ? (thumbnailIndex+6) : (thumbnailIndex+6-numThumbnails)];
	nextThumbnails[3].src = 
		featuredThumbnails[(thumbnailIndex+7 < numThumbnails) ? (thumbnailIndex+7) : (thumbnailIndex+7-numThumbnails)];
			
	previousThumbnails[0].src = 
		featuredThumbnails[(thumbnailIndex-4 >= 0) ? (thumbnailIndex-4) : (numThumbnails-thumbnailIndex-4)];
	previousThumbnails[1].src = 
		featuredThumbnails[(thumbnailIndex-3 >= 0) ? (thumbnailIndex-3) : (numThumbnails-thumbnailIndex-3)];
	previousThumbnails[2].src = 
		featuredThumbnails[(thumbnailIndex-2 >= 0) ? (thumbnailIndex-2) : (numThumbnails-thumbnailIndex-2)];
	previousThumbnails[3].src = 
		featuredThumbnails[(thumbnailIndex-1 >= 0) ? (thumbnailIndex-1) : (numThumbnails-thumbnailIndex-1) ];
}

/*
 * User clicks left button in thumbnail browser
 */
function leftButton() {

	//update thumbnail images, titles, and links
	for (var i=0;i<4;i++) {
		var image = document.getElementById("thumbnail"+i);
		var anchor1 = document.getElementById("thumbnailLink"+i);
		var anchor2 = document.getElementById("thumbnailLink"+i+i);
		
		image.src = previousThumbnails[i].src;
		
		var newIndex = 
			(thumbnailIndex-(4-i) >= 0) ? (thumbnailIndex-(4-i)) : (numThumbnails-thumbnailIndex-(4-i));
		anchor1.innerHTML = 	featuredTitles[newIndex];
		anchor1.href = "Product?itemCode=" + featuredItemCodes[newIndex];
		anchor2.href = "Product?itemCode=" + featuredItemCodes[newIndex];

	}
	
	//update thumbnail Index
	thumbnailIndex -= 4;
	if (thumbnailIndex < 0) thumbnailIndex += numThumbnails;
	
	//update cache
	updateCachedThumbnails();
}

/*
 * user clicks right button in thumbnail browser
 */
function rightButton() {

	//update thumbnail images, titles, and links
	for (var i=0;i<4;i++) {
		var image = document.getElementById("thumbnail"+i);
		var anchor1 = document.getElementById("thumbnailLink"+i);
		var anchor2 = document.getElementById("thumbnailLink"+i+i);
		
		image.src = nextThumbnails[i].src;
		
		var newIndex = 
			(thumbnailIndex+4+i < numThumbnails) ? (thumbnailIndex+4+i) : (thumbnailIndex+4+i-numThumbnails);
		anchor1.innerHTML = 	featuredTitles[newIndex];
		anchor1.href = "Product?itemCode=" + featuredItemCodes[newIndex];
		anchor2.href = "Product?itemCode=" + featuredItemCodes[newIndex];
		
	}
	
	//update thumbnail Index
	thumbnailIndex = (thumbnailIndex + 4) < numThumbnails ? (thumbnailIndex + 4) : (thumbnailIndex + 4 - numThumbnails);
	
	//update cache
	updateCachedThumbnails();
	

}

/*
 * Some setup after the home page loads
 * 1) update the margins of the titles for featured map and featured mapmaker
 * based on the size of the accompanying images.
 * 2) pre-load next four and previous four thumbnails
 */
function onLoadHome() {
/*
	var featuredMap = document.getElementById("featuredMap");
	var featuredMapmaker = document.getElementById("featuredMapmaker");
	var titleLeft = document.getElementById("featuredTitleLeft");
	var titleRight = document.getElementById("featuredTitleRight");
	
	if (featuredMap != null) {	
		titleLeft.style.marginLeft = featuredMap.width + 10 + "px";
		titleRight.style.marginLeft = featuredMapmaker.width + 10 + "px";
	}
		
	//following line used in old browse thumbnails list
	//updateCachedThumbnails();	
*/
}