/**
/*  scrollpane.js
/*  allows for a custom scrollbar to scroll div elements, an alternative for default scrollbars using the CSS overflow 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 : 15;
	this.barClass = (opts.barClass) ? opts.barClass : "";
	this.handleClass =  (opts.handleClass) ? opts.handleClass : "";
	this.inited = false;
	this.init = function(){	
		This.inited = true;	
		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, true);  		
		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.06; // 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); 
		 var ei = new EventInfo(e);
		 This.yoffset = ei.ymouse - This.handle.getRealTop();
		
			var np = This.ymouse - (This.handle.getRealWidth()/2) - 200;			
	 		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, false);
		//This.updateMouse(e);
		//This.yoffset = ei.ymouse - This.handle.getRealTop();  
	    This.scroll = false;     
		window.clearTimeout(This.timer);		
		return true;
	}             
	this.startscroll = function(e){
		var ei = new EventInfo(e, true); 
		This.scroll = true;    
		This.yoffset = ei.ymouse - This.handle.getRealTop(); 
		window.clearTimeout(This.timer);	     
		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 {
			window.clearTimeout(This.timer);		
		}
	} 
	this.wheel = function(e){
		window.clearTimeout(This.timer);		
		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);
		}
		return false;
	}  
	
	var a = null;
	var b = null;  
	var ch = 0;
	var sh = 0;          
	var cw = 0;
	var sw = 0;
	var dy = 0; 

	
}