var ImageSlider = new Class({
	Implements: Options,
	options: {
		container: $empty,
		next: $empty,
		prev: $empty,
		mode: 'control',
		wait: 3800,
		delay: 180,
		offset : 320
	},
	pos:0,
	limit:0,
	initialize: function(options){
		this.setOptions(options);
		
		this.wrapper = $(this.options.container).getElement('div');
		this.wrapper_w = this.wrapper.getCoordinates().width.toInt();

		this.options.prev = $(this.options.prev) || false;
		this.options.next = $(this.options.next) || false;
		this.options.list = $(this.options.list) || false;

		this.slides = this.wrapper.getFirst().getChildren();
		
		//Obtiene el ancho del contenido visible
		this.slides.each(function(el){ this.limit+= el.getCoordinates().width.toInt()+el.getStyle('margin-right').toInt(); }.bind(this));
		this.limit+= this.slides.getLast().getStyle('margin-right').toInt();
		this.fx_slide = new Fx.Scroll(this.wrapper,{ duration: this.options.delay, offset: {'x': 0, 'y': 0}, link:'chain', transition: Fx.Transitions.Cubic.easeInOut }).toLeft();

		if(this.options.prev)
		this.options.prev.addEvent('click', function(event) {
			event = new Event(event).stop();
               this.pos = (this.pos)?(this.pos-this.options.offset<0?0:this.pos-this.options.offset):this.limit - this.wrapper_w;
			this.fx_slide.start(this.pos);
		}.bindWithEvent(this));

		if(this.options.next)
		this.options.next.addEvent('click', function(event) {
			event = new Event(event).stop();
			this.pos = (this.pos == (this.limit-this.wrapper_w))?0:(this.pos+this.options.offset>(this.limit-this.wrapper_w)?this.limit-this.wrapper_w:this.pos+this.options.offset);
			this.fx_slide.start(this.pos);
		}.bindWithEvent(this));
		
		if(this.options.mode == 'auto')
			this.is_autoplay.periodical(this.options.wait,this);
	},
	is_autoplay: function(){ 
		this.pos = (this.pos == (this.limit-this.wrapper_w))?0:(this.pos+this.options.offset>(this.limit-this.wrapper_w)?this.limit-this.wrapper_w:this.pos+this.options.offset);
		this.fx_slide.start(this.pos);
	}
});
