// global vars
// num: gets number of thumb images currently residing on the page
var num;

// make getElementsByClassName work across browsers/platforms
function getElementsByClassName(classname)
{
    var a = [];
    var re = new RegExp('\\b' + classname + '\\b');
    var els = document.all?document.all:document.getElementsByTagName("*");
    for(var i=0,j=els.length; i<j; i++)
        if(re.test(els[i].className))a.push(els[i]);
    return a;
}

function preloadImgs()
{
	var thisImg, thisThumb;
	var pageId = document.getElementsByTagName("body")[0].id;
	//pageId = document.body.id;
	var preloadList = getElementsByClassName("thumb-roll");
	var preloadListNum = preloadList.length + 1;
	// thumbs
	for(var i = 1; i < preloadListNum; i++)
	{
		thisThumb  = new Image();
		thisThumb.src = "image/products/" + pageId + "-thumb-" + i + "-1.jpg";
		//alert("preloading thumb image: " + thisThumb.src);
	}
	// products		
	for(var j = 2; j < preloadListNum; j++)
	{
		thisImg  = new Image();
		thisImg.src = "image/products/" + pageId + "-product-" + j + ".jpg";
		//alert("preloading product image: " + thisImg.src);
	}
}

function swapImg(val,num1,num2)
{
	var str = val.src;
	var stateBefore = num1 + ".jpg";;
	var stateAfter = num2 + ".jpg";
	var result = str.replace(stateBefore, stateAfter);
	val.src = result;	
}	

function viewProduct(currentId)
{
	var thisImg = document.getElementById("product-image");
	var imgPath = thisImg.src;
	var searchStr = imgPath.lastIndexOf(".");
	searchStr = searchStr - 1;
	var pattern = imgPath.substring(searchStr);
	var newVal = currentId + ".jpg";
	var result = imgPath.replace(pattern, newVal);
	thisImg.src = result;
	//alert(thisImg.src);
}

function swapText(pnum)
{
	var prdctText = "product-text-" + pnum;
	var prdctTextBlock = document.getElementById(prdctText).style;
	prdctTextBlock.display = "block";
	var prdctTextTemp = "product-text-";
	for(i=1;i<num+1;i++)
	{
		if(pnum!=i)
		{
			document.getElementById(prdctTextTemp + i).style.display = "none";
		}
	}
}

function thumbOver()
{
	var currentId = this.id;
	currentId = currentId.replace("thumb", "");
	swapImg(this,"0","1");
	viewProduct(currentId);
	swapText(currentId);
}
	
function thumbOut()
{
	swapImg(this,"1","0");
}	

function thumbAddEvents()
{
	var thumbList = getElementsByClassName("thumb-roll");	
	for(var i = 0; i < thumbList.length; i++)
	{
		thumbList[i].onmouseover = thumbOver;
		thumbList[i].onmouseout = thumbOut;
	}
	num = thumbList.length;
	return num;
}

function init()
{
	preloadImgs();
	thumbAddEvents();
}

window.onload = init;