var Rotation = new Class({
	Implements: Chain,
	
	options: {
		path: '',
		box: '',
		items : '',
		time: 5000,
		loader: 'loader.gif',
		position: 0,
		loading: false
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.options.loader = this.options.path + this.options.loader;
		this.chain.apply(this, arguments);
	},
	
	build: function(){
		
		path = this.options.path;
		box = this.options.box;
		items = this.options.items;		
		
		this.load();
		this.animation = this.load.periodical(this.options.time, this);		
	},
	
	load: function(img){
		
		if (this.options.loading){
			this.animation = $clear(this.animation);
			this.options.pause = true;
			return;
		}
		
		this.options.loading = true;
		
		if (this.onDisplay != null)
		{
			
			this.wasDisplay = this.onDisplay.clone(true,true);
			new Fx.Morph(this.wasDisplay, {duration: 1000, transition: Fx.Transitions.linear}).start({
				'opacity': 0
			}).chain(function(){
				$(this.subject.id).destroy();
			});

		}
	
		//new Element('img', {'src': this.options.loader, 'id' : 'rotation_loader'}).inject(this.options.box, 'inside');
		if (img == null) img = path + items[this.options.position];
		this.onDisplay = new Asset.image(img, {onload: this.show.bind(this)});
	},
	
	show: function(){
		
		this.options.loading = false;
		if (this.options.pause)
		{
			this.pause = false;
			this.animation = this.load.periodical(this.options.time, this);
		}
		
		//$('rotation_loader').destroy();
		this.onDisplayFx = new Fx.Morph(this.onDisplay, {duration: 1000, transition: Fx.Transitions.linear});
		this.onDisplayFx.set({
			'opacity': 0
		});
		this.onDisplay.set('id', 'pic' + this.options.position);
		this.onDisplay.inject(box,'inside');
		this.onDisplayFx.start({
			'opacity': 1
		});
				
		if (this.options.position +1 == this.options.items.length)
		{
			this.options.position = 0 ;
		}
		else
		{
			this.options.position = this.options.position + 1;
		}
	}
});

Rotation.implement(new Options);