var maxScrollBars = 25;
var direction = new Array(maxScrollBars); // 0 - vertical, 1 - orizontal
var maxPos = new Array(maxScrollBars);
var scrollBox = new Array(maxScrollBars); // the container div
var ratio = new Array(maxScrollBars);
var scrollLength = new Array(maxScrollBars);
var barItem = new Array(maxScrollBars);
var buttonItem = new Array(maxScrollBars);

var current = 0;
var offset = 0;
var isDragging = false;
var dragObject = null;
var scrollBars = 0;

document.onselectstart = function() { return false; }
document.onmousemove = scrollmM;
document.onmouseup = scrollmU;

function updateScrollbar(id) {
	var maxScroll = 0;
	var btnSize = 30;
	
	if(direction[id] == 0)
		maxScroll = scrollBox[id].offsetHeight - scrollLength[id];
	else
		maxScroll = scrollBox[id].offsetWidth - scrollLength[id];
	
	if(maxScroll < 0) {
		btnSize = scrollLength[id];
		ratio[id] = -1;
		maxPos[id] = 0;
		if(barItem[id] != null) barItem[id].style.visibility = 'hidden';
	}
	else {
		btnSize = (scrollLength[id] * scrollLength[id]) / (maxScroll + scrollLength[id]);
		if(btnSize < 20) btnSize = 20;
		maxPos[id] = scrollLength[id] - btnSize;
		ratio[id] = maxScroll / maxPos[id];
	}
	
	if(direction[id] == 0) {
		buttonItem[id].style.height = btnSize + "px";
		// buttonItem[id].style.marginTop = "0px";
		// scrollBox[id].style.marginTop = "0px";
	}
	else {
		buttonItem[id].style.width = btnSize + "px";
		// buttonItem[id].style.marginLeft = "0px";
		// scrollBox[id].style.marginLeft = "0px";
	}
	
	window.setTimeout("updateScrollbar("+id+");", 1500);
	// scrollBox[id].onresize = updatesb;
}
/*
function updatesb(e) {
	if(window.event) e = window.event;
	var target = e.target != null ? e.target : e.srcElement;
	for(i = 0; i < maxScrollBars; i++)
		if(scrollBox[i] == target)
			updateScrollbar(i);
}*/

function addScrollbar(id, pDirection, scrollItem, buttonItem, scrollHeight) {
	addScrollbar(id, pDirection, scrollItem, buttonItem, scrollHeight, '');
}

function addScrollbar(id, pDirection, scrollItem, pButtonItem, scrollHeight, pBarItem) {
	direction[id] = pDirection;
	scrollBox[id] = document.getElementById(scrollItem);
	scrollLength[id] = scrollHeight;
	barItem[id] = document.getElementById(pBarItem);
	buttonItem[id] = document.getElementById(pButtonItem);
	buttonItem[id].ondrag = function() { return false; }
	buttonItem[id].onselectstart = function() { return false; }
	if(id > scrollBars) scrollBars = id + 1;
	
	updateScrollbar(id);
	
	if(direction[id] == 0) {
		buttonItem[id].style.marginTop = "0px";
		scrollBox[id].style.marginTop = "0px";
	}
	else {
		buttonItem[id].style.marginLeft = "0px";
		scrollBox[id].style.marginLeft = "0px";
	}
}

function scrollmD(id, ob, e) {
	if(ratio[id] < 0) return false;
	dragObject = ob;
	current = id;
	if(window.event) e = window.event;
	var target = e.target != null ? e.target : e.srcElement;
	var dragX = parseInt(dragObject.style.marginLeft);
	var dragY = parseInt(dragObject.style.marginTop);
	var mouseX = e.clientX;
	var mouseY = e.clientY;
	if(direction[id] == 0)
		offset = mouseY - dragY;
	else
		offset = mouseX - dragX;
	isDragging = true;
	document.onselectstart = function() { return false; }
	target.ondragstart = function() { return false; }
	document.body.focus();
	return false;
}

function scrollmM(e) {
	if(!isDragging) return;
	if(window.event) e = window.event;
	
	if(direction[current] == 0) {
		var newY = e.clientY - offset;
		if(newY < 0) newY = 0;
		if(newY > maxPos[current]) newY = maxPos[current];
		scrollBox[current].style.marginTop = "-" + (newY * ratio[current]) + "px";
		dragObject.style.marginTop = newY + "px";
	} else {
		var newX = e.clientX - offset;
		if(newX < 0) newX = 0;
		if(newX > maxPos[current]) newX = maxPos[current];
		scrollBox[current].style.marginLeft = "-" + (newX * ratio[current]) + "px";
		dragObject.style.marginLeft = newX + "px";
	}
	document.body.focus();
	return false;
}

function scrollmU() {
	if(!isDragging) return;
	isDragging = false;
	document.body.focus();
	return false;
}