var SlideShow = Class.create({

	transitionTime: 1,
	images: [],
	showTime: 7,
	el: null,
	
	_step: 1,
	_boxStep: 1,
	_img: null,
	_counter: 0,
	_textBox: null,
	_newTextBox: null,
	_backgroundBox: null,
	_width: 0,

	initialize: function(el,imgs) {
		if(Object.isString(el)) el = $(el);
		if(!el || !imgs || imgs.length == 0) return;
		el.update('');
		el.setStyle({backgroundImage: 'url(/_assets/scripts/slideload.gif)',backgroundColor: '#666',backgroundPosition: '50% 50%',backgroundRepeat: 'no-repeat',position: 'relative'});
		this.el = el;
		this.images = imgs;
		tmp = [];
		if (document.images) {
			for(i=0,l=imgs.length;i<l;i++) {
				tmp[i] = new Image(1,1);
				tmp[i].src = imgs[i].src;
			}
		}
		Event.observe(window,'load',(function() {
			this.el.setStyle({backgroundImage: 'url('+this.images[0].src+')',backgroundPosition: '0 0'});
			if(this.images[0].href) {
				this._img = new Element('a',{'class':'imgLink','style':'position:absolute;z-index:1;','href': this.images[0].href}).insert(new Element('img',{'src': this.images[0].src}));
				this.el.insert(this._img);
			}
			this._width = el.getWidth();
			this._backgroundBox = new Element('div',{'style': 'z-index: 2;position: absolute;bottom: 0px;left: 0px;display:block;width:'+this._width+'px;padding:0;background-color: #666;'});
			this._backgroundBox.setOpacity(0.7);
			this.el.insert(this._backgroundBox);
			text = this.images[0].caption;
			href = this.images[0].href;
			this.makeTextBox(text,href);
			this._textBox = this._newTextBox;
			this._newTextBox = null;
			this._textBox.setOpacity(1);
			this._backgroundBox.setStyle({height: this._textBox.getHeight()+'px'});
			if(this.images.length == 1) return;
			this._counter++;
			pe = new PeriodicalExecuter(this.transition.bind(this),this.showTime);
		}).bind(this));
	},
	
	makeTextBox: function(text,href) {
		this._newTextBox = new Element(href ? 'a' : 'div',{'style': 'color: white;z-index: 3;display: block; position: absolute;left: 0px; bottom: 0px;padding: '+((!text || text == '') ? '0' : '10')+'px;width: '+(this._width-20)+'px'});
		if(href) this._newTextBox.href = href;
		this._newTextBox.update(text);
		this._newTextBox.setOpacity(0);
		this.el.insert(this._newTextBox);
	},
	
	transition: function(pe) {
		pe.stop();
		this._step = 0.1/this.transitionTime;
		text = this.images[this._counter].caption;
		href = this.images[this._counter].href;
		if(this._img){this._img.remove();}
		if(href) {
			this._img = new Element('a',{'class':'imgLink','style':'position:absolute;z-index:1;','href': href}).insert(new Element('img',{'src': this.images[this._counter].src}));
		} else {
			this._img = new Element('img',{'src': this.images[this._counter].src});
		}
		this._counter++;
		if(this._counter == this.images.length) this._counter = 0;
		this._img.setOpacity(0);
		this.makeTextBox(text,href);
		this._boxStep = (this._newTextBox.getHeight()-this._backgroundBox.getHeight())*(0.2/this.transitionTime);
		this.el.insert(this._img);
		pe = new PeriodicalExecuter(this.doStep.bind(this),0.1);
	},
	
	doStep: function(pe) {
		if(this._img.getOpacity() < 1) {
			this._img.setOpacity(this._img.getOpacity()+this._step);
			if(this._textBox.getOpacity() > 0) this._textBox.setOpacity(this._textBox.getOpacity()-(2*this._step));
			else {
				this._backgroundBox.setStyle({height: (this._backgroundBox.getHeight()+this._boxStep)+'px'});
				this._newTextBox.setOpacity(this._newTextBox.getOpacity()+(2*this._step));
			}
		} else {
			img = this._img;
			href = false;
			if(img.tagName == 'A') {
				href = img.href;
				img = img.down();
			}
			this.el.setStyle({backgroundImage: 'url('+img.src+')'});
			if(!href) {
				this._img.remove();
				this._img = null;
			}
			this._textBox.remove();
			this._textBox = this._newTextBox;
			this._newTextBox = null;
			pe.stop();
			pe = new PeriodicalExecuter(this.transition.bind(this),this.showTime);
		}
	}
	
});