// JavaScript Document
var currentPanel = 1;
var totalPanels = 0;
var autoPlay = true;
var timePassed = 0;
var timeToChange = 10;
var multiplier = 1;
var focus = true;

var currentCase = 1;
var totalCase = 0;
var autoPlayCase = false;
var timeToChangeCase = 3;
var timePassedCase = 0;
var cssStyles = ["first", "second", "three", "four", "five", "six"];

function createRandomCase() {
	var randomNum = Math.floor(Math.random() * window.totalPanels) + 1;
	jQuery('.menulinks li:nth-child(' + randomNum + ')').trigger('click');
}
function setCaption() {
	var captionHeight = jQuery('.marquee_caption').height();
	var marqueeHeight = jQuery('.marquee_container').height();
	var newCaptionHeight = marqueeHeight - captionHeight - 15;
	jQuery('.marquee_caption').delay(100).animate({
		top : newCaptionHeight
	}, 500);
}
function initializeMarquee() {
	jQuery('#casesContainer:hidden').delay(1000).fadeIn(1000);

}

function autoAdvance() {
	if(window.timePassed == window.timeToChange) {
		window.timePassed = 0;
		if(window.currentPanel == window.totalPanels) {
			window.multiplier = -1;
		}
		if(window.currentPanel == 1) {
			window.multiplier = 1;
		}
		if(autoPlay == true) {
			window.onfocus = function() {
				focus = true;
			}
			window.onblur = function() {
				focus = false;
			}
			
			if(focus) {
				jQuery('.menulinks li:nth-child(' + (window.currentPanel + window.multiplier) + ')').trigger('click');
			}
		}
	} else {
		window.timePassed += 1;
	}
}


jQuery(document).ready(function() {
	setInterval(autoAdvance, 1000);
	jQuery('.caseMCon').hover(function() {
		window.autoPlay = false;
		jQuery(this).removeClass('autoplay');
	}, function() {
		window.autoPlay = true;
		window.timePassed = 0;
		jQuery(this).addClass('autoplay');
	});
	//Generate Photo Lineup

	jQuery('.casesM').each(function(index) {
		var photoWidth = jQuery('#casesContainer').width();
		var photoPosition = index * photoWidth;
		jQuery('.caseMCon').css('width', photoPosition + photoWidth);
		jQuery(this).css('left', photoPosition);
	});
	var i;
	for(i in cssStyles) {
		jQuery('.casesM.' + cssStyles[i] + ' .imageClassContainer .imageClass .photo').each(function(index) {
			jQuery('.casesM.' + cssStyles[i] + ' .imageClassContainer .nav').append('<li></li>');
		});
		jQuery('.casesM.' + cssStyles[i] + ' .imageClassContainer .imageClass .photo').each(function(index) {
			var ContainerW = jQuery('.imageClassContainer').width();
			var photoPosition = index * ContainerW;
			jQuery('.imageClass').css('width', photoPosition + ContainerW);
			jQuery(this).css('left', photoPosition);
		});
		jQuery('.casesM.' + cssStyles[i] + ' .nav').each(function(index) {
			jQuery('.casesM.' + cssStyles[i] + ' .nav li:first-child').addClass('selected');
		});
	}

	jQuery('.leftB').click(function() {
		jQuery('.menulinks li:nth-child(' + (window.currentPanel - 1) + ')').trigger('click');
		return false;
	});
	jQuery('.rightB').click(function() {
		jQuery('.menulinks li:nth-child(' + (window.currentPanel + 1) + ')').trigger('click');
		return false;
	});
	//Generate Navigation Links
	jQuery('#casesContainer .casesM').each(function(index) {
		window.totalPanels = index + 1;
	});

	jQuery('.menulinks li').click(function() {
		jQuery('.menulinks li').removeClass('selected');
		jQuery(this).addClass('selected');
		var navClicked = jQuery(this).index();
		var marqueeWidth = jQuery('#casesContainer').width();
		var distanceToMove = marqueeWidth * (-1);
		var newLocation = navClicked * distanceToMove + 'px';
		window.currentPanel = navClicked + 1;
		window.timePassed = 0;

		jQuery('.caseMCon').animate({
			left : newLocation
		}, 1000);
	});

	jQuery('.nav li').click(function() {
		jQuery('.casesM.' + cssStyles[window.currentPanel - 1] + ' .nav li').removeClass('selected');
		jQuery(this).addClass('selected');
		var caseClicked = jQuery(this).index();
		var marqueeWidth = jQuery('.imageClassContainer').width();
		var distanceToMove = marqueeWidth * (-1);
		var newLocation = caseClicked * distanceToMove + 'px';
		window.currentCase = caseClicked + 1;
		window.timePassedCase = 0;

		jQuery('.casesM.' + cssStyles[window.currentPanel - 1] + ' .imageClassContainer .imageClass').animate({
			left : newLocation
		}, 1000);
	});
	createRandomCase();
	initializeMarquee();
});