<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
- <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
- <script type="text/javascript" src="../prettify/prettify.js"></script>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
<style type="text/css">
.highlight { display: block; background-color: #ddd; }
</style>
*/
Ext.define('Ext.dd.DragDrop', {
requires: ['Ext.dd.DragDropManager'],
-
+
<span id='Ext-dd-DragDrop-method-constructor'> /**
</span> * Creates new DragDrop.
* @param {String} id of the element that is linked to this instance
* @param {String} sGroup the group of related DragDrop objects
- * @param {object} config an object containing configurable attributes.
+ * @param {Object} config an object containing configurable attributes.
* Valid properties for DragDrop:
- *
+ *
* - padding
* - isTarget
* - maintainOffset
this.init(id, sGroup, config);
}
},
-
+
<span id='Ext-dd-DragDrop-property-ignoreSelf'> /**
</span> * Set to false to enable a DragDrop object to fire drag events while dragging
* over its own Element. Defaults to true - DragDrop objects do not by default
<span id='Ext-dd-DragDrop-property-config'> /**
</span> * Configuration attributes passed into the constructor
* @property config
- * @type object
+ * @type Object
*/
config: null,
<span id='Ext-dd-DragDrop-property-invalidHandleTypes'> /**
</span> * An object who's property names identify HTML tags to be considered invalid as drag handles.
- * A non-null property value identifies the tag as invalid. Defaults to the
+ * A non-null property value identifies the tag as invalid. Defaults to the
* following value which prevents drag operations from being initiated by &lt;a> elements:<pre><code>
{
A: "A"
<span id='Ext-dd-DragDrop-property-invalidHandleClasses'> /**
</span> * An Array of CSS class names for elements to be considered in valid as drag handles.
- * @property invalidHandleClasses
- * @type Array
+ * @property {String[]} invalidHandleClasses
*/
invalidHandleClasses: null,
</span> * The linked element's absolute X position at the time the drag was
* started
* @property startPageX
- * @type int
+ * @type Number
* @private
*/
startPageX: 0,
</span> * The linked element's absolute X position at the time the drag was
* started
* @property startPageY
- * @type int
+ * @type Number
* @private
*/
startPageY: 0,
* DragDrop object in the same group. This lets us define multiple
* groups using a single DragDrop subclass if we want.
* @property groups
- * @type object An object in the format {'group1':true, 'group2':true}
+ * @type Object An object in the format {'group1':true, 'group2':true}
*/
groups: null,
</span> * Individual drag/drop instances can be locked. This will prevent
* onmousedown start drag.
* @property locked
- * @type boolean
+ * @type Boolean
* @private
*/
locked: false,
</span> * When set to true, other DD objects in cooperating DDGroups do not receive
* notification events when this DD object is dragged over them. Defaults to false.
* @property moveOnly
- * @type boolean
+ * @type Boolean
*/
moveOnly: false,
</span> * By default, all instances can be a drop target. This can be disabled by
* setting isTarget to false.
* @property isTarget
- * @type boolean
+ * @type Boolean
*/
isTarget: true,
</span> * The padding configured for this drag and drop object for calculating
* the drop zone intersection with this object.
* An array containing the 4 padding values: [top, right, bottom, left]
- * @property {[int]} padding
+ * @property {Number[]} padding
*/
padding: null,
<span id='Ext-dd-DragDrop-property-constrainX'> /**
</span> * Set to true when horizontal contraints are applied
* @property constrainX
- * @type boolean
+ * @type Boolean
* @private
*/
constrainX: false,
<span id='Ext-dd-DragDrop-property-constrainY'> /**
</span> * Set to true when vertical contraints are applied
* @property constrainY
- * @type boolean
+ * @type Boolean
* @private
*/
constrainY: false,
<span id='Ext-dd-DragDrop-property-minX'> /**
</span> * The left constraint
* @property minX
- * @type int
+ * @type Number
* @private
*/
minX: 0,
<span id='Ext-dd-DragDrop-property-maxX'> /**
</span> * The right constraint
* @property maxX
- * @type int
+ * @type Number
* @private
*/
maxX: 0,
<span id='Ext-dd-DragDrop-property-minY'> /**
</span> * The up constraint
* @property minY
- * @type int
+ * @type Number
* @private
*/
minY: 0,
<span id='Ext-dd-DragDrop-property-maxY'> /**
</span> * The down constraint
* @property maxY
- * @type int
+ * @type Number
* @private
*/
maxY: 0,
* when the page changes
*
* @property maintainOffset
- * @type boolean
+ * @type Boolean
*/
maintainOffset: false,
</span> * Array of pixel locations the element will snap to if we specified a
* horizontal graduation/interval. This array is generated automatically
* when you define a tick interval.
- * @property {[int]} xTicks
+ * @property {Number[]} xTicks
*/
xTicks: null,
</span> * Array of pixel locations the element will snap to if we specified a
* vertical graduation/interval. This array is generated automatically
* when you define a tick interval.
- * @property {[int]} yTicks
+ * @property {Number[]} yTicks
*/
yTicks: null,
* allow drag and drop to start with any mouse click that is propogated
* by the browser
* @property primaryButtonOnly
- * @type boolean
+ * @type Boolean
*/
primaryButtonOnly: true,
<span id='Ext-dd-DragDrop-property-available'> /**
</span> * The available property is false until the linked dom element is accessible.
* @property available
- * @type boolean
+ * @type Boolean
*/
available: false,
* if outer handles are defined. Defaults to false.
*
* @property hasOuterHandles
- * @type boolean
+ * @type Boolean
*/
hasOuterHandles: false,
<span id='Ext-dd-DragDrop-method-startDrag'> /**
</span> * Abstract method called after a drag/drop object is clicked
* and the drag or mousedown time thresholds have beeen met.
- * @param {int} X click location
- * @param {int} Y click location
+ * @param {Number} X click location
+ * @param {Number} Y click location
*/
startDrag: function(x, y) { /* override this */ },
</span> * Abstract method called when this element fist begins hovering over
* another DragDrop obj
* @param {Event} e the mousemove event
- * @param {String/[DragDrop]} id In POINT mode, the element
+ * @param {String/Ext.dd.DragDrop[]} id In POINT mode, the element
* id this is hovering over. In INTERSECT mode, an array of one or more
* dragdrop items being hovered over.
*/
</span> * Abstract method called when this element is hovering over another
* DragDrop obj
* @param {Event} e the mousemove event
- * @param {String|DragDrop[]} id In POINT mode, the element
+ * @param {String/Ext.dd.DragDrop[]} id In POINT mode, the element
* id this is hovering over. In INTERSECT mode, an array of dd items
* being hovered over.
*/
<span id='Ext-dd-DragDrop-method-onDragOut'> /**
</span> * Abstract method called when we are no longer hovering over an element
* @param {Event} e the mousemove event
- * @param {String/[DragDrop]} id In POINT mode, the element
+ * @param {String/Ext.dd.DragDrop[]} id In POINT mode, the element
* id this was hovering over. In INTERSECT mode, an array of dd items
* that the mouse is no longer over.
*/
</span> * Abstract method called when this item is dropped on another DragDrop
* obj
* @param {Event} e the mouseup event
- * @param {String/[DragDrop]} id In POINT mode, the element
+ * @param {String/Ext.dd.DragDrop[]} id In POINT mode, the element
* id this was dropped on. In INTERSECT mode, an array of dd items this
* was dropped on.
*/
},
<span id='Ext-dd-DragDrop-property-defaultPadding'> /**
-</span> * Provides default constraint padding to "constrainTo" elements (defaults to `{left:0, right:0, top:0, bottom:0}`).
- * @type Object
+</span> * @property {Object} defaultPadding
+ * Provides default constraint padding to "constrainTo" elements.
*/
defaultPadding: {
left: 0,
* this.constrainTo("parent-id");
* };
*
- * Or you can initalize it using the {@link Ext.core.Element} object:
+ * Or you can initalize it using the {@link Ext.Element} object:
*
* Ext.get("dragDiv1").initDDProxy("proxytest", {dragElId: "existingProxyDiv"}, {
* startDrag : function(){
* }
* });
*
- * @param {Mixed} constrainTo The element to constrain to.
+ * @param {String/HTMLElement/Ext.Element} constrainTo The element or element ID to constrain to.
* @param {Object/Number} pad (optional) Pad provides a way to specify "padding" of the constraints,
* and can be either a number for symmetrical padding (4 would be equal to `{left:4, right:4, top:4, bottom:4}`) or
* an object containing the sides to pad. For example: `{right:10, bottom:10}`
var b = Ext.get(this.getEl()).getBox(),
ce = Ext.get(constrainTo),
s = ce.getScroll(),
- c,
+ c,
cd = ce.dom;
if(cd == document.body){
- c = { x: s.left, y: s.top, width: Ext.core.Element.getViewWidth(), height: Ext.core.Element.getViewHeight()};
+ c = { x: s.left, y: s.top, width: Ext.Element.getViewWidth(), height: Ext.Element.getViewHeight()};
}else{
var xy = ce.getXY();
c = {x : xy[0], y: xy[1], width: cd.clientWidth, height: cd.clientHeight};
* Supports css-style shorthand; if only one parameter is passed, all sides
* will have that padding, and if only two are passed, the top and bottom
* will have the first param, the left and right the second.
- * @param {int} iTop Top pad
- * @param {int} iRight Right pad
- * @param {int} iBot Bot pad
- * @param {int} iLeft Left pad
+ * @param {Number} iTop Top pad
+ * @param {Number} iRight Right pad
+ * @param {Number} iBot Bot pad
+ * @param {Number} iLeft Left pad
*/
setPadding: function(iTop, iRight, iBot, iLeft) {
// this.padding = [iLeft, iRight, iTop, iBot];
<span id='Ext-dd-DragDrop-method-setInitPosition'> /**
</span> * Stores the initial placement of the linked element.
- * @param {int} diffX the X offset, default 0
- * @param {int} diffY the Y offset, default 0
+ * @param {Number} diffX the X offset, default 0
+ * @param {Number} diffY the Y offset, default 0
*/
setInitPosition: function(diffX, diffY) {
var el = this.getEl();
var dx = diffX || 0;
var dy = diffY || 0;
- var p = Ext.core.Element.getXY( el );
+ var p = Ext.Element.getXY( el );
this.initPageX = p[0] - dx;
this.initPageY = p[1] - dy;
* @private
*/
setStartPosition: function(pos) {
- var p = pos || Ext.core.Element.getXY( this.getEl() );
+ var p = pos || Ext.Element.getXY( this.getEl() );
this.deltaSetXY = null;
this.startPageX = p[0];
</span> * By default, the element can be dragged any place on the screen. Use
* this method to limit the horizontal travel of the element. Pass in
* 0,0 for the parameters if you want to lock the drag to the y axis.
- * @param {int} iLeft the number of pixels the element can move to the left
- * @param {int} iRight the number of pixels the element can move to the
+ * @param {Number} iLeft the number of pixels the element can move to the left
+ * @param {Number} iRight the number of pixels the element can move to the
* right
- * @param {int} iTickSize optional parameter for specifying that the
+ * @param {Number} iTickSize (optional) parameter for specifying that the
* element should move iTickSize pixels at a time.
*/
setXConstraint: function(iLeft, iRight, iTickSize) {
</span> * By default, the element can be dragged any place on the screen. Set
* this to limit the vertical travel of the element. Pass in 0,0 for the
* parameters if you want to lock the drag to the x axis.
- * @param {int} iUp the number of pixels the element can move up
- * @param {int} iDown the number of pixels the element can move down
- * @param {int} iTickSize optional parameter for specifying that the
+ * @param {Number} iUp the number of pixels the element can move up
+ * @param {Number} iDown the number of pixels the element can move down
+ * @param {Number} iTickSize (optional) parameter for specifying that the
* element should move iTickSize pixels at a time.
*/
setYConstraint: function(iUp, iDown, iTickSize) {
<span id='Ext-dd-DragDrop-method-resetConstraints'> /**
</span> * Must be called if you manually reposition a dd element.
- * @param {boolean} maintainOffset
+ * @param {Boolean} maintainOffset
*/
resetConstraints: function() {
// Maintain offsets if necessary
</span> * Normally the drag element is moved pixel by pixel, but we can specify
* that it move a number of pixels at a time. This method resolves the
* location when we have it set up like this.
- * @param {int} val where we want to place the object
- * @param {int[]} tickArray sorted array of valid points
- * @return {int} the closest tick
+ * @param {Number} val where we want to place the object
+ * @param {Number[]} tickArray sorted array of valid points
+ * @return {Number} the closest tick
* @private
*/
getTick: function(val, tickArray) {
<span id='Ext-dd-DragDrop-method-toString'> /**
</span> * toString method
- * @return {string} string representation of the dd obj
+ * @return {String} string representation of the dd obj
*/
toString: function() {
return ("DragDrop " + this.id);