var mousex;
var mousey;
var CursorInMask;
var clickTopOffset;
var onClickMouseY = 0;
var boxRawHeight = 0;
var railRawHeight = 0;

jQuery.fn.scrollbox = function() {
    $(".box").width($(".mask").width() - $(".rails").width());
    $(".box").mousewheel(function(_, delta) {
        if ($(".box").height() > $(".mask").height()) {
            BindConstants();
            scrollWheel(delta);
            return false;
        }
    });
    $(document).bind({
        mouseup: function() {
            $(document).unbind("mousemove ", MouseMove);
        }
    });
    $(".slider").bind({
        mousedown: function() {
            BindConstants();
            $(document).mousemove(MouseMove);
        }
    });
    $($("body")).mousemove(function(ev) {
        mousex = ev.pageX;
        mousey = ev.pageY;
        if (IsCursorIn($(".mask"))) {
            if ($(".box").height() > $(".mask").height()) {
                $(".rails").fadeIn(1000);
            }
        }
        else {
            $(".rails").fadeOut(1000);
        }
    });
};

function BindConstants() {
    onClickMouseY = mousey
    boxRawHeight = $(".box").height() - $(".mask").height();
    railRawHeight = $(".rails").height() - $(".slider").height();
}

function boxScroll(delta) {
    var boxDelta = (boxRawHeight * delta) / railRawHeight;
    $(".box").offset({ top: $(".mask").offset().top - boxDelta, left: $(".box").offset().left });
}

function IsCursorIn(elem) {
    return elem.offset().top < mousey
                && elem.offset().top + elem.height() > mousey
                && elem.offset().left < mousex
                && elem.offset().left + elem.width() > mousex;
}

function MouseMove() {
    var delta = onClickMouseY - mousey;
    $("#delta").text(onClickMouseY + " " + mousey + " " + delta);
    SliderMove(delta);
    onClickMouseY = mousey;
}

function SliderMove(delta) {
    if ($(".slider").offset().top - delta < $(".rails").offset().top || $(".slider").offset().top - delta + $(".slider").height() > $(".rails").offset().top + $(".rails").height()) {
        return;
    }
    if (navigator.userAgent.toLowerCase().indexOf("opera") != -1) {
        $(".slider").offset({ top: $(".slider").offset().top - delta, left: $(".slider").parent().offset().left });
    }
    else {
        $(".slider").offset({ top: $(".slider").offset().top - delta, left: $(".slider").offset().left });
    }
    boxScroll($(".slider").offset().top - $(".rails").offset().top);
}

function scrollWheel(delta) {
    SliderMove(delta * 10);
}