$(document).ready(function() {
	
	// Duree de l'animation
	var duree = 150 ;
	
	// Transparence de vignette
	var transparence = 1 ;
	
	// Taille max de l'image principale
	var maxWidth  = 350 ;
	var maxHeight = 350 ;
	
	// Initialisation des animations
	$('#galerie-photo img').each(function() {
		var self = $(this) ;
		var img = new Image() ;
		$(img).load(function() {
			
			// Initialise les thumbs
			self.stop(true, true).animate({opacity: transparence}, {duration: 1}).css('border-color', '#fff') ;
			
			// Calcule la taille
			var realWidth = img.width ;
			var realHeight = img.height ;
			if (realWidth / maxWidth < realHeight / maxHeight)
			{
				var displayHeight = maxHeight ;
				var displayWidth = Math.round(realWidth / realHeight * displayHeight) ;
			}
			else
			{
				var displayWidth = maxWidth ;
				var displayHeight = Math.round(realHeight / realWidth * displayWidth) ;
			}
			self.click(function() {
				return false ;
			});
			
			self.mouseover(function() {
				
				// Contrôle de différence
				if (self.attr('id') == $('#galerie-photo img.selected').attr('id'))
					return ;
				
				// On enleve l'opacité et la class selected sur la photo précédente
				$('#galerie-photo img.selected').removeClass('selected').animate({opacity:transparence},{duration:1}).css('border-color', '#fff') ;
				
				// On met l'opacité et la class selected sur la photo selectionné
				self.stop(true, true).animate({opacity: 1},{duration: duree}).addClass('selected').css('border-color', '#467bcb') ;
				
				// Transition de la photo dans le cadre principal
				$('#photo-principale img')
					.stop(true, true)
					.animate({opacity: 0}, {
						duration: duree,
						complete: function() {
							$('#photo-principale img').attr({src: self.attr('src'), width: displayWidth, height: displayHeight}) ;
						}
					})
					.animate({opacity: 1},{duration: duree}) ;
				
			}) ;
			
			// Activation de la première thumbnail
			if (self.attr('id') == $('#galerie-photo img:first').attr('id'))
			{
				$('#photo-principale img').animate({opacity: 0}, {duration: 0}) ;
				$('#photo-principale').removeClass('hide') ;
				self.mouseover() ;
			}
			
		}) ;
		
		img.src = self.attr('src') ;
		
	}) ;
	
}) ;

