Changeset 4203

Timestamp:

12/17/07 13:13:51 (1 year ago)

Author:

paul.bakaus

Message:

 

Location:

trunk/ui/experimental/mouse

Files:

• drag.html (modified) (1 diff)
• ui.draggable.ext.js (modified) (6 diffs)
• ui.draggable.js (modified) (4 diffs)
• ui.mouse.js (modified) (2 diffs)

trunk/ui/experimental/mouse/drag.html

@@ -63 +63 @@
                 stop: function(e,ui) {
                     //console.log("Draggable: stop , ", e, " , ", ui);
-                }
+                },
+                cursor: 'move',
+                containment: 'parent',
+                //axis: 'x',
+                //grid: [20,20],
+                //cursorAt: { top: 0, right: 0 }
             });
         });

trunk/ui/experimental/mouse/ui.draggable.ext.js

@@ -43 +43 @@
     $.ui.plugin.add("draggable", "revert", {
         stop: function(e,ui) {
-    
-            var o = ui.options;
-            var rpos = { left: 0, top: 0 };
-            o.beQuietAtEnd = true;
-
-            if(ui.helper != this) {
-                rpos = $(ui.draggable.sorthelper || this).offset();
-                var nl = rpos.left-o.po.left-o.margins.left;
-                var nt = rpos.top-o.po.top-o.margins.top;
-            } else {
-                var nl = o.co.left - (o.po ? o.po.left : 0);
-                var nt = o.co.top - (o.po ? o.po.top : 0);
-            }
-        
-            var self = ui.draggable;
-
-            $(ui.helper).animate({ left: nl, top: nt }, 500, function() {
-                if(o.wasPositioned) $(self.element).css('position', o.wasPositioned);
-                if(o.stop) o.stop.apply(self.element, [self.helper, self.pos, [o.co.left - o.po.left,o.co.top - o.po.top],self]);
-            
-                if(self.helper != self.element)
-                    window.setTimeout(function() { $(self.helper).remove(); }, 0); //Using setTimeout because of strange flickering in Firefox
+            var self = ui.instance;
+            self.cancelHelperRemoval = true;
+            $(ui.helper).animate({ left: self.originalPosition.left, top: self.originalPosition.top }, parseInt(ui.options.revert) || 500, function() {
+                if(ui.options.helper != 'original') self.helper.remove();
+                self.clear();
             });
-        
         }
     });
@@ -74 +56 @@
 
             var o = ui.options;
-            if(ui.draggable.slowMode) return; // Make clones on top of iframes (only if we are not in slowMode)
+            if(ui.instance.slowMode) return; // Make clones on top of iframes (only if we are not in slowMode)
             
             if(o.iframeFix.constructor == Array) {
@@ -98 +80 @@
 
             var o = ui.options;
-            if((!o.cursorAtIgnore || o.containment.left != undefined || o.containment.constructor == Array) && !o._containment) return;
+            if((o.containment.left != undefined || o.containment.constructor == Array) && !o._containment) return;
             if(!o._containment) o._containment = o.containment;
 
-            if(o._containment == 'parent') o._containment = this.parentNode;
+            if(o._containment == 'parent') o._containment = this[0].parentNode;
             if(o._containment == 'document') {
                 o.containment = [
-                    0-o.margins.left,
-                    0-o.margins.top,
-                    $(document).width()-o.margins.right,
-                    ($(document).height() || document.body.parentNode.scrollHeight)-o.margins.bottom
+                    0,
+                    0,
+                    $(document).width(),
+                    ($(document).height() || document.body.parentNode.scrollHeight)
                 ];
             } else { //I'm a node, so compute top/left/right/bottom
 
                 var ce = $(o._containment)[0];
-                var co = $(o._containment).offset({ border: false });
+                var co = $(o._containment).offset();
 
                 o.containment = [
-                    co.left-o.margins.left,
-                    co.top-o.margins.top,
-                    co.left+(ce.offsetWidth || ce.scrollWidth)-o.margins.right,
-                    co.top+(ce.offsetHeight || ce.scrollHeight)-o.margins.bottom
+                    co.left,
+                    co.top,
+                    co.left+(ce.offsetWidth || ce.scrollWidth),
+                    co.top+(ce.offsetHeight || ce.scrollHeight)
                 ];
             }
@@ -126 +108 @@
 
             var o = ui.options;
-            if(!o.cursorAtIgnore) return;
-
-            var h = $(ui.helper);
+            var h = ui.helper;
             var c = o.containment;
+            var self = ui.instance;
+            
             if(c.constructor == Array) {
 
-                if((ui.draggable.pos[0] < c[0]-o.po.left)) ui.draggable.pos[0] = c[0]-o.po.left;
-                if((ui.draggable.pos[1] < c[1]-o.po.top)) ui.draggable.pos[1] = c[1]-o.po.top;
-                if(ui.draggable.pos[0]+h[0].offsetWidth > c[2]-o.po.left) ui.draggable.pos[0] = c[2]-o.po.left-h[0].offsetWidth;
-                if(ui.draggable.pos[1]+h[0].offsetHeight > c[3]-o.po.top) ui.draggable.pos[1] = c[3]-o.po.top-h[0].offsetHeight;
+
+                if((ui.absolutePosition.left < c[0])) self.position.left = c[0] - (self.offset.left - self.clickOffset.left);
+                if((ui.absolutePosition.top < c[1])) self.position.top = c[1] - (self.offset.top - self.clickOffset.top);
+                //if(ui.draggable.pos[0]+h[0].offsetWidth > c[2]-o.po.left) ui.draggable.pos[0] = c[2]-o.po.left-h[0].offsetWidth;
+                //if(ui.draggable.pos[1]+h[0].offsetHeight > c[3]-o.po.top) ui.draggable.pos[1] = c[3]-o.po.top-h[0].offsetHeight;
 
             } else {
@@ -155 +138 @@
         drag: function(e,ui) {
             var o = ui.options;
-            if(!o.cursorAtIgnore) return;
-            ui.draggable.pos[0] = o.co.left + o.margins.left - o.po.left + Math.round((ui.draggable.pos[0] - o.co.left - o.margins.left + o.po.left) / o.grid[0]) * o.grid[0];
-            ui.draggable.pos[1] = o.co.top + o.margins.top - o.po.top + Math.round((ui.draggable.pos[1] - o.co.top - o.margins.top + o.po.top) / o.grid[1]) * o.grid[1];
+            ui.instance.position.left = ui.instance.originalPosition.left + Math.round((e.pageX - ui.instance._pageX) / o.grid[0]) * o.grid[0];
+            ui.instance.position.top = ui.instance.originalPosition.top + Math.round((e.pageY - ui.instance._pageY) / o.grid[1]) * o.grid[1];
         }
     });
@@ -164 +146 @@
         drag: function(e,ui) {
             var o = ui.options;
-            if(!o.cursorAtIgnore) return;
             if(o.constraint) o.axis = o.constraint; //Legacy check
-            o.axis ? ( o.axis == 'x' ? ui.draggable.pos[1] = o.co.top - o.margins.top - o.po.top : ui.draggable.pos[0] = o.co.left - o.margins.left - o.po.left ) : null;
+            o.axis == 'x' ? ui.instance.position.top = ui.instance.originalPosition.top : ui.instance.position.left = ui.instance.originalPosition.left;
         }
     });

trunk/ui/experimental/mouse/ui.draggable.js

@@ -8 +8 @@
             if(!$(this).is(".ui-draggable")) new $.ui.draggable(this, o);
         });
-    }
+    };
     
     $.ui.draggable = function(element, options) {
@@ -43 +43 @@
             this.element.css('position', 'relative');
         
-    }
+    };
     
     $.extend($.ui.draggable.prototype, {
@@ -91 +91 @@
             //Prepare variables for position generation
             this.elementOffset = this.element.offset();
+            this._pageX = e.pageX; this._pageY = e.pageY;
             this.clickOffset = { left: e.pageX - this.elementOffset.left, top: e.pageY - this.elementOffset.top };
             var elementPosition = this.element.position();
             var r = this.helper.css('position') == 'relative';
+
+            //Generate the original position
+            this.originalPosition = {
+                left: (r ? parseInt(this.helper.css('left')) || 0 : elementPosition.left + (offsetParent[0] == document.body ? 0 : offsetParent[0].scrollLeft)),
+                top: (r ? parseInt(this.helper.css('top')) || 0 : elementPosition.top + (offsetParent[0] == document.body ? 0 : offsetParent[0].scrollTop))
+            };
             
             //Generate a flexible offset that will later be subtracted from e.pageX/Y
-            this.offset = {
-                left: e.pageX - (r ? parseInt(this.helper.css('left')) || 0 : elementPosition.left + offsetParent[0].scrollLeft),
-                top: e.pageY - (r ? parseInt(this.helper.css('top')) || 0 : elementPosition.top + offsetParent[0].scrollTop)
-            };
-
+            this.offset = {left: e.pageX - this.originalPosition.left, top: e.pageY - this.originalPosition.top };
+            
             //Call plugins and callbacks
             this.propagate("start", e);
 
             this.helperProportions = { width: this.helper.outerWidth(), height: this.helper.outerHeight() };
-            if (this.slowMode && $.ui.ddmanager && !o.dropBehaviour) $.ui.ddmanager.prepareOffsets(this, e);
+            if ($.ui.ddmanager && !o.dropBehaviour) $.ui.ddmanager.prepareOffsets(this, e);
+            
+            //If we have something in cursorAt, we'll use it
+            if(o.cursorAt) {
+                if(o.cursorAt.top != undefined || o.cursorAt.bottom != undefined) {
+                    this.offset.top -= this.clickOffset.top - (o.cursorAt.top != undefined ? o.cursorAt.top : (this.helperProportions.height - o.cursorAt.bottom));
+                    this.clickOffset.top = (o.cursorAt.top != undefined ? o.cursorAt.top : (this.helperProportions.height - o.cursorAt.bottom));
+                }
+                if(o.cursorAt.left != undefined || o.cursorAt.right != undefined) {
+                    this.offset.left -= this.clickOffset.left - (o.cursorAt.left != undefined ? o.cursorAt.left : (this.helperProportions.width - o.cursorAt.right));
+                    this.clickOffset.left = (o.cursorAt.left != undefined ? o.cursorAt.left : (this.helperProportions.width - o.cursorAt.right));
+                }
+            }
+
             return false;
-                        
+
         },
-        stop: function(e) {
-
-            //Call plugins and callbacks
-            this.propagate("stop", e);
-
-            if (this.slowMode && $.ui.ddmanager && !this.options.dropBehaviour) $.ui.ddmanager.drop(this, e);
-            if(this.options.helper != 'original' && !this.cancelHelperRemoval) this.helper.remove();
-            
+        clear: function() {
             if($.ui.ddmanager) {
                 $.ui.ddmanager.current = null;
                 $.ui.ddmanager.last = this;             
             }
-            this.helper = null; this.offset = null; this.positionCurrent = null;
+            this.helper = null;
+        },
+        stop: function(e) {
+
+            if ($.ui.ddmanager && !this.options.dropBehaviour) $.ui.ddmanager.drop(this, e);
+            this.propagate("stop", e);
+            
+            if(this.cancelHelperRemoval) return false;          
+            if(this.options.helper != 'original') this.helper.remove();
+            this.clear();
+
             return false;
-            
         },
         drag: function(e) {
@@ -129 +148 @@
             //Compute the helpers position
             this.position = { top: e.pageY - this.offset.top, left: e.pageX - this.offset.left };
-            this.positionAbs = { left: e.pageX + this.clickOffset.left, top: e.pageY + this.clickOffset.top };
+            this.positionAbs = { left: e.pageX - this.clickOffset.left, top: e.pageY - this.clickOffset.top };
 
             //Call plugins and callbacks

trunk/ui/experimental/mouse/ui.mouse.js

@@ -58 +58 @@
         if($.browser.msie) $(element).attr('unselectable', 'on'); //Prevent text selection in IE
         
-    }
+    };
     
     $.extend($.ui.mouseInteraction.prototype, {
@@ -93 +93 @@
             
             var o = this.options;
-            if(this.initialized == false) return true;
+            if(!this.initialized) return $(document).unbind('mouseup.draggable').unbind('mousemove.draggable');
 
             if(this.options.stop) this.options.stop.call(this.options.executor || this, e);