window.addEvent('domready', function(){

	var ch = $('scroll_cont').offsetHeight;
	var ich = $('scroll_incont').offsetHeight;
	var dif = null;
	var ct = 0;
	var scroll_down = $('scroll_top');
	var scroll_up = $('scroll_bot');
	var drag = $('scrollbar_drag');
	var pos = 0;
	var gap = 80/40;
	
	if(ich <= ch){
		$('scrollbar').style.visibility = "hidden";
	}else{
		$('scrollbar').style.visibility = "visible";
		dif = (ich-ch)/40;
	};
	
	var mySlide = new Slider($('scrollbar_area'), $('scrollbar_drag'), {	
		steps: 40,	
		mode: 'vertical',	
		onChange: function(step){
			$('scroll_incont').style.top = String(Number(step*-dif) + "px");
			pos = step;
		}
	}).set(0);
	
	scroll_up.addEvent('mousedown', function(event){
		this.interval = (function(event){
			pos++;
			ct = pos*gap;
			if(pos <= 40){
				drag.style.top = String(ct + "px");
			}else if(pos >= 40){
				pos = 40;	
			}
			update();
		}.periodical(40))
	});
	scroll_up.addEvent('mouseup', function(event){
		$clear(this.interval);
	});
	scroll_up.addEvent('mouseout', function(event){
		$clear(this.interval);
	});
	
	scroll_down.addEvent('mousedown', function(event){
		this.interval = (function(event){
			pos--;
			ct = pos*gap;
			if(pos >= 0){
				drag.style.top = String(ct + "px");
			}else if(pos <= 0){
				pos = 0;	
			}
			update();
		}.periodical(40))
	});
	scroll_down.addEvent('mouseup', function(event){
		$clear(this.interval);
	});
	scroll_down.addEvent('mouseout', function(event){
		$clear(this.interval);
	});
	
	function update(){
		$('scroll_incont').style.top = 	String(Number(pos*-dif) + "px");
	}

});