$(document).ready(function(){
startPosn = 0;

$('.descr, .prevNext').show();
$('.url').hide();
$('.aboutMeDiv,.whyCoffeeDiv,.portfolioDiv').hide();
$('.aboutMeDiv').fadeIn('slow');
$('#index').addClass('aboutMeBody');

	$('#index .whyCoffee').click(function(){
		$('.content').hide();
		$('#index').removeClass();
		$('#index').addClass('whyCoffeeBody');
		$('.whyCoffeeDiv').fadeIn('slow');
		return false;					 
	 });
	
	$('#index .aboutMe').click(function(){
		$('.content').hide();
		$('#index').removeClass();
		$('#index').addClass('aboutMeBody');
		$('.aboutMeDiv').fadeIn('slow');
		return false;					 
	 });
	
	
	$('#index .portfolio').click(function(){
		$('.content').hide();
		$('#index').removeClass();
		$('#index').addClass('portfolioBody');
		$('.portfolioDiv').fadeIn('slow');
		carousel('prepare');
		imageLoader();
		return false;					 
	 });
	
	$('.next').click(function(){
			carousel('next');
			return false;	
			});
	$('.prev').click(function(){
			carousel('prev');
			return false;	
			});
	
	//portfolio thumbnail	
	
	$('.thumb').click(function(){
		var path = 'images/portfolio/';
		var rel = $(this).attr('alt');
		var ttl = $(this).attr('title');
		$('#popup')	.hide()	
					.fadeIn('slow')
					.addClass('activated')
				   	.html('<img src="'+ path + rel +'.jpg" />');
		imageLoader();
		$('.descr').html('www.'+ttl);
		return false;
	});

	//website planner
	//$('h4 + ol').not('#gettingStarted').hide();
	$('#gettingStartedNav,#planningYourWebsiteNav,#marketingAndDevelopingNav,#planyourWebsiteNav').hide();
	
	$('.gettingStarted #gettingStartedNav,.marketing #marketingAndDevelopingNav,.planning #planningYourWebsiteNav,.plan #planyourWebsiteNav').show();
	
	$('#websitePlanner .heading').toggle(
		function(){
			$('h4 + ol').not(this).slideUp('slow');
			$('.heading a').removeClass('active');
			$(this).next('ol').slideDown('slow');
			$(this).children('a').addClass('active');
			},
		function(){
			$(this).next('ol').slideUp('slow');
			$(this).removeClass('active');
			}
		
	);

//load images
imageLoader();
});


//image loader
function imageLoader(){
		  	$('img').load(function () {
		      $(this).hide();
		      $(this).fadeIn();
		    });// end load
}


function carousel(move){

var vThumb = 2;
var thumbWidth = 160;// width of the thumbnail li including any padding or borders
var thumbHeight = 320 ;
var topPosn = vThumb * thumbWidth;
var vWidth = vThumb*thumbWidth;
var carouselWidth = 235;	
switch(move){	
	case 'prepare':
		$('.carousel').css({width:carouselWidth+'px', height:thumbHeight+'px', overflow:"hidden", position:"relative", left:"0"});
		$('.carousel ul').css({position:"absolute"});		
		
		var path = 'images/portfolio/';
		var rel = $('.thumb:first').attr('alt');
		var ttl = $('.thumb:first').attr('title');
		$('#popup')	.hide()	
					.fadeIn('slow')
					.addClass('activated')
				   	.html('<img src="'+ path + rel +'.jpg" />');
		$('.descr').html('www.'+ttl);
		
	break;
	case 'next':
		moveNext();
	break;
	case 'prev':
		movePrev();
	break;
}
	function moveNext(){
			var newtopPosn = startPosn - topPosn;
			var moveNum = $('.carousel ul li').length / vThumb;
			var lastLeft = 0 - moveNum * topPosn;
			//alert(moveNum);
			$('.prev').fadeIn('slow');
			if(newtopPosn != lastLeft){
					$('.carousel ul').animate({top:newtopPosn+ "px"},1000);
					startPosn = startPosn - topPosn;
			}else{
				$('.next').fadeOut('slow');	
			}
	}
			
	function movePrev(){
			var newtopPosn = startPosn + topPosn;
			$('.next').fadeIn('slow');
			if(startPosn != 0){
				startPosn = startPosn + topPosn;
					$('.carousel ul').animate({top:newtopPosn+ "px"},1000);
			}else{
			$('.prev').fadeOut('slow');	
			}
	}
	
}