// JavaScript Document

/**
* container - elemento onde vai aparecer o navegador do carrossel
* conteudos - ul com a lista de conteudos a percorrer
*
* Necessita do Mootools More com o Class.Binds e o Element.Shortcuts
*/

var Carrossel = new Class({

	Binds: ['next', 'previous'],
	initialize: function(container, conteudos){
		this.vConteudos = $(conteudos).getElements('li');
		this.nElementos = this.vConteudos.length;
		
		this.current = null;
		
		this.navegador = new Element('ul', {
												'class': 'carrossel'
		});
		
		this.prevLi = new Element('li',{
					'class': 'prev',
					events: {
						click: this.previous
					}
		});
		this.navegador.grab(this.prevLi);
		
		this.vNavegador = new Array();
		var maior = 0;
		for(var i=0; i<this.nElementos; i++){
			var nli = new Element('li');
			nli.addEvent('click', this.seleccionar.bind(this, i));
			var tams = this.vConteudos[i].getSize();
			if(tams.y > maior)
				maior = tams.y;
			this.vNavegador.push(nli);
			this.navegador.grab(nli);
			this.vConteudos[i].hide();
		}
		this.nextLi = new Element('li',{
					'class': 'next',
					events: {
						click: this.next
					}
		});
		this.navegador.grab(this.nextLi);
		$(container).grab(this.navegador, 'top');
		
		//colocar a caixa de conteudos com a altura do maior
		$(conteudos).setStyle('height', maior);
		
		this.seleccionar(0);
	},
	
	
	
	
	first: function(){
		this.desseleccionar();
	},
	
	desseleccionar: function(){
		if(this.current != null){
			this.vNavegador[this.current].removeClass('seleccionado');
			this.vConteudos[this.current].hide();
		}
	},
	
	seleccionar: function(idx){
		this.desseleccionar();
		this.vConteudos[idx].show();
		this.vNavegador[idx].addClass('seleccionado');
		this.current = idx;
		if(idx == 0){
			this.prevLi.addClass('inactivo');
			this.prevLi.removeEvent('click', this.previous);
		}
		else{
			this.prevLi.removeClass('inactivo');
			this.prevLi.addEvent('click', this.previous);
		}

		if(idx == this.nElementos-1){
			this.nextLi.addClass('inactivo');
			this.nextLi.removeEvent('click', this.next);
		}
		else{
			this.nextLi.removeClass('inactivo');
			this.nextLi.addEvent('click', this.next);
		}
	},
	
	next: function(){
		this.desseleccionar(this.current);
		if(++this.current >= this.nElementos)
			this.current = 0;
		this.seleccionar(this.current);
	},
	previous: function(){
		this.desseleccionar(this.current);
		if(--this.current < 0)
			this.current = this.nElementos-1;
		this.seleccionar(this.current);
	}
	
});

//Carrossel.prototype.