/**
 * Widgets
 * 
 * UI components for various areas of the site
 */

var Widget = new Class({
 	
	Implements: [Options]
	
});

var Slideshow = new Class({
	
	Extends : Widget,
	
	options: {
		delay		: 5,
		duration	: 2,
		images		: []
	},
	
	//internal store of <img> elements
	images 	: [],
	
	index	: 0,
	
	initialize: function(el, options) {
		
		this.el = $(el);
		this.el.addClass('active');
		this.setOptions(options);
		
		if (this.options.images.length > 0) {
			//empty the container and add all images
			this.el.empty();
			
			this.options.images.each(function (image, i) {
				
				var img = new Element('img', image);
				img.set('tween', {duration: this.options.duration * 1000});

				this.el.adopt(img);
				this.images.push(img);
				
				//hide all but the first
				if (i > 0) img.fade('hide');
				
			}, this);
		
			this.start();
		}
	},
	
	start: function() {
		this.next.delay(this.options.delay * 1000, this);
	},
	
	next: function() {
		
		this.images[this.index].fade('out');
		
		if (this.images.length > this.index + 1) {
			this.index++;
		} else {
			this.index = 0;
		}
		this.images[this.index].fade('in');
		
		//loop
		this.next.delay(this.options.delay * 1000, this);
	}
	
});
