// JavaScript Document
var JGridScrollers = new Class({

    getOptions: function(){
        return { transition: false
        };
    },
    initialize: function(dlist, options){
        this.setOptions(this.getOptions(), options);
        this.dlist = $(dlist);
		//alert('called');
				
		if ( this.dlist.hasClass('clickScroller') )
		{
			//alert('clickScroller');
		    this.inner = dlist.getFirst('div');
			this.innerFader = null;
			
			if(this.options.transition)
			{
				this.innerFader = new Fx.Style(this.inner,'opacity', {duration:500});
			}
			
		    this.outerSize = dlist.getSize();
		    this.innerSize = this.inner.getSize();
		    this.currLeft = 0;
		    this.currTop = 0;
			this.numPanes = Math.round(this.innerSize.size.x/this.outerSize.size.x);
			this.currPane = 1;
			//alert(this.numPanes);
		    //alert('out width=' + this.innerSize.size.x + ' inner height=' + this.innerSize.size.y);
		    //alert('outer width=' + this.outerSize.size.x + ' offset size=' + this.offsetWidth);
			
			this.firstpane = this.inner.getFirst('div');
			this.margin = this.firstpane.getStyle('margin').toInt();
			this.direction = 'horizontal';
			if ( this.dlist.hasClass('vertical') )
			{
				this.direction = 'vertical';
			}
			
			this.buttonPane = new Element('div').injectAfter(this.dlist).addClass('buttonPane');
			

            this.forwardButton = new Element('div', {'html':' '}).injectInside(this.buttonPane).addClass('forwardButton');
			this.forwardButton.setStyle('cursor', 'pointer');
			
			
			this.forwardButton.addClass(this.dlist.id + '_forward' );
			
			
			if ( this.direction == 'horizontal')
			{			
			   this.forwardButton.addEvent('click', this.scrollForward.bind(this));
			}
			else
			{
			   this.forwardButton.addEvent('click', this.scrollDown.bind(this));
			}
			
			
			this.counter = new Element('div',{'html': ' '}).injectInside(this.buttonPane).addClass('counter');
			this.counter.innerHTML = '1/'+this.numPanes;
			
            this.backButton = new Element('div',  {'html':' '}).injectInside(this.buttonPane).addClass('backButton');
			this.backButton.setStyle('cursor', 'pointer');			
			this.backButton.addClass(this.dlist.id + '_back' );
			//this.backButton.addClass(this.direction);	
			
			if ( this.direction == 'horizontal')
			{
			    this.backButton.addEvent('click', this.scrollBack.bind(this));
			}
			else
			{
			    this.backButton.addEvent('click', this.scrollUp.bind(this));
			}			
			
			

			this.scrollTo(0, false, this.dlist);
			this.scrollTo(false, 0, this.dlist);
				//alert('this line reached');		
			
		}
		
	},
	scrollForward : function(){
		if(this.options.transition)
		{
			this.innerFader.set(0);

		}
		if(this.currPane >= this.numPanes)
		{
		  this.scrollTo(0, false, this.dlist);
		  this.currPane = 1;
		  this.currLeft = 0;
		}
		else if ( (this.currLeft + this.outerSize.size.x ) < this.innerSize.scrollSize.x )
		{
			this.currLeft = this.currLeft + this.outerSize.size.x-this.margin;
		    this.scrollTo( this.currLeft, this.currTop, this.dlist );
		    this.currPane++;
			
		}
		this.updateCounter();
		if(this.options.transition)
		{
			this.innerFader.start(0,1);
		}
		
		//alert('inner scroll left=' + this.currLeft + ' inner scroll height=' + this.currTop);	
		
	},
	scrollBack : function(){
		if(this.options.transition)
		{
		    this.innerFader.set(0);
		}
		
		
		if(this.currPane <= 1)
		{
			this.scrollTo('full', false, this.dlist);
			this.currPane = this.numPanes;
			this.currLeft = this.innerSize.scrollSize.x - this.outerSize.size.x;
		}		
		else if ( (this.currLeft - this.outerSize.size.x ) > 0 )
		{
			this.currLeft = this.currLeft - this.outerSize.size.x+this.margin;
		    this.scrollTo( this.currLeft, this.currTop, this.dlist );
		    this.currPane--;
			
		}
		else
		{
		  this.currLeft = 0;	
		    this.scrollTo( this.currLeft, this.currTop, this.dlist );
		    this.currPane--;
		  
		}
		this.updateCounter();
		if(this.options.transition)
		{
			this.innerFader.start(0,1);
		}
		
		
		
	},
	scrollDown : function(){
		if(this.options.transition)
		{
		    this.innerFader.set(0);
		}
		
		if(this.currPane >= this.numPanes)
		{
		  this.scrollTo(false, 0, this.dlist);
		  this.currPane = 1;
		  this.currTop = 0;
		}
		else if ( (this.currTop + this.outerSize.size.y) < this.innerSize.scrollSize.y )
		{
			this.currTop = this.currTop + this.outerSize.size.y;
	     	this.scrollTo( this.currLeft, this.currTop, this.dlist );
	    	this.currPane++;
			
		}
		this.updateCounter();
		if(this.options.transition)
		{
			this.innerFader.start(0,1);
		}
		//alert('inner scroll left=' + this.currLeft + ' inner scroll height=' + this.currTop);	
		
	},
	scrollUp : function(){
		if(this.options.transition)
		{
		    this.innerFader.set(0);
		}
		
		if(this.currPane <= 1)
		{
		  this.scrollTo(false, 'full', this.dlist);
		  this.currPane = this.numPanes;
		  this.currTop = this.innerSize.scrollSize.y - this.outerSize.size.y;
		}
		else if ( (this.currTop - this.outerSize.size.y) > 0 )
		{
			this.currTop = this.currTop - this.outerSize.size.y;
		    this.scrollTo( this.currLeft, this.currTop, this.dlist );
	        this.currPane--;	
			
		}
		else
		{
			this.currTop = 0;
		    this.scrollTo( this.currLeft, this.currTop, this.dlist );
	        this.currPane--;	
			
		}
		this.updateCounter();
		if(this.options.transition)
		{
			this.innerFader.start(0,1);
		}
	},
	scrollTo: function(x, y, e){
		var el = e.getSize();
		var values = {'x': x, 'y': y};
		for (var z in el.size){
			var max = el.scrollSize[z] - el.size[z];
			if ($chk(values[z])) values[z] = ($type(values[z]) == 'number') ? values[z].limit(0, max) : max;
			else values[z] = el.scroll[z];
		}
		//return this.scroller.start([el.scroll.x, el.scroll.y], [values.x, values.y]);
		
		//this.scroller.start(el.scroll.x, values.x);

		e.scrollTo( values.x, values.y );
	}
	,
	updateCounter: function(){
		this.counter.innerHTML = '' + this.currPane + '/' + this.numPanes;
	}


});

JGridScrollers.implement(new Events);
JGridScrollers.implement(new Options);

//alert('scrollpane included');