/* 

	@Description: Carousel Air france
	@Auteur: Neov
	@Creation: 07/10/2008

*/

(function($){
		
	$.fn.extend({
				
		
		// ajout scrollableImage 
		scrollableImage: function(param)
		{
			this.each(
				function()
				{
					// parametres
					var s = $.extend(
						{
							index		: 0,
							nbrImg		: 0,
							globalWidth : 0,
							sameWidth	: false,
							step		: 0,
							currentItem : 0,
							lastDist	: 0,
							time		: 500,
							parent		: $(this),
							waitImage	: '<img src="' + j_basepath + 'design/front/images/design/preload.gif" class="waiting" />'
						}
						, param
					);
					
					// desactive les boutons precedent et suivant au chargement
					$(this).parent().find('.picto').find('a').addClass('inactive');
					$(this).find('li').hide();
					$(this).append(s.waitImage);
					// cache les images au chargement
					
					// si taille image fixe
					if ( $(this).hasClass('fixsize') ) s.sameWidth = true;
					
					// suppression marge du dernier element
					$('ul > li:last-child', this).find('img').css({marginRight: 0});
					
					
					// ajout preloader					
					s.nbrImg = $(this).find('img').length;
					
					$(this).find('img').each(
						function()
						{
							$(this).preloadImage(s);
						}
					);
										
				}
			);
		},
		
		// preload image.
		preloadImage: function(s)
		{		
			var imagePreloader = new Image();
	
			imagePreloader.onload = function () {
				imagePreloader.onload = null;
				var imgWidth = imagePreloader.width;
				s.index++;
				
				// action lors de la fin du preload
				if(s.index == s.nbrImg)	$().setScroll(s);
			};
					
			imagePreloader.src = $(this).attr('src');

		},
		
		// mis en place du scroller
		setScroll: function(s)
		{
			var $parent = s.parent;

			// fixe le step pour les images de meme taille
			if (s.sameWidth) s.step = $('ul > li', $parent).eq(0).width();
			
			$parent.find('.waiting').animate(
				{opacity:'hide'},
				200,
				function() {
					$parent.find('li').show();
					//$parent.find('li').animate({opacity:'show'}, 500)
				}
			);
			
			// modification de la taille de la liste
			var listLength = $parent.find('ul').find('li').length;
			
			$parent.find('ul').find('li').each(
				function()
				{
					s.globalWidth += $(this).width();
					//alert(s.globalWidth)
				}
			);
			
			$parent.find('ul').width(s.globalWidth);
			var pWidth = parseInt($parent.width());
						
			// initialisation de la position des elements defilants
			$parent.find('ul').css({left: 0 });
			
			
			// action move left
			function moveLeft() {
				var $btn = $(this);
				
				// suppression des clics successives
				$btn.unbind('click');
				
				// position actuelle de l'element defilant
				var cLeft = parseInt($parent.find('ul').css('left'));
				
				// defilement
				if (s.sameWidth) {

					if (cLeft > (pWidth - s.globalWidth)) {
						$parent.find('ul').animate({left:'-=' + s.step}, s.time);
						$parent.parent().find('.prec').find('a').removeClass('inactive');
					}
					
					$parent.find('ul').queue(
						function()
						{
							if ( pWidth == (s.globalWidth + parseInt($parent.find('ul').css('left'))) ) {
								$parent.parent().find('.suiv').find('a').addClass('inactive');
							}

							$btn.bind('click', moveLeft);
							$(this).dequeue();
						}
					);

				} else {
					s.step = $parent.find('ul').find('li').eq(s.currentItem).width();
					
					if (cLeft > (pWidth - s.globalWidth) + s.step) {
						$parent.find('ul').animate({left:'-=' + $parent.find('ul').find('li').eq(s.currentItem).width() }, s.time);
						s.currentItem ++;
					} else if ((s.globalWidth + cLeft) == pWidth) { 
						// console.log('end');
					}else {
						$parent.find('ul').animate({left: (pWidth - s.globalWidth)}, s.time);
						if (s.lastDist == 0) s.lastDist = s.globalWidth - pWidth + cLeft;
						s.currentItem ++;
					}
					
					$parent.parent().find('.prec').find('a').removeClass('inactive');
					
					$parent.find('ul').queue(
						function()
						{
							
							if ( pWidth == (s.globalWidth + parseInt($parent.find('ul').css('left'))) )	$parent.parent().find('.suiv').find('a').addClass('inactive');
							$btn.bind('click', moveLeft);
							$(this).dequeue();
						}
					);
				}
			}
			
			// action move right
			function moveRight() {
				var $btn = $(this);
				
				// suppression des clics successives
				$btn.unbind('click');
				
				// position actuelle de l'element defilant
				var cLeft = parseInt($parent.find('ul').css('left'));	
				
				// defilement
				if (s.sameWidth) {
					if (cLeft < 0) {
						$parent.find('ul').animate({left:'+=' + s.step}, s.time);
					}
					
					$parent.find('ul').queue(
						function()
						{
							if ( parseInt($parent.find('ul').css('left')) == 0 ) $parent.parent().find('.prec').find('a').addClass('inactive');
							$parent.parent().find('.suiv').find('a').removeClass('inactive');
							$btn.bind('click', moveRight);
							$(this).dequeue();
						}
					);
					
				} else {
					
					if (cLeft < 0) {
						s.currentItem --;
						
						if ( (pWidth - s.globalWidth) == cLeft ) {
							$parent.find('ul').animate({left:'+=' + s.lastDist }, s.time);
						} else {
							$parent.find('ul').animate({left:'+=' + $parent.find('ul').find('li').eq(s.currentItem).width() }, s.time);
						}
						
					}
					
					$parent.find('ul').queue(
						function() {
							if ( s.currentItem == 0 ) $parent.parent().find('.prec').find('a').addClass('inactive');
							$parent.parent().find('.suiv').find('a').removeClass('inactive');
							$btn.bind('click', moveRight);
							$(this).dequeue();
						}
					);
					
				}
			}
			
			//alert(s.globalWidth);
			
			// active ou non les boutons
			if ( s.globalWidth <= pWidth ) {
				// desactivation des boutons
				$parent.parent().find('.suiv').find('a').addClass('inactive');
				$parent.parent().find('.prec').find('a').addClass('inactive');
				
			} else {
				// activation des boutons suivants au chargement
				$parent.parent().find('.suiv').find('a')
					.removeClass('inactive')
					.bind('click', moveLeft);
				$parent.parent().find('.prec').find('a').bind('click', moveRight);
			}
			
			
		}
	});
	
})(jQuery);

$(function() {
		   
	$('.enveloppe_image').scrollableImage();
	
});
