document.observe("dom:loaded", function() {	
	// Add lastDescendant method for later use	
	// Set up Original class names for links and turn them on
	var thumbs = $$('a.thumb');
	var banners = $$('a.banner');
	
	thumbs[0].setStyle({ position: 'absolute', left: '-137px', border: '1px solid #06C', width: '62px', height: '41px', top: '0px' }).show();
	var current = $('thumb1').id;
	thumbs[1].setStyle({ position: 'absolute', left: '-66px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff'}).show();
	thumbs.last().setStyle({ position: 'absolute', left: '-205px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff' }).show();
	
	// Track Primary Display
	var tracked = false;
	function trackPrimary(){ // setTimeout acting buggy without a function being passed
		if (!tracked) {
			pageTracker._trackEvent("Solution Banner " + (thumbs[0].down('img').src.slice(-9).replace('.jpg','')) , "Primary Impression", "Solution Banners");
			tracked = true;
		}
	}
	
	banners.each(function(elem) { //Track Primary impressions on clickthrough
		elem.observe('click', function(event){
			event.stop();
			trackPrimary();
			setTimeout('document.location = "' + elem.href + '"', 100);
			});
	});
	
	
	trackPrimary.delay(15);
	// Move images so that current image is in the center	
	$('srThumbs').appear();	
	function moveNext(key, auto) {
		// key is the ID NUMBER of the thumb we have clicked on
		// Need to fade the bg, pull in the next, then move thumbnails
		banners.invoke('hide');
		thumbs.invoke('hide');
		current = $('thumb'+key).id;
		$('thumb'+key).setStyle({ position: 'absolute', left: '-137px', border: '1px solid #06C', width: '62px', height: '41px', top: '0px', opacity: '1' }).show();
		if ($('thumb'+key) == thumbs.last()) {
			//Set new Next
			$('thumb1').setStyle({ position: 'absolute', left: '-66px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff' }).show();
		}
		else {
			$('thumb'+((key * 1) + 1)).setStyle({ position: 'absolute', left: '-66px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff' }).show();
		}
		if ($('thumb'+key) == thumbs.first()) {
			thumbs.last().setStyle({ position: 'absolute', left: '-205px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff' }).show();	
		}
		else {
			$('thumb'+((key * 1) - 1)).setStyle({ position: 'absolute', left: '-205px', top: '3px', opacity: '0.5', width: '57px', height: '35px', border: '1px solid #fff' }).show();
		}
		$('banner'+key).appear();
		//thumbs[0].setStyle({ position: 'absolute', left: '-216px' }).show();
		//thumbs.last().setStyle({ position: 'absolute', left: '-72px' }).show();
		if (auto) { 
			var next;
			if (key > 4) { next = 1; } else { next = ((key*1)+1); }
			autoBanner = moveNext.delay(8, next, true); 
			return autoBanner;
		}
	}
	
	// Link Actions
	var curKey = "";
	thumbs.each(function(elem) {
		var sku = elem.down('img').src.slice(-9).replace('.jpg','');
		var tracked = false;
		elem.observe('click', function(event){
		var key = elem.identify();
			if (!tracked) {
				pageTracker._trackEvent("Solution Banner "+sku, "Secondary Impression", "Solution Banners")
				tracked = true;
			}
		key = key.replace("thumb","");
		clearTimeout(autoBanner);
		var stopBanner = true;
		moveNext(key, false);
		trackPrimary();
		});
	});
	
	thumbs.each(function(elem) {
		elem.observe('mouseover', function(){
			if (elem.identify() != current){
				elem.setStyle({opacity: '1', border: '1px solid #06C'});
			}
		});
	});	
	
	thumbs.each(function(elem) {
		elem.observe('mouseout', function(){
			if (elem.identify() != current){ 
				elem.setStyle({opacity: '0.3', border: '1px solid #fff'});
			}
		});
	});
	autoBanner = moveNext(2, true);
});
