// ss is effectively a namespace.

var ss = new Object;

ss.timerRunning = false;
ss.timer;
ss.full_images=[];
ss.thumb_images=[];	
ss.thumb_refl_images=[];
ss.hotspots=[];
ss.thumb_overlay=[];
ss.activeIndex = 0;
ss.total = 0;

ss.firstSlide = true;

ss.slide;
ss.urltitle_cta;
ss.thumbnail;
	
ss.thumb_clicked = false;

ss.thumbgray_images=[];
ss.thumbgray_refl_images=[];	

ss.urls=[];
ss.urltitles=[];
ss.titles=[];

ss.cache_url = '';

	$(document).ready(function(){		
			
		if (slideshow_xml) {
	
	 		$.ajax({
                 type: "GET",
                 url: slideshow_xml,
				 complete:initSlideshow,
				 cache:false,
                 dataType: "xml",
                 success: function(xml) {
                     $(xml).find('slide').each(function(i){
                        
						var full_img = $(this).find('full').text();
						var thumb_img = $(this).find('thumb').text();
						var title = $(this).find('title').text();
						var url = $(this).find('url').text();
						var thumbgray = $(this).find('thumbgray').text();
						
						var url_title = $(this).find('urltitle').text();
												
						pushSlide(full_img, thumb_img, title, thumbgray, url, url_title, i);
						
					}); //close each(

                }				 
				
             }); //close $.ajax(
			 
		} 
		else if (slideshow_array)
		{
			
		//	ss.cache_url = '';
			
			ss_length = slideshow_array.length;
			
			for (i=0;i<ss_length;i++) {

			var full_img = slideshow_array[i][0];
			var thumb_img = slideshow_array[i][1];
			var title = slideshow_array[i][2];
			var thumbgray = slideshow_array[i][3];
			var url = slideshow_array[i][4];						
			var url_title = slideshow_array[i][5];
		
			pushSlide(full_img, thumb_img, title, thumbgray, url, url_title, i);			
					
			}
			
			initSlideshow();
		}
		
     }); //close $(
	
	
	function initSlideshow() {
		newSlide(0);	
	}
	
	function pushSlide(full_img, thumb_img, title, thumbgray, url, url_title, i) {
		
		ss.urltitles[i]= url_title;
		ss.urls[i]=url;	
		ss.titles[i]=title;	
		
		
		ss.full_images[i]=new Image();
		ss.full_images[i].src= full_img;
		ss.full_images[i].alt = title;
		
		ss.thumb_images[i]=new Image();
		ss.thumb_images[i].src= thumb_img;
		ss.thumb_images[i].alt = title;
		$(ss.thumb_images[i]).css({'position' : 'relative', 'z-index' : '2'});	
	
		ss.thumbgray_images[i]=new Image();
		ss.thumbgray_images[i].src= thumbgray;
		ss.thumbgray_images[i].alt = title;
		$(ss.thumbgray_images[i]).css({'position' : 'absolute', 'z-index' : '1', 'top' : 0, 'left' : 0 });	
	
		ss.thumb_overlay[i]=new Image();
		ss.thumb_overlay[i].src= '/sites/all/themes/toyotires/images/ss_thumbFG_2.png';
		
		$(ss.thumb_overlay[i]).css({'position' : 'absolute', 'z-index' : '3', 'top' : 0, 'left' : 0 , 'border': 'none', 'border-left' : '1px solid #fff', 'width' : '40px'});	
		
		
		ss.hotspots[i] = document.createElement("div");
		$(ss.hotspots[i]).addClass('thumb-sub');
		
		// REFLECTIONS 
	
		var tb_refl_path = '/reflect_opaque.php?cache=1&img='+ thumb_img +'&height=25&fade_start=50';
		// var tb_refl_path = '/reflect_v3.php?cache=1&img='+ thumb_img +'&height=25&fade_start=50';
		var tb_gray_refl_path = '/reflect_v3.php?cache=1&img='+ thumbgray +'&height=25&fade_start=40&end=.png';
							
		ss.thumb_refl_images[i]=new Image();
		ss.thumb_refl_images[i].src= tb_refl_path;
		ss.thumb_refl_images[i].alt = title;
		$(ss.thumb_refl_images[i]).css({'position' : 'relative', 'z-index' : '2'});					
	
		ss.thumbgray_refl_images[i]=new Image();
		ss.thumbgray_refl_images[i].src= tb_gray_refl_path;
		ss.thumbgray_refl_images[i].alt = title;
		$(ss.thumbgray_refl_images[i]).css({'position' : 'absolute', 'z-index' : '1', 'top' : 0, 'left' : 0 });					
	

		$(ss.hotspots[i]).click(function(){
			ss.thumb_clicked = true;
			ss_stopTimer();
			newSlide(i);
		});
	
		$(ss.hotspots[i]).hover(
		function(){
			thumbOver(i)
		},
		function() {
			thumbOut(i);
		});					
	
		
		$(ss.hotspots[i]).appendTo('#thumb-holder');
		$(ss.hotspots[i]).clone().appendTo('#thumb-refl-holder');
		
		// This is IMPORTANT.  IE 7 will lose the alpha channel during the transition w/o a declared background-color.
		$(ss.thumb_images[i]).addClass('ieFix');
		
		$(ss.thumb_images[i]).appendTo('#thumb-holder div:last-child');
		$(ss.thumbgray_images[i]).appendTo('#thumb-holder div:last-child');
		$(ss.thumb_overlay[i]).appendTo('#thumb-holder div:last-child');
	
							
		$(ss.thumb_images[i]).animate({
			opacity: 0
		}, { duration: 10});			
		
		
		$(ss.thumb_refl_images[i]).appendTo('#thumb-refl-holder div:last-child');
		$(ss.thumbgray_refl_images[i]).appendTo('#thumb-refl-holder div:last-child');
		
		$(ss.thumb_refl_images[i]).animate({
			opacity: 0
		}, { duration: 10});
		
		
	//	$(ss.thumb_overlay[i]).width($(ss.thumb_images[i]).width());
		
		$("#full-slide").hide();
		$('#thumb-holder').css({'border' : '1px solid #ccc' });
		$('#thumb-refl-holder').css({'border' : '1px solid #fcfcfc' });
	
	
		ss.total++;
		
	}		
	
	
	 function newSlide(index) {
				
		ss_stopTimer();
		
		if (!ss.thumb_clicked)
			ss_startTimer();
	
		if (ss.thumb_images[index] == ss.thumbnail)
			return;
		 
		$(ss.thumbnail).removeClass("active");
		
		/*
		$(ss.thumb_overlay[ss.activeIndex]).animate({
			opacity: 1
		}, { duration: 200});			
		*/
		
		// IE can't handle the animation.  It messes up the ALPHA channel in the interim.
		// So it's a discrete event instead.
		
		$(ss.thumb_overlay[ss.activeIndex]).show();	
				
		// Can't be fadeOut, which ends in display:none.  We need the thumb to prop open the div
		$(ss.thumbnail).animate({
			opacity: 0
		}, { duration: 200});
				
		// $(ss.thumb_refl_images[ss.activeIndex]).fadeOut(200);	
		
		
		$(ss.thumb_refl_images[ss.activeIndex]).animate({
			opacity: 0
		}, { duration: 200});	
		
		
		ss.slide = ss.full_images[index];
		ss.activeIndex = index; 	
		ss.urltitle_cta = ss.urltitles[index];
		
		ss.thumbnail = ss.thumb_images[index];
		
		
		$(ss.thumb_overlay[ss.activeIndex]).hide();
			
		/*	
		$(ss.thumb_overlay[ss.activeIndex]).fadeOut(200);		
		
		$(ss.thumb_overlay[ss.activeIndex]).animate({
			opacity: 0
		}, { duration: 200});			
		*/
		
		
		$(ss.thumbnail).animate({
			opacity: 1
		}, { duration: 200});
			
			
		
		/*		
		$(ss.thumb_refl_images[index]).animate({
			opacity: 1
		}, { duration: 200});		
		*/	
			
			
		 $(ss.thumbnail).addClass("active");
		 
		 
		 if (ss.firstSlide && slideshow_array) {
			ss.firstSlide = false;
			
			$(ss.thumb_refl_images[index]).animate({
		  	opacity: 1
			}, { duration: 400});
			
			repopulateSlide();
		 	return;
		 }
		 
		 if (!ss.thumb_clicked) {
			 
			// IE 7 is problem. transparent pngs, on fade and w/o a bkg, look terrible.
			if ($.browser.msie && slideshow_array) {
				$("#full-slide").hide();
				repopulateSlide();
			}
			else {
				$("#full-slide").fadeOut(800, repopulateSlide);
			} 
					
			$(ss.thumb_refl_images[index]).animate({
		  	opacity: 1
			}, { duration: 400});
		 
		 }

		 else {
			 
			// IE 7 is problem. transparent pngs, on fade and w/o a bkg, look terrible.
			if ($.browser.msie && slideshow_array) {
				$("#full-slide").hide();
				repopulateSlide();
			}
			else {
				$("#full-slide").fadeOut(300, repopulateSlide);
			} 

		 }
		 
	 }
	 
	 function thumbOver(j) {
		
		ss_stopTimer();
		
		var thumb = ss.thumb_images[j];
		
		if (thumb == ss.thumbnail)
			return; 
		 
		$(thumb).animate({
		  	opacity: 1
		}, { duration: 400});
		
		
		$(ss.thumb_refl_images[j]).animate({
		  	opacity: 1
		}, { duration: 400});
		
		
		
	 }
	
	 function thumbOut(j) {
		
		var thumb = ss.thumb_images[j];
		
		if (thumb == ss.thumbnail) {
			
			if(ss.thumb_clicked)
				ss_startTimer_extra();
			else
				ss_startTimer();
			return; 
		}
			
		ss_startTimer();
	
	
		$(thumb).animate({
		  	opacity: 0
		}, { duration: 400});
		
		$(ss.thumb_refl_images[j]).animate({
		  	opacity: 0
		}, { duration: 400});
				
		
	 }	
	
	function repopulateSlide() {
		
		if (ss.firstSlide && slideshow_array) {
			ss.firstSlide = false;
			$("#full-slide").show();
			return;
		}
		else {
			$('#full-slide').empty();
			$(ss.slide).appendTo('#full-slide');
		}
		
		if (slideshow_array) {
		// alert(ss.urltitle_cta);
		$('#ss-hotspot').empty();
		$('#ss-hotspot').html('<a href="' + ss.urls[ss.activeIndex] + '" title="' + ss.urltitle_cta + '">&nbsp;</a>');
		}
		
		
		// IE 7 is problem. transparent pngs, on fade and w/o a bkg, look terrible.
		if ($.browser.msie && slideshow_array) {
			$("#full-slide").show();
		} else {
			$("#full-slide").fadeIn(400);	
		}
						
	}
	 
	function autoAdvance() {
		
		// Secondary slides should not still be loading as they are being displayed
		if (!ss.full_images[ss.activeIndex].complete) {
			$(ss.full_images[ss.activeIndex]).load(imgLoadCallback);
			return;
		}
		
		ss_stopTimer();
		
		var index;
		
		// alert(ss.total);
		
		if (ss.activeIndex == (ss.total - 1))
			index = 0;
		else
			index = ss.activeIndex + 1;
			
		newSlide(index);
	
	}
	 		
	function ss_startTimer() {
		ss.thumb_clicked = false;
		ss.timer = setTimeout("autoAdvance()",5500); // nav_timer holds the id of the timer
	 	ss.timerRunning = true; // whenever you start a timer set the nav_ss.timerRunning flag to true 
	}
	
	function ss_startTimer_extra() {
		ss.thumb_clicked = false;
		ss.timer = setTimeout("autoAdvance()",7500); // nav_timer holds the id of the timer
	 	ss.timerRunning = true; // whenever you start a timer set the nav_ss.timerRunning flag to true 
	}
		
	
	function ss_stopTimer() {
	if (ss.timerRunning) {
			clearTimeout(ss.timer); 
			ss.timerRunning = false;
		}
	}
	
	function imgLoadCallback() { 
		autoAdvance();
	}