var tmp = 0;
var tmo = null;

$j(document).ready(function() {
    $j(".scroll-banner").each(function() {
        this.scrl = $j("<div class='content'></div><div class='scrollbar'><div class='slider'></div><div class='arrow up'></div><div class='arrow down'></div></div>");
        var content = $j(this).html();
        $j(this).html("");
        $j(this).append(this.scrl);
        $j(this).find(".content").html(content);

        $j(this).mouseenter(function() {
            this.showed = true;
            $j(this).find(".scrollbar").addClass("hover");
        });
        $j(this).mouseleave(function() {
            this.showed = false;
            if ($j(this).find(".slider")[0].dragStarted) return false;
            $j(this).find(".scrollbar").removeClass("hover");
        });

        $j(this).find(".arrow").mousedown(function() {
            var step = 15;
            if ($j(this).hasClass("up")) step*=-1;
            $j(this.parentNode.parentNode).find(".content")[0].scrollTop+=step;
            setScrollbar($j(this.parentNode.parentNode));
            tmp = this;
            tmo = setTimeout(function() { $j(tmp).trigger("mousedown");}, 100);
        });

        $j(this).find(".arrow").mouseup(function() {
            if (tmo) clearTimeout(tmo);
        });

        $j(this).find(".slider").mousedown(function(event) {
            event.preventDefault();
            this.dragStarted = true;
            return false;
        });
        $j(this).find(".slider").mouseup(function(event) {
            event.preventDefault();
            this.dragStarted = false;
            if (!this.parentNode.parentNode.showed) $j(this.parentNode.parentNode).find(".scrollbar").removeClass("hover");
            return false;
        });
        $j(this).find(".scrollbar").mousemove(function(event) {
            event.preventDefault();
            if (!$j(this).find(".slider")[0].dragStarted) return false;
            var y = event.pageY - $j(this.parentNode.parentNode).find(".scrollbar").offset().top - 16;
            if (y<23) y=23;
            if (y>312) y=312;
            var p = (y-23)/289;
            var obj = $j(this.parentNode);
            var h = obj.find(".content")[0].scrollHeight - obj.outerHeight() + 2;
            obj.find(".content")[0].scrollTop = p*h;
            $j(this.parentNode).find(".slider").css({top: y+"px"});
            return false;
        });

        $j(this).find(".content").mousewheel(function(event, delta) {
            event.preventDefault();
            var step = 30;
            if (delta>0) step*=-1;
            $j(this.parentNode).find(".content")[0].scrollTop+=step;
            setScrollbar($j(this.parentNode));
            return false;
        });
    });

    $j(document).mouseup(function() {
        $j(".slider").each(function() { 
            this.dragStarted = false;
            if (!this.parentNode.parentNode.showed) $j(this.parentNode.parentNode).find(".scrollbar").removeClass("hover");
        });
    });
});

setScrollbar = function(obj) {
    var t = obj.find(".content")[0].scrollTop;
    var h = obj.find(".content")[0].scrollHeight - obj.outerHeight() + 2;
    var p = t/h;
    var y = Math.floor(23 + 289*p);
    obj.find(".slider").css({top: y+"px"});
}