var IlmariSlideshow = new Class({
	Implements: [Options, Events],
	
	containerElement: null,
	controlButtons: null,
	slideSelector: null,
	options: {
		showDuration: 3000,
		transitionDuration: 1000,
		transition: 'sine:in:out'
	},
	timer: null, 
	interval: null, 
	current: 0,		
	stopped: true,
	images: [],
	
	showNext: function(stop){
		if(stop == true){ this.stop(); }
		var to;
		if(this.current + 1 >= this.images.length){ to = 0; }
		else { to = this.current + 1 } 
		this.gotoAndShow(to);
	},

	showPrevious: function(stop){
		if(stop == true){ this.stop(); }	
		var to;
		if(this.current - 1 < 0){ to = this.images.length - 1 }
		else{ to = this.current - 1}
		this.gotoAndShow(to);
	},
	
	
	gotoAndShow: function(index){
		this.images[this.current].tween(0);
		//this.slideSelectorButtons[this.current].fireEvent('fadeOut');
		this.current = index;
		this.images[this.current].tween(1);
		//this.slideSelectorButtons[this.current].fireEvent('fadeIn');
	},


	initialize: function(div, options) {
		this.setOptions(options);
		this.interval = this.options.showDuration + this.options.transitionDuration;
		this.containerElement = document.id(div) || false;
		if(!this.containerElement){
			//alert('just gave up');
			return;
		}
		var prepared = this.prepareImages();
		if(prepared){
			//this.createControls();
			//this.createSlideSelector();
			this.start();
		}
		else {}
	},
	
	start: function(){
		(function(){
			this.showNext();
			this.timer = this.showNext.bind(this).periodical(this.interval);
		}).bind(this).delay( this.options.showDuration );
		this.stopped = false;
		//this.controlButtons.playtoggle.updateStatus(this.stopped);
		this.fireEvent('updateStatus');
		return !this.stopped;
	},
	
	stop: function(){
		this.timer = clearInterval( this.timer );
		this.stopped = true;
		//this.controlButtons.playtoggle.updateStatus(this.stopped);
		this.fireEvent('updateStatus');			
		return this.stopped;
	},
	
	
	toggle: function(){
		var status;
		if(this.stopped == true){
			status = "started";
			this.start();
		}
		else {
			status = "stopped";
			this.stop();
		}
		return status;
	},

	myArrayMin: function(a){
		var foo;
		a.each(function(item){
			if(!foo){ 
				foo=item; 
			}else{
				if(item < foo){
					foo=item;
				}
			}			
		});
		return foo;
	},
		
	prepareImages: function(){
		var foo = this;
		var tweenOptions = {
			property: 'opacity', 
			link: 'cancel',
			transition: this.options.transition,
			duration: this.options.transitionDuration
			/*,onComplete: function(){
				foo.updateSlideselectorButtons();
			}*/
		};
	
		this.images = this.containerElement.getElements('img');
		if(this.images.lenght <=1){
			return false;
		}
		
		var s, w=[], h=[];
		this.images.each(function( image, index ){
			s = image.getSize();
			w.push(s.x);
			h.push(s.y);
			if(index != 0){
				image.fade('hide');
			}
			image.setStyles({
				position: 'absolute',
				margin: 0, padding: 0,
				top: 0, left: 0
			});
			image.set('tween', tweenOptions);
		});
				
		this.containerElement.setStyles({
			position: 'relative',
			width: this.myArrayMin( w ) +'px',
			height: this.myArrayMin( h ) +'px'
		});
		return true;
	},
	
	createSlideSelector: function(){
		this.slideSelector = new Element('div', {
			'class': 'slideshow-slideselector'
		});
		var tmpbtn = new Element('a', {
			href: '#slide',
			'class': 'slideshow-slideselector-button'
		});
		var tmpbtn_inner = new Element('div', {
			'class': 'slideshow-slideselector-button-inner'
		}).inject(tmpbtn);
		
		// todo: morph class?
		var btnColors = { 
			normal: '#ffffff', 
			current: '#ff0000'
		};
		
		var slideSelectorButtons = [];
		var slideshow = this;
		this.images.each( function(img, index){
			var btn = tmpbtn.clone();
			if(index == 0){ 
				btn.getElement('div').setStyle('background-color', btnColors.current);
			}
			btn.set('tween', { duration: this.options.transitionDuration });
			btn.addEvents({
				fadeIn: function(){ 
					//this.morph('.current');
					this.getElement('div').tween('background-color', btnColors.current);
				},
				fadeOut: function(){ 
					//this.morph('.not-current');
					this.getElement('div').tween('background-color', btnColors.normal);
				},
				click: function(clickEvent){
					clickEvent.stop();
					slideshow.stop();
					slideshow.gotoAndShow(index);
				}
			});
			slideSelectorButtons[index] = btn;
		}, this);
		
		this.slideSelectorButtons = slideSelectorButtons;
		this.slideSelector.adopt(this.slideSelectorButtons);
		this.slideSelector.inject(this.containerElement);
	},
	
	updateSlideselectorButtons: function(){
		this.slideSelectorButtons.each( function(btn,index){
			if(this.current == index){
				btn.addClass('current'); 
			}else{ 
				btn.removeClass('current'); 
			}
		}, this);
	},
	
	createControls: function(){
		var cb = new Element('a', {
			href:'#',
			'class': 'slideshow-controlbutton'
		});			
		
		this.controlButtons = {
			previous: cb.clone().addEvent('click', (function(ev){
				ev.stop();
				this.showPrevious(true);
			}).bind(this)),
			
			next: cb.clone().addEvent('click', (function(ev){
				ev.stop();
				this.showNext(true);
			}).bind(this)),
			
			playtoggle: cb.clone().addClass('play')
		};
		
		this.controlButtons.playtoggle.addEvents({
			'click': (function(ev){
				ev.stop();
				this.toggle();
			}).bind(this),
			'mouseenter': function(){},
			'mouseleave': function(){}
		});

		this.controlButtons.playtoggle.updateStatus = function(stopped){ 
			if(stopped == true){
				this.addClass('play');
				this.removeClass('pause');
			}
			else {
				this.removeClass('play');
				this.addClass('pause');
			}
		}
		
		Object.each(this.controlButtons, (function(button, name){ 
			button.addClass(name); 
			button.inject(this.containerElement, 'top'); 
		}).bind(this));

	}	
});		

