$(document).ready(function() {
	Cufon.replace('nav ul li, h1, #project_list ul li', 
		{hover: true}
	);
	Cufon.replace('#project_list ul li, .project_info a, .facts p, .facts li, .project_info p');
	
	$(window).resize(function() {
		var new_width = $(window).width();
		var new_height = $(window).height();
		$('#projects_container ul li .project').css('left', new_width/2 + 'px');
		$('#projects_container ul li').css('width', new_width + 'px');
		$('#projects_container ul li .project').css('top', new_height/2 + 'px');
		$('#projects_container ul li').css('height', new_height + 'px');
	});	
	
	$("#nav_projects").click(function(){
		$("#about").animate({left: "-50%"}, 500, "backin");
		$("#projects_container").delay(600).fadeIn(500);
	});
	
	$("#nav_projects").hover(
		function(){
      		$("#overlay").stop(true).css({"z-index": "1000"}).delay(100).fadeIn(0);
			$("#project_list").delay(300).fadeIn(500);
			$("#nav_about").css({"z-index": "0"});},
		function(){
			$("#project_list").stop(true).fadeOut(300);
			$("#overlay").stop(true).fadeOut(200).css({"z-index": "0"});
			$("#nav_about").css({"z-index": "1900"});
	});
	
	$("#nav_about").click(function(){
		$("#projects_container").fadeOut(400);
		$("#about").delay(400).animate({left: "50%"}, 500);
	});
	
	$("#project_list li").hover(
		function(){
      		$("a", this).animate({left: "15px"}, 150);},
		function(){
			$("a", this).animate({left: "0px"}, 150);
	});
	
	$('#projects_container ul') 
	    .cycle({ 
	        fx: 'scrollHorz',
	        speed: 700,
			easing:  'easeinout',
	        timeout: 0,
			speedOut: 600,
			next: "#next",
			prev: "#prev",
			after: onAfter,
			pagerAnchorBuilder: function(idx, slide) { 
				return '#project_list li:eq(' + idx + ') a'; 
			}
    });

	function onAfter() {
		var new_width = $(window).width();
		var new_height = $(window).height();
		$('#projects_container ul li .project').css('left', new_width/2 + 'px');
		$('#projects_container ul li').css('width', new_width + 'px');
		$('#projects_container ul li .project').css('top', new_height/2 + 'px');
		$('#projects_container ul li').css('height', new_height + 'px');
	}
	
	$('#login') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.login'
    });
	$('#mirko') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.mirko'
    });
	$('#mailchimp') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.mailchimp'
    });
	$('#reifman') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.reifman'
    });
	$('#plexus') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.plexus'
    });
	$('#identity') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.identity'
    });
	$('#focus') 
	    .cycle({ 
	        fx: 'fade',
	        speed: 400,
	        timeout: 0,
			pager: '.focus'
    });
	
	$("#contact ul li").hover(
		function(){
      		$(this).stop(true).animate({marginTop: "8px"}, 200);},
		function(){
			$(this).stop(true).animate({marginTop: "0px"}, 200);
	});
	
	$(".project_info h1").click(
		function(){
      		$(this).prevAll().find("span").toggleClass("active");
			$(this).next().toggleFade(100);
	});
	
	$(".btn_more_info").click(
		function(){
      		$(this).next().next().toggleFade(100);
			$("span", this).toggleClass("active");
	});
	
	$(".project_info a").hover(
		function(){
      		$(this).stop(true).animate({backgroundPosition: "6px 6px"}, 150);},
		function(){
			$(this).stop(true).animate({backgroundPosition: "0 6px"}, 150);
	});
	
	$("#prev").hover(
		function(){
      		$(this).stop(true).animate({backgroundPosition: "-10px -100px"}, 150);},
		function(){
			$(this).stop(true).animate({backgroundPosition: "0 -100px"}, 150);
	});
	
	$("#next").hover(
		function(){
      		$(this).stop(true).animate({backgroundPosition: "-80px -100px"}, 150);},
		function(){
			$(this).stop(true).animate({backgroundPosition: "-90px -100px"}, 150);
	});
	
	$("#resume a").hover(
		function(){
      		$("#resume img").stop(true).css({"-webkit-transform": "rotate(370deg)", "-moz-transform": "rotate(370deg)"});},
		function(){
			$("#resume img").stop(true).css({"-webkit-transform": "rotate(0deg)", "-moz-transform": "rotate(0deg)"});
	});
	
});