var thumbSetTotal = 50;
var togSlideShow = true;
var startIndex = 0;
var index = 0;
var interval;
var intervalScroll;
var ie55 = window.createPopup;
var imagesLoaded = new Array();


function scrollForward() {
	intervalScroll = window.setInterval("nextSet()", 900);
}

function scrollBackward() {
	intervalScroll = window.setInterval("previousSet()", 900);
}

function stopScroll() {
	clearInterval(intervalScroll);
}


function loadImages() {

	
	if (togSlideShow) {
		for (i = 0; i < imagesLarge.length; i++) {
			var image = new Object();
			image = new Image(320, 240);
			image.src = imagesLarge[i].src;
			imagesLoaded[i] = image;
		}
		startInterval();
		togSlideShow = false;
	}
	else {
		clearInterval(interval);
		togSlideShow = true;
	}
}

function startInterval(){
	clearInterval(interval);
	interval = window.setInterval("start()", 5000);
}

function start() {

	if (index == imagesSmall.length - 1) 
		index = 0;
	else
		index += 1;

	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").className = "ImageFilter";
	if (ie55) document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").filters.apply();
	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").src = imagesLoaded[index].src;
	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").alt = imagesLoaded[index].src;
    var changeTo = "large" + (index+1);

document.getElementById("ctl00_ContentPlaceHolder1_LblComments").innerHTML = document.getElementById(changeTo).title;	
	
	if (ie55) document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").filters.play();
	

}

function changeImage(changeTo) {
//alert(document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").src );
	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").src = document.getElementById(changeTo).value;	
	
}	

function changeImage1(changeTo, selectedIndex) {
    document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").className = "ImageFilter";
	if (ie55) document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").filters.apply();
	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").src = document.getElementById(changeTo).value;
	document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").alt = document.getElementById(changeTo).value;
	document.getElementById("ctl00_ContentPlaceHolder1_LblComments").innerHTML = document.getElementById(changeTo).title;
	if (ie55) document.getElementById("ctl00_ContentPlaceHolder1_largeDetailImage").filters.play();
	//document.getElementById("largeDetailImage").src = document.getElementById(changeTo).value;
	//document.getElementById("largeDetailImage").alt = imagesLoaded[index].src		
	index = selectedIndex - 1;
}

	
function nextSet() {

	if ((startIndex + (thumbSetTotal - 1)) < imagesSmall.length - 1)
		startIndex += 1;
	else
		stopScroll();
	
	var counter = 1;
	var output = "";
	
	output = "<table cellpadding=0 cellspacing=3 border=0 width=100%>";
	output += "<tr><td align=right width=50%><img src=images/vehicle/up_arrow.jpg onMouseOver=\"mouseCursor('hand')\" onMouseOut=\"mouseCursor('')\" onMouseDown='scrollBackward()' onMouseUp='stopScroll()' onClick='previousSet()' /></td>";
	
	for (i = startIndex; i < imagesSmall.length; i++) {
		if (counter <= thumbSetTotal) {
			output += "<input type=hidden id=small" + i + " value=" + imagesSmall[i].url + " >";
			output += "<input type=hidden id=medium" + i + " value=" + imagesMedium[i].url + " >";
			output += "<input type=hidden id=large" + i + " value=" + imagesLarge[i].url + " >";
			output += "<td><img src='" + imagesSmall[i].url + "' onclick=\"changeImage1('large" + i + "', " + i + ");return false\" style='border:#000000 Solid 1px; cursor:hand;'></td>";
		}
		counter += 1;
	}
	
	if ((startIndex + (thumbSetTotal - 1)) == imagesSmall.length - 1)
		output += "<td align=left width=50%><img src=images/spacer.gif width=1 height=1 /></td>";
	else
		output += "<td align=left width=50%><img src=images/vehicle/down_arrow.jpg onMouseOver=\"mouseCursor('hand')\" onMouseOut=\"mouseCursor('')\"	onMouseDown='scrollForward()' onMouseUp='stopScroll()' onClick='nextSet()' /></td>";
	
	output += "</tr></table>";

	document.all.Thumbs.innerHTML = output;
}

function previousSet() {

	if (startIndex > 0)
		startIndex -= 1;
	else
		stopScroll();
		
	var counter = 1;
	var output = "";
	
	output = "<table cellpadding=0 cellspacing=3 border=0 width=100%>";
	output += "<tr>"
	
	if (startIndex == 0)
		output += "<td align=right width=50%><img src=images/spacer.gif width=1 height=1 /></td>";
	else
		output += "<td align=right width=50%><img src=images/vehicle/up_arrow.jpg onMouseOver=\"mouseCursor('hand')\" onMouseOut=\"mouseCursor('')\" onMouseDown='scrollBackward()' onMouseUp='stopScroll()' onClick='previousSet()' /></td>";
	
	for (i = startIndex; i < imagesSmall.length; i++) {
		if (counter <= thumbSetTotal) {
			output += "<input type=hidden id=small" + i + " value=" + imagesSmall[i].url + " >";
			output += "<input type=hidden id=medium" + i + " value=" + imagesMedium[i].url + " >";
			output += "<input type=hidden id=large" + i + " value=" + imagesLarge[i].url + " >";
			output += "<td><img src='" + imagesSmall[i].url + "' onclick=\"changeImage1('large" + i + "', " + i + ");return false\" style='border:#000000 Solid 1px; cursor:hand;'></td>";
		}
		counter += 1;
	}
	
	output += "<td align=left width=50%><img src=images/vehicle/down_arrow.jpg onMouseOver=\"mouseCursor('hand')\" onMouseOut=\"mouseCursor('')\"	onMouseDown='scrollForward()' onMouseUp='stopScroll()' onClick='nextSet()' /></td>";
	output += "</tr></table>";
	
	document.all.Thumbs.innerHTML = output;
}

window.onload = loadImages;