var Carrousel = function( properties ) {
	if( properties )
		this.carrouselProperties = properties;
	else {
		this.carrouselProperties = {
			startColor: '#FFFFFF', 
			endColor: '#FF0000',
			duration: 4000,
			transition: 1000,
			startPos: 0,
			endPos: -80,
			opacity: 0.8
		};
	}
	this.stageObjectsArray = [];
	this.currentStageObject = 1;
	this.totalStageObjects = $('StageCarrousel').getElementsByTagName('ul').length;
	this.previousStageObject = 0;//this.totalStageObjects - 1;
	this.hasStarted = true;
	this.intervalTimer = null;
	for( var i = 0; i < this.totalStageObjects; i++ ) {
		this.stageObjectsArray.push( [$('Carrousel-' + ( i + 1 ) ), $('CarrouselInfo-' + ( i + 1 ) ), $('CarrouselSelector-' + ( i + 1 ) ) ] );
		//this.stageObjectsArray[i][0].setStyles({opacity: 0});
		this.stageObjectsArray[i][0].set('tween', {duration: this.carrouselProperties.transition, link:'chain'});
		//this.stageObjectsArray[i][0].style.display = 'none';
		//Inicializamos el info
		//this.stageObjectsArray[i][1].setStyles({opacity: 0});
		//this.stageObjectsArray[i][1].setStyles({top: this.carrouselProperties.startPos});
		this.stageObjectsArray[i][1].set('morph', {duration: this.carrouselProperties.transition, link:'chain'});
		//this.stageObjectsArray[i][1].set('tween', {duration: this.stageDurationTime, link:'chain'});
		//this.stageObjectsArray[i][1].style.display = 'none';
	}
	for( var i = 1; i < this.totalStageObjects; i++ ) {
		this.stageObjectsArray[i][0].setStyles({opacity: 0});
		//this.stageObjectsArray[i][0].style.display = 'none';
		this.stageObjectsArray[i][1].setStyles({top: this.carrouselProperties.startPos});
		this.stageObjectsArray[i][1].setStyles({opacity: 0});
		//this.stageObjectsArray[i][1].style.display = 'none';
	}
	this.MoveForward = function() {
		//desvanecemos el layer de foto
		this.stageObjectsArray[this.currentStageObject][0].style.display = 'block';
		this.stageObjectsArray[this.currentStageObject][0].tween('opacity', 0, 1);
		//this.stageObjectsArray[this.currentStageObject][0].style.zIndex = '100';
		//this.stageObjectsArray[this.previousStageObject][0].style.zIndex = '1';
		if( this.hasStarted ) {
			this.stageObjectsArray[this.previousStageObject][0].tween('opacity', 1, 0).tween('display', 'none');
			if( this.carrouselProperties.endBkg )
				this.stageObjectsArray[this.previousStageObject][2].style.backgroundImage = 'url('+this.carrouselProperties.startBkg+')';
			else {
				if( this.carrouselProperties.startColor == 'transparent')
					this.stageObjectsArray[this.previousStageObject][2].style.backgroundColor = 'transparent';
				else
					this.stageObjectsArray[this.previousStageObject][2].tween('background-color', this.carrouselProperties.endColor, this.carrouselProperties.startColor);
			}
		}
		else
			this.hasStarted = true;
		//Movemos el layer de info
		this.stageObjectsArray[this.currentStageObject][1].style.display = 'block';
		this.stageObjectsArray[this.currentStageObject][1].morph({opacity: [0,this.carrouselProperties.opacity], top: this.carrouselProperties.endPos});
		//this.stageObjectsArray[this.currentStageObject][1].tween('top', -80);
		//this.stageObjectsArray[this.currentStageObject][1].tween('opacity', 0, 0.8);
		this.stageObjectsArray[this.previousStageObject][1].morph({opacity: [this.carrouselProperties.opacity,0], top: this.carrouselProperties.startPos}).morph({display: 'none', top: this.carrouselProperties.startPos});
		//this.stageObjectsArray[this.previousStageObject][1].morph({opacity: [0.8,0], top: 0}).tween('display', 'none');
		//this.stageObjectsArray[this.previousStageObject][1].tween('top', 0);
		//this.stageObjectsArray[this.previousStageObject][1].tween('opacity', 0.8, 0).tween('display', 'none');
		//Cambiamos fondo de selectores
		if( this.carrouselProperties.startBkg )
			this.stageObjectsArray[this.currentStageObject][2].style.backgroundImage = 'url('+this.carrouselProperties.endBkg+')';
		else {
			if( this.carrouselProperties.startColor == 'transparent')
				this.stageObjectsArray[this.currentStageObject][2].style.backgroundColor = this.carrouselProperties.endColor;
			else
				this.stageObjectsArray[this.currentStageObject][2].tween('background-color', this.carrouselProperties.startColor, this.carrouselProperties.endColor);
		}
		( this.previousStageObject == (this.totalStageObjects - 1) ) ? this.previousStageObject = 0 : this.previousStageObject++;
		( this.currentStageObject < (this.totalStageObjects - 1) ) ? this.currentStageObject++ : this.currentStageObject = 0;
		//alert(this.currentStageObject);
		if( $('superlog') )
			$('superlog').innerHTML = this.previousStageObject + '-' + this.currentStageObject;
	}
	this.MoveBackwards = function() {
		( this.previousStageObject == 0 ) ? this.previousStageObject = this.totalStageObjects - 1 : this.previousStageObject--;
		( this.currentStageObject > 0 ) ? this.currentStageObject-- : this.currentStageObject = this.totalStageObjects - 1;
		if( $('superlog') )
			$('superlog').innerHTML = this.previousStageObject + '-' + this.currentStageObject;
		//alert(this.currentStageObject);
		//this.stageObjectsArray[this.currentStageObject][0].style.display = 'none';
		this.stageObjectsArray[this.previousStageObject][0].style.display = 'block';
		this.stageObjectsArray[this.previousStageObject][0].tween('opacity', 0, 1);
		this.stageObjectsArray[this.currentStageObject][0].tween('opacity', 1, 0).tween('display', 'none');
		
		this.stageObjectsArray[this.previousStageObject][1].style.display = 'block';
		this.stageObjectsArray[this.previousStageObject][1].morph({opacity: [0,this.carrouselProperties.opacity], top: this.carrouselProperties.endPos});
		this.stageObjectsArray[this.currentStageObject][1].morph({opacity: [this.carrouselProperties.opacity,0], top: this.carrouselProperties.startPos}).morph({display: 'none', top: this.carrouselProperties.startPos});
		
		if( this.carrouselProperties.startBkg )
			this.stageObjectsArray[this.previousStageObject][2].style.backgroundImage = 'url('+this.carrouselProperties.endBkg+')';
		else
			this.stageObjectsArray[this.currentStageObject][2].tween('background-color', this.carrouselProperties.startColor, this.carrouselProperties.endColor);
		if( this.carrouselProperties.endBkg )
			this.stageObjectsArray[this.currentStageObject][2].style.backgroundImage = 'url('+this.carrouselProperties.startBkg+')';	
		else
			this.stageObjectsArray[this.previousStageObject][2].tween('background-color', this.carrouselProperties.endColor, this.carrouselProperties.startColor);
		
		
	}
	this.GoTo = function( index ) {
		clearInterval(this.intervalTimer);
		//this.previousStageObject = this.currentStageObject;
		//TODO: Validar mover hacia adelante o atrás según posición
		this.currentStageObject = index;
		( this.currentStageObject == 0 ) ? this.previousStageObject = this.totalStageObjects - 1 : this.previousStageObject = this.currentStageObject - 1;
		for( i = 0; i < this.totalStageObjects; i++) {
			this.stageObjectsArray[i][0].style.display = 'none';
			if( this.carrouselProperties.startBkg )
				this.stageObjectsArray[i][2].style.backgroundImage = 'url('+this.carrouselProperties.startBkg+')';
			else
				this.stageObjectsArray[i][2].style.backgroundColor = this.carrouselProperties.startColor;
		}
		this.MoveForward();
		this.intervalTimer = setInterval( 'myCarrousel.MoveForward()', this.carrouselProperties.duration );
	}
	this.Next = function() {
		clearInterval(this.intervalTimer);
		this.Start();
	}
	this.Previous = function() {
		clearInterval(this.intervalTimer);
		//this.stageObjectsArray[this.previousStageObject][0].style.display = 'none';
		this.MoveBackwards();
		this.intervalTimer = setInterval( 'myCarrousel.MoveForward()', this.carrouselProperties.duration );
	}
	this.Start = function() {
		this.MoveForward();
		this.intervalTimer = setInterval( 'myCarrousel.MoveForward()', this.carrouselProperties.duration);
	}
}