var canAnimate = true;
var animateTime = 400;
var autoCarouselTime = 4000;

function initCarousel(carouselID) {
	setUpCarousel(carouselID);
	
	$(carouselID+' .carouselWrapper .previous').click(function() {
		if(canAnimate){
			canAnimate = false;
			previousClicked(carouselID);
		}
	})
	$(carouselID+' .carouselWrapper .next').click(function() {
		if(canAnimate){
			canAnimate = false;
			nextClicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(0)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			previous3Clicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(1)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			previous2Clicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(2)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			previousClicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(4)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			nextClicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(5)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			next2Clicked(carouselID);
		}
	})
	$(carouselID+' .carouselThumbList img:eq(6)').live("click", function() {
		if(canAnimate){
			canAnimate = false;
			next3Clicked(carouselID);
		}
	})
	
	var autoCarousel = setInterval( "nextClicked('"+carouselID+"')", autoCarouselTime );
	
	$('.carousel').hover(
		function() {
			clearInterval(autoCarousel)
		},
		function() {
			autoCarousel = setInterval( "nextClicked('"+carouselID+"')", autoCarouselTime );
		}
	)
}

/*==============================================================================================================
=== set up carousel ============================================================================================
==============================================================================================================*/
function setUpCarousel(carouselID) {
	$('<div class="carouselWrapper"></div>')
		.appendTo(carouselID);
		
	$('<div class="previous"></div>')
		.appendTo(carouselID+' .carouselWrapper');
		
	$('<div class="carouselThumbListWrapper"></div>')
		.appendTo(carouselID+' .carouselWrapper');
		
	$('<div class="carouselThumbList"></div>')
		.appendTo(carouselID+' .carouselWrapper .carouselThumbListWrapper');
		
	$('<div class="next"></div>')
		.appendTo(carouselID+' .carouselWrapper');
		
	$('<div class="carouselActiveOverlay"></div>')
		.appendTo(carouselID+' .carouselWrapper');
		
	$(carouselID+' .smallCarousel li').each(function(i){
		$(this).find('.thumbImg')
			.appendTo(carouselID+' .carouselThumbList');
	});
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:eq(3)').addClass('activeImg');
	
	smallCarouselSIFR();
}

/*==============================================================================================================
=== next clicked ===============================================================================================
==============================================================================================================*/
function nextClicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(4)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_", "");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index", "1");
	$(carouselID+' ul.smallCarousel li#' + activeImgID).css("z-index", "0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime, function(){
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#' + activeImgID).addClass('active').css();
	})

	$(carouselID+' .carouselThumbList').animate({
		top: '-41px'
	}, animateTime, "linear", function(){
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList').css("top", "0px");
		canAnimate = true;
	})
}

function next2Clicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(5)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_", "");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index", "1");
	$(carouselID+' ul.smallCarousel li#' + activeImgID).css("z-index", "0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime, function(){
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#' + activeImgID).addClass('active').css();
	})

	$(carouselID+' .carouselThumbList').animate({
		top: '-82px'
	}, animateTime, "linear", function(){
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList').css("top", "0px");
		canAnimate = true;
	})
}

function next3Clicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(6)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_", "");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index", "1");
	$(carouselID+' ul.smallCarousel li#' + activeImgID).css("z-index", "0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime, function(){
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#' + activeImgID).addClass('active').css();
	})

	$(carouselID+' .carouselThumbList').animate({
		top: '-123px'
	}, animateTime, "linear", function(){
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList img:first').appendTo(carouselID+' .carouselThumbList');
		$(carouselID+' .carouselThumbList').css("top", "0px");
		canAnimate = true;
	})
}

/*==============================================================================================================
=== previous clicked ===========================================================================================
==============================================================================================================*/
function previousClicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(2)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_","");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index","1");
	$(carouselID+' ul.smallCarousel li#'+activeImgID).css("z-index","0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime,function() {
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#'+activeImgID).addClass('active').css();
	})
	
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList').css("top","-41px");
	
	$(carouselID+' .carouselThumbList').animate({
		top: '0px'
	}, animateTime, "linear", function() {
		canAnimate = true;
	})
}
function previous2Clicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(1)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_","");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index","1");
	$(carouselID+' ul.smallCarousel li#'+activeImgID).css("z-index","0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime,function() {
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#'+activeImgID).addClass('active').css();
	})
	
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList').css("top","-82px");
	
	$(carouselID+' .carouselThumbList').animate({
		top: '0px'
	}, animateTime, "linear", function() {
		canAnimate = true;
	})
}
function previous3Clicked(carouselID) {
	$(carouselID+' .activeImg').removeClass('activeImg');
	$(carouselID+' .carouselThumbList img:eq(0)').addClass('activeImg');
	var activeImgID = $(carouselID+' .carouselThumbList .activeImg').attr('id').replace("thumb_","");
	
	$(carouselID+' ul.smallCarousel li.active').css("z-index","1");
	$(carouselID+' ul.smallCarousel li#'+activeImgID).css("z-index","0").show();
	
	smallCarouselSIFR();
	
	checkIfGradProfileIsLong(carouselID, activeImgID);
	
	$(carouselID+' ul.smallCarousel li.active').fadeOut(animateTime,function() {
		$(this).removeClass('active');
		$(carouselID+' ul.smallCarousel li#'+activeImgID).addClass('active').css();
	})
	
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList img:last').prependTo(carouselID+' .carouselThumbList');
	$(carouselID+' .carouselThumbList').css("top","-123px");
	
	$(carouselID+' .carouselThumbList').animate({
		top: '0px'
	}, animateTime, "linear", function() {
		canAnimate = true;
	})
}


/*==============================================================================================================
=== check for grad profile length ==============================================================================
==============================================================================================================*/
function checkIfGradProfileIsLong(carouselID, activeImgID) {
	if(carouselID == '#gradSuccessCarousel') {
		var gradProfileHeight = $(carouselID+' ul.smallCarousel li#' + activeImgID + ' .gradProfile').height();
		if (gradProfileHeight <= 288) {
			$(carouselID+' ul.smallCarousel li#' + activeImgID + ' .gradProfileNextPage').hide();
			$(carouselID+' ul.smallCarousel li#' + activeImgID + ' .gradProfilePreviousPage').hide();
		}
	}
}


/*==============================================================================================================
=== grad profile ===============================================================================================
==============================================================================================================*/
function gradProfile() {
	
	$('.gradProfileNextPage').click(function() {
		if(canAnimate) {
			var buttonClicked = this;
			var profileHeight = $(this).parent().find('.gradProfile').height();
			var numberOfPages = Math.ceil(profileHeight/288);
			var positionOfLastPage = (-288*(numberOfPages-1));
			var positionTop = $(this).parent().find('.gradProfile').position().top;	
			
			if(positionOfLastPage < positionTop) {
				canAnimate = false;
				var positionToMoveTo = (positionTop - 288)+'px'
				$(this).parent().find('.gradProfile').animate({
					"top": positionToMoveTo
				}, animateTime, "linear", function() {
					//callback
					$(this).parent().parent().find('.gradProfilePreviousPage').removeClass('gradProfilePreviousPageInactive');
					var checkIfLastPage = parseInt($(this).position().top);
					if(checkIfLastPage == positionOfLastPage) {
						$(buttonClicked).addClass('gradProfileNextPageInactive');
					}
					canAnimate = true;
				})
				
			}
		}
	})
	
	$('.gradProfilePreviousPage').click(function() {
		if(canAnimate) {
			var buttonClicked = this;
			var positionTop = $(this).parent().find('.gradProfile').position().top;
			
			if(positionTop < 0) {
				canAnimate = false;
				var positionToMoveTo = (parseInt(positionTop) + 288)+'px'
				$(this).parent().find('.gradProfile').animate({
					"top": positionToMoveTo
				}, animateTime, "linear", function() {
					//callback
					$(this).parent().parent().find('.gradProfileNextPage').removeClass('gradProfileNextPageInactive');
					var checkIfZero = parseInt($(this).position().top);
					if(checkIfZero == 0) {
						$(buttonClicked).addClass('gradProfilePreviousPageInactive');
					}
					canAnimate = true;
				})
			}
		}
	}) 
};



/*==============================================================================================================
=== tabbedBox =================================================================================================
==============================================================================================================*/
function tabbedBox() {
	$('.tabbedBox .tabs .tab').click(function() {
		var isTabActive = $(this).hasClass('active');
		if(isTabActive == false) {
			$(this).parent().find('.activeTab').removeClass('activeTab');
			$(this).addClass('activeTab');
			
			var contentToShow = '#'+($(this).attr('id'))+'Content';
			$(this).parent().parent().find('.activeContent').hide().removeClass('activeContent');
			$(this).parent().parent().find(contentToShow).show().addClass('activeContent');
		}
	});
};



/*==============================================================================================================
=== run javascript =============================================================================================
==============================================================================================================*/
$(document).ready(function() {
	initCarousel('#creativeSpacesCarousel');
	initCarousel('#gradSuccessCarousel');
	gradProfile();
	tabbedBox();
});