r3021 committed - Draggable: Support hash, array, string for cursorAt option. Partial f...
Revision: 3021
Author: scott.gonzalez
Date: Mon Aug 3 06:13:13 2009
Log: Draggable: Support hash, array, string for cursorAt option. Partial
fix for #2525 - Standardised way to pass coordinates to plugins.
http://code.google.com/p/jquery-ui/source/detail?r=3021
Modified:
/trunk/tests/unit/draggable/draggable_options.js
/trunk/ui/ui.draggable.js
=======================================
--- /trunk/tests/unit/draggable/draggable_options.js Wed Jul 8 20:22:57
2009
+++ /trunk/tests/unit/draggable/draggable_options.js Mon Aug 3 06:13:13
2009
@@ -239,61 +239,135 @@
});
test("{ cursorAt: { left: -5, top: -5 } }", function() {
-
+ expect(4);
+
+ var deltaX = -3, deltaY = -3,
+ offsetX = 5, offsetY = 5,
+ cursorAtX = -5, cursorAtY = -5;
+
+ $.each(['relative', 'absolute'], function(i, position) {
+ var el = $('#draggable' + (i + 1)).draggable({
+ cursorAt: { left: cursorAtX, top: cursorAtY },
+ drag: function(event, ui) {
+ equals(ui.offset.left, expected.left, position + ' left');
+ equals(ui.offset.top, expected.top, position + ' top');
+ }
+ }),
+ before = el.offset(),
+ pos = {
+ clientX: before.left + offsetX,
+ clientY: before.top + offsetY
+ },
+ expected = {
+ left: before.left + offsetX - cursorAtX + deltaX,
+ top: before.top + offsetY - cursorAtY + deltaY
+ };
+
+ el.simulate("mousedown", pos);
+ pos.clientX += deltaX;
+ pos.clientY += deltaY;
+ $(document).simulate("mousemove", pos);
+ el.simulate("mouseup", pos);
+ });
+});
+
+test("{ cursorAt: { right: 10, bottom: 20 } }", function() {
expect(4);
- var dx = -3, dy = -3;
- var ox = 5, oy = 5;
- var cax = -5, cay = -5;
-
- var actual = null;
- $("#draggable2").draggable({
- cursorAt: { left: cax, top: cay },
- drag: function(event, ui) {
- actual = ui.offset;
- }
+ var deltaX = -3, deltaY = -3,
+ offsetX = 5, offsetY = 5,
+ cursorAtX = 10, cursorAtY = 20;
+
+ $.each(['relative', 'absolute'], function(i, position) {
+ var el = $('#draggable' + (i + 1)).draggable({
+ cursorAt: { right: cursorAtX, bottom: cursorAtY },
+ drag: function(event, ui) {
+ equals(ui.offset.left, expected.left, position + ' left');
+ equals(ui.offset.top, expected.top, position + ' top');
+ }
+ }),
+ before = el.offset(),
+ pos = {
+ clientX: before.left + offsetX,
+ clientY: before.top + offsetY
+ },
+ expected = {
+ left: before.left + offsetX - el.width() + cursorAtX + deltaX,
+ top: before.top + offsetY - el.height() + cursorAtY + deltaY
+ };
+
+ el.simulate("mousedown", pos);
+ pos.clientX += deltaX;
+ pos.clientY += deltaY;
+ $(document).simulate("mousemove", pos);
+ el.simulate("mouseup", pos);
});
- var el = $("#draggable2").data("draggable").element;
-
- var before = el.offset();
- var pos = { clientX: before.left + ox, clientY: before.top + oy };
- $("#draggable2").simulate("mousedown", pos);
- pos = { clientX: pos.clientX + dx, clientY: pos.clientY + dy };
- $(document).simulate("mousemove", pos);
- $(document).simulate("mousemove", pos);
- $("#draggable2").simulate("mouseup", pos);
- var expected = {
- left: before.left + ox - cax + dx,
- top: before.top + oy - cay + dy
- };
-
- equals(actual.left, expected.left, "Absolute: -1px left");
- equals(actual.top, expected.top, "Absolute: -1px top");
-
- var actual = null;
- $("#draggable1").draggable({
- cursorAt: { left: cax, top: cay },
- drag: function(event, ui) {
- actual = ui.offset;
- }
+});
+
+test("{ cursorAt: [10, 20] }", function() {
+ expect(4);
+
+ var deltaX = -3, deltaY = -3,
+ offsetX = 5, offsetY = 5,
+ cursorAtX = 10, cursorAtY = 20;
+
+ $.each(['relative', 'absolute'], function(i, position) {
+ var el = $('#draggable' + (i + 1)).draggable({
+ cursorAt: { left: cursorAtX, top: cursorAtY },
+ drag: function(event, ui) {
+ equals(ui.offset.left, expected.left, position + ' left');
+ equals(ui.offset.top, expected.top, position + ' top');
+ }
+ }),
+ before = el.offset(),
+ pos = {
+ clientX: before.left + offsetX,
+ clientY: before.top + offsetY
+ },
+ expected = {
+ left: before.left + offsetX - cursorAtX + deltaX,
+ top: before.top + offsetY - cursorAtY + deltaY
+ };
+
+ el.simulate("mousedown", pos);
+ pos.clientX += deltaX;
+ pos.clientY += deltaY;
+ $(document).simulate("mousemove", pos);
+ el.simulate("mouseup", pos);
});
- var el = $("#draggable2").data("draggable").element;
-
- var before = el.offset();
- var pos = { clientX: before.left + ox, clientY: before.top + oy };
- $("#draggable2").simulate("mousedown", pos);
- pos = { clientX: pos.clientX + dx, clientY: pos.clientY + dy };
- $(document).simulate("mousemove", pos);
- $(document).simulate("mousemove", pos);
- $("#draggable2").simulate("mouseup", pos);
- var expected = {
- left: before.left + ox - cax + dx,
- top: before.top + oy - cay + dy
- };
-
- equals(actual.left, expected.left, "Relative: -1px left");
- equals(actual.top, expected.top, "Relative: -1px top");
-
+});
+
+test("{ cursorAt: '20, 40' }", function() {
+ expect(4);
+
+ var deltaX = -3, deltaY = -3,
+ offsetX = 5, offsetY = 5,
+ cursorAtX = 20, cursorAtY = 40;
+
+ $.each(['relative', 'absolute'], function(i, position) {
+ var el = $('#draggable' + (i + 1)).draggable({
+ cursorAt: { left: cursorAtX, top: cursorAtY },
+ drag: function(event, ui) {
+ equals(ui.offset.left, expected.left, position + ' left');
+ equals(ui.offset.top, expected.top, position + ' top');
+ }
+ }),
+ before = el.offset(),
+ pos = {
+ clientX: before.left + offsetX,
+ clientY: before.top + offsetY
+ },
+ expected = {
+ left: before.left + offsetX - cursorAtX + deltaX,
+ top: before.top + offsetY - cursorAtY + deltaY
+ };
+
+ el.simulate("mousedown", pos);
+ pos.clientX += deltaX;
+ pos.clientY += deltaY;
+ $(document).simulate("mousemove", pos);
+ el.simulate("mouseup", pos);
+ });
});
test("{ distance: 10 }", function() {
=======================================
--- /trunk/ui/ui.draggable.js Wed Jul 8 20:22:57 2009
+++ /trunk/ui/ui.draggable.js Mon Aug 3 06:13:13 2009
@@ -103,8 +103,7 @@
this.originalPageY = event.pageY;
//Adjust the mouse offset relative to the helper if 'cursorAt' is
supplied
- if(o.cursorAt)
- this._adjustOffsetFromHelper(o.cursorAt);
+ (o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt));
//Set a containment if given in the options
if(o.containment)
@@ -202,10 +201,24 @@
},
_adjustOffsetFromHelper: function(obj) {
- if(obj.left != undefined) this.offset.click.left = obj.left +
this.margins.left;
- if(obj.right != undefined) this.offset.click.left =
this.helperProportions.width - obj.right + this.margins.left;
- if(obj.top != undefined) this.offset.click.top = obj.top +
this.margins.top;
- if(obj.bottom != undefined) this.offset.click.top =
this.helperProportions.height - obj.bottom + this.margins.top;
+ if (typeof obj == 'string') {
+ obj = obj.split(' ');
+ }
+ if ($.isArray(obj)) {
+ obj = {left: +obj[0], top: +obj[1] || 0};
+ }
+ if ('left' in obj) {
+ this.offset.click.left = obj.left + this.margins.left;
+ }
+ if ('right' in obj) {
+ this.offset.click.left = this.helperProportions.width - obj.right +
this.margins.left;
+ }
+ if ('top' in obj) {
+ this.offset.click.top = obj.top + this.margins.top;
+ }
+ if ('bottom' in obj) {
+ this.offset.click.top = this.helperProportions.height - obj.bottom +
this.margins.top;
+ }
},
_getParentOffset: function() {