
var Cycler = new Class({
    Implements: Options,
    options:
	{
        duration: 1000,
		interval: 6000,
		children: 'img'
    },

    initialize: function(container, options){
        this.setOptions(options);
        this.container = $(container);
		this.elements = this.container.getChildren(this.options.children);

		if (this.elements.length < 2)
		{
			return;
		}


		this.elements.each(function(elt, idx){
			elt.set('tween', {duration: this.options.duration, fps: 20, transition: 'linear'});
			$(elt).setStyles({
				'z-index': this.elements.length - idx,
				'position': 'absolute',
				'top' : 0,
				'left' : 0,
				'opacity' : (idx > 0) ? 0 : 1,
				'visibility' : (idx > 0) ? 'hidden' : 'visible'
			});
		}, this);


	this.container.setStyles({
			'position':'relative',
			'overflow':'hidden',
			'height': (this.elements[0]) ? this.elements[0].getHeight() : 'auto',
			'width': (this.elements[0]) ? this.elements[0].getWidth() : 'auto'
		});


		this.currentItem = 0;


	},

	start: function()
	{
		this.started = 1;
		$clear(this.timer);
		this.timer = this.nextItem.periodical(this.options.interval + this.options.duration, this);
	},



	stop: function()
	{
		this.pause();
		this.started = 0;
	},

	nextItem: function()
	{
		if (this.elements.length == 0) return;
		if (this.currentItem + 1 == this.elements.length)
		{
			this.elements[0].fade('in');
			this.elements[this.currentItem].fade.delay(this.options.duration, this.elements[this.currentItem], 'hide');
			this.currentItem = 0;
		}
		else
		{
			this.elements[this.currentItem].fade('out');
			this.currentItem++;
			this.elements[this.currentItem].fade('show');
		}
	}

});
