/**************jQuery Draggable***************/
/* 2009-06-30
/*********************************************/

$.fn.extend({
  draggable:function(ops,callback) {
    this.css('position', 'absolute');
    var ops = $.extend({}, ops),
    handle = ops.handle ? $(ops.handle, this) : this,
    dragstart = ops.dragstart ? ops.dragstart : function () {},
    dragend = ops.dragend ? ops.dragend : function () {},
    restrict = ops.restrict ? ops.restrict : true,
    range = ops.range ? ops.range : document.body,
    flag = false,
    _o={left:0,top:0},
    self=this;

    handle.css('-moz-user-select', 'none');
    handle.onselectionstart = 'return false;';

    function pos(e)
    {
      if (flag)
      {
        var left = e.pageX -_o.left;
        var top = e.pageY - _o.top;

        var elWidth = $(self).outerWidth(), elHeight = $(self).outerHeight();
        var docWidth = $(range).outerWidth(), docHeight = $(range).outerHeight() + $(range).scrollTop();

        if (restrict)
        {
          if (left < 0)
            left = 0;

          if (top < 0)
            top = 0;

          if (left >  (docWidth - elWidth))
            left = (docWidth - elWidth);

          if (top > (docHeight - elHeight))
            top = (docHeight - elHeight);
        }

        self.css( {
          left : left + 'px',
          top : top + 'px'
        });
      }
    }

    handle.bind('mousedown',function(e){
      dragstart();
      flag = true;
      var offset = self.offset();
      _o = { left: e.pageX - offset.left, top: e.pageY - offset.top };
      $(document).bind('mousemove', pos);
    }).bind('mouseup',function(e){
      dragend();
      pos(e);
      flag = false;
      $(document).unbind('mousemove');

      if (callback)
        callback.apply(this,[self]);

    }).css('cursor','move');

    return self;

  }
})