// JavaScript Document

/*********************************************************************************************/
/********************************Box jQuery Slide Effect************************************************/
/*********************************************************************************************/

$(function(){
	// Une boucle va parcourir chaque vignette, et créer les effets de survol
	$('.boxDef').each(function(index){//.boxDef est la classe attachée à nos vignettes
		
		
		//var index = $("div").index(this);
		var index = index + 4; //on ajoute 3 car on commence a #box3
		var iterstring = index.toString(); //iterstring : le numero de la vignette
		//alert(index + ' ' + $(this).text());
		
		var containerstring = "#box" + iterstring;//alert(containerstring );
		var container = $(containerstring);//container cible notre vignette, par exemple #box6
		
		
		var colourstring = "#overlay" + iterstring;//alert(colourstring);
		var colour = $(colourstring);
		
		var contentstring = "#hover" + iterstring;//alert(contentstring);
		var content = $(contentstring);
		content.hide(); 
		colour.hide();
		
		
		container.hover(function(){
			//au survol de la vignette, on affiche les informations
			content.stop().show().css({'left':'-310px'}).animate({left:0},300);
			colour.stop().fadeTo(500, .7)
		}
		,function(){
			//les informations dispairaissent
			content.stop().animate({left:310},300);
			colour.stop().fadeTo(500, 0)
		});
		
	});
});//end jQuery




/*********************************************************************************************/
/********************************Icons Effects fb,twitt,vim*****************************/
/*********************************************************************************************/

$(function(){
	
		$('img.a').hover(
				function(){
					$(this).stop().animate({'opacity':'0'},'slow');
					$('img.c,img.d,img.e,img.f').stop(true,true).fadeOut();
					$('img.fb').stop().animate({'left':'100px','top':'20px'}).show(500);
				},
				function(){
					$(this).stop().animate({'opacity':'1'},'slow');
					$('img.fb').stop(true,true).fadeOut('fast');
					$('img.c,img.d,img.e,img.f').stop(true,true).fadeIn();
					
				}
		);//end hover()
		
		$('img.c').hover(
				function(){
					$(this).stop().animate({'opacity':'0'},'medium');
					$('img.a,img.b,img.e,img.f').stop(true,true).fadeOut().hide();
					//$('img.d').animate({'bottom':'6px','height':'60px'});
					$('img.twitt').animate({'left':'-30px','top':'10px'}).show(500);
				},
				function(){
					$(this).stop().animate({'opacity':'1'},'slow');
					//$('img.d').stop().animate({'top':'6px','height':'70px','left':'70px'});
					$('img.twitt').stop(true,true).fadeOut('fast');
					$('img.a,img.b,img.e,img.f').stop(true,true).fadeIn();
					
				}
		);//end hover()
		
		$('img.e').hover(
				function(){
					$(this).stop().animate({'opacity':'0'},'slow');
					$('img.a,img.b,img.c,img.d').stop(true,true).fadeOut();
					$('img.vim').stop().animate({'left':'10px','top':'17px'}).show(500);
				},
				function(){
					$(this).stop().animate({'opacity':'1'},'slow');
					$('img.vim').stop(true,true).fadeOut('fast');
					$('img.a,img.b,img.c,img.d').fadeIn();
					
				}
		);//end hover()
		
});//end jQuery


/*********************************************************************************************/
/********************************jFlickrFeed Plugin************************************************/
/*********************************************************************************************/


$(function(){
	
	$('#flickr').jflickrfeed({ //#flickr est la div ou nous affichons le diaporama
	limit: 11, //nombre d'image à afficher dans le diaporama
	qstrings: {
		id: '56124596@N02' //id du compte Flickr
	},
	itemTemplate: '<li><img class="size_flickr" src="{{image}}" alt="" /><div id="title_flickr">{{title}}</div></li>'
	}, function(data) {
	$('#flickr div').hide();
	$('#flickr').cycle({
		timeout: 3000, //on chande d'image toute les 3 secondes
		fx :'fade',
		//fx:  'scrollDown', 
		speed :'2000',
		pause :'1',
		random : '1'//on affiche les images dans un ordre aléatoire
		
	});
	$('#flickr li ').hover(function(){
		$(this).children('div').fadeIn();//si on survole l'image, des informations s'affichent
		
	},function(){
		$(this).children('div').fadeOut();
	});
});
		


});//end jQuery





/*********************************************************************************************/
/********************************Awards************************************************/
/*********************************************************************************************/

$(function(){
	
		$('.trig1').hover(
				function(){
					$('.award1a').stop(true,true).fadeIn(1000);
					$('.award1b').stop(true,true).fadeIn(2000);
					$('.award1c').stop(true,true).fadeIn(2600);
				},
				function(){
					$('.award1a').stop(true,true).fadeOut(1000);
					$('.award1b').stop(true,true).fadeOut(800);
					$('.award1c').stop(true,true).fadeOut(600);
				}
		)
		
		$('.trig2').hover(
				function(){
					$('.award2').stop(true,true).fadeIn(1000);
				},
				function(){
					$('.award2').stop(true,true).fadeOut(700);
				}
		)
		
		$('.trig3').hover(
				function(){
					$('.award3').stop(true,true).fadeIn(1000);
				},
				function(){
					$('.award3').stop(true,true).fadeOut();
				}
		)
		
		$('.trig4').hover(
				function(){
					$('.award4').stop(true,true).fadeIn(1000);
				},
				function(){
					$('.award4').stop(true,true).fadeOut();
				}
		)
		
		$('.trig5').hover(
				function(){
					$('.award5').stop(true,true).fadeIn(1000);
				},
				function(){
					$('.award5').stop(true,true).fadeOut();
				}
		)
});


/*********************************************************************************************/
/********************************Nivo Slider************************************************/
/*********************************************************************************************/
$(window).load(function() {
	$('#slider').nivoSlider({
		directionNav:false,
		controlNav:false,
		pauseOnHover:true,
	});
});