// Options:
// - title, description, link
// CSS:
// - .item
// - .item .title
// - .item .description
// - .item .link
var DivSlideShow = new Class({
	initialize: function(container, params){
		this.container = container;
		this.container.style.position = 'relative';
		this.container.style.overflow = 'hidden';
		this.container.addEvent('mouseover', function(){
			this.animate = $clear(this.animate);
		}.bind(this));
		this.container.addEvent('mouseout', function(){
			if( ! this.animate )
				this.animate = this.nextSlide.periodical(this.interval, this);
		}.bind(this));
		this.size = container.getSize();
		this.interval = params.interval ? params.interval : 5000;
		this.transitionTime = params.transitionTime ? params.transitionTime : 1250;
		this.slides = new Array();
		if(params.slidesData)
		{
			params.slidesData.each(function(obj, index)
			{
				var divItem = new Element('div', {
					'class': 'item',
					'styles':{
						'position':'absolute',
						'opacity':index == 0 ? 1 : 0
					}
				});
				var itemTitle = new Element('h2', {
					'class': 'title',
					'html': obj.title
				});
				var itemBody = new Element('p', {
					'class': 'description',
					'html': obj.description
				});
				var itemLink = new Element('p', {
					'class': 'link',
					'html': "<a href='" + obj.link + "'>More</a>"
				});
				container.grab(divItem);
				divItem.grab(itemTitle);
				divItem.grab(itemBody);
				divItem.grab(itemLink);
				this.slides.push(divItem);
			}, this);
		}
		this.numItems = this.slides.length;
		this.itemNum = 0;
		this.animate = this.nextSlide.periodical(this.interval, this);
	},
	nextSlide: function(){
		// get item to slide out
		var curItem = this.slides[this.itemNum];  
		//change index
		this.itemNum = this.itemNum < this.numItems-1 ? this.itemNum+1 : 0;
		//now get item to slide in using new index
		var newItem = this.slides[this.itemNum];
		//Slide in the new one
		var newItemSlide = new Fx.Morph(newItem, {
			duration: this.transitionTime, 
			transition: Fx.Transitions.Quad.easeInOut,
			wait:false
		});
		//Fade in the new one
		var newItemFade = new Fx.Morph(newItem, {
			duration: this.transitionTime * 2, 
			transition: Fx.Transitions.Quad.easeInOut,
			wait:false
		});
		// Slide out the old one
		var oldItemSlide = new Fx.Morph(curItem, {
			duration: this.transitionTime, 
			transition: Fx.Transitions.Quad.easeInOut, 
			wait:false
		});
		// Fade out the old one
		var oldItemFade = new Fx.Morph(curItem, {
			duration: this.transitionTime * 0.5, 
			transition: Fx.Transitions.Quad.easeInOut, 
			wait:false
		});
		newItemSlide.start({
			'top': [-this.size.y, 0]
		});
		newItemFade.start({
			'opacity':[0,1]
		});
		oldItemSlide.start({
			'top': [0, this.size.y]
		});
		oldItemFade.start({
			'opacity':0
		});
	}
});