var moveObj = null;

var mObj = new Class({
		
		actual: 0,
		previous: 0,
		timeout: null,
		
		initialize: function () {
			this.pages = $$('#pgBanners img');
			this.effects = new Fx.Elements(this.pages, { onComplete: this.goWait.bind(this), duration: 1000 } );
			this.goWait();
		},
		
		goNext: function () {
			if( this.actual + 1 == this.pages.length )
				var actual = 0;
			else
				var actual = this.actual + 1;
			
			this.goTo( actual );
		},
		
		goTo: function ( actual ) {
			//this.effects.stop();
			clearTimeout( this.timeout );
			this.previous = this.actual;
			this.actual = actual;
			
			this.obj = {};
			
			this.pages.each( function ( p, i ) {
				var z = ( i == this.actual ) ? 3 : ( i == this.previous ) ? 2 : 1;
				//var val = ( i == this.actual || i == this.previous ) ? 1 : 0;
				var val = ( i == this.actual ) ? 0 : 1;
				var val = ( i == this.previous ) ? 1 : 0;
				var r = p.getStyle( 'opacity' );
				this.obj[''+i+''] = { 'opacity': [r,val] };
				this.pages[i].setStyle( 'z-index', ''+z+'' );
			}.bind( this ) );
			
			this.effects.start( this.obj );
		},
		
		goWait: function () {
			this.timeout = setTimeout( this.goNext.bind( this ), 3000 );
		}
		
});

window.addEvent( 'domready', function () {
	moveObj = new mObj();
} );