/*
* This is a derivative of the similarly named class in the YUI Library.
* The original license:
* Copyright (c) 2006, Yahoo! Inc. All rights reserved.
@@ -7,7 +24,7 @@
*/
-/**
+/**
* @class Ext.dd.DragDropManager
* DragDropManager is a singleton that tracks the element interaction for
* all DragDrop items in the window. Generally, you will not call
@@ -25,7 +42,7 @@ Ext.define('Ext.dd.DragDropManager', {
// shorter ClassName, to save bytes and use internally
alternateClassName: ['Ext.dd.DragDropMgr', 'Ext.dd.DDM'],
- /**
+ /**
* Two dimensional Array of registered DragDrop objects. The first
* dimension is the DragDrop item group, the second the DragDrop
* object.
@@ -36,7 +53,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
ids: {},
- /**
+ /**
* Array of element ids defined as drag handles. Used to determine
* if the element that generated the mousedown event is actually the
* handle and not the html element itself.
@@ -47,7 +64,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
handleIds: {},
- /**
+ /**
* the DragDrop object that is currently being dragged
* @property dragCurrent
* @type DragDrop
@@ -56,7 +73,7 @@ Ext.define('Ext.dd.DragDropManager', {
**/
dragCurrent: null,
- /**
+ /**
* the DragDrop object(s) that are being hovered over
* @property dragOvers
* @type Array
@@ -65,7 +82,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
dragOvers: {},
- /**
+ /**
* the X distance between the cursor and the object being dragged
* @property deltaX
* @type int
@@ -74,7 +91,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
deltaX: 0,
- /**
+ /**
* the Y distance between the cursor and the object being dragged
* @property deltaY
* @type int
@@ -83,7 +100,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
deltaY: 0,
- /**
+ /**
* Flag to determine if we should prevent the default behavior of the
* events we define. By default this is true, but this can be set to
* false if you need the default behavior (not recommended)
@@ -93,7 +110,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
preventDefault: true,
- /**
+ /**
* Flag to determine if we should stop the propagation of the events
* we generate. This is true by default but you may want to set it to
* false if the html element contains other features that require the
@@ -104,7 +121,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
stopPropagation: true,
- /**
+ /**
* Internal flag that is set to true when drag and drop has been
* intialized
* @property initialized
@@ -113,7 +130,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
initialized: false,
- /**
+ /**
* All drag and drop can be disabled.
* @property locked
* @private
@@ -121,7 +138,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
locked: false,
- /**
+ /**
* Called the first time an element is registered.
* @method init
* @private
@@ -131,7 +148,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.initialized = true;
},
- /**
+ /**
* In point mode, drag and drop interaction is defined by the
* location of the cursor during the drag/drop
* @property POINT
@@ -140,7 +157,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
POINT: 0,
- /**
+ /**
* In intersect mode, drag and drop interaction is defined by the
* overlap of two or more drag and drop objects.
* @property INTERSECT
@@ -149,7 +166,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
INTERSECT: 1,
- /**
+ /**
* The current drag and drop mode. Default: POINT
* @property mode
* @type int
@@ -157,7 +174,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
mode: 0,
- /**
+ /**
* Runs method on all drag and drop objects
* @method _execOnAll
* @private
@@ -175,7 +192,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* Drag and drop initialization. Sets up the global event handlers
* @method _onLoad
* @private
@@ -194,7 +211,7 @@ Ext.define('Ext.dd.DragDropManager', {
},
- /**
+ /**
* Reset constraints on all drag and drop objs
* @method _onResize
* @private
@@ -204,21 +221,21 @@ Ext.define('Ext.dd.DragDropManager', {
this._execOnAll("resetConstraints", []);
},
- /**
+ /**
* Lock all drag and drop functionality
* @method lock
* @static
*/
lock: function() { this.locked = true; },
- /**
+ /**
* Unlock all drag and drop functionality
* @method unlock
* @static
*/
unlock: function() { this.locked = false; },
- /**
+ /**
* Is drag and drop locked?
* @method isLocked
* @return {boolean} True if drag and drop is locked, false otherwise.
@@ -226,7 +243,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
isLocked: function() { return this.locked; },
- /**
+ /**
* Location cache that is set for all drag drop objects when a drag is
* initiated, cleared when the drag is finished.
* @property locationCache
@@ -235,7 +252,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
locationCache: {},
- /**
+ /**
* Set useCache to false if you want to force object the lookup of each
* drag and drop linked element constantly during a drag.
* @property useCache
@@ -244,7 +261,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
useCache: true,
- /**
+ /**
* The number of pixels that the mouse needs to move after the
* mousedown before the drag is initiated. Default=3;
* @property clickPixelThresh
@@ -253,7 +270,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
clickPixelThresh: 3,
- /**
+ /**
* The number of milliseconds after the mousedown event to initiate the
* drag if we don't get a mouseup event. Default=350
* @property clickTimeThresh
@@ -262,7 +279,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
clickTimeThresh: 350,
- /**
+ /**
* Flag that indicates that either the drag pixel threshold or the
* mousdown time threshold has been met
* @property dragThreshMet
@@ -272,7 +289,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
dragThreshMet: false,
- /**
+ /**
* Timeout used for the click time threshold
* @property clickTimeout
* @type Object
@@ -281,7 +298,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
clickTimeout: null,
- /**
+ /**
* The X position of the mousedown event stored for later use when a
* drag threshold is met.
* @property startX
@@ -291,7 +308,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
startX: 0,
- /**
+ /**
* The Y position of the mousedown event stored for later use when a
* drag threshold is met.
* @property startY
@@ -301,7 +318,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
startY: 0,
- /**
+ /**
* Each DragDrop instance must be registered with the DragDropManager.
* This is executed in DragDrop.init()
* @method regDragDrop
@@ -318,7 +335,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.ids[sGroup][oDD.id] = oDD;
},
- /**
+ /**
* Removes the supplied dd instance from the supplied group. Executed
* by DragDrop.removeFromGroup, so don't call this function directly.
* @method removeDDFromGroup
@@ -336,7 +353,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* Unregisters a drag and drop item. This is executed in
* DragDrop.unreg, use that method instead of calling this directly.
* @method _remove
@@ -352,7 +369,7 @@ Ext.define('Ext.dd.DragDropManager', {
delete this.handleIds[oDD.id];
},
- /**
+ /**
* Each DragDrop handle element must be registered. This is done
* automatically when executing DragDrop.setHandleElId()
* @method regHandle
@@ -368,7 +385,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.handleIds[sDDId][sHandleId] = sHandleId;
},
- /**
+ /**
* Utility function to determine if a given element has been
* registered as a drag drop item.
* @method isDragDrop
@@ -381,7 +398,7 @@ Ext.define('Ext.dd.DragDropManager', {
return ( this.getDDById(id) ) ? true : false;
},
- /**
+ /**
* Returns the drag and drop instances that are in all groups the
* passed in instance belongs to.
* @method getRelated
@@ -407,7 +424,7 @@ Ext.define('Ext.dd.DragDropManager', {
return oDDs;
},
- /**
+ /**
* Returns true if the specified dd target is a legal target for
* the specifice drag obj
* @method isLegalTarget
@@ -428,7 +445,7 @@ Ext.define('Ext.dd.DragDropManager', {
return false;
},
- /**
+ /**
* My goal is to be able to transparently determine if an object is
* typeof DragDrop, and the exact subclass of DragDrop. typeof
* returns "object", oDD.constructor.toString() always returns
@@ -443,7 +460,7 @@ Ext.define('Ext.dd.DragDropManager', {
return (oDD && oDD.__ygDragDrop);
},
- /**
+ /**
* Utility function to determine if a given element has been
* registered as a drag drop handle for the given Drag Drop object.
* @method isHandle
@@ -457,7 +474,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.handleIds[sDDId][sHandleId] );
},
- /**
+ /**
* Returns the DragDrop instance for a given id
* @method getDDById
* @param {String} id the id of the DragDrop object
@@ -473,7 +490,7 @@ Ext.define('Ext.dd.DragDropManager', {
return null;
},
- /**
+ /**
* Fired after a registered DragDrop object gets the mousedown event.
* Sets up the events required to track the object being dragged
* @method handleMouseDown
@@ -514,7 +531,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.clickTimeThresh );
},
- /**
+ /**
* Fired when either the drag pixel threshol or the mousedown hold
* time threshold has been met.
* @method startDrag
@@ -531,7 +548,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.dragThreshMet = true;
},
- /**
+ /**
* Internal function to handle the mouseup event. Will be invoked
* from the context of the document.
* @method handleMouseUp
@@ -560,7 +577,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.stopEvent(e);
},
- /**
+ /**
* Utility to stop event propagation and event default, if these
* features are turned on.
* @method stopEvent
@@ -577,7 +594,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* Internal function to clean up event handlers after the drag
* operation is complete
* @method stopDrag
@@ -600,7 +617,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.dragOvers = {};
},
- /**
+ /**
* Internal function to handle the mousemove event. Will be invoked
* from the context of the html element.
*
@@ -648,7 +665,7 @@ Ext.define('Ext.dd.DragDropManager', {
return true;
},
- /**
+ /**
* Iterates over all of the DragDrop elements to find ones we are
* hovering over or dropping on
* @method fireEvents
@@ -784,7 +801,7 @@ Ext.define('Ext.dd.DragDropManager', {
},
- /**
+ /**
* Helper function for getting the best match from the list of drag
* and drop objects returned by the drag and drop events when we are
* in INTERSECT mode. It returns either the first object that the
@@ -831,7 +848,7 @@ Ext.define('Ext.dd.DragDropManager', {
return winner;
},
- /**
+ /**
* Refreshes the cache of the top-left and bottom-right points of the
* drag and drop objects in the specified group(s). This is in the
* format that is stored in the drag and drop instance, so typical
@@ -873,7 +890,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* This checks to make sure an element exists and is in the DOM. The
* main purpose is to handle cases where innerHTML is used to remove
* drag and drop objects from the DOM. IE provides an 'unspecified
@@ -901,7 +918,7 @@ Ext.define('Ext.dd.DragDropManager', {
return false;
},
- /**
+ /**
* Returns a Region object containing the drag and drop element's position
* and size, including the padding configured for it
* @method getLocation
@@ -946,7 +963,7 @@ Ext.define('Ext.dd.DragDropManager', {
return Ext.create('Ext.util.Region', t, r, b, l);
},
- /**
+ /**
* Checks the cursor location to see if it over the target
* @method isOverTarget
* @param {Ext.util.Point} pt The point to evaluate
@@ -1005,7 +1022,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* unload event handler
* @method _onUnload
* @private
@@ -1015,7 +1032,7 @@ Ext.define('Ext.dd.DragDropManager', {
Ext.dd.DragDropManager.unregAll();
},
- /**
+ /**
* Cleans up the drag and drop events and objects.
* @method unregAll
* @private
@@ -1038,7 +1055,7 @@ Ext.define('Ext.dd.DragDropManager', {
this.ids = {};
},
- /**
+ /**
* A cache of DOM elements
* @property elementCache
* @private
@@ -1046,7 +1063,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
elementCache: {},
- /**
+ /**
* Get the wrapper for the DOM element specified
* @method getElWrapper
* @param {String} id the id of the element to get
@@ -1064,7 +1081,7 @@ Ext.define('Ext.dd.DragDropManager', {
return oWrapper;
},
- /**
+ /**
* Returns the actual DOM element
* @method getElement
* @param {String} id the id of the elment to get
@@ -1076,7 +1093,7 @@ Ext.define('Ext.dd.DragDropManager', {
return Ext.getDom(id);
},
- /**
+ /**
* Returns the style property for the DOM element (i.e.,
* document.getElById(id).style)
* @method getCss
@@ -1089,7 +1106,7 @@ Ext.define('Ext.dd.DragDropManager', {
return (el) ? el.style : null;
},
- /**
+ /**
* Inner class for cached elements
* @class Ext.dd.DragDropManager.ElementWrapper
* @for DragDropManager
@@ -1097,24 +1114,24 @@ Ext.define('Ext.dd.DragDropManager', {
* @deprecated
*/
ElementWrapper: function(el) {
- /**
+ /**
* The element
* @property el
*/
this.el = el || null;
- /**
+ /**
* The element id
* @property id
*/
this.id = this.el && el.id;
- /**
+ /**
* A reference to the style property
* @property css
*/
this.css = this.el && el.style;
},
- /**
+ /**
* Returns the X position of an html element
* @method getPosX
* @param el the element for which to get the position
@@ -1126,7 +1143,7 @@ Ext.define('Ext.dd.DragDropManager', {
return Ext.core.Element.getX(el);
},
- /**
+ /**
* Returns the Y position of an html element
* @method getPosY
* @param el the element for which to get the position
@@ -1137,7 +1154,7 @@ Ext.define('Ext.dd.DragDropManager', {
return Ext.core.Element.getY(el);
},
- /**
+ /**
* Swap two nodes. In IE, we use the native method, for others we
* emulate the IE behavior
* @method swapNode
@@ -1163,7 +1180,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* Returns the current scroll position
* @method getScroll
* @private
@@ -1194,7 +1211,7 @@ Ext.define('Ext.dd.DragDropManager', {
};
},
- /**
+ /**
* Returns the specified element style property
* @method getStyle
* @param {HTMLElement} el the element
@@ -1206,7 +1223,7 @@ Ext.define('Ext.dd.DragDropManager', {
return Ext.fly(el).getStyle(styleProp);
},
- /**
+ /**
* Gets the scrollTop
* @method getScrollTop
* @return {int} the document's scrollTop
@@ -1216,7 +1233,7 @@ Ext.define('Ext.dd.DragDropManager', {
return this.getScroll().top;
},
- /**
+ /**
* Gets the scrollLeft
* @method getScrollLeft
* @return {int} the document's scrollTop
@@ -1226,7 +1243,7 @@ Ext.define('Ext.dd.DragDropManager', {
return this.getScroll().left;
},
- /**
+ /**
* Sets the x/y position of an element to the location of the
* target element.
* @method moveToEl
@@ -1239,7 +1256,7 @@ Ext.define('Ext.dd.DragDropManager', {
Ext.core.Element.setXY(moveEl, aCoord);
},
- /**
+ /**
* Numeric array sort function
* @method numericSort
* @static
@@ -1248,7 +1265,7 @@ Ext.define('Ext.dd.DragDropManager', {
return (a - b);
},
- /**
+ /**
* Internal counter
* @property _timeoutCount
* @private
@@ -1256,7 +1273,7 @@ Ext.define('Ext.dd.DragDropManager', {
*/
_timeoutCount: 0,
- /**
+ /**
* Trying to make the load order less important. Without this we get
* an error if this file is loaded before the Event Utility.
* @method _addListeners
@@ -1277,7 +1294,7 @@ Ext.define('Ext.dd.DragDropManager', {
}
},
- /**
+ /**
* Recursively searches the immediate parent and all child nodes for
* the handle element in order to determine wheter or not it was
* clicked.
@@ -1306,4 +1323,6 @@ Ext.define('Ext.dd.DragDropManager', {
}, function() {
this._addListeners();
});
-