var pos_supported = false;
var pos_in_drag = false;

var posslide_init = function()
{
  // make sure the theme supports the playhead
  var base = document.getElementById('playhead');
  var inner = document.getElementById('playhead-filler');
  var slider = document.getElementById('playhead-button');
  if ( !slider || !inner || !base )
    return false;
  
  pos_supported = true;
  
  var minX = $(base).Left() - 3;
  var minY = $(base).Top() + 3;
  var maxY = minY;
  var maxX = minX + $(base).Width() - 6;
  Drag.init(slider, slider, minX, maxX, minY, maxY);
  
  slider.onDrag = posslide_handle_drag;
  slider.onDragEnd = posslide_handle_dragend;
  slider.onDragStart = function(x, y) { pos_in_drag = true; };
  base.onclick = posslide_handle_click;
  
  posslide_set_position(0);
  slider.style.top = minY + 'px';
}

var posslide_handle_drag = function(x, y, do_inner)
{
  var inner = document.getElementById('playhead-filler');
  var slider = document.getElementById('playhead-button');
  var size = x - $(inner).Left() + 8;
  if ( do_inner )
    inner.style.width = size + 'px';
  if ( ( pos_in_drag && !do_inner ) || ( !pos_in_drag && do_inner ) )
    slider.style.left = ( x ) + 'px';
}

var posslide_handle_dragend = function(x, y)
{
  pos_in_drag = false;
  if ( !verify_online() )
  {
    posslide_set_position(current_track_pos);
    return false;
  }
  
  var inner = document.getElementById('playhead-filler');
  var base = document.getElementById('playhead');
  var multiplier = $(base).Width() - 13;
  var pos = x - $(inner).Left() + 8;
  pos = 100 * ( pos / multiplier );
  set_playback_position(pos);
}

var posslide_handle_click = function(e)
{
  if ( !verify_online() )
    return false;
  
  e = Drag.fixE(e);
  var base = document.getElementById('playhead');
  var val = e.clientX - $(base).Left();
  val = 100 * ( val / $(base).Width() );
  posslide_set_position(val);
  set_playback_position(val);
}

function posslide_set_position(pos)
{
  if ( !pos_supported )
    return false;
  
  // pos needs to be 1-100
  var base = document.getElementById('playhead');
  var multiplier = $(base).Width() - 13;
  pos = ( pos / 100 ) * multiplier;
  var left = pos + $(base).Left();
  posslide_handle_drag(left, 0, true);
}

addOnloadHook(posslide_init);