2
YUI 3.10.3 (build 2fb5187)
3
Copyright 2013 Yahoo! Inc. All rights reserved.
4
Licensed under the BSD License.
5
http://yuilibrary.com/license/
8
YUI.add('dd-drag', function (Y, NAME) {
12
* Provides the ability to drag a Node.
17
* Provides the ability to drag a Node.
26
DRAGGING = 'dragging',
27
DRAG_NODE = 'dragNode',
28
OFFSET_HEIGHT = 'offsetHeight',
29
OFFSET_WIDTH = 'offsetWidth',
31
* Handles the mouseup DOM event, does nothing internally just fires.
37
* Handles the mousedown DOM event, checks to see if you have a valid handle then starts the drag timers.
38
* @event drag:mouseDown
39
* @preventable _defMouseDownFn
40
* @param {EventFacade} event An Event Facade object with the following specific property added:
41
* <dl><dt>ev</dt><dd>The original mousedown event.</dd></dl>
45
EV_MOUSE_DOWN = 'drag:mouseDown',
47
* Fires after the mousedown event has been cleared.
48
* @event drag:afterMouseDown
49
* @param {EventFacade} event An Event Facade object with the following specific property added:
50
* <dl><dt>ev</dt><dd>The original mousedown event.</dd></dl>
54
EV_AFTER_MOUSE_DOWN = 'drag:afterMouseDown',
56
* Fires after a handle is removed.
57
* @event drag:removeHandle
58
* @param {EventFacade} event An Event Facade object with the following specific property added:
59
* <dl><dt>handle</dt><dd>The handle that was removed.</dd></dl>
63
EV_REMOVE_HANDLE = 'drag:removeHandle',
65
* Fires after a handle is added.
66
* @event drag:addHandle
67
* @param {EventFacade} event An Event Facade object with the following specific property added:
68
* <dl><dt>handle</dt><dd>The handle that was added.</dd></dl>
72
EV_ADD_HANDLE = 'drag:addHandle',
74
* Fires after an invalid selector is removed.
75
* @event drag:removeInvalid
76
* @param {EventFacade} event An Event Facade object with the following specific property added:
77
* <dl><dt>handle</dt><dd>The handle that was removed.</dd></dl>
81
EV_REMOVE_INVALID = 'drag:removeInvalid',
83
* Fires after an invalid selector is added.
84
* @event drag:addInvalid
85
* @param {EventFacade} event An Event Facade object with the following specific property added:
86
* <dl><dt>handle</dt><dd>The handle that was added.</dd></dl>
90
EV_ADD_INVALID = 'drag:addInvalid',
92
* Fires at the start of a drag operation.
94
* @param {EventFacade} event An Event Facade object with the following specific property added:
96
* <dt>pageX</dt><dd>The original node position X.</dd>
97
* <dt>pageY</dt><dd>The original node position Y.</dd>
98
* <dt>startTime</dt><dd>The startTime of the event. getTime on the current Date object.</dd>
101
* @type {CustomEvent}
103
EV_START = 'drag:start',
105
* Fires at the end of a drag operation.
107
* @param {EventFacade} event An Event Facade object with the following specific property added:
109
* <dt>pageX</dt><dd>The current node position X.</dd>
110
* <dt>pageY</dt><dd>The current node position Y.</dd>
111
* <dt>startTime</dt><dd>The startTime of the event, from the start event.</dd>
112
* <dt>endTime</dt><dd>The endTime of the event. getTime on the current Date object.</dd>
115
* @type {CustomEvent}
119
* Fires every mousemove during a drag operation.
121
* @param {EventFacade} event An Event Facade object with the following specific property added:
123
* <dt>pageX</dt><dd>The current node position X.</dd>
124
* <dt>pageY</dt><dd>The current node position Y.</dd>
125
* <dt>scroll</dt><dd>Should a scroll action occur.</dd>
126
* <dt>info</dt><dd>Object hash containing calculated XY arrays: start, xy, delta, offset</dd>
129
* @type {CustomEvent}
131
EV_DRAG = 'drag:drag',
133
* Fires when this node is aligned.
135
* @preventable _defAlignFn
136
* @param {EventFacade} event An Event Facade object with the following specific property added:
138
* <dt>pageX</dt><dd>The current node position X.</dd>
139
* <dt>pageY</dt><dd>The current node position Y.</dd>
142
* @type {CustomEvent}
144
EV_ALIGN = 'drag:align',
146
* Fires when this node is over a Drop Target. (Fired from dd-drop)
148
* @param {EventFacade} event An Event Facade object with the following specific property added:
150
* <dt>drop</dt><dd>The drop object at the time of the event.</dd>
151
* <dt>drag</dt><dd>The drag object at the time of the event.</dd>
154
* @type {CustomEvent}
157
* Fires when this node enters a Drop Target. (Fired from dd-drop)
159
* @param {EventFacade} event An Event Facade object with the following specific property added:
161
* <dt>drop</dt><dd>The drop object at the time of the event.</dd>
162
* <dt>drag</dt><dd>The drag object at the time of the event.</dd>
165
* @type {CustomEvent}
168
* Fires when this node exits a Drop Target. (Fired from dd-drop)
170
* @param {EventFacade} event An Event Facade object with the following specific property added:
172
* <dt>drop</dt><dd>The drop object at the time of the event.</dd>
175
* @type {CustomEvent}
178
* Fires when this node is dropped on a valid Drop Target. (Fired from dd-ddm-drop)
179
* @event drag:drophit
180
* @param {EventFacade} event An Event Facade object with the following specific property added:
182
* <dt>drop</dt><dd>The best guess on what was dropped on.</dd>
183
* <dt>drag</dt><dd>The drag object at the time of the event.</dd>
184
* <dt>others</dt><dd>An array of all the other drop targets that was dropped on.</dd>
187
* @type {CustomEvent}
190
* Fires when this node is dropped on an invalid Drop Target. (Fired from dd-ddm-drop)
191
* @event drag:dropmiss
192
* @param {EventFacade} event An Event Facade object with the following specific property added:
194
* <dt>pageX</dt><dd>The current node position X.</dd>
195
* <dt>pageY</dt><dd>The current node position Y.</dd>
198
* @type {CustomEvent}
202
this._lazyAddAttrs = false;
203
Drag.superclass.constructor.apply(this, arguments);
205
var valid = DDM._regDrag(this);
207
Y.error('Failed to register node, already in use: ' + o.node);
214
* This property defaults to "mousedown", but when drag-gestures is loaded, it is changed to "gesturemovestart"
216
* @property START_EVENT
218
Drag.START_EVENT = 'mousedown';
222
* Y.Node instance to use as the element to initiate a drag operation
227
setter: function(node) {
228
if (this._canDrag(node)) {
233
Y.error('DD.Drag: Invalid Node Given: ' + node);
239
* Y.Node instance to use as the draggable element, defaults to node
240
* @attribute dragNode
244
setter: function(node) {
245
if (this._canDrag(node)) {
250
Y.error('DD.Drag: Invalid dragNode Given: ' + node);
256
* Offset the drag element by the difference in cursor position: default true
257
* @attribute offsetNode
264
* Center the dragNode to the mouse position on drag:start: default false
265
* @attribute startCentered
272
* The number of pixels to move to start a drag operation, default is 3.
273
* @attribute clickPixelThresh
277
value: DDM.get('clickPixelThresh')
280
* The number of milliseconds a mousedown has to pass to start a drag operation, default is 1000.
281
* @attribute clickTimeThresh
285
value: DDM.get('clickTimeThresh')
288
* Set to lock this drag element so that it can't be dragged: default false.
294
setter: function(lock) {
296
this.get(NODE).addClass(DDM.CSS_PREFIX + '-locked');
298
this.get(NODE).removeClass(DDM.CSS_PREFIX + '-locked');
304
* A payload holder to store arbitrary data about this drag object, can be used to store any value.
312
* If this is false, the drag element will not move with the cursor: default true. Can be used to "resize" the element.
320
* Use the protective shim on all drag operations: default true. Only works with dd-ddm, not dd-ddm-base.
328
* Config option is set by Drag to inform you of which handle fired the drag event (in the case that there are several handles): default false.
329
* @attribute activeHandle
336
* By default a drag operation will only begin if the mousedown occurred with the primary mouse button.
337
* Setting this to false will allow for all mousedown events to trigger a drag.
338
* @attribute primaryButtonOnly
345
* This attribute is not meant to be used by the implementor, it is meant to be used as an Event tracker so you can listen for it to change.
346
* @attribute dragging
356
* This attribute only works if the dd-drop module has been loaded. It will make this node a drop target as well as draggable.
362
setter: function(config) {
363
this._handleTarget(config);
368
* This attribute only works if the dd-drop module is active. It will set the dragMode (point, intersect, strict) of this Drag instance.
369
* @attribute dragMode
374
setter: function(mode) {
375
return DDM._setDragMode(mode);
379
* Array of groups to add this drag into.
391
return Y.Object.keys(this._groups);
393
setter: function(g) {
394
this._groups = Y.Array.hash(g);
399
* Array of valid handles to add. Adding something here will set all handles, even if previously added with addHandle
405
setter: function(g) {
408
Y.Array.each(g, function(v) {
410
if (v instanceof Y.Node || v instanceof Y.NodeList) {
413
this._handles[key] = v;
416
this._handles = null;
422
* Controls the default bubble parent for this Drag instance. Default: Y.DD.DDM. Set to false to disable bubbling. Use bubbleTargets in config
428
setter: function(t) {
429
Y.log('bubbles is deprecated use bubbleTargets: HOST', 'warn', 'dd');
435
* Should the mousedown event be halted. Default: true
436
* @attribute haltDown
444
Y.extend(Drag, Y.Base, {
446
* Checks the object for the methods needed to drag the object around.
447
* Normally this would be a node instance, but in the case of Graphics, it
448
* may be an SVG node or something similar.
451
* @param {Object} n The object to check
452
* @return {Boolean} True or false if the Object contains the methods needed to Drag
454
_canDrag: function(n) {
455
if (n && n.setXY && n.getXY && n.test && n.contains) {
461
* The default bubbleTarget for this object. Default: Y.DD.DDM
463
* @property _bubbleTargets
465
_bubbleTargets: Y.DD.DDM,
467
* Add this Drag instance to a group, this should be used for on-the-fly group additions.
469
* @param {String} g The group to add this Drag Instance to.
473
addToGroup: function(g) {
474
this._groups[g] = true;
475
DDM._activateTargets();
479
* Remove this Drag instance from a group, this should be used for on-the-fly group removals.
480
* @method removeFromGroup
481
* @param {String} g The group to remove this Drag Instance from.
485
removeFromGroup: function(g) {
486
delete this._groups[g];
487
DDM._activateTargets();
491
* This will be a reference to the Drop instance associated with this drag if the target: true config attribute is set..
497
* Attribute handler for the target config attribute.
499
* @method _handleTarget
500
* @param {Boolean/Object} config The Config
502
_handleTarget: function(config) {
504
if (config === false) {
506
DDM._unregTarget(this.target);
510
if (!Y.Lang.isObject(config)) {
513
config.bubbleTargets = config.bubbleTargets || this.getTargets();
514
config.node = this.get(NODE);
515
config.groups = config.groups || this.get('groups');
516
this.target = new Y.DD.Drop(config);
521
* Storage Array for the groups this drag belongs to.
528
* This method creates all the events for this Event Target and publishes them so we get Event Bubbling.
530
* @method _createEvents
532
_createEvents: function() {
534
this.publish(EV_MOUSE_DOWN, {
535
defaultFn: this._defMouseDownFn,
542
this.publish(EV_ALIGN, {
543
defaultFn: this._defAlignFn,
550
this.publish(EV_DRAG, {
551
defaultFn: this._defDragFn,
558
this.publish(EV_END, {
559
defaultFn: this._defEndFn,
560
preventedFn: this._prevEndFn,
581
Y.Array.each(ev, function(v) {
593
* A private reference to the mousedown DOM event
596
* @type {EventFacade}
600
* The getTime of the mousedown event. Not used, just here in case someone wants/needs to use it.
602
* @property _startTime
607
* The getTime of the mouseup event. Not used, just here in case someone wants/needs to use it.
614
* A private hash of the valid drag handles
621
* A private hash of the invalid selector strings
623
* @property _invalids
628
* A private hash of the default invalid selector strings: {'textarea': true, 'input': true, 'a': true, 'button': true, 'select': true}
630
* @property _invalidsDefault
633
_invalidsDefault: {'textarea': true, 'input': true, 'a': true, 'button': true, 'select': true },
635
* Private flag to see if the drag threshhold was met
637
* @property _dragThreshMet
640
_dragThreshMet: null,
642
* Flag to determine if the drag operation came from a timeout
644
* @property _fromTimeout
649
* Holder for the setTimeout call
651
* @property _clickTimeout
656
* The offset of the mouse position to the element's position
662
* The initial mouse position
668
* The initial element position
674
* The position of the element as it's moving (for offset calculations)
680
* The xy that the node will be set to. Changing this will alter the position as it's dragged.
686
* The real xy position of the node.
692
* The XY coords of the mousemove
698
* A region object associated with this drag, used for checking regions while dragging.
704
* Handler for the mouseup DOM event
706
* @method _handleMouseUp
707
* @param {EventFacade} ev The Event
709
_handleMouseUp: function() {
710
this.fire('drag:mouseup');
711
this._fixIEMouseUp();
712
if (DDM.activeDrag) {
717
* The function we use as the ondragstart handler when we start a drag
718
* in Internet Explorer. This keeps IE from blowing up on images as drag handles.
720
* @method _fixDragStart
721
* @param {Event} e The Event
723
_fixDragStart: function(e) {
724
if (this.validClick(e)) {
729
* The function we use as the onselectstart handler when we start a drag in Internet Explorer
731
* @method _ieSelectFix
733
_ieSelectFix: function() {
737
* We will hold a copy of the current "onselectstart" method on this property, and reset it after we are done using it.
739
* @property _ieSelectBack
743
* This method copies the onselectstart listner on the document to the _ieSelectFix property
745
* @method _fixIEMouseDown
747
_fixIEMouseDown: function() {
749
this._ieSelectBack = Y.config.doc.body.onselectstart;
750
Y.config.doc.body.onselectstart = this._ieSelectFix;
754
* This method copies the _ieSelectFix property back to the onselectstart listner on the document.
756
* @method _fixIEMouseUp
758
_fixIEMouseUp: function() {
760
Y.config.doc.body.onselectstart = this._ieSelectBack;
764
* Handler for the mousedown DOM event
766
* @method _handleMouseDownEvent
767
* @param {EventFacade} ev The Event
769
_handleMouseDownEvent: function(ev) {
770
this.fire(EV_MOUSE_DOWN, { ev: ev });
773
* Handler for the mousedown DOM event
775
* @method _defMouseDownFn
776
* @param {EventFacade} e The Event
778
_defMouseDownFn: function(e) {
781
this._dragThreshMet = false;
784
if (this.get('primaryButtonOnly') && ev.button > 1) {
787
if (this.validClick(ev)) {
788
this._fixIEMouseDown(ev);
789
if (Drag.START_EVENT.indexOf('gesture') !== 0) {
790
//Only do these if it's not a gesture
791
if (this.get('haltDown')) {
792
Y.log('Halting MouseDown', 'info', 'drag');
795
Y.log('Preventing Default on MouseDown', 'info', 'drag');
800
this._setStartPosition([ev.pageX, ev.pageY]);
802
DDM.activeDrag = this;
804
this._clickTimeout = Y.later(this.get('clickTimeThresh'), this, this._timeoutCheck);
806
this.fire(EV_AFTER_MOUSE_DOWN, { ev: ev });
809
* Method first checks to see if we have handles, if so it validates the click
810
* against the handle. Then if it finds a valid handle, it checks it against
811
* the invalid handles list. Returns true if a good handle was used, false otherwise.
813
* @param {EventFacade} ev The Event
816
validClick: function(ev) {
817
var r = false, n = false,
824
Y.Object.each(this._handles, function(i, n) {
825
if (i instanceof Y.Node || i instanceof Y.NodeList) {
828
if (nlist instanceof Y.Node) {
829
nlist = new Y.NodeList(i._node);
831
nlist.each(function(nl) {
832
if (nl.contains(tar)) {
837
} else if (Y.Lang.isString(n)) {
838
//Am I this or am I inside this
839
if (tar.test(n + ', ' + n + ' *') && !hTest) {
847
if (n.contains(tar) || n.compareTo(tar)) {
852
if (this._invalids) {
853
Y.Object.each(this._invalids, function(i, n) {
854
if (Y.Lang.isString(n)) {
855
//Am I this or am I inside this
856
if (tar.test(n + ', ' + n + ' *')) {
865
els = ev.currentTarget.all(hTest);
867
els.each(function(n) {
868
if ((n.contains(tar) || n.compareTo(tar)) && !set) {
870
this.set('activeHandle', n);
874
this.set('activeHandle', this.get(NODE));
880
* Sets the current position of the Element and calculates the offset
882
* @method _setStartPosition
883
* @param {Array} xy The XY coords to set the position to.
885
_setStartPosition: function(xy) {
888
this.nodeXY = this.lastXY = this.realXY = this.get(NODE).getXY();
890
if (this.get('offsetNode')) {
891
this.deltaXY = [(this.startXY[0] - this.nodeXY[0]), (this.startXY[1] - this.nodeXY[1])];
893
this.deltaXY = [0, 0];
897
* The method passed to setTimeout to determine if the clickTimeThreshold was met.
899
* @method _timeoutCheck
901
_timeoutCheck: function() {
902
if (!this.get('lock') && !this._dragThreshMet && this._ev_md) {
903
this._fromTimeout = this._dragThreshMet = true;
905
this._alignNode([this._ev_md.pageX, this._ev_md.pageY], true);
909
* Remove a Selector added by addHandle
910
* @method removeHandle
911
* @param {String} str The selector for the handle to be removed.
915
removeHandle: function(str) {
917
if (str instanceof Y.Node || str instanceof Y.NodeList) {
920
if (this._handles[key]) {
921
delete this._handles[key];
922
this.fire(EV_REMOVE_HANDLE, { handle: str });
927
* Add a handle to a drag element. Drag only initiates when a mousedown happens on this element.
929
* @param {String} str The selector to test for a valid handle. Must be a child of the element.
933
addHandle: function(str) {
934
if (!this._handles) {
938
if (str instanceof Y.Node || str instanceof Y.NodeList) {
941
this._handles[key] = str;
942
this.fire(EV_ADD_HANDLE, { handle: str });
946
* Remove an invalid handle added by addInvalid
947
* @method removeInvalid
948
* @param {String} str The invalid handle to remove from the internal list.
952
removeInvalid: function(str) {
953
if (this._invalids[str]) {
954
this._invalids[str] = null;
955
delete this._invalids[str];
956
this.fire(EV_REMOVE_INVALID, { handle: str });
961
* Add a selector string to test the handle against. If the test passes the drag operation will not continue.
963
* @param {String} str The selector to test against to determine if this is an invalid drag handle.
967
addInvalid: function(str) {
968
if (Y.Lang.isString(str)) {
969
this._invalids[str] = true;
970
this.fire(EV_ADD_INVALID, { handle: str });
975
* Internal init handler
977
* @method initializer
979
initializer: function() {
981
this.get(NODE).dd = this;
983
if (!this.get(NODE).get('id')) {
984
var id = Y.stamp(this.get(NODE));
985
this.get(NODE).set('id', id);
990
this._invalids = Y.clone(this._invalidsDefault, true);
992
this._createEvents();
994
if (!this.get(DRAG_NODE)) {
995
this.set(DRAG_NODE, this.get(NODE));
999
//Don't prep the DD instance until all plugins are loaded.
1000
this.on('initializedChange', Y.bind(this._prep, this));
1002
//Shouldn't have to do this..
1003
this.set('groups', this.get('groups'));
1006
* Attach event listners and add classname
1011
this._dragThreshMet = false;
1012
var node = this.get(NODE);
1013
node.addClass(DDM.CSS_PREFIX + '-draggable');
1014
node.on(Drag.START_EVENT, Y.bind(this._handleMouseDownEvent, this));
1015
node.on('mouseup', Y.bind(this._handleMouseUp, this));
1016
node.on('dragstart', Y.bind(this._fixDragStart, this));
1019
* Detach event listeners and remove classname
1023
_unprep: function() {
1024
var node = this.get(NODE);
1025
node.removeClass(DDM.CSS_PREFIX + '-draggable');
1026
node.detachAll('mouseup');
1027
node.detachAll('dragstart');
1028
node.detachAll(Drag.START_EVENT);
1030
this.deltaXY = [0,0];
1038
* Starts the drag operation
1044
if (!this.get('lock') && !this.get(DRAGGING)) {
1045
var node = this.get(NODE), ow, oh, xy;
1046
this._startTime = (new Date()).getTime();
1049
node.addClass(DDM.CSS_PREFIX + '-dragging');
1050
this.fire(EV_START, {
1051
pageX: this.nodeXY[0],
1052
pageY: this.nodeXY[1],
1053
startTime: this._startTime
1055
node = this.get(DRAG_NODE);
1058
ow = node.get(OFFSET_WIDTH);
1059
oh = node.get(OFFSET_HEIGHT);
1061
if (this.get('startCentered')) {
1062
this._setStartPosition([xy[0] + (ow / 2), xy[1] + (oh / 2)]);
1075
this.set(DRAGGING, true);
1080
* Ends the drag operation
1086
this._endTime = (new Date()).getTime();
1087
if (this._clickTimeout) {
1088
this._clickTimeout.cancel();
1090
this._dragThreshMet = this._fromTimeout = false;
1092
if (!this.get('lock') && this.get(DRAGGING)) {
1094
pageX: this.lastXY[0],
1095
pageY: this.lastXY[1],
1096
startTime: this._startTime,
1097
endTime: this._endTime
1100
this.get(NODE).removeClass(DDM.CSS_PREFIX + '-dragging');
1101
this.set(DRAGGING, false);
1102
this.deltaXY = [0, 0];
1107
* Handler for fixing the selection in IE
1111
_defEndFn: function() {
1112
this._fixIEMouseUp();
1116
* Handler for preventing the drag:end event. It will reset the node back to it's start position
1118
* @method _prevEndFn
1120
_prevEndFn: function() {
1121
this._fixIEMouseUp();
1123
this.get(DRAG_NODE).setXY(this.nodeXY);
1128
* Calculates the offsets and set's the XY that the element will move to.
1131
* @param {Array} xy The xy coords to align with.
1133
_align: function(xy) {
1134
this.fire(EV_ALIGN, {pageX: xy[0], pageY: xy[1] });
1137
* Calculates the offsets and set's the XY that the element will move to.
1139
* @method _defAlignFn
1140
* @param {EventFacade} e The drag:align event.
1142
_defAlignFn: function(e) {
1143
this.actXY = [e.pageX - this.deltaXY[0], e.pageY - this.deltaXY[1]];
1146
* This method performs the alignment before the element move.
1148
* @method _alignNode
1149
* @param {Array} eXY The XY to move the element to, usually comes from the mousemove DOM event.
1151
_alignNode: function(eXY, scroll) {
1158
* This method performs the actual element move.
1162
_moveNode: function(scroll) {
1163
//if (!this.get(DRAGGING)) {
1166
var diffXY = [], diffXY2 = [], startXY = this.nodeXY, xy = this.actXY;
1168
diffXY[0] = (xy[0] - this.lastXY[0]);
1169
diffXY[1] = (xy[1] - this.lastXY[1]);
1171
diffXY2[0] = (xy[0] - this.nodeXY[0]);
1172
diffXY2[1] = (xy[1] - this.nodeXY[1]);
1180
right: xy[0] + this.get(DRAG_NODE).get(OFFSET_WIDTH),
1181
bottom: xy[1] + this.get(DRAG_NODE).get(OFFSET_HEIGHT),
1185
this.fire(EV_DRAG, {
1200
* Default function for drag:drag. Fired from _moveNode.
1202
* @method _defDragFn
1203
* @param {EventFacade} ev The drag:drag event
1205
_defDragFn: function(e) {
1206
if (this.get('move')) {
1207
if (e.scroll && e.scroll.node) {
1208
var domNode = e.scroll.node.getDOMNode();
1209
//If it's the window
1210
if (domNode === Y.config.win) {
1211
domNode.scrollTo(e.scroll.left, e.scroll.top);
1213
e.scroll.node.set('scrollTop', e.scroll.top);
1214
e.scroll.node.set('scrollLeft', e.scroll.left);
1217
this.get(DRAG_NODE).setXY([e.pageX, e.pageY]);
1218
this.realXY = [e.pageX, e.pageY];
1222
* Fired from DragDropMgr (DDM) on mousemove.
1225
* @param {EventFacade} ev The mousemove DOM event
1227
_move: function(ev) {
1228
if (this.get('lock')) {
1232
this.mouseXY = [ev.pageX, ev.pageY];
1233
if (!this._dragThreshMet) {
1234
var diffX = Math.abs(this.startXY[0] - ev.pageX),
1235
diffY = Math.abs(this.startXY[1] - ev.pageY);
1236
if (diffX > this.get('clickPixelThresh') || diffY > this.get('clickPixelThresh')) {
1237
this._dragThreshMet = true;
1239
//This only happens on gestures to stop the page from scrolling
1240
if (ev && ev.preventDefault) {
1241
ev.preventDefault();
1243
this._alignNode([ev.pageX, ev.pageY]);
1246
if (this._clickTimeout) {
1247
this._clickTimeout.cancel();
1249
this._alignNode([ev.pageX, ev.pageY]);
1253
* Method will forcefully stop a drag operation. For example calling this from inside an ESC keypress handler will stop this drag.
1258
stopDrag: function() {
1259
if (this.get(DRAGGING)) {
1265
* Lifecycle destructor, unreg the drag from the DDM and remove listeners
1267
* @method destructor
1269
destructor: function() {
1272
this.target.destroy();
1274
DDM._unregDrag(this);
1283
}, '3.10.3', {"requires": ["dd-ddm-base"]});