var efSlideShow = new Class({
	Implements:Options,
	options:{
		autoplay:{
			enable: true,
			interval: 4000  /* interval in milliseconds */
		}
	},
	initialize: function(containerEl,options){
		var self = this;
		this.setOptions(options);
		this.containerEl = containerEl;
		this.itemsEls = this.containerEl.getElements('.item');
		this.controls = {};
		this.currentItem = 0;
		this.build();
		this.setAutoplay();
	},
	
	build:function(){
		var self = this;
		//set opacity on containerEl
		this.containerEl.setStyle('opacity',0);
		
		var controlPages = [];
		this.itemsEls.each(function(item,i){
			if(i!=self.currentItem){
				item.setStyle('opacity',0);//set opacity=0 for all, except first
			}
			controlPages.push(new Element('div',{
				'class':'pageBtn pageBtn-'+(i+1),
				text:i+1,
				events:{click:self.showItem.pass(i,self)}
			}));
			//item.addEvent('mouseenter',self.stopAutoplay.bind(self));
			//item.addEvent('mouseleave',self.setAutoplay.bind(self));
		});
		this.containerEl.addEvent('mouseenter',self.stopAutoplay.bind(self));
		this.containerEl.addEvent('mouseleave',self.setAutoplay.bind(self));
		
		this.controls.pagesEls = controlPages;
		
		//controls
		$$(
			this.controls.nextEl = new Element('div',{
				'class':'nextBtn',
				text:'Next',
				events:{click:this.showNextItem.bind(this)}
			}),
			this.controls.prevEl = new Element('div',{
				'class':'prevBtn',
				text:'Previous',
				events:{click:this.showPrevItem.bind(this)}
			}),
			this.controls.pagesContainerEl = new Element('div',{
				'class':'pages'
			}).adopt(this.controls.pagesEls)
		).inject(this.containerEl);
		
		//we finish build, let's show it !
		/*
		this.itemsEls.each(function(item,i){
			item.setStyle('visibility','visible');
		});
		*/
		this.itemsEls[0].setStyle('visibility','visible');
		this.containerEl.fade(1);
		
	},
	
	setAutoplay: function(){
		if(this.options.autoplay.enable){
			$clear(this.autoPlayInterval);
			this.autoPlayInterval = this.showNextItem.periodical(this.options.autoplay.interval,this);
		}else{
			this.autoPlayInterval = 0;
		}
	},
	stopAutoplay: function(){
		if(this.autoPlayInterval){
			$clear(this.autoPlayInterval);
		}
	},
	
	showItem: function(index){
		if(this.itemsEls[index] && this.itemsEls.length>1 && index!==this.currentItem){
			$clear(this.autoPlayInterval);
			
			this.itemsEls[this.currentItem].fade(0);
			this.itemsEls[index].fade(1);
			this.currentItem = index;
			
			this.setAutoplay();
		}
	},
	
	showNextItem: function(){
		var index = (this.itemsEls[this.currentItem+1] ? this.currentItem+1 : 0); 
		this.showItem(index);
	},
	showPrevItem: function(){
		var index = (this.currentItem==0 ? this.itemsEls.length-1 : this.currentItem-1);
		this.showItem(index);
	}
	
});