var imageSlideshow = new Class({
	Implements: Options,
	
	options: {
		duration: 1500,
		wait: 4000,
		changeEmltHeight: false,
		fadeAtStart: false
	},
	
	current: null,
	count: 0,	
	fx: {},
	
	initialize: function(elmt,options){
		this.setOptions(options);
		
		this.elmt = elmt;
		
		this.images = this.elmt.getElements('img');
		this.count = this.images.length;
		
		if (this.count > 1) {
			this.elmt.setStyle('overflow','hidden');
			this.images.setStyles({
				'position': 'absolute',
				'opacity': 0
			});
			
			this.changeImage(0,!this.options.fadeAtStart);
			this.changeImage.periodical(this.options.wait, this);
		}
	},
	
	nextI: function(){
		this.current++;
		if(this.current >= this.count){
			this.current = 0;
		}
		return this.current;
	},
	
	changeImage: function(i,doNotFade){
		var current = this.current ? this.current : 0;
		var i = $type(i) == 'number' ? i : this.nextI();
		if (
			$type(this.images[current]) == 'element' &&
			$type(this.images[i]) == 'element'
		) {
			if(!doNotFade){
				if(!this.images[i].retrieve('tweenSet')){
					this.images[i].set('tween',{duration:this.options.duration})
						.store('tweenSet',true);
				}
				if(!this.images[current].retrieve('tweenSet')){
					this.images[current].set('tween',{duration:this.options.duration})
						.store('tweenSet',true);
				}				
				this.images[current].tween('opacity', 0);
				this.images[i].tween('opacity',1);
			}else{
				this.images[current].setStyle('opacity',0);
				this.images[i].setStyle('opacity',1);
			}			
		}
	}
	
});

/* So you can do like this $('photos').imageSlideshow(); or even $('photos').imageSlideshow().setStyle('border',1); */
Element.implement({
	imageSlideshow: function (options){
		new imageSlideshow(this,options);
		return this;
	}
});