function absolutePos(x,t,l){
  t=l=0; while(x){t+=x.offsetTop;l+=x.offsetLeft;x=x.offsetParent}
  return {top:t,left:l}
}

function Scroller(arena,scrollerID,slider_path_precise_dev){ // 'arena', to element do ktorego doczepiamy scroll

  /* body */

  var s

  var createScroller = function(){

    s = document.body.appendChild(document.createElement('div'))
    s.innerHTML =
      '<div class="ff_scroller-head">'+
        '<div class="ff_scroller-head-arrow"></div>'+
      '</div>'+
      '<div class="ff_scroller-slider-path">'+
        '<div class="ff_scroller-slider"></div>'+
      '</div>'+
      '<div class="ff_scroller-tail">'+
        '<div class="ff_scroller-tail-arrow"></div>'+
      '</div>'
    ;

    s.setAttribute('id',scrollerID)
    s.style.height = arena.offsetHeight + 'px'
    window.onresize = function(){
      s.style.top = absolutePos(arena).top + 'px'
      s.style.left = absolutePos(arena).left + arena.offsetWidth + 'px'
    }
    window.onresize()

    function getFirstElementByClassName(root_node,class_name,node_name){
      var nodes=root_node.getElementsByTagName(node_name)
      for(var i=0; nodes[i]; i++)
        if(nodes[i].className==class_name)return nodes[i]
    }
    s.head = getFirstElementByClassName(s,'ff_scroller-head','div')
    s.head_arrow = getFirstElementByClassName(s,'ff_scroller-head-arrow','div')
    s.slider_path = getFirstElementByClassName(s,'ff_scroller-slider-path','div')
    s.slider = getFirstElementByClassName(s,'ff_scroller-slider','div')
    s.tail = getFirstElementByClassName(s,'ff_scroller-tail','div')
    s.tail_arrow = getFirstElementByClassName(s,'ff_scroller-tail-arrow','div')

  }

  function Arena(){
    /* body */
    var onscroll = function(){
      s.slider.style.top=(s.slider_path.offsetHeight-s.slider.offsetHeight)*arena.scrollTop/(arena.scrollHeight-arena.clientHeight)+'px'
    }
    var onmousescroll = function(d){
      arena.scrollTop-=18*(d>0?-1:1)
    }
    /* init */
    arena.style.overflow='hidden'
    arena.onscroll=onscroll

    arena.onmousewheel=function(e){
      onmousescroll(e?e.detail:-event.wheelDelta>0?1:-1)
      if(e){e.preventDefault()}else{event.returnValue=0}
    }
    if(arena.addEventListener)arena.addEventListener('DOMMouseScroll',arena.onmousewheel,false)

  }

  function Arrows(){
    /* setup */
    /* body */
    var timer
    var onmousedown = function(d){
      timer=setTimeout(function(){
        timer=setInterval(function(){
          arena.scrollTop-=6*(d?-1:1)
        },30)
      },200)
    }
    var onmouseup = function(d){
      arena.scrollTop-=18*(d?-1:1)
      clearInterval(timer)
    }
    var onmouseout = function(){
      clearInterval(timer)
    }
    /* init */
    s.head_arrow.onmousedown=function(){onmousedown(0)}
    s.tail_arrow.onmousedown=function(){onmousedown(1)}
    s.head_arrow.onmouseup=function(){onmouseup(0)}
    s.tail_arrow.onmouseup=function(){onmouseup(1)}
    s.head_arrow.onmouseout=s.tail_arrow.onmouseout=onmouseout
  }

  function SliderPath(precise){
    /* setup */
    precise=precise||false
    /* body */
    var onclick = function(e){
      e=e||event
      if((e.target||e.srcElement)!=s.slider_path)return!1
      e.absoluteY=e.clientY+(document.documentElement.scrollTop||document.body.scrollTop)
      if(precise){
        arena.scrollTop=(arena.scrollHeight-arena.clientHeight)*(e.absoluteY-absolutePos(s.slider_path).top)/s.slider_path.offsetHeight
      } else {
        arena.scrollTop+=arena.clientHeight*(e.absoluteY>absolutePos(s.slider).top?1:-1)
    } }
    /* init */
    s.slider_path.style.height=s.offsetHeight-s.head.offsetHeight-s.tail.offsetHeight+'px'
    s.slider_path.onclick=onclick
  }

  function Slider(){
    /* body */
    var relativeY
    var onmousedown = function(e){
      e=e||event
      relativeY=e.clientY-s.slider.offsetTop
    }
    var onmousemove = function(e){
      if(!relativeY)return!1
      e=e||event
      var newPos=(e.clientY-relativeY)/(s.slider_path.offsetHeight-s.slider.offsetHeight)
      if((newPos>=0)&&(newPos<=1))arena.scrollTop=(arena.scrollHeight-arena.clientHeight)*newPos
    }
    var onmouseup = function(){
      relativeY=null
    }
    /* init */
    arena.onscroll()
    s.slider.onmousedown=onmousedown
    document.onmousemove=onmousemove
    document.onmouseup=onmouseup
  }


  /* init */

  if(arena.scrollHeight>arena.offsetHeight){

    createScroller()
    new Arena()
    new Arrows()
    new SliderPath(slider_path_precise_dev)
    new Slider()

  }

}

onload = function(){
  new Scroller(document.getElementById('contentBox'),'ff_scroller',0)
}
