...it should be cool with scrolling now.
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;
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)
{
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);