function ScrollBar(height, minimun, maximun, onScroll,bColor,lColod) {
	var stage = null;
	var upState = null;
	var downState = null;
	var hitTestState = null;
	var bg = null;
	var offsetX = 0;
	var offsetY = 0;
	var nHeight = 0;
	var blockColor =  typeof(bColor) == 'undefined' ? '#E4C492':bColor;
	var lineColor  =  typeof(lColod) == 'undefined' ? '#E0C08D':lColod;
	init();
	return stage;
	function scrollHandler(ev) {
		ev = ev || window.event;
		var dir = 0;
		if (ev.wheelDelta) {
			dir = ev.wheelDelta > 0 ? 1 : -1;
		}else if (ev.detail) {
			dir = ev.detail < 0 ? 1: -1;
		}
		var temp =  92/(maximun - minimun) * (height - 110);
		temp  = temp < 1 ? 1 : temp;
		temp *= dir;
		setState( (parseInt(hitTestState.style.top) + -temp));
	}
	function init() {
		document.onclick = function() {
		document.onmousewheel = scrollHandler;
		//document.onDOMMouseScroll = scrollHandler;
		if (document.addEventListener) {
			document.addEventListener('DOMMouseScroll',scrollHandler, false);
		}
		}
		stage = document.createElement("DIV");
		stage.style.width = "7px";
		stage.style.height = height+ "px";
		stage.style.position = "relative";
		
		bg = document.createElement("DIV");
		bg.style.width = "1px";
		bg.style.height = height + "px";
		bg.innerHTML = ""
		bg.style.backgroundColor = blockColor;
		bg.style.marginLeft = "5px";
		bg.style.position = "absolute";
		stage.appendChild(bg);
		
		hitTestState = document.createElement("DIV");
		$(hitTestState).html("<img src='images/block.gif'>");
		hitTestState.style.width = "7px";
		hitTestState.style.height = "90px";
		//hitTestState.style.backgroundColor = lineColor,
		hitTestState.style.position = "absolute";
		stage.appendChild(hitTestState);
		hitTestState.style.top = "10px";
		hitTestState.style.cursor = "pointer";
		
		hitTestState.onmousedown = function(ev) {
			offsetY = getMouse(ev)[1] - this.offsetTop;
			offsetX = getMouse(ev)[0] - this.offsetLeft;
			document.onmousemove = mousemove;
			document.onmouseup = mouseup;
			document.onselectstart = function() {return false};
		}	
	}
	
	function mousemove(ev) {
		var tmp = parseInt(getMouse(ev)[1] - offsetY);
		setState(tmp);
	}
	function setState(tmp) {
		
		if (tmp < 10) {
			tmp = 10;
		} else if (tmp > height - 100) {
			tmp = height - 100;
		}
		nHeight = tmp;
		hitTestState.style.top = tmp + "px";
		onScroll((maximun - minimun) * (tmp-10) / (height - 110));
	}
	function mouseup() {
		document.onselectstart = null;
		document.onmousemove = null;
		document.onmouseup = null;
	}
	
	function getMouse(ev) {
		var ev = ev || window.event;
		if (ev.x) {
			nx = ev.x;
			ny = ev.y;
		} else {
			nx = ev.pageX;
			ny = ev.pageY;
		}
		return [nx,ny];
	}
}

function initScrollBar(box,mask,content,bcolor,lcolof){
	var h = $(mask).height();
	var left = $(mask).width() ;
	var bh = $(content).height();
	var ah = $(mask).height();
	var div = $(box);
	var blockColor =  typeof(bcolor) == 'undefined' ? '#E4C492':bcolor;
	var lineColor  =  typeof(lcolof) == 'undefined' ? '#E0C08D':lcolof;
	if (bh > ah) {
			var scroll = new ScrollBar(h, ah, bh, function(num) {
			var c = $(content);
			c.css("top",-num)},blockColor,lineColor);
			scroll.id = 'scrollbar';
			scroll.style.position = "absolute";
			scroll.style.top = "0px";
			scroll.style.left = left+"px";
			$("#scrollbar").remove();
			$(scroll).appendTo(box);
			scroll_obj = scroll;
			scrollupint=setInterval(function(){updateScroll(mask,content)},1000);

		}
}
function updateScroll(mask,content){
	var bh = $(content).height();
	var ah = $(mask).height();
	var scroll = $("#scrollbar");
	scroll.minimun=ah;
	scroll.maximun=bh;
}

