Draggable: Cleanup.

This commit is contained in:
Scott González 2011-11-17 19:48:04 -05:00
parent dac3dddd9e
commit 4792d5b7af

View File

@ -18,10 +18,10 @@ $.widget( "ui.draggable", {
widgetEventPrefix: "drag", widgetEventPrefix: "drag",
options: { options: {
helper: false, helper: null,
// TODO: remove scroll options
scrollSensitivity: 20, scrollSensitivity: 20,
scrollSpeed: 20, scrollSpeed: 20
iframeFix: false
}, },
// dragEl: element being dragged (original or helper) // dragEl: element being dragged (original or helper)
@ -34,37 +34,28 @@ $.widget( "ui.draggable", {
// overflowOffset: offset of scroll parent // overflowOffset: offset of scroll parent
// overflow: object containing width and height keys of scroll parent // overflow: object containing width and height keys of scroll parent
// TODO: move next to _unblockFrames()
_blockFrames: function() { _blockFrames: function() {
var body = this.document[0].body;
var iframes = $('iframe'), this.iframeBlocks = this.document.find( "iframe" ).map(function() {
widget = this; var iframe = $( this ),
iframeOffset = iframe.offset();
this.iframeBlocks = $(''); return $( "<div>" )
.css({
iframes.each( function() { position: "absolute",
width: iframe.outerWidth(),
var iframe = $(this), height: iframe.outerHeight(),
width = iframe.outerWidth(), top: iframeOffset.top,
height = iframe.outerHeight(), left: iframeOffset.left
iframeOffset = iframe.offset(), })
block = $('<div />'); .appendTo( body )[0];
block.css({
position: 'absolute',
width: width+'px',
height: height+'px',
top: iframeOffset.top+'px',
left: iframeOffset.left+'px'
})
.appendTo( widget.document[0].body );
widget.iframeBlocks = widget.iframeBlocks.add( block );
}); });
}, },
_create: function() { _create: function() {
// TODO: move to drag start in case DOM changes
this.scrollParent = this.element.scrollParent(); this.scrollParent = this.element.scrollParent();
// Static position elements can't be moved with top/left // Static position elements can't be moved with top/left
@ -128,10 +119,7 @@ $.widget( "ui.draggable", {
else if ( event.pageX < ( scrollLeft + this.options.scrollSensitivity ) ) { else if ( event.pageX < ( scrollLeft + this.options.scrollSensitivity ) ) {
this.scrollParent.scrollLeft( scrollLeft - this.options.scrollSpeed ); this.scrollParent.scrollLeft( scrollLeft - this.options.scrollSpeed );
} }
} else { } else {
// Handle vertical scrolling // Handle vertical scrolling
if ( ( event.pageY + this.options.scrollSensitivity ) > ( this.overflow.height + this.overflowOffset.top ) ) { if ( ( event.pageY + this.options.scrollSensitivity ) > ( this.overflow.height + this.overflowOffset.top ) ) {
this.scrollParent.scrollTop( scrollTop + this.options.scrollSpeed ); this.scrollParent.scrollTop( scrollTop + this.options.scrollSpeed );
@ -147,14 +135,11 @@ $.widget( "ui.draggable", {
else if ( ( event.pageX - this.options.scrollSensitivity ) < this.overflowOffset.left ) { else if ( ( event.pageX - this.options.scrollSensitivity ) < this.overflowOffset.left ) {
this.scrollParent.scrollLeft( scrollLeft - this.options.scrollSpeed ); this.scrollParent.scrollLeft( scrollLeft - this.options.scrollSpeed );
} }
} }
}, },
_mouseDown: function( event ) { _mouseDown: function( event ) {
var newLeft, newTop, allowed; var newLeft, newTop;
// Prevent text selection, among other things // Prevent text selection, among other things
event.preventDefault(); event.preventDefault();
@ -162,10 +147,6 @@ $.widget( "ui.draggable", {
// The actual dragging element, should always be a jQuery object // The actual dragging element, should always be a jQuery object
this.dragEl = this.element; this.dragEl = this.element;
if ( this.options.iframeFix === true ) {
this._blockFrames();
}
// Helper required // Helper required
if ( this.options.helper ) { if ( this.options.helper ) {
// clone // clone
@ -217,14 +198,13 @@ $.widget( "ui.draggable", {
this._preparePosition( event ); this._preparePosition( event );
allowed = this._trigger( "start", event, this._uiHash() );
// If user stops propagation, leave helper there ( if there's one ), disallow any CSS changes // If user stops propagation, leave helper there ( if there's one ), disallow any CSS changes
if ( allowed !== true ) { if ( this._trigger( "start", event, this._uiHash() ) === false ) {
this.document.unbind( "." + this.widgetName ); this.document.unbind( "." + this.widgetName );
return; return;
} }
this._blockFrames();
this._setCss( event ); this._setCss( event );
this._bind( this.document, { this._bind( this.document, {
@ -234,15 +214,12 @@ $.widget( "ui.draggable", {
}, },
_mouseMove: function( event ) { _mouseMove: function( event ) {
var newLeft, newTop, allowed; var newLeft, newTop;
this._preparePosition( event ); this._preparePosition( event );
allowed = this._trigger( "drag", event, this._uiHash() );
// If user stops propagation, leave helper there ( if there's one ), disallow any CSS changes // If user stops propagation, leave helper there ( if there's one ), disallow any CSS changes
if ( allowed !== true ) { if ( this._trigger( "drag", event, this._uiHash() ) === false ) {
this.document.unbind( "." + this.widgetName ); this.document.unbind( "." + this.widgetName );
return; return;
} }
@ -254,30 +231,18 @@ $.widget( "ui.draggable", {
}, },
_mouseUp: function( event ) { _mouseUp: function( event ) {
var allowed;
this._preparePosition( event ); this._preparePosition( event );
allowed = this._trigger( "stop", event, this._uiHash() );
// If user stops propagation, leave helper there, disallow any CSS changes // If user stops propagation, leave helper there, disallow any CSS changes
if ( allowed === true ) { if ( this._trigger( "stop", event, this._uiHash() ) === false ) {
this._setCss( event ); this._setCss( event );
if ( this.options.helper ) { if ( this.options.helper ) {
this.dragEl.remove(); this.dragEl.remove();
} }
} }
this.document.unbind( "." + this.widgetName ); this.document.unbind( "." + this.widgetName );
this._unblockFrames();
if ( this.options.iframeFix === true ) {
this._unblockFrames();
}
}, },
// Uses event to determine new position of draggable, before any override from callbacks // Uses event to determine new position of draggable, before any override from callbacks
@ -298,7 +263,7 @@ $.widget( "ui.draggable", {
left: newLeft, left: newLeft,
top: newTop top: newTop
}; };
// Refresh offset cache with new positions // Refresh offset cache with new positions
this.offset.left = this.startOffset.left + leftDiff; this.offset.left = this.startOffset.left + leftDiff;
this.offset.top = this.startOffset.top + topDiff; this.offset.top = this.startOffset.top + topDiff;
@ -326,8 +291,8 @@ $.widget( "ui.draggable", {
} }
this.dragEl.css({ this.dragEl.css({
left: newLeft + "px", left: newLeft,
top: newTop + "px" top: newTop
}); });
}, },
@ -337,26 +302,19 @@ $.widget( "ui.draggable", {
offset: this.offset offset: this.offset
}; };
// TODO: should we always set the helper?
if ( this.options.helper ) { if ( this.options.helper ) {
ret.helper = this.dragEl; ret.helper = this.dragEl;
} }
return ret; return ret;
}, },
_unblockFrames: function() { _unblockFrames: function() {
if ( this.iframeBlocks ) {
if ( !this.iframeBlocks || !this.iframeBlocks.length ) { this.iframeBlocks.remove();
return; delete this.iframeBlocks;
} }
this.iframeBlocks.each( function() {
$(this).remove();
});
} }
}); });