var EcoSlider = new Class({
	
	Implements: [Events, Options],
	
	options: {
		fx: {
			slider: {
				link: 'cancel',
				transition: Fx.Transitions.Expo.easeOut,
				property: 'margin-left'
			}
		},
		opcaoLink: false
	},
	
	initialize: function(element, options){
		this.setOptions(options);
		this.container = $(element) || $$(element)[0];
		this.legendaContainer = this.container.getElement('.eco-legenda');
		this.imgContainer = this.container.getElement('.eco-img-grd');
		this.arrowLeft = this.container.getElement('.eco-slider-imgs-seta-esq');
		this.arrowRight = this.container.getElement('.eco-slider-imgs-seta-dir');
		this.bigArrowLeft = this.container.getElement('.eco-container-seta-grd-esq');
		this.bigArrowRight = this.container.getElement('.eco-container-seta-grd-dir');
		this.disabledClass = 'eco-slider-imgs-seta-desabilitado';
		
		var sliderUl = this.container.getElement('.eco-slider-imgs').getElement('ul'),
			sliderViewport = this.container.getElement('.eco-slider-imgs');
		
		sliderUl.setStyle('margin-left', 0);
		
		this.lis = sliderUl.getElements('li');
		this.as = sliderUl.getElements('a');
		this.imgs = sliderUl.getElements('img');
		this.cachedImgs = [];
		this.liWidth = this.lis[0].getWidth() + this.lis[0].getStyle('margin-left').toInt() + this.lis[0].getStyle('margin-right').toInt();
		this.numberVisibleLis = Math.ceil(sliderViewport.getWidth() / this.liWidth);

		this.sliderFx = new Fx.Tween(sliderUl, this.options.fx.slider);
		this.liCounter = 0;
		this.maxCounterValue = this.lis.length - this.numberVisibleLis;
		
		this.showVisibleImgs();
		this.createLegenda();
		
		this.setImgsClickEvent();
		this.setBigArrowsClickEvent();
		this.setArrowsEvent();
		if(this.options.opcaoLink) this.setOpcaoLink();
	},
	
	showImg: function(i){
		if(!this.imgs[i].get('src')){
			this.imgs[i].set('src', this.imgs[i].get('longdesc'));
		}
	},
	
	showVisibleImgs: function(){
		var visibleImgs = Math.min(this.numberVisibleLis, this.imgs.length);
		for(var i=visibleImgs; i--;){
			this.showImg(i);
		}
	},
	
	setBigImg: function(){
		var oldImg = this.imgContainer.getElements('img');
		if(oldImg.length) oldImg.dispose();
		if(!this.cachedImgs[this.currentImg]){
			var newImg = new Element('img');
			newImg.store('img-index', this.currentImg);
			newImg.addEvent('load', function(e){
				newImg.inject(this.imgContainer, 'top');
				this.cachedImgs[newImg.retrieve('img-index')] = newImg;
			}.bind(this));
			newImg.set('src', this.as[this.currentImg].get('href'));
		}
		else{
			this.cachedImgs[this.currentImg].inject(this.imgContainer);
		}
	},
	
	setImgsClickEvent: function(){
		var self = this;
		this.as.each(function(el, i){
			el.addEvent('click', function(){
				if(!el.hasClass('eco-current-img')){
					self.currentImg = i;
					self.changeImg();
				}
				return false;
			});
		});
	},
	
	setHoverClass: function(){
		this.as.each(function(a){
			a.removeClass('eco-current-img');
		});
		this.as[this.currentImg].addClass('eco-current-img');
	},
	
	setArrowsEvent: function(){
		this.arrowLeft.addClass(this.disabledClass);
		if(this.imgs.length <= this.numberVisibleLis) this.arrowRight.addClass(this.disabledClass);
		this.arrowLeft.addEvent('click', function(){
			this.leftArrowClickEvent();
			return false;
		}.bind(this));
		this.arrowRight.addEvent('click', function(){
			this.rightArrowClickEvent();
			return false;
		}.bind(this));
	},
	
	leftArrowClickEvent: function(){
		if(this.liCounter > 0){
			this.arrowRight.removeClass(this.disabledClass);
			this.liCounter--;
			this.sliderFx.start(-(this.liCounter*this.liWidth));
			if(this.liCounter == 0){
				this.arrowLeft.addClass(this.disabledClass);
			}
		}
	},
	
	rightArrowClickEvent: function(){
		if(this.liCounter < this.maxCounterValue){
			this.arrowLeft.removeClass(this.disabledClass);
			this.showImg(this.liCounter+this.numberVisibleLis);
			this.liCounter++;
			this.sliderFx.start(-(this.liCounter*this.liWidth));
			if(this.liCounter == this.maxCounterValue){
				this.arrowRight.addClass(this.disabledClass);
			}
		}
	},
	
	changeImg: function(){
		this.setBigImg();
		this.setLegenda();
		this.setHoverClass();
		this.bigArrowLeft.setStyle('display', (this.currentImg == 0)? 'none': 'block');
		this.bigArrowRight.setStyle('display', (this.currentImg == this.imgs.length-1)? 'none': 'block');
		if(this.options.opcaoLink) this.setOpcaoLinkHref();
	},
	
	setBigArrowsClickEvent: function(){
		this.currentImg = 0;
		this.setBigImg();
		this.setLegenda();
		this.setHoverClass();
		
		this.bigArrowLeft.setStyle('display', 'none');
		this.bigArrowLeft.addEvent('click', function(e){
			if(this.currentImg > 0){
				this.currentImg--;
				this.changeImg();
			}
			if(this.currentImg < this.liCounter){
				this.leftArrowClickEvent();
			}
			return false;
		}.bind(this));
		this.bigArrowRight.addEvent('click', function(e){
			if(this.currentImg < this.imgs.length){
				this.bigArrowLeft.setStyle('display', 'block');
				this.currentImg++;
				this.changeImg();
			}
			if(this.currentImg >= this.numberVisibleLis+this.liCounter){
				this.rightArrowClickEvent();
			}
			return false;
		}.bind(this));
	},

	setOpcaoLinkHref: function(){
		this.linkOpcao.set('href', this.imgs[this.currentImg].get('data-opcao-link'));
	},
	
	setOpcaoLink: function(){
		var containerImgGrd = this.container.getElement('.eco-container-img-grd');
		this.linkOpcao = new Element('a', {'class': 'eco-link-opcao', 'title': this.options.opcaoLink, 'html': this.options.opcaoLink}).inject(containerImgGrd);
		this.setOpcaoLinkHref();
		containerImgGrd.addEvents({
			'mouseenter': function(){
				this.linkOpcao.setStyle('visibility', 'visible');
			}.bind(this),
			'mouseleave': function(){
				this.linkOpcao.setStyle('visibility', 'hidden');
			}.bind(this)
		});
	},
	
	createLegenda: function(){
		this.legTitle = new Element('strong');
		this.legText = new Element('p');
		this.legendaContainer.adopt(this.legTitle, this.legText);
	},
	
	setLegenda: function(){
		this.legTitle.set('html', this.as[this.currentImg].get('title'));
		this.legText.set('html', this.as[this.currentImg].get('rel'));
	}

});