// JavaScript Document
//Written by Chris Converse
//for lynda.com

var currentPanel = 1;
var totalPanels = 0;
var autoPlay = true;
var timePassed = 0;
var timeToChange = 6;
var window_focus = true;

$ (document).ready(function (){
	//Preload
	$('.marquee_panels img').imgpreload(function(){
		initializeMarquee();
	});
	
	//Is the Window or Tab in focus
	function onBlur() {
		window.window_focus = false;
	};
	function onFocus(){
		window.window_focus = true;
	};
	
	if (/*@cc_on!@*/false) { // check for Internet Explorer
		document.onfocusin = onFocus;
		document.onfocusout = onBlur;
	} else {
		window.onfocus = onFocus;
		window.onblur = onBlur;
	}
	
	setInterval(autoAdvance, 1000);
	
	if(window.autoPlay == true){
		$('.marquee_container').hover(
			function(){
				window.autoPlay = false;
				$(this).removeClass('autoplay');
			},
			function(){
				window.autoPlay = true;
				window.timePassed = 0;
				$(this).addClass('autoplay');
			}
		);
	}
	
	//Generate Photo Lineup
	$('img.marquee_panel_photo').each(function (index){
		var photoWidth = $('.marquee_container').width();
		var photoPosition = index * photoWidth;
		$('.marquee_photos').append('<img class="marquee_photo" style="left:'+photoPosition+'; display:inline-block" src="'+$(this).attr('src')+'" alt="'+$(this).attr('alt')+'" width="'+photoWidth+'" height="310" />');
		$('.marquee_photos').css('width' , photoPosition+photoWidth);
	});
	
	//Generate Navigation Links
	$('.marquee_panels .marquee_panel').each(function(index){
		$('.marquee_nav').append('<a class="marquee_nav_item"></a>');
		window.totalPanels = index + 1;
	});
	
	//Set up Navigation Links
	$('.marquee_nav a.marquee_nav_item').click(function(){
		
		//Set the navigation state
		$('.marquee_nav a.marquee_nav_item').removeClass('selected');
		$(this).addClass('selected');	
	
		var navClicked = $(this).index();
		var marqueeWidth = $('.marquee_container').width();
		var distanceToMove = marqueeWidth * (-1);  //slides to the left, positive 1 for slide to right
		var newPhotoPosition = navClicked * distanceToMove + 'px';
		var newCaption = $('.marquee_panel_caption').get(navClicked);
		window.currentPanel = navClicked + 1;
		
		//Animate the photos and caption
		$('.marquee_photos').animate({left: newPhotoPosition}, 1000);  //time interval to slide
		$('.marquee_caption').animate({top: '300px'}, 500, function (){
			var newHTML = $(newCaption).html();
			$('.marquee_caption_content').html(newHTML);
			setCaption();
		});
	});

});

function autoAdvance(){
	if(window.timePassed == window.timeToChange){
		window.timePassed = 0;
		if(window.currentPanel == window.totalPanels){
			window.currentPanel = 0;
		}
		if(window.autoPlay == true && window.window_focus == true){
			$('.marquee_nav a.marquee_nav_item:nth-child('+(window.currentPanel+1)+')').trigger('click');
		}
	}
	else{
		window.timePassed += 1;
	}
}

function initializeMarquee(){
	$('.marquee_caption_content').html(
		$('.marquee_panels .marquee_panel:first .marquee_panel_caption').html()
	);
	$('.marquee_nav a.marquee_nav_item:first').addClass('selected');
	$('.marquee_photos').fadeIn(1500);
	setCaption();
}

function setCaption(){
	var captionHeight = $('.marquee_caption').height();
	var marqueeHeight = $('.marquee_container').height();
	var newCaptionHeight = marqueeHeight - captionHeight - 15; //padding so that bottom of caption is away from bottom edge
	$('.marquee_caption').delay(100).animate({top: newCaptionHeight}, 500);
}