
SlideShow = new Class({
	Implements: [Options],
	options: {
		delay: 5000,
		duration: 1000,
		zIndex: 50,
		slides: []
	},
	initialize: function(container, options) {
		this.container = $(container);
		if(!this.container) return;

		this.container.addEvents({
			mouseover: function() {

			},
			mouseout: function() {

			},
			click: function() {
				
			}
		});

		this.setOptions(options);

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

		for(var i=0; i<tmp.length; ++i) {
			if(typeof(tmp[i]) != 'object') tmp[i] = { src: tmp[i] };
			this.options.slides.push( tmp[i] );

			var p = new Image();
			p.src = tmp[i].src;
		}
		if(!this.options.slides.length) return;
		this.slides = this.options.slides;

		this.timer = null;
		this.curIndex = 0;

		this.startTimer();
	},

	startTimer: function() {
		clearTimeout(this.timer);

		var n = (this.slides[this.curIndex+1]) ? this.curIndex+1 : 0;
		var i = new Image(); i.src = this.slides[n].src;

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

	},

	slideNext: function() {
		clearTimeout(this.timer);

		++this.curIndex;
		if(this.curIndex >= this.slides.length) this.curIndex = 0;
		var newslide = this.slides[this.curIndex];

		var img = this.container.getElement('img');
		if(!img) {
			img = new Element('img', {
				styles: { display: 'block', margin: 'auto' }
			}).inject(this.container);
		}
		img.setStyle('opacity', 1);

		this.container.setStyles({
			backgroundImage: 'url('+newslide.src+')',
			backgroundRepeat: 'no-repeat',
			backgroundPosition: 'left top'
		});

		new Fx.Tween(img, {
			duration: this.options.duration,
			onComplete: function() {
				this.startTimer();
				img.src = newslide.src;
			}.bind(this)
		}).start('opacity', 0);

	}

});












