//////////////////////////////////
///// PRODUCT IMAGE SWAPPER /////
/////////////////////////////////
/*
1. Changes the CLASS for icon to show a normal or highlighted border color.
2. Replaces the large product IMG with the icon IMG .
3. Changes the large images HREF for use with a popup hires image.
*/

var lastID = 1;

// SWAP PRODUCT ICONS
function swapImage(id,filename,imagename) {
	// For each icon not selected just display normal border
	if (lastID > 0) {
		document.getElementById(lastID).className = "thumbnailBorder";
	}

	// If icon selected then display highlight border
	document.getElementById(id).className = "thumbnailSelected";

	// Stores value of last clicked image to make sure only one item is highlighted
	lastID = id;

	// Swap large image with icon version
	document.images['productImage'].src = filename; 

	// Dynamically change the name of the anchor to the image name (minus .jpg);
	// This will then be used in the popup window to get correct image.
	document.getElementById('productLink').name = imagename;
}

// SWAP 3D RENDER ICONS
function swapRender(id) {
	// For each icon not selected just display normal border
	if (lastID > 0) {
		document.getElementById(lastID).className = "thumbnailBorder";
	}

	// If icon selected then display highlight border
	document.getElementById(id).className = "thumbnailSelected";

	// Stores value of last clicked image to make sure only one item is highlighted
	lastID = id;
}

// SWAP 360-DEGREE VIEW ICONS
function swapRotate(id) {
	// For each icon not selected just display normal border
	if (lastID > 0) {
		document.getElementById(lastID).className = "thumbnailBorder";
	}

	// If icon selected then display highlight border
	document.getElementById(id).className = "thumbnailSelected";

	// Stores value of last clicked image to make sure only one item is highlighted
	lastID = id;
}

// SWAP VIDEO ICONS
function swapVideo(id) {
	// For each icon not selected just display normal border
	if (lastID > 0) {
		document.getElementById(lastID).className = "thumbnailBorder";
	}

	// If icon selected then display highlight border
	document.getElementById(id).className = "thumbnailSelected";

	// Stores value of last clicked image to make sure only one item is highlighted
	lastID = id;
}