var duma = {
	$:function(o){ 
		if(document.getElementById(o)) {
			return document.getElementById(o);
		}
	},
	getStyle:function(o) { 
		return o.currentStyle||document.defaultView.getComputedStyle(o,null);
	},
	getOffset:function(o) {
		var t = o.offsetTop,h = o.offsetHeight;
		while(o = o.offsetParent) { 
			t += o.offsetTop;
		}
		return {
			top:t,
			height:h
		};
	},
	bind:function(o,eType,fn) {
		if(o.addEventListener) { 
			o.addEventListener(eType,fn,false);
		}
		else if(o.attachEvent) { 
			o.attachEvent("on" + eType,fn);
		}
		else { 
			o["on" + eType] = fn;
		}
	},
	stopEvent:function(e) {
		e = e || window.event;
		e.stopPropagation && (e.preventDefault(),e.stopPropagation()) || (e.cancelBubble = true,e.returnValue = false);
	},
	setCookie:function(c_name,value,expiredays) {
		var exdate = new Date();
		exdate.setDate(exdate.getDate() + expiredays);
		document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());
	},
	getCookie:function(c_name) {
		if(document.cookie.length > 0) {
			c_start = document.cookie.indexOf(c_name + "=");
			if(c_start != -1) {
				c_start = c_start + c_name.length + 1;
				c_end = document.cookie.indexOf(";",c_start);
				if(c_end == -1) { 
					c_end = document.cookie.length;
				}
				return unescape(document.cookie.substring(c_start,c_end));
			}
		}
		return "";
	}
};
duma.BeautifyScrollBar = function(obj,arrowUpCss,arrowUpActiveCss,handleCss,handleActiveCss,arrowDownCss,arrowDownActiveCss) {
	this.arrowUpInterval;
	this.arrowDownInterval;
	this.barMouseDownInterval;
	this.relY;
	this.id = obj;
	this.obj = duma.$(this.id);
	this.setObjCss();		//预先设置父容器的css定位才能让接下来的属性设置起作用
	this.obj.innerHTML = '<div id="' + obj + 'Area" class="dumascroll_area">' + this.obj.innerHTML + '</div>'
	+'<div id="' + obj + 'Bar" class="dumascroll_bar">'
	+'<div class="dumascroll_arrow_up"></div>'
	+'<div class="dumascroll_handle"></div>'
	+'<div class="dumascroll_arrow_down"></div></div>';
	this.area = duma.$(obj + "Area");
	this.bar = duma.$(obj + "Bar");
	this.barPos;
	this.arrowUp = this.bar.getElementsByTagName("div")[0];
	this.arrowUpCss = arrowUpCss;
	this.arrowUpActiveCss = arrowUpActiveCss;
	this.handle = this.bar.getElementsByTagName("div")[1];
	this.handleCss = handleCss;
	this.handleActiveCss = handleActiveCss;
	this.arrowDown = this.bar.getElementsByTagName("div")[2];
	this.arrowDownCss = arrowDownCss;
	this.arrowDownActiveCss = arrowDownActiveCss;
	this.handleMinHeight = 15;
	this.arrowUpHeight = parseInt(duma.getStyle(this.arrowUp).height);
	this.arrowDownHeight = parseInt(duma.getStyle(this.arrowDown).height);
	this.areaScrollHeight = this.area.scrollHeight;
	this.handleHeight = parseInt(this.area.offsetHeight/this.area.scrollHeight * (this.bar.offsetHeight - this.arrowUpHeight - this.arrowDownHeight));
}
duma.BeautifyScrollBar.prototype = {
	setObjCss:function() {
		//若容器本来就没有设position，则初始化为relative；若容器原来未设置背景色，则初始化为白色；
		duma.getStyle(this.obj).position == "static"
		? this.obj.style.position = "relative"
		: duma.getStyle(this.obj).backgroundColor == "transparent" ? this.obj.style.backgroundColor = "#fff" : null;
	},
	sethandle:function() {				//当内容超多时设置拖拽条子的最小高度
		this.handle.style.top = this.arrowUpHeight + "px";
		if(this.handleHeight > this.handleMinHeight) {
			this.handleHeight < this.bar.offsetHeight - this.arrowUpHeight - this.arrowDownHeight
			? this.handle.style.height = this.handleHeight + "px"
			: this.handle.style.display = "none";
		}
		else { 
			this.handleHeight = this.handleMinHeight; this.handle.style.height = this.handleMinHeight + "px";
		}
	},
	setBarPos:function() {				//将当前滚动的距离值存入cookie
		this.barPos = this.area.scrollTop + "";
		duma.setCookie(this.id + "CookieName",this.barPos,1);
	},
	getBarPos:function() {
		this.barPos = duma.getCookie(this.id + "CookieName");
		if(this.barPos!=null && this.barPos!="") {
			this.area.scrollTop = this.barPos;
			this.areaScroll();
		}
	},
	clearArrowUpInterval:function() { 
		clearInterval(this.arrowUpInterval);
	},
	clearArrowDownInterval:function() { 
		clearInterval(this.arrowDownInterval);
	},
	clearBarMouseDownInterval:function() { 
		clearInterval(this.barMouseDownInterval);
	},
	areaScroll:function() {
		this.handle.style.display != "none"
			? this.handle.style.top = this.area.scrollTop/(this.area.scrollHeight - this.area.offsetHeight)
				* (this.bar.offsetHeight - this.handleHeight - this.arrowUpHeight - this.arrowDownHeight) + this.arrowUpHeight + "px"
			: null;
	},
	areakeydown:function(e) {			//支持键盘上下按键
		var that = this;
		document.onkeydown = function(event) {
			var e = event || window.event,
			ek = e.keyCode || e.which;
			if(ek == 40) { 
				that.area.scrollTop += 25
			}
			else if(ek == 38) { 
				that.area.scrollTop -= 25
			}
			if(that.area.scrollTop > 0 && that.area.scrollTop < that.area.scrollHeight - that.area.offsetHeight){ 
				duma.stopEvent(e);
			}
			that.setBarPos();
		}
	},
	handleMove:function(e) {
		var e = e || window.event;
		this.area.scrollTop = (e.clientY - this.relY - this.arrowUpHeight)
			/(this.bar.offsetHeight - this.handleHeight - this.arrowUpHeight - this.arrowDownHeight)
			*(this.area.scrollHeight - this.area.offsetHeight);
		this.setBarPos();
	},
	handleMouseDown:function(e) {
		var that = this,e = e || window.event;
		that.relY = e.clientY - that.handle.offsetTop;
		that.handle.setCapture ? that.handle.setCapture() : null;
		that.handle.className = that.handleActiveCss;
		document.onmousemove = function(event) { 
			that.handleMove(event);
		};
		document.onmouseup = function() {
			that.handle.className = that.handleCss;
			that.handle.releaseCapture ? that.handle.releaseCapture() : null;
			document.onmousemove = null;
		};
	},
	barScroll:function(e) {
		var e = e || window.event,eDir;		//设置滚轮事件,e.wheelDelta与e.detail分别兼容IE、W3C，根据返回值的正负来判断滚动方向
		if(e.wheelDelta) { 
			eDir = e.wheelDelta/120;
		}
		else if(e.detail) { 
			eDir = -e.detail/3;
		}
		eDir > 0 ? this.area.scrollTop -= 80 : this.area.scrollTop += 80;	//步长设80像素比较接近window滚动条的滚动速度
		if(this.area.scrollTop > 0 && this.area.scrollTop < this.area.scrollHeight - this.area.offsetHeight){ 
			duma.stopEvent(e);
		}
		this.setBarPos();
	},
	barDown:function(e) {
		var e = e || window.event,that = this,
		eY = e.clientY,
		mStep = this.bar.offsetHeight,
		documentScrollTop = document.documentElement.scrollTop || document.body.scrollTop,
		hOffset = duma.getOffset(this.handle),
		bOffset = duma.getOffset(this.bar);
		if(documentScrollTop + eY < hOffset.top) {
			this.barMouseDownInterval = setInterval(function(e){
				that.area.scrollTop -= that.area.offsetHeight;
				if(that.area.scrollTop <= (eY + documentScrollTop - bOffset.top - that.arrowUpHeight)/(that.bar.offsetHeight - that.arrowUpHeight - that.arrowDownHeight) * that.area.scrollHeight) {
					that.clearBarMouseDownInterval();
				}
				that.setBarPos();
			},80);
		}
		else if(documentScrollTop + eY > hOffset.top + hOffset.height) {
			this.barMouseDownInterval = setInterval(function(){
				that.area.scrollTop += that.area.offsetHeight;
				if(that.area.scrollTop >= (eY + documentScrollTop - bOffset.top - that.arrowUpHeight - hOffset.height)/(that.bar.offsetHeight - that.arrowUpHeight - that.arrowDownHeight) * that.area.scrollHeight) {
					that.clearBarMouseDownInterval();
				}
				that.setBarPos();
			},80);
		}
		duma.stopEvent(e);
	},
	arrowUpMouseDown:function(e) {
		var that = this;
		this.arrowUpInterval = setInterval(function(){ 
			that.area.scrollTop -= 25; that.setBarPos();
		},10);
		this.arrowUp.className = this.arrowUpActiveCss;
		duma.stopEvent(e);
	},
	arrowUpMouseUp:function() { 
		this.clearArrowUpInterval(); this.arrowUp.className = this.arrowUpCss;
	},
	arrowUpMouseOut:function() { 
		this.clearArrowUpInterval(); this.arrowUp.className = this.arrowUpCss;
	},
	arrowDownMouseDown:function(e) {
		var that = this;
		this.arrowDownInterval = setInterval(function(){ 
			that.area.scrollTop += 25; that.setBarPos();
		},10);
		this.arrowDown.className = this.arrowDownActiveCss;
		duma.stopEvent(e);
	},
	arrowDownMouseUp:function() { 
		this.clearArrowDownInterval(); this.arrowDown.className = this.arrowDownCss;
	},
	arrowDownMouseOut:function() { 
		this.clearArrowDownInterval(); this.arrowDown.className = this.arrowDownCss;
	},
	run:function(){
		var that = this;
		this.sethandle();
		this.areaScroll();
		this.getBarPos();
		this.area.onscroll = function(){
			that.areaScroll()
		};
		this.area.onmouseover = this.bar.onmouseover = function(event){
			that.areakeydown(event)
		};
		this.area.onmouseout = this.bar.onmouseout = function(){
			document.onkeydown = null
		};
		this.handle.onmousedown = function(event){
			that.handleMouseDown(event)
		};
		this.bar.onmousedown = function(event){
			that.barDown(event)
		};
		this.bar.onmouseup = function(){
			that.clearBarMouseDownInterval()
		};
		this.bar.onmouseout = function(){
			that.clearBarMouseDownInterval()
		};
		this.arrowUp.onmousedown = function(event){
			that.arrowUpMouseDown(event)
		};
		this.arrowUp.onmouseup = function(){
			that.arrowUpMouseUp()
		};
		this.arrowUp.onmouseout = function(){
			that.arrowUpMouseOut()
		};
		this.arrowDown.onmousedown = function(event){
			that.arrowDownMouseDown(event)
		};
		this.arrowDown.onmouseup = function(){
			that.arrowDownMouseUp()
		};
		this.arrowDown.onmouseout = function(){
			that.arrowDownMouseOut()
		};
		duma.bind(this.obj,"mousewheel",function(event){
			that.barScroll(event)
		});
		duma.bind(this.obj,"DOMMouseScroll",function(event){
			that.barScroll(event)
		});
	}
}
duma.BeautifyScrollBar.init = function() {
	var o = document.getElementsByTagName("div"),
	oLen = o.length,
	dumascrollClass = /\bdumascroll\b/,
	oArr = [],
	oArrLen = oArr.length;
	for(var i=0; i<oLen; i++) {
		if(dumascrollClass.test(o[i].className)) {
			oArr.push("dumaScrollAreaId_" + i);
			oArrLen = oArr.length;
			o[i].id = oArr[oArrLen - 1];
		}
	}
	for(var j=0; j<oArrLen; j++) {
		new duma.BeautifyScrollBar(oArr[j],"dumascroll_arrow_up","dumascroll_arrow_up_a","dumascroll_handle","dumascroll_handle_a","dumascroll_arrow_down","dumascroll_arrow_down_a").run();
	}
}
duma.bind(window,"load",duma.BeautifyScrollBar.init);