$(document).ready(function(){	 
	 var home = true;
	 var identity = false;
	 var webdesign = false;
	 var illustration = false;
	 var about = false;
	 $("#logo").fadeOut(0);
	 $("#copyright").fadeOut(0);
	 $('#preload').fadeOut(0);
	 $("#menu").fadeOut(0);
	 $("#hire").fadeOut(0);
	 $('#welcome').fadeOut(0);
	 $("#over-mij").fadeOut(0);
	 $("#back").fadeOut(0);
	 $('#full-view').fadeOut(0);
	 $("#content-identity").fadeOut(0);
	 $("#content-over-mij").fadeOut(0);
	 $("#content-identity-showcase").fadeOut(0);
	 $("#content-webdesign").fadeOut(0);
	 $("#content-webdesign-showcase").fadeOut(0);
	 $("#content-illustration").fadeOut(0);
	 $("#content-illustration-showcase").fadeOut(0);
	 $("#logo").delay(3500).slideDown(750,'easeOutExpo');
	 $('#welcome').delay(750).slideDown(750,'easeOutExpo');
	 $('#welcome').delay(1250).fadeOut(500);
	 $("#copyright").delay(4200).slideDown(500);
	 $("#menu").delay(4400).fadeIn(500);
	 $("#over-mij").delay(4600).fadeIn(500);
	 $("#hire").delay(3800).fadeIn(500);
	 $('#preload').delay(3000).fadeIn(200).animate({rotate: '+=800deg'}, 1000);
	 $('#preload').fadeOut(200);
	 $('#content').animate({height: '100%'}, 500);
	 $('#content').delay(300).animate({marginLeft: '-75px', width: '150px'}, 500,'easeOutExpo');
	 
	 function backHome(){
		 home = true;
					$("#content-identity").fadeOut(500);
					$("#content-identity-showcase").fadeOut(500);
					$("#content-illustration").fadeOut(500);
					$("#content-illustration-showcase").fadeOut(500);
					$("#content-webdesign").fadeOut(500);
					$("#content-webdesign-showcase").fadeOut(500);
					$("#content-over-mij").fadeOut(500);
					$('#content').delay(700).animate({marginLeft: '-75px', width: '150px'}, 500,'easeOutExpo');
					$('#logo').animate({top: '50%'}, 500);
				
		 }
	 $('#identity').click(function(){
		identity = true;
		if (home) {
		 home = false;
		 $('#logo').animate({top: '15%'}, 500);
		 $('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500);
		 $("#content-identity").delay(1000).fadeIn(500);
		} else {
			$("#content-illustration-showcase").fadeOut(500);
			$("#content-illustration").fadeOut(500);
			$("#content-webdesign-showcase").fadeOut(500);
			$("#content-webdesign").fadeOut(500);
			$("#content-identity-showcase").fadeOut(500);
			$("#content-over-mij").fadeOut(500);
			$('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
			$("#content-identity").delay(1000).fadeIn(500);
		}
	 });
	 
	 $('#illustration').click(function(){
		illustration = true;
		if (home) {
		 home = false;
		 $('#logo').animate({top: '15%'}, 500);
		 $('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
		 $("#content-illustration").delay(1000).fadeIn(500);
		} else {
			$("#content-identity-showcase").fadeOut(500);
			$("#content-identity").fadeOut(500);
			$("#content-webdesign-showcase").fadeOut(500);
			$("#content-webdesign").fadeOut(500);
			$("#content-over-mij").fadeOut(500);
			$("#content-illustration-showcase").fadeOut(500);
			$('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
			$("#content-illustration").delay(1000).fadeIn(500);
		}
	 });
	 
	 $('#webdesign').click(function(){
		webdesign = true;
		if (home) {
		 home = false;
		 $('#logo').animate({top: '15%'}, 500);
		 $('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500);
		 $("#content-webdesign").delay(1000).fadeIn(500);
		} else {
			$("#content-identity-showcase").fadeOut(500);
			$("#content-identity").fadeOut(500);
			$("#content-webdesign-showcase").fadeOut(500);
			$("#content-illustration-showcase").fadeOut(500);
			$("#content-illustration").fadeOut(500);
			$("#content-over-mij").fadeOut(500);
			$('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
			$("#content-webdesign").delay(1000).fadeIn(500);
		}
	 });
	 
	  $('#over-mij').click(function(){
		about = true;
		if (home) {
		 home = false;
		 $('#logo').animate({top: '15%'}, 500);
		 $('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
		 $("#content-over-mij").delay(1000).fadeIn(500);
		} else {
			$("#content-identity-showcase").fadeOut(500);
			$("#content-identity").fadeOut(500);
			$("#content-webdesign-showcase").fadeOut(500);
			$("#content-webdesign").fadeOut(500);
			$("#content-illustration-showcase").fadeOut(500);
			$("#content-illustration").fadeOut(500);
			$('#content').delay(500).animate({marginLeft: '-150px', width: '300px'}, 500,'easeOutExpo');
			$("#content-over-mij").delay(1000).fadeIn(500);
		}
	 });
	 
	 
	 
	 $('#logo').click(function(){
		if (!home) {
		 	backHome();
		}
	 });
	 
	 $('#showcase-identity').click(function(){
		 $("#content-identity").fadeOut(500);
		 $('#content').delay(500).animate({marginLeft: '-250px', width: '500px'}, 500,'easeOutExpo');
		 $("#content-identity-showcase").delay(1000).fadeIn(500);
	 });
	 
	 $('#showcase-illustration').click(function(){
		 $("#content-illustration").fadeOut(500);
		 $('#content').delay(500).animate({marginLeft: '-250px', width: '500px'}, 500,'easeOutExpo');
		 $("#content-illustration-showcase").delay(1000).fadeIn(500);
	 });
	 
	 $('#showcase-webdesign').click(function(){
		 $("#content-webdesign").fadeOut(500);
		 $('#content').delay(500).animate({marginLeft: '-250px', width: '500px'}, 500,'easeOutExpo');
		 $("#content-webdesign-showcase").delay(1000).fadeIn(500);
	 });
	 $('img.showcase').click(function(){
		 var imgheight = 0;
		 var imgwidth = 0;
		 var src = $(this).attr("src").replace("small", "large");
		 var text = $(this).attr("alt");
		 
		 $('<img id="showcase-full"/>')
		.attr('src', src)
		.load(function(){
			$('#full-view img').remove();
			$('#full-view').append($(this));
			imgheight = $("#full-view").height();
			imgwidth  = $("#full-view").width();
			$('#showcase-full').fadeOut(0);
			$("#full-view > p").html(text);
			$('#full-view').delay(500).css("marginLeft", -imgwidth/2+'px');
			$('#full-view').delay(500).css("marginTop", -imgheight/2+'px');
			$('#full-view > p').delay(500).css("marginTop", imgheight+20+'px');
			$('#preload').delay(200).fadeIn(400).animate({rotate: '+=500deg'}, 500);
	 		$('#preload').fadeOut(400);
			$('#content').delay(500).animate({marginLeft: -(imgwidth+100)/2+'px', width: imgwidth+100+'px'}, 500,'easeOutExpo');
			$('#showcase-full').delay(400).fadeIn(400);
			$("#full-view").fadeIn(400);
			$("#full-view > p").fadeIn(500);
			$("#logo").fadeOut(500);
			$("#over-mij").fadeOut(500);
			$("img.showcase").fadeOut(500);
			$("h2").fadeOut(500);
			$("p.description").fadeOut(500);
			$("#menu").fadeOut(500);
			$("#hire").fadeOut(500);
			
			$("#full-view").delay(500).fadeTo(300,1);
			$("#back").fadeIn(300);
		});
		 
		
	 });
	 
	  $('#full-view').click(function(){
		 $('#back').fadeOut(200);
		 $('#full-view > img').fadeOut(200);
		 $('#full-view > p').fadeOut(200);
		 $('#content').delay(200).animate({marginLeft: '-250px', width: '500px'}, 500,'easeOutExpo');
		 $("#logo").delay(600).fadeIn(400);
		 $("#over-mij").delay(600).fadeIn(400);
		 $("img.showcase").delay(600).fadeIn(400);
		 $("h2").delay(600).fadeIn(400);
		 $("p.description").delay(600).fadeIn(400);
		 $("#menu").delay(600).fadeIn(400);
		 $("#hire").delay(600).fadeIn(400);
	 });
	 
	 $('#back').click(function(){
		 $('#back').fadeOut(200);
		 $('#full-view > img').fadeOut(200);
		 $('#full-view > p').fadeOut(200);
		 $('#content').delay(200).animate({marginLeft: '-250px', width: '500px'},500,'easeOutExpo');
		 $("#logo").delay(600).fadeIn(400);
		 $("#over-mij").delay(600).fadeIn(400);
		 $("img.showcase").delay(600).fadeIn(400);
		 $("h2").delay(600).fadeIn(400);
		 $("p.description").delay(600).fadeIn(400);
		 $("#menu").delay(600).fadeIn(400);
		 $("#hire").delay(600).fadeIn(400);
	 });
});