Upgrade to ExtJS 4.0.1 - Released 05/18/2011
[extjs.git] / docs / source / DragDrop.html
index 56c0fc4..e702fb8 100644 (file)
@@ -1,4 +1,21 @@
-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre>/*
+<!DOCTYPE html>
+<html>
+<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>
+  <style type="text/css">
+    .highlight { display: block; background-color: #ddd; }
+  </style>
+  <script type="text/javascript">
+    function highlight() {
+      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+    }
+  </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+  <pre class="prettyprint lang-js">/*
  * 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 @@
  */
 
 
-<span id='Ext-dd.DragDrop-method-constructor'><span id='Ext-dd.DragDrop'>/**
+<span id='Ext-dd-DragDrop-method-constructor'><span id='Ext-dd-DragDrop'>/**
 </span></span> * @class Ext.dd.DragDrop
  * Defines the interface and base operation of items that that can be
  * dragged or can be drop targets.  It was designed to be extended, overriding
@@ -60,7 +77,7 @@ Ext.define('Ext.dd.DragDrop', {
         }
     },
     
-<span id='Ext-dd.DragDrop-property-ignoreSelf'>    /**
+<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
      * fire drag events to themselves.
@@ -68,7 +85,7 @@ Ext.define('Ext.dd.DragDrop', {
      * @type Boolean
      */
 
-<span id='Ext-dd.DragDrop-property-id'>    /**
+<span id='Ext-dd-DragDrop-property-id'>    /**
 </span>     * The id of the element associated with this object.  This is what we
      * refer to as the &quot;linked element&quot; because the size and position of
      * this element is used to determine when the drag and drop objects have
@@ -78,14 +95,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     id: null,
 
-<span id='Ext-dd.DragDrop-property-config'>    /**
+<span id='Ext-dd-DragDrop-property-config'>    /**
 </span>     * Configuration attributes passed into the constructor
      * @property config
      * @type object
      */
     config: null,
 
-<span id='Ext-dd.DragDrop-property-dragElId'>    /**
+<span id='Ext-dd-DragDrop-property-dragElId'>    /**
 </span>     * The id of the element that will be dragged.  By default this is same
      * as the linked element, but could be changed to another element. Ex:
      * Ext.dd.DDProxy
@@ -95,7 +112,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     dragElId: null,
 
-<span id='Ext-dd.DragDrop-property-handleElId'>    /**
+<span id='Ext-dd-DragDrop-property-handleElId'>    /**
 </span>     * The ID of the element that initiates the drag operation.  By default
      * this is the linked element, but could be changed to be a child of this
      * element.  This lets us do things like only starting the drag when the
@@ -106,7 +123,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     handleElId: null,
 
-<span id='Ext-dd.DragDrop-property-invalidHandleTypes'>    /**
+<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 
      * following value which prevents drag operations from being initiated by &amp;lt;a&gt; elements:&lt;pre&gt;&lt;code&gt;
@@ -118,7 +135,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     invalidHandleTypes: null,
 
-<span id='Ext-dd.DragDrop-property-invalidHandleIds'>    /**
+<span id='Ext-dd-DragDrop-property-invalidHandleIds'>    /**
 </span>     * An object who's property names identify the IDs of elements to be considered invalid as drag handles.
      * A non-null property value identifies the ID as invalid. For example, to prevent
      * dragging from being initiated on element ID &quot;foo&quot;, use:&lt;pre&gt;&lt;code&gt;
@@ -130,14 +147,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     invalidHandleIds: null,
 
-<span id='Ext-dd.DragDrop-property-invalidHandleClasses'>    /**
+<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
      */
     invalidHandleClasses: null,
 
-<span id='Ext-dd.DragDrop-property-startPageX'>    /**
+<span id='Ext-dd-DragDrop-property-startPageX'>    /**
 </span>     * The linked element's absolute X position at the time the drag was
      * started
      * @property startPageX
@@ -146,7 +163,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     startPageX: 0,
 
-<span id='Ext-dd.DragDrop-property-startPageY'>    /**
+<span id='Ext-dd-DragDrop-property-startPageY'>    /**
 </span>     * The linked element's absolute X position at the time the drag was
      * started
      * @property startPageY
@@ -155,7 +172,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     startPageY: 0,
 
-<span id='Ext-dd.DragDrop-property-groups'>    /**
+<span id='Ext-dd-DragDrop-property-groups'>    /**
 </span>     * The group defines a logical collection of DragDrop objects that are
      * related.  Instances only get events when interacting with other
      * DragDrop object in the same group.  This lets us define multiple
@@ -165,7 +182,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     groups: null,
 
-<span id='Ext-dd.DragDrop-property-locked'>    /**
+<span id='Ext-dd-DragDrop-property-locked'>    /**
 </span>     * Individual drag/drop instances can be locked.  This will prevent
      * onmousedown start drag.
      * @property locked
@@ -174,7 +191,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     locked: false,
 
-<span id='Ext-dd.DragDrop-method-lock'>    /**
+<span id='Ext-dd-DragDrop-method-lock'>    /**
 </span>     * Lock this instance
      * @method lock
      */
@@ -182,7 +199,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.locked = true;
     },
 
-<span id='Ext-dd.DragDrop-property-moveOnly'>    /**
+<span id='Ext-dd-DragDrop-property-moveOnly'>    /**
 </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
@@ -190,7 +207,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     moveOnly: false,
 
-<span id='Ext-dd.DragDrop-method-unlock'>    /**
+<span id='Ext-dd-DragDrop-method-unlock'>    /**
 </span>     * Unlock this instace
      * @method unlock
      */
@@ -198,7 +215,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.locked = false;
     },
 
-<span id='Ext-dd.DragDrop-property-isTarget'>    /**
+<span id='Ext-dd-DragDrop-property-isTarget'>    /**
 </span>     * By default, all instances can be a drop target.  This can be disabled by
      * setting isTarget to false.
      * @property isTarget
@@ -206,29 +223,29 @@ Ext.define('Ext.dd.DragDrop', {
      */
     isTarget: true,
 
-<span id='Ext-dd.DragDrop-property-padding'>    /**
+<span id='Ext-dd-DragDrop-property-padding'>    /**
 </span>     * The padding configured for this drag and drop object for calculating
      * the drop zone intersection with this object.
-     * @property padding
-     * @type int[] An array containing the 4 padding values: [top, right, bottom, left]
+     * An array containing the 4 padding values: [top, right, bottom, left]
+     * @property {[int]} padding
      */
     padding: null,
 
-<span id='Ext-dd.DragDrop-property-_domRef'>    /**
+<span id='Ext-dd-DragDrop-property-_domRef'>    /**
 </span>     * Cached reference to the linked element
      * @property _domRef
      * @private
      */
     _domRef: null,
 
-<span id='Ext-dd.DragDrop-property-__ygDragDrop'>    /**
+<span id='Ext-dd-DragDrop-property-__ygDragDrop'>    /**
 </span>     * Internal typeof flag
      * @property __ygDragDrop
      * @private
      */
     __ygDragDrop: true,
 
-<span id='Ext-dd.DragDrop-property-constrainX'>    /**
+<span id='Ext-dd-DragDrop-property-constrainX'>    /**
 </span>     * Set to true when horizontal contraints are applied
      * @property constrainX
      * @type boolean
@@ -236,7 +253,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     constrainX: false,
 
-<span id='Ext-dd.DragDrop-property-constrainY'>    /**
+<span id='Ext-dd-DragDrop-property-constrainY'>    /**
 </span>     * Set to true when vertical contraints are applied
      * @property constrainY
      * @type boolean
@@ -244,7 +261,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     constrainY: false,
 
-<span id='Ext-dd.DragDrop-property-minX'>    /**
+<span id='Ext-dd-DragDrop-property-minX'>    /**
 </span>     * The left constraint
      * @property minX
      * @type int
@@ -252,7 +269,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     minX: 0,
 
-<span id='Ext-dd.DragDrop-property-maxX'>    /**
+<span id='Ext-dd-DragDrop-property-maxX'>    /**
 </span>     * The right constraint
      * @property maxX
      * @type int
@@ -260,7 +277,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     maxX: 0,
 
-<span id='Ext-dd.DragDrop-property-minY'>    /**
+<span id='Ext-dd-DragDrop-property-minY'>    /**
 </span>     * The up constraint
      * @property minY
      * @type int
@@ -268,7 +285,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     minY: 0,
 
-<span id='Ext-dd.DragDrop-property-maxY'>    /**
+<span id='Ext-dd-DragDrop-property-maxY'>    /**
 </span>     * The down constraint
      * @property maxY
      * @type int
@@ -276,7 +293,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     maxY: 0,
 
-<span id='Ext-dd.DragDrop-property-maintainOffset'>    /**
+<span id='Ext-dd-DragDrop-property-maintainOffset'>    /**
 </span>     * Maintain offsets when we resetconstraints.  Set to true when you want
      * the position of the element relative to its parent to stay the same
      * when the page changes
@@ -286,25 +303,23 @@ Ext.define('Ext.dd.DragDrop', {
      */
     maintainOffset: false,
 
-<span id='Ext-dd.DragDrop-property-xTicks'>    /**
+<span id='Ext-dd-DragDrop-property-xTicks'>    /**
 </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 xTicks
-     * @type int[]
+     * @property {[int]} xTicks
      */
     xTicks: null,
 
-<span id='Ext-dd.DragDrop-property-yTicks'>    /**
+<span id='Ext-dd-DragDrop-property-yTicks'>    /**
 </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 yTicks
-     * @type int[]
+     * @property {[int]} yTicks
      */
     yTicks: null,
 
-<span id='Ext-dd.DragDrop-property-primaryButtonOnly'>    /**
+<span id='Ext-dd-DragDrop-property-primaryButtonOnly'>    /**
 </span>     * By default the drag and drop instance will only respond to the primary
      * button click (left button for a right-handed mouse).  Set to true to
      * allow drag and drop to start with any mouse click that is propogated
@@ -314,14 +329,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     primaryButtonOnly: true,
 
-<span id='Ext-dd.DragDrop-property-available'>    /**
+<span id='Ext-dd-DragDrop-property-available'>    /**
 </span>     * The available property is false until the linked dom element is accessible.
      * @property available
      * @type boolean
      */
     available: false,
 
-<span id='Ext-dd.DragDrop-property-hasOuterHandles'>    /**
+<span id='Ext-dd-DragDrop-property-hasOuterHandles'>    /**
 </span>     * By default, drags can only be initiated if the mousedown occurs in the
      * region the linked element is.  This is done in part to work around a
      * bug in some browsers that mis-report the mousedown if the previous
@@ -334,14 +349,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     hasOuterHandles: false,
 
-<span id='Ext-dd.DragDrop-method-b4StartDrag'>    /**
+<span id='Ext-dd-DragDrop-method-b4StartDrag'>    /**
 </span>     * Code that executes immediately before the startDrag event
      * @method b4StartDrag
      * @private
      */
     b4StartDrag: function(x, y) { },
 
-<span id='Ext-dd.DragDrop-method-startDrag'>    /**
+<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.
      * @method startDrag
@@ -350,14 +365,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     startDrag: function(x, y) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4Drag'>    /**
+<span id='Ext-dd-DragDrop-method-b4Drag'>    /**
 </span>     * Code that executes immediately before the onDrag event
      * @method b4Drag
      * @private
      */
     b4Drag: function(e) { },
 
-<span id='Ext-dd.DragDrop-method-onDrag'>    /**
+<span id='Ext-dd-DragDrop-method-onDrag'>    /**
 </span>     * Abstract method called during the onMouseMove event while dragging an
      * object.
      * @method onDrag
@@ -365,7 +380,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onDrag: function(e) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-onDragEnter'>    /**
+<span id='Ext-dd-DragDrop-method-onDragEnter'>    /**
 </span>     * Abstract method called when this element fist begins hovering over
      * another DragDrop obj
      * @method onDragEnter
@@ -376,14 +391,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onDragEnter: function(e, id) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4DragOver'>    /**
+<span id='Ext-dd-DragDrop-method-b4DragOver'>    /**
 </span>     * Code that executes immediately before the onDragOver event
      * @method b4DragOver
      * @private
      */
     b4DragOver: function(e) { },
 
-<span id='Ext-dd.DragDrop-method-onDragOver'>    /**
+<span id='Ext-dd-DragDrop-method-onDragOver'>    /**
 </span>     * Abstract method called when this element is hovering over another
      * DragDrop obj
      * @method onDragOver
@@ -394,14 +409,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onDragOver: function(e, id) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4DragOut'>    /**
+<span id='Ext-dd-DragDrop-method-b4DragOut'>    /**
 </span>     * Code that executes immediately before the onDragOut event
      * @method b4DragOut
      * @private
      */
     b4DragOut: function(e) { },
 
-<span id='Ext-dd.DragDrop-method-onDragOut'>    /**
+<span id='Ext-dd-DragDrop-method-onDragOut'>    /**
 </span>     * Abstract method called when we are no longer hovering over an element
      * @method onDragOut
      * @param {Event} e the mousemove event
@@ -411,14 +426,14 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onDragOut: function(e, id) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4DragDrop'>    /**
+<span id='Ext-dd-DragDrop-method-b4DragDrop'>    /**
 </span>     * Code that executes immediately before the onDragDrop event
      * @method b4DragDrop
      * @private
      */
     b4DragDrop: function(e) { },
 
-<span id='Ext-dd.DragDrop-method-onDragDrop'>    /**
+<span id='Ext-dd-DragDrop-method-onDragDrop'>    /**
 </span>     * Abstract method called when this item is dropped on another DragDrop
      * obj
      * @method onDragDrop
@@ -429,7 +444,7 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onDragDrop: function(e, id) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-onInvalidDrop'>    /**
+<span id='Ext-dd-DragDrop-method-onInvalidDrop'>    /**
 </span>     * Abstract method called when this item is dropped on an area with no
      * drop target
      * @method onInvalidDrop
@@ -437,21 +452,21 @@ Ext.define('Ext.dd.DragDrop', {
      */
     onInvalidDrop: function(e) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4EndDrag'>    /**
+<span id='Ext-dd-DragDrop-method-b4EndDrag'>    /**
 </span>     * Code that executes immediately before the endDrag event
      * @method b4EndDrag
      * @private
      */
     b4EndDrag: function(e) { },
 
-<span id='Ext-dd.DragDrop-method-endDrag'>    /**
+<span id='Ext-dd-DragDrop-method-endDrag'>    /**
 </span>     * Fired when we are done dragging the object
      * @method endDrag
      * @param {Event} e the mouseup event
      */
     endDrag: function(e) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-b4MouseDown'>    /**
+<span id='Ext-dd-DragDrop-method-b4MouseDown'>    /**
 </span>     * Code executed immediately before the onMouseDown event
      * @method b4MouseDown
      * @param {Event} e the mousedown event
@@ -459,21 +474,21 @@ Ext.define('Ext.dd.DragDrop', {
      */
     b4MouseDown: function(e) {  },
 
-<span id='Ext-dd.DragDrop-method-onMouseDown'>    /**
+<span id='Ext-dd-DragDrop-method-onMouseDown'>    /**
 </span>     * Event handler that fires when a drag/drop obj gets a mousedown
      * @method onMouseDown
      * @param {Event} e the mousedown event
      */
     onMouseDown: function(e) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-onMouseUp'>    /**
+<span id='Ext-dd-DragDrop-method-onMouseUp'>    /**
 </span>     * Event handler that fires when a drag/drop obj gets a mouseup
      * @method onMouseUp
      * @param {Event} e the mouseup event
      */
     onMouseUp: function(e) { /* override this */ },
 
-<span id='Ext-dd.DragDrop-method-onAvailable'>    /**
+<span id='Ext-dd-DragDrop-method-onAvailable'>    /**
 </span>     * Override the onAvailable method to do what is needed after the initial
      * position was determined.
      * @method onAvailable
@@ -481,7 +496,7 @@ Ext.define('Ext.dd.DragDrop', {
     onAvailable: function () {
     },
 
-<span id='Ext-dd.DragDrop-property-defaultPadding'>    /**
+<span id='Ext-dd-DragDrop-property-defaultPadding'>    /**
 </span>     * Provides default constraint padding to &quot;constrainTo&quot; elements (defaults to {left: 0, right:0, top:0, bottom:0}).
      * @type Object
      */
@@ -492,7 +507,7 @@ Ext.define('Ext.dd.DragDrop', {
         bottom: 0
     },
 
-<span id='Ext-dd.DragDrop-method-constrainTo'>    /**
+<span id='Ext-dd-DragDrop-method-constrainTo'>    /**
 </span>     * Initializes the drag drop object's constraints to restrict movement to a certain element.
  *
  * Usage:
@@ -549,7 +564,7 @@ Ext.define('Ext.dd.DragDrop', {
         );
     },
 
-<span id='Ext-dd.DragDrop-method-getEl'>    /**
+<span id='Ext-dd-DragDrop-method-getEl'>    /**
 </span>     * Returns a reference to the linked element
      * @method getEl
      * @return {HTMLElement} the html element
@@ -562,7 +577,7 @@ Ext.define('Ext.dd.DragDrop', {
         return this._domRef;
     },
 
-<span id='Ext-dd.DragDrop-method-getDragEl'>    /**
+<span id='Ext-dd-DragDrop-method-getDragEl'>    /**
 </span>     * Returns a reference to the actual element to drag.  By default this is
      * the same as the html element, but it can be assigned to another
      * element. An example of this can be found in Ext.dd.DDProxy
@@ -573,7 +588,7 @@ Ext.define('Ext.dd.DragDrop', {
         return Ext.getDom(this.dragElId);
     },
 
-<span id='Ext-dd.DragDrop-method-init'>    /**
+<span id='Ext-dd-DragDrop-method-init'>    /**
 </span>     * Sets up the DragDrop object.  Must be called in the constructor of any
      * Ext.dd.DragDrop subclass
      * @method init
@@ -587,7 +602,7 @@ Ext.define('Ext.dd.DragDrop', {
         // Ext.EventManager.on(this.id, &quot;selectstart&quot;, Event.preventDefault);
     },
 
-<span id='Ext-dd.DragDrop-method-initTarget'>    /**
+<span id='Ext-dd-DragDrop-method-initTarget'>    /**
 </span>     * Initializes Targeting functionality only... the object does not
      * get a mousedown handler.
      * @method initTarget
@@ -634,7 +649,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.handleOnAvailable();
     },
 
-<span id='Ext-dd.DragDrop-method-applyConfig'>    /**
+<span id='Ext-dd-DragDrop-method-applyConfig'>    /**
 </span>     * Applies the configuration parameters that were passed into the constructor.
      * This is supposed to happen at each level through the inheritance chain.  So
      * a DDProxy implentation will execute apply config on DDProxy, DD, and
@@ -653,7 +668,7 @@ Ext.define('Ext.dd.DragDrop', {
 
     },
 
-<span id='Ext-dd.DragDrop-method-handleOnAvailable'>    /**
+<span id='Ext-dd-DragDrop-method-handleOnAvailable'>    /**
 </span>     * Executed when the linked element is available
      * @method handleOnAvailable
      * @private
@@ -664,7 +679,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.onAvailable();
     },
 
-<span id='Ext-dd.DragDrop-method-setPadding'>     /**
+<span id='Ext-dd-DragDrop-method-setPadding'>     /**
 </span>     * Configures the padding for the target zone in px.  Effectively expands
      * (or reduces) the virtual object size for targeting calculations.
      * Supports css-style shorthand; if only one parameter is passed, all sides
@@ -687,7 +702,7 @@ Ext.define('Ext.dd.DragDrop', {
         }
     },
 
-<span id='Ext-dd.DragDrop-method-setInitPosition'>    /**
+<span id='Ext-dd-DragDrop-method-setInitPosition'>    /**
 </span>     * Stores the initial placement of the linked element.
      * @method setInitPosition
      * @param {int} diffX   the X offset, default 0
@@ -714,7 +729,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.setStartPosition(p);
     },
 
-<span id='Ext-dd.DragDrop-method-setStartPosition'>    /**
+<span id='Ext-dd-DragDrop-method-setStartPosition'>    /**
 </span>     * Sets the start position of the element.  This is set when the obj
      * is initialized, the reset when a drag is started.
      * @method setStartPosition
@@ -729,7 +744,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.startPageY = p[1];
     },
 
-<span id='Ext-dd.DragDrop-method-addToGroup'>    /**
+<span id='Ext-dd-DragDrop-method-addToGroup'>    /**
 </span>     * Add this instance to a group of related drag/drop objects.  All
      * instances belong to at least one group, and can belong to as many
      * groups as needed.
@@ -741,7 +756,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.DDMInstance.regDragDrop(this, sGroup);
     },
 
-<span id='Ext-dd.DragDrop-method-removeFromGroup'>    /**
+<span id='Ext-dd-DragDrop-method-removeFromGroup'>    /**
 </span>     * Remove's this instance from the supplied interaction group
      * @method removeFromGroup
      * @param {string}  sGroup  The group to drop
@@ -754,7 +769,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.DDMInstance.removeDDFromGroup(this, sGroup);
     },
 
-<span id='Ext-dd.DragDrop-method-setDragElId'>    /**
+<span id='Ext-dd-DragDrop-method-setDragElId'>    /**
 </span>     * Allows you to specify that an element other than the linked element
      * will be moved with the cursor during a drag
      * @method setDragElId
@@ -764,7 +779,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.dragElId = id;
     },
 
-<span id='Ext-dd.DragDrop-method-setHandleElId'>    /**
+<span id='Ext-dd-DragDrop-method-setHandleElId'>    /**
 </span>     * Allows you to specify a child of the linked element that should be
      * used to initiate the drag operation.  An example of this would be if
      * you have a content div with text and links.  Clicking anywhere in the
@@ -783,7 +798,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.DDMInstance.regHandle(this.id, id);
     },
 
-<span id='Ext-dd.DragDrop-method-setOuterHandleElId'>    /**
+<span id='Ext-dd-DragDrop-method-setOuterHandleElId'>    /**
 </span>     * Allows you to set an element outside of the linked element as a drag
      * handle
      * @method setOuterHandleElId
@@ -799,7 +814,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.hasOuterHandles = true;
     },
 
-<span id='Ext-dd.DragDrop-method-unreg'>    /**
+<span id='Ext-dd-DragDrop-method-unreg'>    /**
 </span>     * Remove all drag and drop hooks for this element
      * @method unreg
      */
@@ -813,7 +828,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.unreg();
     },
 
-<span id='Ext-dd.DragDrop-method-isLocked'>    /**
+<span id='Ext-dd-DragDrop-method-isLocked'>    /**
 </span>     * Returns true if this instance is locked, or the drag drop mgr is locked
      * (meaning that all drag/drop is disabled on the page.)
      * @method isLocked
@@ -824,7 +839,7 @@ Ext.define('Ext.dd.DragDrop', {
         return (this.DDMInstance.isLocked() || this.locked);
     },
 
-<span id='Ext-dd.DragDrop-method-handleMouseDown'>    /**
+<span id='Ext-dd-DragDrop-method-handleMouseDown'>    /**
 </span>     * Fired when this object is clicked
      * @method handleMouseDown
      * @param {Event} e
@@ -868,7 +883,7 @@ Ext.define('Ext.dd.DragDrop', {
                         this.DDMInstance.handleWasClicked(target, this.id)) );
     },
 
-<span id='Ext-dd.DragDrop-method-addInvalidHandleType'>    /**
+<span id='Ext-dd-DragDrop-method-addInvalidHandleType'>    /**
 </span>     * Allows you to specify a tag name that should not start a drag operation
      * when clicked.  This is designed to facilitate embedding links within a
      * drag handle that do something other than start the drag.
@@ -880,7 +895,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.invalidHandleTypes[type] = type;
     },
 
-<span id='Ext-dd.DragDrop-method-addInvalidHandleId'>    /**
+<span id='Ext-dd-DragDrop-method-addInvalidHandleId'>    /**
 </span>     * Lets you to specify an element id for a child of a drag handle
      * that should not initiate a drag
      * @method addInvalidHandleId
@@ -893,7 +908,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.invalidHandleIds[id] = id;
     },
 
-<span id='Ext-dd.DragDrop-method-addInvalidHandleClass'>    /**
+<span id='Ext-dd-DragDrop-method-addInvalidHandleClass'>    /**
 </span>     * Lets you specify a css class of elements that will not initiate a drag
      * @method addInvalidHandleClass
      * @param {string} cssClass the class of the elements you wish to ignore
@@ -902,7 +917,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.invalidHandleClasses.push(cssClass);
     },
 
-<span id='Ext-dd.DragDrop-method-removeInvalidHandleType'>    /**
+<span id='Ext-dd-DragDrop-method-removeInvalidHandleType'>    /**
 </span>     * Unsets an excluded tag name set by addInvalidHandleType
      * @method removeInvalidHandleType
      * @param {string} tagName the type of element to unexclude
@@ -913,7 +928,7 @@ Ext.define('Ext.dd.DragDrop', {
         delete this.invalidHandleTypes[type];
     },
 
-<span id='Ext-dd.DragDrop-method-removeInvalidHandleId'>    /**
+<span id='Ext-dd-DragDrop-method-removeInvalidHandleId'>    /**
 </span>     * Unsets an invalid handle id
      * @method removeInvalidHandleId
      * @param {string} id the id of the element to re-enable
@@ -925,7 +940,7 @@ Ext.define('Ext.dd.DragDrop', {
         delete this.invalidHandleIds[id];
     },
 
-<span id='Ext-dd.DragDrop-method-removeInvalidHandleClass'>    /**
+<span id='Ext-dd-DragDrop-method-removeInvalidHandleClass'>    /**
 </span>     * Unsets an invalid css class
      * @method removeInvalidHandleClass
      * @param {string} cssClass the class of the element(s) you wish to
@@ -939,7 +954,7 @@ Ext.define('Ext.dd.DragDrop', {
         }
     },
 
-<span id='Ext-dd.DragDrop-method-isValidHandleChild'>    /**
+<span id='Ext-dd-DragDrop-method-isValidHandleChild'>    /**
 </span>     * Checks the tag exclusion list to see if this click should be ignored
      * @method isValidHandleChild
      * @param {HTMLElement} node the HTMLElement to evaluate
@@ -967,7 +982,7 @@ Ext.define('Ext.dd.DragDrop', {
 
     },
 
-<span id='Ext-dd.DragDrop-method-setXTicks'>    /**
+<span id='Ext-dd-DragDrop-method-setXTicks'>    /**
 </span>     * Create the array of horizontal tick marks if an interval was specified
      * in setXConstraint().
      * @method setXTicks
@@ -996,7 +1011,7 @@ Ext.define('Ext.dd.DragDrop', {
         Ext.Array.sort(this.xTicks, this.DDMInstance.numericSort);
     },
 
-<span id='Ext-dd.DragDrop-method-setYTicks'>    /**
+<span id='Ext-dd-DragDrop-method-setYTicks'>    /**
 </span>     * Create the array of vertical tick marks if an interval was specified in
      * setYConstraint().
      * @method setYTicks
@@ -1025,7 +1040,7 @@ Ext.define('Ext.dd.DragDrop', {
         Ext.Array.sort(this.yTicks, this.DDMInstance.numericSort);
     },
 
-<span id='Ext-dd.DragDrop-method-setXConstraint'>    /**
+<span id='Ext-dd-DragDrop-method-setXConstraint'>    /**
 </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.
@@ -1048,7 +1063,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.constrainX = true;
     },
 
-<span id='Ext-dd.DragDrop-method-clearConstraints'>    /**
+<span id='Ext-dd-DragDrop-method-clearConstraints'>    /**
 </span>     * Clears any constraints applied to this instance.  Also clears ticks
      * since they can't exist independent of a constraint at this time.
      * @method clearConstraints
@@ -1059,7 +1074,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.clearTicks();
     },
 
-<span id='Ext-dd.DragDrop-method-clearTicks'>    /**
+<span id='Ext-dd-DragDrop-method-clearTicks'>    /**
 </span>     * Clears any tick interval defined for this instance
      * @method clearTicks
      */
@@ -1070,7 +1085,7 @@ Ext.define('Ext.dd.DragDrop', {
         this.yTickSize = 0;
     },
 
-<span id='Ext-dd.DragDrop-method-setYConstraint'>    /**
+<span id='Ext-dd-DragDrop-method-setYConstraint'>    /**
 </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.
@@ -1092,7 +1107,7 @@ Ext.define('Ext.dd.DragDrop', {
 
     },
 
-<span id='Ext-dd.DragDrop-method-resetConstraints'>    /**
+<span id='Ext-dd-DragDrop-method-resetConstraints'>    /**
 </span>     * resetConstraints must be called if you manually reposition a dd element.
      * @method resetConstraints
      * @param {boolean} maintainOffset
@@ -1124,7 +1139,7 @@ Ext.define('Ext.dd.DragDrop', {
         }
     },
 
-<span id='Ext-dd.DragDrop-method-getTick'>    /**
+<span id='Ext-dd-DragDrop-method-getTick'>    /**
 </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.
@@ -1159,7 +1174,7 @@ Ext.define('Ext.dd.DragDrop', {
         }
     },
 
-<span id='Ext-dd.DragDrop-method-toString'>    /**
+<span id='Ext-dd-DragDrop-method-toString'>    /**
 </span>     * toString method
      * @method toString
      * @return {string} string representation of the dd obj
@@ -1168,4 +1183,6 @@ Ext.define('Ext.dd.DragDrop', {
         return (&quot;DragDrop &quot; + this.id);
     }
 
-});</pre></pre></body></html>
\ No newline at end of file
+});</pre>
+</body>
+</html>