Enum=function(){for (n=0;n<arguments.length;n++) this[arguments[n]]=n}
ScrollDirection=new Enum('UP','DOWN','LEFT','RIGHT');
ScrollAxis=new Enum('X','Y');

Scrollbar=function(elm,scrollArea,axis){
	var t=this;
	t.elm=elm;
	t.scrollArea=scrollArea;
	t.axis=axis;
	var dir=axis==ScrollAxis.Y?ScrollDirection.UP:ScrollDirection.LEFT;
	elm.appendChild((t.button1=new Scrollbutton(bouw('div.scrollbtn.scroll_'+(ScrollAxis.Y?'up':'lt')),scrollArea,dir)).elm);
	elm.appendChild(bouw('div.scrollrail',_,[['div.scrollslider']]));
	elm.appendChild((t.button2=new Scrollbutton(bouw('div.scrollbtn.scroll_'+(ScrollAxis.Y?'dn':'rt')),scrollArea,dir+1)).elm);
	t.slider=new Scrollslider(elm.childNodes[1].firstChild,scrollArea,axis);
	zetStatus(elm,scrollArea.shouldScroll(axis));
}

ScrollArea=X(function(contentElm){
	var t=this;
	t.contentElm=contentElm;
	t.contentElm.style.overflow='scroll';
	t.elm=bouw('div.scrollarea');
	for (var n in contentElm.style) try {
		t.elm.style[n]=t.contentElm.style[n]
	}
	catch(e){}
	//remove standard scrollbar:
	t.stdScrollSize=t.contentElm.offsetWidth-t.contentElm.clientWidth;
	t.elm.style.overflow='hidden';
	t.elm.style.width=t.contentElm.offsetWidth+'px';
	t.contentElm.style.width=t.contentElm.offsetWidth+t.stdScrollSize+'px';
	t.elm.style.height=t.contentElm.offsetHeight+'px';
	t.contentElm.style.height=t.contentElm.offsetHeight+t.stdScrollSize+'px';
	t.elm.style.styleFloat=t.contentElm.currentStyle.styleFloat;
	t.elm.style.cssFloat=t.contentElm.currentStyle.cssFloat;
	//t.contentElm.style.border='1px solid blue';
	new Reactie(d,'mouseup',function(){t.stopScrolling()}).Start();
	this.contentElm.parentElement.replaceChild(this.elm,this.contentElm);
	this.elm.appendChild(this.contentElm);
	//TODO: resize eventhandlers (voor body want chrome heeft geen resize events op andere tags)
},{
	prototype:{
		intervalMsec:100,
		shouldScroll:function(axis){
			var wh=axis==ScrollAxis.Y?'Height':'Width';
			return this.contentElm['scroll'+wh]>this.contentElm['offset'+wh]
		},
		stopScrolling:function(){clearInterval(this.scrollInterval)},
		startScrolling:function(direction,amount){
			var t=this,s='scroll'+(direction<2?'Top':'Left'),a=amount*(direction%2==0?-1:1);
			var doScroll=function(){t.contentElm[s]+=a};
			doScroll();//todo: if mouse over srcElement
			t.scrollInterval=setInterval(doScroll,t.intervalMsec);
		}
	}
});

Scrollbutton=function(elm,scrollArea,direction){
	this.elm=elm;
	new Reactie(elm,'mousedown',function(){
		scrollArea.startScrolling(direction,scrollArea.contentElm.clientHeight/4);
	}).Start();
};

Scrollslider=function(elm,scrollArea,axis){
	var t=this;
	t.elm=elm;
	t.elmRail=elm.parentElement;
	var
	 y=axis==ScrollAxis.Y,
	 wh=y?'Height':'Width',
	 tl=y?'Top':'Left',
	 xy=y?'Y':'X',
	 dir=y?ScrollDirection.UP:ScrollDirection.LEFT,
	 scale=t.elmRail['offset'+wh]/scrollArea.contentElm['scroll'+wh]
	;
	if (!scrollArea.shouldScroll(axis)) return;
	elm.style[wh.toLowerCase()]=((scrollArea.contentElm['offset'+wh]-scrollArea.stdScrollSize)*scale).afronden()+'px';
	new Reactie(scrollArea.contentElm,'scroll',function(){
		elm.style['margin'+tl]=(scrollArea.contentElm['scroll'+tl]*scale).afronden()+'px';
	}).Start();
	new Reactie(t.elmRail,'mousedown',function(){//TODO: FF berekent offset anders!
		scrollArea.startScrolling(dir+this.Event['offset'+xy]>parseInt(elm.style['margin'+tl]||0)?1:0,scrollArea.contentElm['client'+wh]);
	}).Start();
	var startPos;
	var dmmReactie=new Reactie(d,'mousemove',function(){
		if (d.selection) d.selection.empty();
		scrollArea.contentElm.scrollTop=(startPos+Muis[xy.toLowerCase()])/scale;
	});
	var dmuReactie=new Reactie(d,'mouseup',function(){
		dmmReactie.Stop();
		dmuReactie.Stop();
	});
	new Reactie(elm,'mousedown',function(){
		startPos=parseInt(elm.style['margin'+tl]||0)-Muis[xy.toLowerCase()];
		this.Event.cancelBubble=true;
		dmmReactie.Start();
		dmuReactie.Start();
	}).Start();
};