/*
 * http://code.google.com/p/jquery-inheritance/
 **/

var Showcase = jQuery.inherit({
	__constructor : function(sections, listSections, params){
		
		// Le carrousel ne fonctionne qu'avec un nombre impair de slide. On ajoute une slide quand le nombre initial est pair
		// Ajoute un élément vide et le place au milieu de la liste html
		// pour que la slide soit affiché, lors de son initialisation, en arrière plan du carrousel
		
		if( jQuery(sections).length % 2 == 0 ) {
			li_index = Math.round(jQuery(sections).length / 2);
			jQuery(jQuery(sections)[li_index]).after('<li></li>');
			jQuery(jQuery(listSections)[li_index]).after('<li></li>');
		}
		
		this.listSections 	= jQuery(listSections);	// liste textuelle en relation avec les slides
		this.allSections 	= jQuery(sections);
		this.sections 		= jQuery(sections);
		
		this.options = jQuery.extend({
				ratio: 					0.6,
				initialDelay: 			1000, 	// ms
				duration: 				500,	// ms	
				size:					this.sections.length
			}, params || {});
			
		this.running 	= false;
		this.queue		= new Array;
		
		this.computeMetrics();	
		
		// Définie le tableau des éléments 
		// en fonction du nombre de slide à afficher (half) 
		// et le nombre de slide réellement présent (allsections)
		this.sections = jQuery.makeArray(this.allSections).slice(this.currentIndex - this.half, this.currentIndex + this.half + 1);
		
		//Position de départ des slides
		this.allSections.each(jQuery.proxy(function(index,section) {
			jQuery(section).css({
				position: 'absolute',
				zIndex: Math.abs(index - this.sections.length),
				left: '50%',
				top: '50%',
				marginLeft: -1 * Math.round(parseFloat(jQuery('#slides li td').css('width'))) / 2 ,
				marginTop: -1 * Math.round(parseFloat(jQuery('#slides li td').css('height'))) / 2,
				opacity : 1
			});
			section.initialIndex = index;
			
			
			
			// Ajoute l'évènement onclick
			// Si il n'y a qu'une image, inutile de continuer
			if(jQuery(sections).length > 1) {
				jQuery(section).click(jQuery.proxy(function(){
					this.jump(section);
				},this));
				
				// Ajoute l'effet d'opacité sur le rollover
				jQuery(section).mouseover(function () {
					jQuery(this).css('opacity', 1);
				}).mouseout(function () {
					jQuery(this).css('opacity', section.opacity);
				});
				
				// cache.les slides dans la file d'attente ! 
				if (!jQuery.inArray(jQuery(section),this.sections)) {
					this.queue.push(jQuery(section).hide());
				}
			}
		}, this));
		
		// Déplace de la moitié les éléments du tableau pour "centrer" l'affichage avec le premier élément du tableau
		for (i = 0; i <= this.half; i++) {
			this.sections.push(this.sections.shift());
		}
		
		// Gère le click sur les éléments textuels
		if(this.listSections.length > 0) {
			this.listSections.each(jQuery.proxy(function (index, listsection) {
				jQuery(listsection).click(jQuery.proxy(function() {
					this.jumpList(index);
				}, this));
			}, this));
		}
		
		this.animate();
	},
	
	computeMetrics: function () {
		this.half 			= (this.options.size - 1) / 2;	
		this.currentIndex	= this.half;	
		this.ratioStep 		= Math.round(((1 - this.options.ratio) / this.currentIndex) * 100) / 100;
		this.positionStep 	= Math.round(50 / this.half * 100) / 100;		
		this.maxDimensions 	= {
			'height':	parseFloat( this.sections.eq(0).css('height') ),
			'width':	parseFloat( this.sections.eq(0).css('width') )
			};
	},
	
	previous: function () {
		if (this.options.size < this.allSections.length) {
			var sectionIn 	= this.queue.shift();
			var sectionOut 	= this.sections.pop();		
		
			this.sections.unshift(sectionIn);
			this.queue.push(sectionOut.fade({
					duration: this.options.duration
				}));
		} else {
			this.sections.unshift(this.sections.pop());
		}
	},
	
	next: function () {
		if (this.options.size < this.allSections.size()) {
			var sectionIn 	= this.queue.shift();
			var sectionOut 	= this.sections.shift();
			this.sections.push(sectionIn);
			this.queue.push(sectionOut.fade({duration: this.options.duration}));
		} else {
			this.sections.push(this.sections.shift());
		}
	},
	
	jump : function (section) {
		
		if (!this.running) {
		
			var direction = '';
			
			// direction = 'previous';
			if (section.index < this.half) {
				for(var times=0; times < this.half - section.index; times++) {
					this.previous();
				}
			} else if (section.index == this.half) {
			} else { // direction = 'next';
				for(var times=0; times < section.index - this.half; times++) {
					this.next();
				}
			}
		}
		
		this.animate();
	},
	
	jumpList : function (index) {
		
		if (!this.running) {
			var section = this.allSections[index];
			
			var direction = '';
			
			// Calcule la différence entre l'index de la slide et la distance 
			// à parcourir pour aller vers la slide du milieu
			if (section.index > this.half) {
				for(var times=0; times < (section.index - this.half); times++) {
					this.next();
				}
				direction = 'previous';
			} else if (section.index == this.half) {
			} else {
				for(var times=0; times < (this.half - section.index); times++) {
					this.previous();
				}
				direction = 'previous';
			}
		}
		
		this.animate(direction);
	},
	
	/**
	 * Fonction qui effectue l'animation en parallèle pour toutes les slides
	 **/
	runEffects: function () {
		
		this.stackSections();
		
		jQuery.map(this.effects, jQuery.proxy(function(n, i){
			this.running = true;
			
			// Fix ie - vérification sur les chiffres
			if(this.allSections.length > 1) {
				var tmpMarginTop = (parseFloat(n.style.marginTop)) ? parseFloat(n.style.marginTop) : "0";
				var tmpLeft = (parseFloat(n.style.left)) ? parseFloat(n.style.left) : 0;
				var tmpMarginLeft = (parseFloat(n.style.marginLeft)) ? parseFloat(n.style.marginLeft) : 0;
			} else {
				var tmpMarginTop = (parseFloat(n.style.marginTop)) ? parseFloat(n.style.marginTop) : "-85";
				var tmpLeft = (parseFloat(n.style.left)) ? parseFloat(n.style.left) : 50;
				var tmpMarginLeft = (parseFloat(n.style.marginLeft)) ? parseFloat(n.style.marginLeft) : 0;
			}
			
			// animation du conteneur
			jQuery(n.section).animate({
				marginTop: tmpMarginTop,
				left: tmpLeft+'%',
				opacity:(n.section.opacity) ? n.section.opacity : 1,
				marginLeft: tmpMarginLeft+"px"
			},
			this.options.duration,
			jQuery.proxy(function() {
				this.running = false;
			},this));
		},this));
		
		var libelle = jQuery(this.listSections[this.currentIndex]).html();
		jQuery('#mod_cc_libelle').html( libelle );
	},
	
	/** 
	 * Function qui redéfini le z-index de chaque slide
	 **/
	stackSections: function () {
		this.sections.each(function (section) {
			jQuery(section).css({
				zIndex: section.stackIndex
			});
		});
	},
	
	/**
	 * Function appelée au début de chaque lancement d'animation
	 * permet de calculer différentes informations pour chaque slide 
	 **/
	indexSections: function () {
		this.sections.each(jQuery.proxy(function (section, index) {
			section.index 			= index;
			section.modifier 		= Math.abs(Math.abs((section.index - (this.sections.length - 1) / 2)) - this.half);
			
			section.ratio 			= Math.round(((section.modifier * this.ratioStep) + this.options.ratio) * 100) / 100;			
						
			//section.width 			= Math.min(Math.round(this.maxDimensions.width * section.ratio), this.maxDimensions.width);
			section.height 			= Math.min(Math.round(this.maxDimensions.height * section.ratio), this.maxDimensions.height);		
			
			section.width 			= '170';
			
			section.positionIndex 	= (section.index - (this.options.size - 1) / 2);
			section.stackIndex 		= Math.abs(Math.abs((section.index - (this.options.size - 1) / 2)) - this.half) + 1;					
			
			// Position en pourcentage par rapport au bloc conteneur
			section.left 			= Math.round((this.half + section.positionIndex) * this.positionStep);
			section.top 			= section.left;
			
			section.opacity			= Math.min(section.ratio, 1);
			
		}, this));
	}	
});

var JCarrouselHorizontal = jQuery.inherit(Showcase, {
	animate : function() {
		this.indexSections();
		this.effects = new Array();		
		this.sections.each(jQuery.proxy(function (section, index) {
			
			var style = {
				left: 		section.left + '%', 
				top:		'50%',
				marginTop:	-Math.abs(parseFloat(section.height) / 2) + 'px'
				};
			
			if (section.left == 0) {
				style.marginLeft = '0px';
			} else if (section.left == 50) {
				style.marginLeft = -Math.round(section.width / 2) + 'px';					
			} else if (section.left == 100) {
				style.marginLeft = -section.width + 'px';
			} else {
				style.marginLeft = -Math.round(section.width / 2) + 'px';
			}
			
			this.effects.push({
				'section': section,
				'style': style
			});
		},this));
		
		//modifie l'index en cours et gère la classe "active" pour le lien produit
		jQuery(this.listSections[this.currentIndex]).removeClass('active');
		this.currentIndex = this.sections[this.half].initialIndex;
		jQuery(this.listSections[this.currentIndex]).addClass('active');
		
		this.runEffects();
		
	}
});