var avScroll = new Class({

    options: {
		imgWidth: 0,
		scrollRange: 0,
		picsPerRow:0, 
		container: null,
		leftClicks: 0,
		rightClicks: 0,
		speed: 500		
	},
	
	initialize: function(options){
	this.setOptions(options)
	
		this.imgWidth = options['imgWidth'];
		this.scrollRange = options['scrollRange'];
		this.container = $(options['container']);
		this.picsPerRow = options['picsPerRow'];
		
		if($(options['ff'])){
			this.ff = $(options['ff']);
			$(this.ff).addEvent('click',this.fastForward.bindWithEvent(this));
		}
		if($(options['rw'])){
			this.rw = $(options['rw']);
			$(this.rw).addEvent('click',this.speedReverse.bindWithEvent(this));
		}
		
		this.leftClicks = 0;
		this.rightClicks = 0;
		this.speed = options['speed'];		
	},
	
	fastForward: function(){
		
				if(this.leftClicks < this.scrollRange-this.picsPerRow){
					// scroll 4 images to the right, calculate it on base of the clicks and the image width
					var start= (this.leftClicks) * this.imgWidth;			
					var end = (( this.leftClicks + this.picsPerRow ) * this.imgWidth);
					$(this.container).effect('right',{ duration: this.speed, wait:true, transition:Fx.Transitions.Back.easeInOut }).start(start,end);
					this.leftClicks = this.leftClicks +  this.picsPerRow;
				}
				
	},
	
	speedReverse: function(){
		
				if(this.leftClicks > 0){
					var start= (this.leftClicks *  this.imgWidth );
					var end = ((this.leftClicks  - this.picsPerRow ) * this.imgWidth);
					$(this.container).effect('right',{ duration: this.speed, wait:true, transition: Fx.Transitions.Back.easeInOut }).start(start,end);
					this.leftClicks-= this.picsPerRow;
				}
				
	}
				
});
avScroll.implement(new Options, new Events);