var nextImg = 0;
var switchTime = 4000; // The pause between automated shifts / ms
var fadeTime = 400; // The time taken to fade out and fade in images / ms
var topImgs = new Array();

// To add an image to the animation simply add one onto the end
// To associate it with a button, make sure the button div has id="promo[index_of_image_from_below]"
topImgs[0] = {'file':'images/topimages/siliconehosekits.jpg'};
topImgs[1] = {'file':'images/topimages/performancekits.jpg'};
topImgs[2] = {'file':'images/topimages/aluminiumpipes.jpg'};
/* topImgs[3] = {'file':'images/topimages/brakelinekits.jpg'};*/ 
topImgs[3] = {'file':'images/topimages/superflexi.jpg'};
topImgs[4] = {'file':'images/topimages/siliconeducting.jpg'};
topImgs[5] = {'file':'images/topimages/vacuumtubing.jpg'};
topImgs[6] = {'file':'images/topimages/hoseclamps.jpg'};
topImgs[7] = {'file':'images/topimages/brakelinekits.jpg'};
topImgs[8] = {'file':'images/topimages/historic.jpg'};
topImgs[9] = {'file':'images/topimages/takeoff.jpg'};
topImgs[10] = {'file':'images/topimages/oilcatchcans.jpg'};
topImgs[11] = {'file':'images/topimages/limitededitions.jpg'};
topImgs[12] = {'file':'images/topimages/filters.jpg'};
topImgs[13] = {'file':'images/topimages/intercoolers.jpg'};
/*topImgs[14] = {'file':'images/topimages/blankingplugs.jpg'};*/
function autoSwitch() {
	if (nextImg > topImgs.length - 2) {
		nextImg = -1;
	}
	
	$('#promo').fadeOut(fadeTime, function(){
			$('#promo').attr('src', topImgs[nextImg].file);
			$('#promo').fadeIn(fadeTime);
		});
	
	$('.promoOn').removeClass('promoOn');
	$('#promo' + (nextImg + 2) + ' .promo').addClass('promoOn');
	
	nextImg++;

	switcher = setTimeout('autoSwitch()', switchTime);
}

$(document).ready(function(){
	switcher = setTimeout('autoSwitch()', switchTime);

	$('#promo').bind('mouseenter', function(){
			clearTimeout(switcher);
		});

	$('#promo').bind('mouseleave', function(){
			switcher = setTimeout('autoSwitch()', switchTime);
		});

	$('table#promolinks td').bind('mouseenter', function(){
			clearTimeout(switcher);
			var index = this.id.replace(/promo/, '') - 1;
			
			if (index >= 0) {
				var newImg = topImgs[index].file;
				var currImg = $('#promo').attr('src');
	
				if(newImg != currImg) {
					nextImg = index + 1; // Set the next image for the next time we loop
					
					$('#promo').fadeOut(fadeTime, function(){
							$('#promo').attr('src', newImg);
							$('#promo').fadeIn(fadeTime);
						});
					
					$('.promoOn').removeClass('promoOn');
					$('#' + this.id + ' .promo').addClass('promoOn');
				}
			}
		});

	$('table#promolinks td').bind('mouseleave', function(){
			switcher = setTimeout('autoSwitch()', switchTime);
		});
	});