Slides = new Class({
	Implements: [Options],
	options: {
		delay: 7000,
		slideSpeed: 800
	},
	initialize: function(container, slides, options) {
		this.container = $(container);
		if(!this.container) return;
		this.setOptions(options);

		this.timer = null;

		this.slides = [];
		var tmp = $splat(slides);

		for(var i=0; i<tmp.length; ++i) {
			var preload = new Image();
			preload.src = tmp[i];

			this.slides.push( preload );
		}
		if(this.slides.length < 2) return;


		this.curIndex = 0;

		var initlist = [];
		initlist.push(this.slides[this.slides.length-1]);
		initlist.push(this.slides[0]);
		initlist.push(this.slides[1]);

		this.container.setStyles({
			'padding': 0,
			'white-space': 'nowrap',
			overflow: 'hidden'
		});


		if(this.options.overlay) {
/*
			this.overlay = new Element('div', {
				styles: {
					'background-image': 'url('+this.options.overlay+')',
					'background-repeat': 'no-repeat',
					'background-position': 'center top',
					'width': 100,
					'height': this.options.slideHeight,
					'top': 0,
					'left': 0,
					'position': 'absolute',
					'z-index': 80
				}
			}).inject(this.container);
*/
			this.overlay1 = new Element('img', {
				src: this.options.overlay,
				styles: {
					'width': 100,
					'height': this.options.slideHeight,
					'top': 0,
					'left': 0,
					'position': 'absolute',
					'z-index': 80
				}
			}).inject(this.container);
			this.overlay2 = this.overlay1.clone().inject(this.container);
		}

		this.curSlides = [];
		for(var i=0; i<initlist.length; ++i) {
			var n = new Element('img', {
				src: initlist[i].src,
				width: this.options.slideWidth,
				height: this.options.slideHeight
			}).inject(this.container);
			this.curSlides.push(n);
		}

		var lst = [ 'arrowLeft', 'arrowRight' ];
		for(var i=0; i<lst.length; ++i) {
			this[lst[i]] =  new Element('img', {
				src: this.options[lst[i]],
				styles: {
					cursor: 'pointer',
					opacity: 0.7,
					display: 'block',
					position: 'absolute',
					'z-index': 81
				}
			})
			.store('which', lst[i])
			.store('slides', this)
			.addEvents({
				'mouseover': function() {
					this.setStyle('opacity', 1);
				},
				'mouseout': function() {
					this.setStyle('opacity', 0.7);
				},
				'click': function() {
					if( this.retrieve('which') == 'arrowLeft' ) this.retrieve('slides').slidePrevious();
					else this.retrieve('slides').slideNext();
				}
			})
			.addEvents({
				'mouseover': function() {
					this.pause();
				}.bind(this),
				'mouseout': function() {
					this.resume();
				}.bind(this)

			})
			.inject(this.container);
		}
		this.resize();


		window.addEvent('resize', function() {
			this.resize();
		}.bind(this));

		this.resume();
	},
	resize: function() {
		var w = $(document.body).getWidth();
		this.container.setStyles({
			width: w
		});
		this.scrollOffset = (this.container.getScrollWidth() - w) / 2;
		this.container.scrollTo(this.scrollOffset, 0);

		this.arrowLeft.setStyles({
			top: this.container.getTop() + (this.container.getHeight() / 2) - (this.options.arrowHeight / 2),
			left: ( $(document.body).getWidth() / 2 ) - (this.options.slideWidth / 2) - this.options.arrowWidth - 10
		});
		this.arrowRight.setStyles({
			top: this.container.getTop() + (this.container.getHeight() / 2) - (this.options.arrowHeight / 2),
			left: ( $(document.body).getWidth() / 2 ) + (this.options.slideWidth / 2) + 10
		});

		if(this.overlay1) {
			this.overlay1.setStyles({
				top: this.container.getTop(),
				'left': 0,
				'width': ($(document.body).getWidth() - this.options.slideWidth) / 2 
			});
		}

		if(this.overlay2) {
			this.overlay2.setStyles({
				top: this.container.getTop(),
				'left': ($(document.body).getWidth() / 2 ) + (this.options.slideWidth / 2),
				'width': ($(document.body).getWidth() - this.options.slideWidth) / 2 
			});
		}
	},

	slidePrevious: function() {
		--this.curIndex;
		if(this.curIndex < 0) this.curIndex = this.slides.length - 1;


		var previndex = this.curIndex - 1;
		if(previndex < 0) previndex = this.slides.length - 1;

		var n = new Element('img', {
			src: this.slides[previndex].src,
			width: 1,
			height: this.options.slideHeight
		}).inject(this.container, 'top');
		this.curSlides.unshift(n);

		new Fx.Tween(this.curSlides[0], {
			duration: this.options.slideSpeed,
			onComplete: function() {
				$(this.curSlides.pop()).destroy();
			}.bind(this)
		}).start('width', this.options.slideWidth);

	},
	slideNext: function() {
		++this.curIndex;
		if(this.curIndex >= this.slides.length) this.curIndex = 0;

		var nextindex = this.curIndex+1;
		if(nextindex >= this.slides.length) nextindex = 0;

		var n = new Element('img', {
			src: this.slides[nextindex].src,
			width: this.options.slideWidth,
			height: this.options.slideHeight
		}).inject(this.container);
		this.curSlides.push(n);


		new Fx.Tween(this.curSlides[0], {
			duration: this.options.slideSpeed,
			onComplete: function() {
				$(this.curSlides.shift()).destroy();
			}.bind(this)
		}).start('width', 0);


	},
	resume: function() {
		clearTimeout(this.timer);
		this.timer = setTimeout(function() {
			this.slideNext();
			this.resume();
		}.bind(this), this.options.delay);
	},
	pause: function() {
		clearTimeout(this.timer);

	}

});