if(typeof($) == "undefined")
    $ = function(a) { return document.getElementById(a); };


function getStyle(el, prop) {
  if (document.defaultView && document.defaultView.getComputedStyle) {
    return document.defaultView.getComputedStyle(el, null)[prop];
  } else if (el.currentStyle) {
    return el.currentStyle[prop];
  } else {
    return el.style[prop];
  }
}
var scrollbars_active = new Array();
function scrollbars_move(e)
{
    if(!e) { e = window.event; }
    
    for(var i = 0; i < scrollbars_active.length; i++) {
        if(!scrollbars_active[i].drag_start) return;
        
        var ypos = (scrollbars_active[i].currentPos + e.screenY - scrollbars_active[i].drag_start.y);
        ypos = Math.max(ypos, 0);
        ypos = Math.min(ypos, scrollbars_active[i].barbar_container_height - scrollbars_active[i].barbar_height);
        scrollbars_active[i].style.top = (ypos + scrollbars_active[i].minY) + 'px';
        
        scrollbars_active[i].scroll_element.scrollTop = (ypos * scrollbars_active[i].barbar_coefficient);
    }
}
function scrollbars_up()
{
    for(var i = 0; i < scrollbars_active.length; i++) {
        scrollbars_active[i].drag_start = null;
        scrollbars_active[i].currentPos = parseInt(scrollbars_active[i].style.top.replace(/^.*(^| )([0-9]+)px.*$/, '$2'))
            - scrollbars_active[i].minY;
    }
    scrollbars_active.length = 0;
}

function getOffsetLeft(e)
{
    var sum = 0;
    while(e && e.id != "right") { sum += e.offsetLeft; e = e.offsetParent; }
    return sum;
}
function getOffsetTop(e)
{
    var sum = 0;
    while(e && e.id != "right") { sum += e.offsetTop; e = e.offsetParent; }
    return sum;
}
function scrollbars_init(id, id_scroll)
{
    var box = document.getElementById(id);
    if(box.offsetHeight >= box.scrollHeight) return;
    box.style.display = "block";
    
    minY = 15;

    var barbar_container_height = (box.offsetHeight - 4 - 4 - 13 - 13 - 4);
    var barbar_height = Math.ceil((box.offsetHeight / box.scrollHeight) * barbar_container_height);
    var barbar_coefficient = box.offsetHeight / barbar_height;

    //box.style.overflow = "hidden";
    var bar = $(id_scroll);
    var bar_as = bar.getElementsByTagName('a');
    var up = bar_as[0], down = bar_as[1];
    var barbar = $('slider');
    bar.style.display = "block";
    barbar.style.height = (5 + barbar_height) + 'px';
    
    box.onscroll = function() {
        if(scrollbars_active.length == 0) {
            barbar.currentPos = box.scrollTop / barbar_coefficient;
            barbar.style.top = (barbar.currentPos + minY) + 'px';
        }
    }

    up.onmouseup = function() {
        ypos = barbar.currentPos - 10;
        ypos = Math.max(ypos, 0);
        barbar.style.top = (ypos + minY) + 'px';
        box.scrollTop = (ypos * barbar_coefficient);
        barbar.currentPos = ypos;
    }
    
    barbar.minY = minY;
    barbar.currentPos = 0;
    barbar.barbar_container_height = barbar_container_height;
    barbar.barbar_height = barbar_height;
    barbar.barbar_coefficient = barbar_coefficient;
    barbar.scroll_element = box;
    barbar.onmousedown = function(e) {
        if(!e) { e = window.event; }

        barbar.drag_start = {x: e.screenX, y: e.screenY};
        scrollbars_active[scrollbars_active.length] = barbar;
    }
    down.onmouseup = function() {
        ypos = barbar.currentPos + 10;
        ypos = Math.min(ypos, barbar_container_height - barbar_height);
        barbar.style.top = (ypos + minY) + 'px';
        box.scrollTop = (ypos * barbar_coefficient);
        barbar.currentPos = ypos;
    }
    
    var a = new Array(bar, barbar, down, up, box);
    for(var i = 0; i < a.length; i++) {
        a[i].onselectstart = function() { return false; }
        a[i].oncontrolselect = function() { return false; }
        a[i].ondragstart = function() { return false; }
        a[i].ondragenter = function() { return false; }
        a[i].ondrag = function() { return false; }
    }
    
    document.body.onmousemove = scrollbars_move;
    document.body.onmouseup = document.body.onmouseleave = scrollbars_up;
}