// scrollbar1 by rod.rant-on.net | rodmorelos@msn.com
// keep these two lines and you're free to use this code

var scrollbar = {

	scrollables: 1, // set the number of scrollable content here
	
	contentY: 0, dragY: 0, clickY: 0,

	mouseDown: function(e)
	{
		e = scrollbar.fixEvent(e);
		var target = (e.target.nodeType == 3 || e.target.tagName.toLowerCase() == 'img') ? e.target.parentNode : e.target;
		for (var i = 1; i <= scrollbar.scrollables; i++)
		{
			if (target.id == scrollbar.bar[i].id)
			{
				scrollbar.bar[i].grab = true;
				scrollbar.clickY = e.clientY - scrollbar.bar[i].offsetTop;
				e.preventDefault();
			}
		}
	},

	mouseUp: function(e)
	{
		for (var i = 1; i <= scrollbar.scrollables; i++)
		{
			scrollbar.bar[i].grab = false;
			scrollbar.bg[i].grab = false;
		}
	},

	mouseMove: function(e)
	{
		for (var i = 1; i <= scrollbar.scrollables; i++)
		{
			if (scrollbar.bar[i].grab && scrollbar.content[i].height > scrollbar.container[i].height)
			{
				e = scrollbar.fixEvent(e);
				scrollbar.dragY = e.clientY - scrollbar.clickY;
				if (scrollbar.dragY < 0) scrollbar.dragY = 0;
				if (scrollbar.dragY > scrollbar.bg[i].height - scrollbar.bar[i].height) scrollbar.dragY = scrollbar.bg[i].height - scrollbar.bar[i].height;
				scrollbar.contentY = 0 - (scrollbar.dragY * (scrollbar.content[i].height - scrollbar.container[i].height) / Math.round(scrollbar.bg[i].height - scrollbar.bar[i].height));
				scrollbar.content[i].style.top = scrollbar.contentY + 'px';
				scrollbar.bar[i].style.top = scrollbar.dragY + 'px';
				e.preventDefault();
			}
		}
	},

	fixEvent: function(e, currentTarget)
	{
		if (!e) e = event;
		if (!e.target) e.target = e.srcElement;
		if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
		if (typeof e.clientY == 'undefined') e.clientY = e.pageY;
		if (!e.preventDefault) e.preventDefault = function() { this.returnValue = false; return false; }
		return e;
	},

	wheelScroll: function(e)
	{
		e = fixEvent(e);
		var el = e.target;
		if (el.id.slice(0, el.id.length - 1) != 'scrollContent')
		{
			do el = el.parentNode;
			while (el.tagName.toLowerCase() != 'div' || el.id.slice(0, el.id.length - 1) != 'scrollContent')
		}
		var i = el.id.charAt(el.id.length - 1);
		if (window.event.wheelDelta <= -120)
		{
			scroller.wheelScrolled = true;
			scroller.scroll(i, -scroller.wheelSpeed);
		}
		else if (window.event.wheelDelta >= 120)
		{
			scroller.wheelScrolled = true;
			scroller.scroll(i, scroller.wheelSpeed);
		}
		e.preventDefault();
	},

	init: function()
	{
		scrollbar.container = new Array();
		scrollbar.content = new Array();
		scrollbar.bar = new Array();
		scrollbar.bg = new Array();
		for (var i = 1; i <= scrollbar.scrollables; i++)
		{
			scrollbar.container[i] = document.getElementById('container' + i);
			scrollbar.container[i].height = scrollbar.container[i].offsetHeight;
			scrollbar.content[i] = document.getElementById('content' + i);
			scrollbar.content[i].height = scrollbar.content[i].offsetHeight;
			scrollbar.bar[i] = document.getElementById('scrollBar' + i);
			scrollbar.bar[i].height = scrollbar.bar[i].offsetHeight;
			scrollbar.bar[i].grab = false;
			scrollbar.bg[i] = document.getElementById('scrollTrack' + i);
			scrollbar.bg[i].height = scrollbar.bg[i].offsetHeight;
			scrollbar.bg[i].grab = false;

			if(scrollbar.content[i].height < scrollbar.container[i].height){
				scrollbar.bar[i].style.display = 'none';
				scrollbar.bg[i].style.display = 'none';
			}
		}
		document.onmousemove = scrollbar.mouseMove;
		document.onmousedown = scrollbar.mouseDown;
		document.onmouseup = scrollbar.mouseUp;
	}

}

onload = scrollbar.init;