GE_imgRotate = Class.create({
	
	frames:[],
	timer:null,
	active:null,
	
	initialize:function(el) {
		
		var self = this;
		var container = $(el);
		
		container.select('li').each(function(frame){
			frame.setStyle({position:'absolute',display:'block',zIndex:'1'});
			self.hideFrame(frame);
			self.frames.push(frame);
		});

		this.frames[0].setOpacity(1);
		this.active=this.frames[0];

		this.autoRotate();
				
	},
	
	autoRotate:function() {
		var self = this;
		this.timer = new PeriodicalExecuter(function(pe) {
			self.rotateFrame();
		}, 5);				
	},
	
	cancelRotate:function() {
		if (this.timer) this.timer.stop();
	},
	
	rotateFrame:function() {
		var i = ((this.frames.indexOf(this.active)+1)==this.frames.length)? 0 : (this.frames.indexOf(this.active) + 1);
		this.goToFrame(this.frames[i]);
	},
	
	goToFrame:function(frame) {
		if (this.active == frame) return;

		var self = this;
		var fx = [];
		
		fx.push( new Effect.Fade(frame,{from:0.0,to:1.0}) );

		new Effect.Parallel(fx,{
			duration:0.5,
			beforeStart:function(){
				if (self.active) { self.active.setStyle({zIndex:'1'}); }
				frame.setStyle({zIndex:'2'});
			},
			afterFinish:function(){
				self.hideFrame(self.active);
				self.active = frame;
				frame.show();
			}
		});
	},
	
	hideFrame:function(frame) {
		frame.setOpacity(0).show();
	}
	
});

GE_Main.mapFnToCSS('factoid_img_list',function(el){
	//random image display
	var li = $(el).select('li')[Math.floor(Math.random()*4)];
	if (li) li.show();

	//adding key trigger for rotation
	// document.observe('keydown',function(e){
	// 	var keycode;
	// 	if (e == null) keycode = e.keyCode; // ie
	// 	else keycode = e.which; // mozilla
	// 	if (keycode==84) var homepage_features = new GE_imgRotate(el);
	// });
});
