var Rotator = new Class({
        Implements: Options,
        options: {
                pause: 5000,
                duration: 1000,
                transition: 'bounce:out',
                loop: true,
                onComplete: Class.empty,
                onStart: Class.empty
        },
        initialize: function(container,children,options) {
                this.setOptions(options);
                this.container = $(container);
                this.children = $$(children);
                this.children.setStyles({
                        'display':'none'
                });
                this.children[0].setStyle('display','');
                this.el = new Element('div').addClass('rotator');
            	this.el.injectInside(this.container);
            	this.children.injectInside(this.el);
            	this.children.addEvent('mouseover', function(){
            		this.stop();
            		this.paused = true;
            	}.bind(this));
            	this.children.addEvent('mouseout', function(){
                	this.periodical = this.show.bind(this).periodical(this.options.pause);
            		this.paused = false;
            	}.bind(this));
                this.next = 0;
                this.start();
        },
        start: function() {
                this.started = true;
                this.periodical = this.show.bind(this).periodical(this.options.pause);
        },
        stop: function() {
                this.started = false;
                $clear(this.periodical);
        },
        show: function() {
                if (!this.options.loop && this.next==this.children.length-1){
			this.stop();
		}
                this.next = (this.next==this.children.length-1)?0:this.next+1;
                var prev = (this.next==0)?this.children.length-1:this.next-1;
		
        	this.children[this.next].setStyle('display', '');
        	this.children[prev].setStyle('display', 'none');
        }
});