From e41a10b55953fda8c117faa4f952fab091b14e57 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= Date: Sun, 8 Jan 2012 21:48:53 -0500 Subject: [PATCH] Interaction: Normalize top/left coordinates in hooks. --- ui/jquery.ui.draggable.js | 47 +++++++++++++++++-------------------- ui/jquery.ui.interaction.js | 31 +++++++++++++++--------- 2 files changed, 42 insertions(+), 36 deletions(-) diff --git a/ui/jquery.ui.draggable.js b/ui/jquery.ui.draggable.js index 8d2da862c..7e3d5f378 100644 --- a/ui/jquery.ui.draggable.js +++ b/ui/jquery.ui.draggable.js @@ -71,7 +71,7 @@ $.widget( "ui.draggable", $.ui.interaction, { }; }, - _handleScrolling: function( event ) { + _handleScrolling: function( position ) { var scrollTop = this.scrollParent.scrollTop(), scrollLeft = this.scrollParent.scrollLeft(), scrollSensitivity = 20, @@ -86,10 +86,10 @@ $.widget( "ui.draggable", $.ui.interaction, { overflowTop = this.overflowOffset ? this.overflowOffset.top : scrollTop, - xRight = this.overflow.width + overflowLeft - event.pageX, - xLeft = event.pageX - overflowLeft, - yBottom = this.overflow.height + overflowTop - event.pageY, - yTop = event.pageY - overflowTop; + xRight = this.overflow.width + overflowLeft - position.left, + xLeft = position.left - overflowLeft, + yBottom = this.overflow.height + overflowTop - position.top, + yTop = position.top - overflowTop; // Handle vertical scrolling if ( yBottom < scrollSensitivity ) { @@ -110,7 +110,7 @@ $.widget( "ui.draggable", $.ui.interaction, { } }, - _start: function( event ) { + _start: function( event, position ) { // The actual dragging element, should always be a jQuery object this.dragEl = this.element; @@ -146,10 +146,7 @@ $.widget( "ui.draggable", $.ui.interaction, { this.position = $.extend( {}, this.startPosition ); this.offset = $.extend( {}, this.startOffset ); - this.startCoords = { - left: event.pageX, - top: event.pageY - }; + this.startCoords = position; // Cache the offset of scrollParent, if required for _handleScrolling if ( this.scrollParent[0] !== this.document[0] && this.scrollParent[0].tagName !== "HTML" ) { @@ -163,7 +160,7 @@ $.widget( "ui.draggable", $.ui.interaction, { this.window.width() : this.scrollParent.width() }; - this._preparePosition( event ); + this._preparePosition( position ); // If user cancels start, don't allow dragging if ( this._trigger( "start", event, this._uiHash() ) === false ) { @@ -171,29 +168,29 @@ $.widget( "ui.draggable", $.ui.interaction, { } this._blockFrames(); - this._setCss( event ); + this._setCss(); }, - _move: function( event ) { - this._preparePosition( event ); + _move: function( event, position ) { + this._preparePosition( position ); // If user cancels drag, don't move the element if ( this._trigger( "drag", event, this._uiHash() ) === false ) { return; } - this._setCss( event ); + this._setCss(); // Scroll the scrollParent, if needed - this._handleScrolling( event ); + this._handleScrolling( position ); }, - _stop: function( event ) { - this._preparePosition( event ); + _stop: function( event, position ) { + this._preparePosition( position ); // If user cancels stop, leave helper there, disallow any CSS changes if ( this._trigger( "stop", event, this._uiHash() ) === false ) { - this._setCss( event ); + this._setCss(); if ( this.options.helper ) { this.dragEl.remove(); } @@ -204,9 +201,9 @@ $.widget( "ui.draggable", $.ui.interaction, { // Uses event to determine new position of draggable, before any override from callbacks // TODO: handle absolute element inside relative parent like a relative element - _preparePosition: function( event ) { - var leftDiff = event.pageX - this.startCoords.left, - topDiff = event.pageY - this.startCoords.top, + _preparePosition: function( position ) { + var leftDiff = position.left - this.startCoords.left, + topDiff = position.top - this.startCoords.top, newLeft = leftDiff + this.startPosition.left, newTop = topDiff + this.startPosition.top; @@ -227,8 +224,8 @@ $.widget( "ui.draggable", $.ui.interaction, { this.offset.top = this.startOffset.top + topDiff; }, - // Places draggable where mouse or user from callback indicates - _setCss: function( event ) { + // Places draggable where event, or user via event/callback, indicates + _setCss: function() { var newLeft, newTop; // User overriding left/top so shortcut math is no longer valid @@ -257,7 +254,7 @@ $.widget( "ui.draggable", $.ui.interaction, { }); }, - _uiHash: function( event ) { + _uiHash: function() { var ret = { position: this.position, offset: this.offset diff --git a/ui/jquery.ui.interaction.js b/ui/jquery.ui.interaction.js index cea8d8873..6504c57d8 100644 --- a/ui/jquery.ui.interaction.js +++ b/ui/jquery.ui.interaction.js @@ -12,24 +12,24 @@ $.widget( "ui.interaction", { _startProxy: function( hook ) { var that = this; - return function( event ) { - that._interactionStart( event, hook ); + return function( event, position ) { + that._interactionStart( event, position, hook ); } }, - _interactionStart: function( event, hook ) { - if ( false !== this._start( event ) ) { + _interactionStart: function( event, position, hook ) { + if ( false !== this._start( event, position ) ) { interaction.started = true; interaction.hooks[ hook ].handle( this ); } }, - _interactionMove: function( event ) { - this._move( event ); + _interactionMove: function( event, position ) { + this._move( event, position ); }, - _interactionStop: function( event ) { - this._stop( event ); + _interactionStop: function( event, position ) { + this._stop( event, position ); interaction.started = false; } }); @@ -46,7 +46,10 @@ interaction.hooks.mouse = { "mousedown": function( event ) { if ( event.which === 1 ) { event.preventDefault(); - start( event ); + start( event, { + left: event.pageX, + top: event.pageY + }); } } }); @@ -55,11 +58,17 @@ interaction.hooks.mouse = { handle: function( widget ) { function mousemove( event ) { event.preventDefault(); - widget._interactionMove( event ); + widget._interactionMove( event, { + left: event.pageX, + top: event.pageY + }); } function mouseup( event ) { - widget._interactionStop( event ); + widget._interactionStop( event, { + left: event.pageX, + top: event.pageY + }); widget.document .unbind( "mousemove", mousemove ) .unbind( "mouseup", mouseup );