/**
/*  scrollpane.js
/*  allows for a custom scrollbar to scroll div elements, an alternative for default scrollbars using the CSS scroll property.

/*  requires element.js, events.js

/*  Ben Ipsen  2006. No Copyright. No license. Just Love. 
/*  Use wisely and for the greater good.  
/*
/*  docs: http://benipsen.com/elementary/
**/

function ScrollPane(element, container, opts){
    if(!opts) opts = {};           
	var This = this;
   
	this.barWidth = (opts.barWidth) ? opts.barWidth : 20;
	this.barClass = (opts.barClass) ? opts.barClass : "";
	this.handleClass =  (opts.handleClass) ? opts.handleClass : "";
	
	this.init = function(){		
		This.element = new Element(element,{});
		This.container = new Element(container,{});
 		if(This.element.getRealHeight() > This.container.getRealHeight()){
			This.vertical();
			This.element = new Element(element,{onrollover:This.over, onrollout:This.off, onrelease:This.stopscroll});
			This.container = new Element(container,{onrollover:This.over, onrollout:This.off, nrelease:This.stopscroll}); 

			addWindowEventListener('mouseup',this.stopscroll);  		
			addWindowEventListener('mousewheel',This.wheel);
			addWindowEventListener('DOMMouseScroll',This.wheel);
			addWindowEventListener('mousemove',This.updateMouse);

		}
		
   	}                             

	this.vertical = function(){  
		
		a = new Animation(This.element.element,{});
	    cw = This.element.getRealWidth();
		sw = This.container.getRealWidth();   
		dy = ch-sh;   
		dx = cw-sw;

		This.element.setDimensions(This.element.getRealWidth()-20, This.element.getRealHeight());
		var bar = This.container.append("div");
			bar.style.position = 'absolute';
			bar.style.left = This.element.getRealWidth() + 'px';
			bar.style.top = '0';     
			bar.style.width = This.barWidth + 'px';
	    	bar.style.height = This.container.getRealHeight() + 'px';
			bar.className = This.barClass;
	    This.bar = new Element(bar, {onrollover:This.over, onrollout:This.off, onpress:This.barClick,onrelease:This.stopscroll});
	
	    var handle = This.bar.append("div","");
			handle.style.position = 'absolute';
			handle.className = This.handleClass;   
		    This.handle = new Element(handle,{onrollover:This.over, onrollout:This.off,  onpress:This.startscroll, onrelease:This.stopscroll});
            b = new Animation(This.handle.element,{x:0,y:0}); 
			ch = This.element.getRealHeight() + This.element.getRealHeight()*0.15; // add ratio to fix mac?!?;
			sh = This.container.getRealHeight();              
			dy = ch-sh;  
	
 	}
	     
	this.xmouse = 0;
	this.ymouse = 0;
	this.timer = null;
	this.over = function(){ This.over = true; }
	this.off = function(){ This.over = false; } 
	this.updateMouse = function(e){
		 var ei = new EventInfo(e, true);  
		 This.xmouse = ei.xmouse;
		 This.ymouse = ei.ymouse;
	}
	this.barClick = function(e){
		 This.updateMouse(e);     
		 This.yoffset = (This.handle.getRealHeight()/2);
		
		var np = This.ymouse-This.yoffset-This.bar.getRealTop();			
	 		if(np < -1){
				np = 0;
			}
			if(np > This.bar.getRealHeight() - This.handle.getRealHeight()){
			   np = This.bar.getRealHeight() - This.handle.getRealHeight();
			}  

			var hval = (np)/(sh-This.handle.getRealHeight());
			var contpos = Math.floor(dy*hval*-1);
		    a.effect({x:0,y:contpos,duration:0.4,fps:1/30,transition:physics.easeOut}); 
		    b.effect({x:0,y:np,duration:0.4,fps:1/30,transition:physics.easeOut});  
	}
	this.stopscroll = function(e){
		var ei = new EventInfo(e,true);
		This.updateMouse(e);
		This.yoffset = ei.ymouse - This.handle.getRealTop();  
	    This.scroll = false;     
		window.clearTimeout(This.timer);
	    
	}             
	this.startscroll = function(e){
		var ei = new EventInfo(e, true); 
		This.scroll = true;    
		This.yoffset = ei.ymouse - This.handle.getRealTop();      
		This.timer = window.setTimeout(This.vscroll,20);
	}
	this.vscroll = function(force, nt){        
		   
		  if(This.scroll || force){        
			 var np = This.ymouse-This.yoffset-This.bar.getRealTop();
			
	 		if(np < -1){
				np = 0;
			}
			if(np > This.bar.getRealHeight() - This.handle.getRealHeight()){
			   np = This.bar.getRealHeight() - This.handle.getRealHeight();
			}  
			                                   
			var hval = (np)/(sh-This.handle.getRealHeight());
			var contpos = Math.floor(dy*hval*-1);  
		  	
			This.element.setPosition(0,contpos);  
			This.handle.setPosition(0, np); 
			b.element.setPosition(0,np);
		    a.element.setPosition(0,contpos);
			if(!nt) This.timer = window.setTimeout(This.vscroll,10);
		} else {
			
		}
	} 
	this.wheel = function(e){
		var dir = 0; 
		var ei = new EventInfo(e, true);
	    This.ymouse = This.handle.getRealTop();
		if(!e) e = window.event;
		if(e.wheelDelta){
			dir = e.wheelDelta/120;  
			if(window.opera)
				dir *= -1;
		} else if(e.detail){
			dir = -e.detail/3;
		}                    
		
		if(e.preventDefault)
			e.preventDefault();
		e.returnValue = false;	
	    if(This.over){ 
	 		This.ymouse += dir*-5;
			This.yoffset = 0;
			This.vscroll(true);
			window.clearTimeout(This.timer);
		}
	}  
	
	var a = null;
	var b = null;  
	var ch = 0;
	var sh = 0;          
	var cw = 0;
	var sw = 0;
	var dy = 0; 

	
}