//ScrollBar
function ScrollBar (target, area) {
	//alert("ScrollBar(" + [target, area, property] + ")");
	
	this.target_height = $(target).height();
	this.area_height = $(area).height();
	
	if (this.target_height > this.area_height) {
		
		var p = this;
		this.target = target;
		this.scrollbar = "#scrollbar";
		this.bar = "#scrollbar .bar";
		
		$(area).css("overflow", "hidden");
		$(area).append('<div id="scrollbar"><div class="bar"></div></div>');
		$(target).width($(target).width() - $(this.scrollbar).width() - 10);
		$(target).css({"float":"left", "position":"static"});
		$(this.scrollbar).css({"float":"right"});
		this.target_height = $(target).height();
		
		var bar_height = Math.floor(this.area_height / this.target_height * $(this.scrollbar).height());
		bar_height = Math.max(bar_height, 10);
		
		$(this.bar).height(bar_height);
		$(this.bar).css("top", 0);
		$(this.bar).mousedown(function (event) {
			p.startDrag(event);
			return false;
		});
		$("body").mouseup(function () {
			p.stopDrag();
			return false;
		});
		$(area).mousewheel(function(event, delta) {
			p.scrollTo(p.bar_y - (delta * 8));
			if (event.preventDefault) event.preventDefault();
			event.returnValue = false;
		});
		
		$(this.scrollbar).mousedown(function (event) {
			var y = event.pageY - $(p.scrollbar).position().top > p.bar_y ? bar_height : -bar_height;
			p.scrollTo(p.bar_y + y);
			return false;
		});
		
		this.start_y;
		this.max_y = Math.floor($(this.scrollbar).height() - bar_height - 6);
		this.min_y = 0;
		this.bar_y = 0;
	}
	
	return this;
}

ScrollBar.prototype.startDrag = function (event) {
	//alert("ScrollBar.startDrag()");
	
	var p = this;
	this.start_y = event.pageY - this.bar_y;
	$("body").mousemove(function (event) {
		p.scrollTo(event.pageY - p.start_y);
		return false;
	});
}

ScrollBar.prototype.scrollTo = function (value) {
	//alert("ScrollBar.scrollTo(" + value + ")");
	
	this.bar_y = Math.min(Math.max(Math.round(value), this.min_y), this.max_y);
	$(this.bar).css("top", this.bar_y);
	
	var target_y = this.bar_y / this.max_y * (this.area_height - this.target_height);
	$(this.target).css("margin-top", target_y);
}

ScrollBar.prototype.stopDrag = function () {
	//alert("ScrollBar.stopDrag()");
	
	$("body").unbind("mousemove");
}