var scrollBalkGlobal = Array();

function scrollBalk() {
	this.width = 15;
	this.height = 169;
	this.backgroundTop = "url(style/scrollbalk/top.png) no-repeat";
	this.backgroundMiddle = "url(style/scrollbalk/bg.png)";
	this.backgroundBottom = "url(style/scrollbalk/bottom.png) no-repeat bottom";
	this.buttonTop = {height: 15, background: "url(style/scrollbalk/button_top.png)", backgroundHover: "url(style/scrollbalk/button_top.png)"};
	this.buttonBottom = {height: 15, background: "url(style/scrollbalk/button_bottom.png)", backgroundHover: "url(style/scrollbalk/button_bottom.png)"};
	this.handle = {height: 30, background: "url(style/scrollbalk/button.png)", backgroundHover: "url(style/scrollbalk/button.png)"};

	this.id = scrollBalkGlobal.length;
	this.style = "display: block; float: right; border-top: 1px solid #9a9999; position: relative; font-size: 1px;";
	scrollBalkGlobal[this.id] = this;

	this.valuePercent = 0;
	this.onChange = function(parent, value){window.status = value;};
	
	this.pos = 0;
	this.maxPos = 0;
	this.isScrolling = false;
	this.pageScroll = 0;

	this.firstStep = 10;
	this.smoothScroll = 3;
	this.wheelSpeed = 8;
}

scrollBalk.prototype.draw = function() {
	var b, buffer, temp, did, w, omo, s, bb, bt, h;
	bb = this.buttonBottom; bt = this.buttonTop; h = this.handle;
	did = "<div id=\"scrollbalk_" + this.id;
	w = "width: " + this.width + "px;height:";
	omo = "; cursor: pointer;\" onmouseover=\"this.style.background = '";
	s = " style=\"display: block; position: absolute; top:"
	buffer = did + "\" style=\"" + this.style + w + this.height + "px;\">";
	buffer += did + "_bt\"" + s + (this.height - bb.height - bt.height) + "px;" + w + bt.height + "px; background: " + bt.background + omo + bt.backgroundHover + "'\" onmouseout=\"this.style.background = '" + bt.background + "';scrollBalkGlobal[" + this.id + "].scroll(3);\" onmousedown=\"scrollBalkGlobal[" + this.id + "].buttonDown(true);\" onmouseup=\"scrollBalkGlobal[" + this.id + "].scroll(3);\"></div>";
	temp = "display: block; position: absolute; top: 0px;" + w + (this.height - bt.height - bb.height) + "px;";
	buffer += "<div style=\"" + temp + " background: " + this.backgroundMiddle + ";\"></div><div style=\"" + temp + " background: " + this.backgroundTop + ";\"></div><div style=\"" + temp + " background: " + this.backgroundBottom + ";\"></div>";
	buffer += did + "_handle\"" + s + "3px;" + w + h.height + "px; background: " + h.background + omo + h.backgroundHover + "'\" onmouseout=\"this.style.background = '" + h.background + "';\" onmousedown=\"scrollBalkGlobal[" + this.id + "].handleDown(event);\"></div>";
	buffer += "<div" + s + (this.height - bb.height) + "px;" + w + bb.height + "px; background: " + bb.background + omo + bb.backgroundHover + "'\" onmouseout=\"this.style.background = '" + bb.background + "';scrollBalkGlobal[" + this.id + "].scroll(3);\" onmousedown=\"scrollBalkGlobal[" + this.id + "].buttonDown(false);\" onmouseup=\"scrollBalkGlobal[" + this.id + "].scroll(3);\"></div></div>";
	document.write(buffer);
	this.maxPos = this.height - bb.height - bt.height - h.height - 2;
}

scrollBalk.prototype.updatePos = function() {
	document.getElementById("scrollbalk_" + this.id + "_handle").style.top = 3 + Math.round(this.pos) + "px";
	this.valuePercent = this.pos / this.maxPos;
	this.onChange(this, this.valuePercent);
}

scrollBalk.prototype.scroll = function(start) {
	var h = this;
	if (start != 2) h.isScrolling = (start == 3) ? false : true;
	if (start != 3 && h.isScrolling == true) {
		var p, t;
		if (start == 1) {p = h.firstStep; t = 500}
		else {p = h.smoothScroll; t = 30}
		this.pos = Math.max(0, Math.min(h.pos + p, h.maxPos));
		setTimeout(function(){h.scroll(2)}, t);
		this.updatePos();
	}
}

scrollBalk.prototype.buttonDown = function(up) {
	var m = (up) ? -1 : 1;
	this.firstStep = m * Math.abs(this.firstStep);
	this.smoothScroll = m * Math.abs(this.smoothScroll);
	this.scroll(1);
}

scrollBalk.prototype.handleDown = function(e) {
	if (!e) e = window.event;
	var h = this;
	h.startPos = e.clientY - h.pos;
	document.onmouseup = h.handleUp;
	document.onmousemove = function(e) {
		if (!e) e = window.event;
		h.pos = Math.max(0, Math.min(e.clientY - h.startPos, h.maxPos));
		h.updatePos();
		if (e.preventDefault) e.preventDefault();
	}
	if (e.preventDefault) e.preventDefault();
}

scrollBalk.prototype.handleUp = function() {
	document.onmousemove = null;
	document.onmouseup = null;
}

scrollBalk.prototype.setSpeed = function(factor) {
	this.firstStep = 10 * factor;
	this.smoothScroll = 3 * factor;
	this.wheelSpeed = 8 * factor;
}

function wheelEvent(e) {
	var parent;
	if (!(parent = currentWheelHandle)) return false;
	var d = 0;
	if (!e) e = window.event;
	if (e.wheelDelta) d = e.wheelDelta;
	else if (e.detail) d = - e.detail / 3;
	if (d) {
		var np = (d < 0) ? parent.pos + parent.wheelSpeed: parent.pos - parent.wheelSpeed;
		parent.pos = Math.max(0, Math.min(parent.maxPos, np));
		parent.updatePos();
	}
	if (e.preventDefault) e.preventDefault();
	e.returnValue = false;
	e.cancelBubble = true;
	if (e.stopPropagation) e.stopPropagation();
	return false;
}

scrollBalk.prototype.wheel = function (obj, on) {
	var handle = this;
	
	if (on) {
		currentWheelHandle = this;
		if (window.addEventListener) {
    		window.addEventListener('DOMMouseScroll', wheelEvent, false);
		}
		else {
			obj.onmousewheel = wheelEvent;
		}
    }
	else {
		currentWheelHandle = false;
		if (window.removeEventListener) {
			window.removeEventListener('DOMMouseScroll', wheelEvent, false);
		}
		else {
			 obj.onmousewheel = null;
		}
	}
}

scrollBalk.prototype.setPixelPos = function(id, value) {
	document.getElementById("scrolldiv_" + id).style.top = "-" + Math.round(value) + "px";
}

var scrollBalken = Array();
var currentWheelHandle = false;

function newScrollBalk(id) {
	var temp = scrollBalken[id] = new scrollBalk();
	temp.onChange = function(parent, value) {
		var divHeight = Math.max(document.getElementById("scrolldiv_" + id).offsetHeight, 170);
		document.getElementById("scrolldiv_" + id).style.top = "-" + Math.round((divHeight - 170) * value) + "px";
	}
	temp.draw();
}

function newScrollBalkMulti(id) {
	var temp = scrollBalken[id] = new scrollBalk();
	temp.onChange = function(parent, value) {
		var divHeight = Math.max(document.getElementById("scrolldiv_" + id).offsetHeight, 132);
		document.getElementById("scrolldiv_" + id).style.top = "-" + Math.round((divHeight - 132) * value) + "px";
	}
	temp.height = 132;
	temp.draw();
}