function ScrollPanel(name,container){
	this.name=name;
	this.container=container;
	this.outer;
	this.inner;
	this.scrollbar;
	this.arrowUp;
	this.arrowDown;
	this.scrollbutton;

	this.y;
	this.tmpY;
	this.step=200;
	this.onscroll=false;
	this.buttonY=0;
	this.buttonYmax=0;

	this.init=function(){
		this.container=document.getElementById(this.container);

		if(this.container){
			if(this.isIE()){
				this.outer        = document.createElement('div');
				this.inner        = document.createElement('div');
				this.scrollbar    = document.createElement('div');
				this.arrowUp      = document.createElement('<div onclick="'+this.name+'.scrollUp()">');
				this.arrowDown    = document.createElement('<div onclick="'+this.name+'.scrollDown()">');
				this.scrollbutton = document.createElement('<div onmousemove="'+this.name+'.move()" onmouseover="'+this.name+'.mouseOver()" onmouseout="'+this.name+'.mouseOut()">');

				this.arrowUp.setAttribute('onclick',this.name+'.scrollUp()');
				this.arrowDown.setAttribute('onclick',this.name+'.scrollDown()');
				this.scrollbutton.setAttribute('id','scrollbutton');
			} else {
				this.outer        = document.createElement('div');
				this.inner        = document.createElement('div');
				this.scrollbar    = document.createElement('div');
				this.arrowUp      = document.createElement('div');
				this.arrowDown    = document.createElement('div');
				this.scrollbutton = document.createElement('div');

				this.arrowUp.setAttribute('onclick',this.name+'.scrollUp("'+this.name+'")');
				this.arrowDown.setAttribute('onclick',this.name+'.scrollDown("'+this.name+'")');
				this.scrollbutton.setAttribute('id','scrollbutton');
				this.scrollbutton.addEventListener("mousedown",this.mouseDown,false)
				this.scrollbutton.addEventListener("mouseup",this.mouseUp,false)
				this.scrollbutton.addEventListener("mousemove",this.move,false)
				this.scrollbutton.addEventListener("mouseover",this.mouseOver,false)
				this.scrollbutton.addEventListener("mouseout",this.mouseOut,false)
			}

			this.outer.style.overflow                   = 'hidden';
			this.outer.style.width                      = '95%';
			this.outer.style.height                     = '100%';
			this.outer.style.position                   = 'relative';
			if(this.isIE()) this.outer.style.styleFloat = 'left';
			else this.outer.style.cssFloat              = 'left';

			this.inner.style.width    = '100%';
			this.inner.style.position = 'relative';

			this.scrollbar.style.width                      = '5%';
			this.scrollbar.style.height                     = '100%';
			if(this.isIE()) this.scrollbar.style.styleFloat = 'left';
			else this.scrollbar.style.cssFloat              = 'left';

			this.arrowUp.style.width       = '100%';
			this.arrowUp.style.height      = '30px';
			this.arrowUp.style.marginLeft  = 'auto';
			this.arrowUp.style.marginRight = 'auto';
			this.arrowUp.style.position    = 'relative';
			this.arrowUp.style.top         = '0px';
			this.arrowUp.style.background  = 'url(images/arrow_up.gif)';
			if(this.isIE()) this.arrowUp.style.cursor='hand';
			else this.arrowUp.style.cursor='pointer';

			this.arrowDown.style.width       = '100%';
			this.arrowDown.style.height      = '30px';
			this.arrowDown.style.marginLeft  = 'auto';
			this.arrowDown.style.marginRight = 'auto';
			this.arrowDown.style.position    = 'relative';
			this.arrowDown.style.background  = 'url(images/arrow_down.gif)';
			if(this.isIE()) this.arrowDown.style.cursor='hand';
			else this.arrowDown.style.cursor='pointer';

			this.scrollbutton.style.width       = '60%';
			this.scrollbutton.style.height      = '100px';
			this.scrollbutton.style.marginLeft  = 'auto';
			this.scrollbutton.style.marginRight = 'auto';
			this.scrollbutton.style.position    = 'relative';
			if(this.needButton)
			this.scrollbutton.style.border      = 'solid 1px #922423';
			if(this.isIE()) this.scrollbutton.style.cursor='hand';
			else this.scrollbutton.style.cursor='pointer';
			this.scrollbutton.panel             = this;

			this.inner.innerHTML=this.container.innerHTML;
			this.container.innerHTML='';

			this.scrollbar.appendChild(this.arrowUp);
			this.scrollbar.appendChild(this.scrollbutton);
			this.scrollbar.appendChild(this.arrowDown);
			this.outer.appendChild(this.inner);
			this.container.appendChild(this.outer);
			this.container.appendChild(this.scrollbar);

			var contpadding=(this.isIE())?this.container.offsetTop:this.outer.offsetTop-this.container.offsetTop;
			if(!this.isIE()) this.arrowDown.style.top=(this.scrollbar.offsetHeight-this.arrowDown.offsetHeight-2*contpadding-this.scrollbutton.offsetHeight)+'px';
			else this.arrowDown.style.top=(this.scrollbar.offsetTop+this.scrollbar.offsetHeight-this.arrowDown.offsetHeight-this.scrollbutton.offsetHeight-40)+'px';
			this.buttonYmax=this.scrollbar.offsetHeight-this.arrowDown.offsetHeight-2*contpadding-this.scrollbutton.offsetHeight;
			if(this.isIE())this.buttonYmax+=2*contpadding-26;

			this.y=0;
			this.tmpY=0;
		}
	}

	this.scrollUp=function(){
		if((this.y+this.step)<0) this.y+=this.step;
		else this.y=0;
		this.scroll();
	}

	this.scrollDown=function(){
		if(-this.y+this.step<this.inner.offsetHeight-this.outer.offsetHeight) this.y-=this.step;
		else this.y=this.outer.offsetHeight-this.inner.offsetHeight;
		this.scroll();
	}

	this.scroll=function(){
		if(Math.abs(this.tmpY-this.y)>1){
			this.tmpY=this.tmpY+((this.y-this.tmpY)/5);
			setTimeout(this.name+'.scrollTo('+this.tmpY+')',50);
		}
	}

	this.scrollTo=function(y){
		this.inner.style.top=y+"px";
		this.buttonY=y*(this.buttonYmax/(this.outer.offsetHeight-this.inner.offsetHeight));
		this.scrollbutton.style.top=this.buttonY+'px';

		this.scroll();
	}

	this.mouseDown=function(e){
		if(!e) var e = window.event;

		var targ;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;

		targ.panel.onscroll=true;
	}

	this.mouseUp=function(e){
		if(!e) var e = window.event;

		var targ;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;

		targ.panel.onscroll=false;
	}

	this.mouseOver=function(e){
		if(!e) var e = window.event;

		var targ;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;

		targ.panel.scrollbutton.style.background='rgb(242,232,224)';
	}

	this.mouseOut=function(e){
		if(!e) var e = window.event;

		var targ;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;

		targ.panel.scrollbutton.style.background='none';
	}

	this.move=function(e){
		if(!e) var e = window.event;

		var targ;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;

		var posy;
		if(e.pageY){ posy = e.pageY; }
		else {
			if(e.clientY){
				posy = e.clientY;
				if (this.isIE()){ posy += document.body.scrollTop; }
			}
		}
		var mousePos=targ.panel.mouseCoords(e);

		var magic1=570;
		var scrolltop;
		if((mousePos.y-magic1)<0) scrolltop=0;
		else if((mousePos.y-magic1)>(targ.panel.buttonYmax)) scrolltop=targ.panel.buttonYmax;
		else scrolltop=(mousePos.y-magic1);
		targ.panel.scrollbutton.style.top=scrolltop+'px';
		targ.panel.buttonY=scrolltop;
		targ.panel.y=(targ.panel.outer.offsetHeight-targ.panel.inner.offsetHeight)*((targ.panel.buttonY)/targ.panel.buttonYmax)
		targ.panel.inner.style.top=targ.panel.y+'px';
	}

	this.mouseCoords=function(ev){
		if(ev.pageX || ev.pageY) return {x:ev.pageX, y:ev.pageY};
		return {
			x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
			y:ev.clientY + document.body.scrollTop  - document.body.clientTop
		};
	}

	this.isIE=function(){
		return (this.strpos(navigator.userAgent.toLowerCase(),"msie",0)>0);
	}

	this.strpos=function( haystack, needle, offset){
	    var i = haystack.indexOf( needle, offset ); // returns -1
	    return i >= 0 ? i : false;
	}

	this.addInit=function(name) {
	    var oldQueue = window.onload? window.onload: function() {};
	    window.onload = function() {
	    	eval(name+".init()");
	        oldQueue();
	    }
	}

	this.addInit(this.name);
}