//Global
var _img;
InitImgElements();


function ImgOnClick(theEvent)
{
	var img;
	if(!theEvent) theEvent = window.event;
	
	img = theEvent.srcElement ? theEvent.srcElement : theEvent.target;

	var imgID = $idnum(img);
	for(var i = 1; i < _img.length + 1; i++) 
	{
		_img[i - 1].src = smImage[i - 1];
	}
	
	img.src = smrolloverImage[imgID - 1];
	var largeImage = $get('largeImage');
	largeImage.src = lgImage[imgID - 1];
	largeImage.onclick = function() { Redirect(links[imgID - 1]); } ;
	
}


function InitImgElements()
{
	_img = new Array(4);
	for(var i = 1; i < _img.length + 1; i++)
	{
		_img[i - 1] = $get("img"+i);
		_img[i - 1].style.cursor = 'pointer';
	}
	preLoader();
}

//loads images into cache..
function preLoader()
{
	var tempImage = new Image();
	for(var i = 0; i < lgImage.length; i++)
		tempImage.src = lgImage[i];
		
	for(var i = 0; i < smImage.length; i++)
		tempImage.src = smImage[i];

	for(var i = 0; i < smrolloverImage.length; i++)
		tempImage.src = smrolloverImage[i];
	
}

function Redirect(url)
{
	window.location = url;
}


//helper functions
function $get(id) { return document.getElementById(id); }


function $idnum(element) { return element.id.substr(3, 1); }