var duree = 170;
var duree_portfolio = 300;
var vol = false;

function getBGPositionX(e){
	position = e.css("backgroundPosition");
	positionEspace = position.indexOf(" ", 0);
	position = position.substr(0,positionEspace);
	return position;
}


$(function(){
	//lightbox
	$(".art_vignettes a").fancybox({
		'padding'	:	0,
		'overlayOpacity' : 0.8,
		'overlayColor' : '#000000'
	});
	
	//menu
	$("#nav li a").hover(
		function(){
			position = getBGPositionX($(this)) + " -11px";
			$(this).animate({backgroundPosition: "("+position+")"}, {duration:duree});
		},
		function(){
			if(!$(this).parent().hasClass("active")){
				position = getBGPositionX($(this)) + " 0px";
				$(this).animate({backgroundPosition: "("+position+")"}, {duration:duree});
			}
		}
	);
	$("#nav li a").click(function(){
		if(!$(this).parent().hasClass("active")){
			$("#projets .article").removeClass("hidden");
			filtre = $(this).attr("rel");
			
			//on enleve tous les elements qui sont active
			$("#nav li.active a").each(function(){
				position = getBGPositionX($(this)) + " 0px";
				$(this).animate({backgroundPosition: "("+position+")"}, {duration:duree});
			});
			$("#nav li.active").removeClass("active");
			$(this).parent().addClass("active");
			
			//on fait le traitement d'affichage
			if(filtre == "tous"){
				$("#projets .article").removeClass("hidden");
			}
			else{
				$("#projets .article."+filtre).removeClass("hidden");
				$("#projets .article:not([class~='"+filtre+"'])").addClass("hidden");
			}
			$('.article.hidden').animate({opacity: 0},{ duration: 1000 });
            $('.article:not(.hidden)').animate({opacity: 1},{ duration: 1000 });
			$('#projets').masonry();
	
		}
		return false;
	});
	$('#projets').masonry({
			columnWidth: 1,
			itemSelector: '.article:not(.hidden)',
			animate: true,
			animationOptions: {duration: 1000,queue: false}
		}
	);
	
	//on met le menu à "Tous"
	$("#nav li:first").addClass("active");
	
	
	//portfolio
	$("#portfolio #main .article a.lien_article").hover(function(){
		//$(this).find("span").fadeIn(200);
		 $(this).find("span.ensavoirplus").fadeIn(300);
		 $(this).find("span.titreprojet").animate({
			opacity: 0.9,
			paddingLeft : '+=20px' ,
			backgroundPosition : '(19px 8px)'
		  }, 150);
		  $(this).find("img.color").animate({
			opacity: 1
		  }, 100);
	},
	function(){
		$(this).find("span.ensavoirplus").fadeOut(100);
		$(this).find("span.titreprojet").animate({
			opacity: 0.8,
			paddingLeft : '-=20px',
			backgroundPosition : '(-8px 8px)'
		  }, 300);
		  $(this).find("img.color").animate({
			opacity: 0
		  }, 300);
	});
	
	//.article
	$("#portfolio #main .article a.lien_article").click(function(){
		 action = $(this).text();
		 articleCourant = $(this).parent().parent().parent();
		  $(".details").fadeOut("details",function(){
			  $(this).find(".complet").hide();
			  $(this).find(".simple").show();
			  $(this).removeClass("details");
			  $(this).fadeIn();  
			  if(action != "Fermer"){

				  articleCourant.animate({
					opacity: 0
				  }, 100,function(){
					  articleCourant.find(".simple").hide()
					  articleCourant.find(".complet").show();
					  $(this).addClass("details");
					  
					  if(!articleCourant.find(".art_vignettes img").attr("src")){
							articleCourant.find(".art_vignettes").prepend('<img src="'+articleCourant.find("span.image").text()+'" alt="Apercu" class="" width="375" height="188" />');
							articleCourant.find("span.image").remove();
					  }
					  
					  $('#projets').masonry({},function(){
							articleCourant.animate({opacity: 1}, 1000);
					  });
					  position= $(this).offset();
					  $.scrollTo( position.top-200, 400 );
				 });
			}else{
				$('#projets').masonry();
				$('#details').addClass("details")
			}

		  });
		  
		return false;	
	});
	
	
	//ninja
	$("#logo").hover(
		function(){
		if(!vol){
			$('#ninja').stop().animate({
				opacity:1,
				top: "-43px"
			  }, 300);
		}
		},
		function(){
		if(!vol){
			$('#ninja').stop().animate({
				opacity:1,
				top: "-132px"
			  }, 200);
		}
				
		
	});
	
	//top
	$(".scroll").hover(function(){
		$(this).animate({opacity:1}, 200);
	},
	function(){
		$(this).animate({opacity:0.5}, 200);
	});
	
	$(".scroll").click(function(){
		id=$(this).attr("id");
		if(id == "scrollBottom"){
			 $.scrollTo("h2.portfolio", 400 );
		}
		if(id == "scrollTop"){
			 $.scrollTo("#infos", 400 );
		}
		return false;
	});

	

	//NINJA
	$("#logo").click(function(){
		if(!vol){
			$('#ninja').stop().animate({
				opacity:1,
				top: "-132px"
			  }, 200,function(){
				$('#ninja').removeClass("a3");
				$('#ninja').animate({
					display: 'block',
					opacity:1,
					top: "+0px"
				  }, 600,function(){
						$(this).addClass("a2");
						$(this).delay(400).animate({
							display: 'block',
							opacity:0,
							top: "-200px"
						  });
						$("#logo").delay(400).animate({
							display: 'block',
							opacity:0,
							top: "-200px"
						  });
				  });
			  });
		vol = true;
		}
		return false;
	});

	//lien blank
	$(".art_infos a, #social a,#diplomes a").click(function(){
		window.open($(this).attr("href"));
		return false;
	});

	//lien video
	$("a.video").click(function() {
                 $.fancybox({
                  'padding'             : 0,
                  'autoScale'   : false,
                  'transitionIn'        : 'none',
                  'transitionOut'       : 'none',
                  'title'               : this.title,
                  'width'               : 680,
                  'height'              : 495,
				  'overlayOpacity' : 0.8,
				  'overlayColor' : '#000000',
                  'href'                : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
                  'type'                : 'swf',    // <--add a comma here
                  'swf'                 : {'allowfullscreen':'true'} // <-- flashvars here
                  });
                 return false;

            }); 
	
	
});