// javascript document

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() {
duma.getstyle(this.obj).position == "static" ? this.obj.style.position = "relative" : duma.getstyle(this.obj).backgroundcolor == "transparent" ? this.obj.style.backgroundcolor = "#fff" : null;		//若容器本来就没有设position，则初始化为relative；若容器原来未设置背景色，则初始化为白色；

},
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);