var rotator =
{
    next: function( instance )
    {
        instance = $(instance);

        if ( instance.blockChange )
        {
            return;
        }

        var active = instance.select( "div.slide.active" )[0];
        if ( !next )
        {
            var next = active.next( "div.slide" );
            if ( !next )
            {
                next = instance.down( "div.slide" );
            }
        }
        
        if ( !nextNext )
        {
            var nextNext = next.next( "div.slide" );
            if ( !nextNext )
            {
                nextNext = instance.down( "div.slide" );
            }
        }

        if ( active == next )
        {
            return;
        }
        
        Effect.Appear( nextNext, { duration: 0.7, from: 0.0, to: 1.0 } );
        
        Effect.Fade( active, { duration: 0.8, from: 1.0, to: 0.0, afterFinish: function()
        {
            active.removeClassName( 'active' );
            next.addClassName( 'active' );
            active.setStyle( { zIndex: 0 } );
            next.setStyle( { zIndex: 2 } );
            nextNext.setStyle( { zIndex: 1 } );
            instance.blockChange = false;
        } } );
        
        
    },

    rotatorInit: function( instance )
    {
        var instanceID = instance.identify();
        var slides = instance.select( 'div.slide' );

        instance.interval = setInterval( "rotator.next('" + instanceID + "')", 5000 );
    },

    init: function()
    {
        $$( 'div.rotator' ).each( function( instance ) { rotator.rotatorInit( instance ); } );
    }
}

document.observe( 'dom:loaded', rotator.init );