// JavaScript Document

$(document).ready(function() {
	
	// We need a loop count to keep track of which folio item we're on
	var nLoopCount = 1;
	
	// Initially hide the transport controls and intro
	$('#mainIntro_h1').hide();
	$('#mainIntro_p').hide();
	$('#mainIntro_h2').hide();
	$('#mainIntro_ul').hide();
	$('#mainIntro').hide();
	$('#arrowLeft').hide();
	$('#arrowRight').hide();
	
	// Fade in the intro
	$('#mainIntro').fadeIn('slow', function() {
        $('#mainIntro_h1').fadeIn('slow', function() {
       		$('#mainIntro_p').fadeIn('slow', function() {
        		$('#mainIntro_h2').fadeIn('slow', function() {
        			$('#mainIntro_ul').fadeIn('slow', function() {
        				// Do Less
					});
				});
			});
		});
		// Get the height of the article and transfer it to the twitter tray
		var nArticleHeight = 0;
		nArticleHeight = $('#article_main').height() + 38;
		$('#twitterTray article').css({'height': nArticleHeight + 'px' });
		$('#twitterTray').css({'height': nArticleHeight + 'px' });
	});
	
	// Listen for the click on stater
	$('#startBtn').click(function() {
		// Fade out the intro para
		$(this).parent().parent().fadeOut('slow', function() {
        	// Introduce the arrow controls
			// $('#arrowLeft').fadeIn('slow');
			$('#arrowRight').fadeIn('slow', function() {
        		folioNext();
			});
		});
		return false;
	});
	
	// Listen for the click on right arrow
	$('#arrowRight').click(function() {
		folioNext();
		return false;
	});
	
	// Listen for the click on left arrow
	$('#arrowLeft').click(function() {
		folioPrev();
		return false;
	});
	
	// Show next folio item
	function folioNext() {
		
		if (!$('#arrowRight').hasClass('disabled')) {
		
			if (nLoopCount == 15) {
				$('#arrowRight').fadeOut();
			}
		
			$('#arrowRight').addClass('disabled');
			
			$('#folio_' + nLoopCount).show();
			$('#folio_' + nLoopCount).css({ 'opacity': 0 });
			$('#folio_' + (nLoopCount - 1)).animate({
				opacity: 0,
				left: -980 + "px"
			}, 500, function() {
				// $(this).css({'left': '980px' });
			});	
			$('#folio_' + nLoopCount).animate({
				opacity: 1,
				left: 0 + "px"
			}, 500, function() {
				$('#arrowRight').removeClass('disabled');
				nLoopCount++;
				if (nLoopCount == 3) {
					$('#arrowLeft').fadeIn();
				}
			});	
		}
	}
	
	// Show previous folio item
	function folioPrev() {
		
		if (!$('#arrowLeft').hasClass('disabled')) {
		
			if (nLoopCount == 3) {
				$('#arrowLeft').fadeOut();
			}
		
			$('#arrowLeft').addClass('disabled');
			
			$('#folio_' + (nLoopCount - 2)).show();
			$('#folio_' + (nLoopCount - 2)).css({ 'opacity': 0 });
			$('#folio_' + (nLoopCount - 1)).animate({
				opacity: 0,
				left: 980 + "px"
			}, 500, function() {
				// $(this).css({'left': '980px' });
			});	
			$('#folio_' + (nLoopCount - 2)).animate({
				opacity: 1,
				left: 0 + "px"
			}, 500, function() {
				$('#arrowLeft').removeClass('disabled');
				nLoopCount--;
				if (nLoopCount == 15) {
					$('#arrowRight').fadeIn();
				}
			});
		}
	}
	
	// =================================================
	// TWITTER FEED CONTROL
	// =================================================
	
	// Hide all the twigets to start with
	$('.twiget, #tw_Close > img').hide();
	
	$('#tw_Dan_Image, #tw_Mark_Image, #tw_Peto_Image, #tw_Ash_Image, #tw_Lisa_Image').click(
		function () {
			$('#tw_Close > img').fadeOut('fast');
			var relativeFeed = $(this).attr('class');
			$('#twitterTray').animate({ width: 364 + "px" }, 300, function() {
				// Do Less
			});	
			$('#twiget_container').animate({ width: 10 + "px" }, 300, function() {
				// Hide all the twigets to start with
				$('.twiget').hide();
				$('#' + relativeFeed).show();
				$('#twiget_container').animate({ width: 300 + "px" }, 500, function() {
					$('#tw_Close > img').fadeIn('fast');
				});	
			});	
			return false;
		}
	);
	
	$('#tw_Close').click(
		function () {
			$('#tw_Close > img').fadeOut('fast');
			$('#twitterTray').animate({ width: 64 + "px" }, 300, function() {
				// Do Less
			});
			$('#twiget_container').animate({ width: 10 + "px" }, 300, function() {
				// Do less	
			});	
			return false;
		}
	);
				
});