/**
 * author Lemoigne Sylvain
 * 
 * version v1.0 - 21/07/2008
 *
 * utilisation de mootools v1.2
 */
 
/**
 * Evolution a prevoir pour la classe
 *		- rajouter des options pour controler le fonctionnement de la classe
 *			- pour activer les bulles
 *			- pour définir le sens de parcours des objets de la classe bulle (note : parcours pt a revoir)
 *			- pour definir les parametres du movement
 *		- revoir le systeme de gestion des bulles (fonction update picto)
 *		  notamment pour les src de l'image, remplacer les images passées en argument par une méthode generique
 *		- prevoir de pouvoir demarrer sur un autre element que le premier
 *		- prevoir un sens de defilement
 */

/*
 * Default HTML to use this class
 *	The differents name aren't mandatory
 *	You can change their
 * 	HTML
 *		<div id="arrow-left"></div>
 *		<div id="content">
 *			<div id="bloc">
 *				<div class="element"></div>
 *				<div class="element"></div>
 *				<div class="element"></div>
 *			</div>
 *		</div>
 *		<div id="arrow-right"></div>
 *
 *	CSS
 *		#content{
 *			position:relative;
 *			width:100px;
 *			overflow:hidden;
 *		}
 *		#bloc{
 *			position:absolute;
 *			left:0px;
 *			width:10000px;
 *		}
 *		.element{
 *			float:left;
 *		}
 */

var Diaporama = new Class({
	
	/**
	 * 	function Constructor
	 *		Init variable
	 *		Create event
	 *
	 *	Parameter
	 *		param string	- id of container
	 * 		param string	- id of bloc move
	 * 		param string	- name of the class element
	 * 		param string	- left arrow's id
	 * 		param string	- right arrow's id
	 *		param bool		- active or not bulle
	 *		param string	- class of picto
	 *		param string	- src of picture
	 *		param string	- src of picture select
	 *		param bool		- scroll auto
	 *		param int		- scroll period in millisecond
	 *		param int		- scroll period to restart after a stop in millisecond
	 */
	initialize: function(	
		idContent,
		idBloc, 
		classElement, 
		idLeftArrow, 
		idRightArrow,
		picto,
		classPicto,
		srcPicto,
		srcPictoSelect,
		scroll,
		scrollPeriod,
		scrollRestart )
	{
		this.idContent = idContent;
		this.idBloc = idBloc;
		this.classElement = classElement;
		this.idLeftArrow = idLeftArrow;
		this.idRightArrow = idRightArrow;
		
		this.picto = picto;
		this.classPicto = classPicto;
		this.srcPicto = srcPicto;
		this.srcPictoSelect = srcPictoSelect;
		
		this.scroll = scroll;
		this.scrollPeriod = scrollPeriod;
		this.scrollRestart = scrollRestart;
		
		this.pas = $$(this.classElement).getSize()[0].x;
		this.nbElement = ($$(this.classElement).length) - 1; //because take 0
		this.xStart = $(this.idBloc).getPosition($(this.idContent)).x;
		this.xCurrent = this.xStart;
		
		this.initMove();
		
		this.createLeftArrowEvent();
		this.createRightArrowEvent();
		
		if(this.scroll)
			this.startPeriod();
	},
	
	
	/**
	 * Create the move
	 *
	 *
	 */
	initMove: function()
	{
		this.fxMove = new Fx.Tween(
			this.idBloc, 
			{
				wait:false, 
				transition:Fx.Transitions.Sine.easeOut, 
				duration:1000
			}
		);
	},
	
	/**
	 * start call periodical move
	 *
	 */
	startPeriod: function(){
		this.period = this.rightMove.periodical(this.scrollPeriod, this);
	},
	
	/**
	 * stop periodical move
	 *
	 */
	stopPeriod: function(){
		$clear(this.period);
		this.startPeriod.delay(this.scrollRestart, this);
	},
	
	/**
	 * Update the src of pictures
	 *
	 */
	updatePicto: function()
	{
		var numElement = - this.xCurrent / this.pas;
		var i = this.nbElement;
		$$(this.classPicto).each(function(el){
			if(i == numElement)
				el.src = this.srcPictoSelect;
			else
				el.src = this.srcPicto;
			i--;
		}.bind(this));
	},
	
	
	/**
	 * add Event on left arrow's click
	 *
	 */
	createLeftArrowEvent: function()
	{
		//add Event
		$(this.idLeftArrow).addEvent('click', function(e){
			this.leftMove();	
			if(this.scroll)
				this.stopPeriod();
		}.bind(this));
	},
	
	/**
	 * Left Move
	 *
	 */
	leftMove: function(){
		if( this.xCurrent < this.xStart )
		{
			this.fxMove.start('left', this.xCurrent, this.xCurrent + this.pas);
			this.xCurrent = this.xCurrent + this.pas;
		}
		else
		{
			this.fxMove.start('left', this.xCurrent, this.xStart - this.pas * this.nbElement);
			this.xCurrent = this.xStart - this.pas * this.nbElement;
		}
		if(this.picto)
			this.updatePicto();
	},
	
	/**
	 * add Event on right arrow's click
	 *
	 */
	createRightArrowEvent: function()
	{
		//add Event
		$(this.idRightArrow).addEvent('click', function(e){
			this.rightMove();
			if(this.scroll)
				this.stopPeriod();
		}.bind(this));
	},
	
	/**
	 * Right Move
	 *
	 */
	rightMove: function(){
		if( this.xCurrent > (this.xStart - this.pas * this.nbElement) )
		{
			this.fxMove.start('left', this.xCurrent, this.xCurrent - this.pas);
			this.xCurrent = this.xCurrent - this.pas;
		}
		else
		{
			this.fxMove.start('left', this.xCurrent, this.xStart);
			this.xCurrent = this.xStart;
		}
		if(this.picto)
			this.updatePicto();
	},
	
	/*
	 * Move to an element
	 *
	 * param int	- num of element to move
	 */
	moveToElement: function(num){
		/*num %= (this.nbElement + 1); //if num > nbElement*/
		/*console.log('xCurrent'+this.xCurrent);
		console.log('xStart'+this.xStart);
		console.log('Pas'+this.pas);*/
		numCurrent = (-this.xCurrent + this.xStart)  / this.pas;
		/*console.log(num);
		console.log(numCurrent);*/
		while(numCurrent != num){
			if(numCurrent < num){
				/*console.log('right');*/
				this.rightMove();
				numCurrent++;
			}
			else{
				/*console.log('left');*/
				this.leftMove();
				numCurrent--;
			}
		}
	}
	
});