Upgrade to ExtJS 3.3.1 - Released 11/30/2010
[extjs.git] / docs / source / DragTracker.html
index 67a4651..be2261f 100644 (file)
@@ -7,20 +7,20 @@
 </head>
 <body  onload="prettyPrint();">
     <pre class="prettyprint lang-js">/*!
 </head>
 <body  onload="prettyPrint();">
     <pre class="prettyprint lang-js">/*!
- * Ext JS Library 3.2.0
- * Copyright(c) 2006-2010 Ext JS, Inc.
- * licensing@extjs.com
- * http://www.extjs.com/license
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
  */
 <div id="cls-Ext.dd.DragTracker"></div>/**
  * @class Ext.dd.DragTracker
  * @extends Ext.util.Observable
  * A DragTracker listens for drag events on an Element and fires events at the start and end of the drag,
  */
 <div id="cls-Ext.dd.DragTracker"></div>/**
  * @class Ext.dd.DragTracker
  * @extends Ext.util.Observable
  * A DragTracker listens for drag events on an Element and fires events at the start and end of the drag,
- * as well as during the drag. This is useful for components such as {@link Ext.Slider}, where there is
+ * as well as during the drag. This is useful for components such as {@link Ext.slider.MultiSlider}, where there is
  * an element that can be dragged around to change the Slider's value.
  * DragTracker provides a series of template methods that should be overridden to provide functionality
  * in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd.
  * an element that can be dragged around to change the Slider's value.
  * DragTracker provides a series of template methods that should be overridden to provide functionality
  * in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd.
- * See {@link Ext.Slider}'s initEvents function for an example implementation.
+ * See {@link Ext.slider.MultiSlider}'s initEvents function for an example implementation.
  */
 Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
     <div id="cfg-Ext.dd.DragTracker-active"></div>/**
  */
 Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {    
     <div id="cfg-Ext.dd.DragTracker-active"></div>/**
@@ -64,7 +64,7 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
                <div id="event-Ext.dd.DragTracker-dragstart"></div>/**
                 * @event dragstart
                 * @param {Object} this
                <div id="event-Ext.dd.DragTracker-dragstart"></div>/**
                 * @event dragstart
                 * @param {Object} this
-                * @param {Object} startXY the page coordinates of the event
+                * @param {Object} e event object
                 */
                'dragstart',
                <div id="event-Ext.dd.DragTracker-dragend"></div>/**
                 */
                'dragstart',
                <div id="event-Ext.dd.DragTracker-dragend"></div>/**
@@ -97,6 +97,7 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
 
     destroy : function(){
         this.el.un('mousedown', this.onMouseDown, this);
 
     destroy : function(){
         this.el.un('mousedown', this.onMouseDown, this);
+        delete this.el;
     },
 
     onMouseDown: function(e, target){
     },
 
     onMouseDown: function(e, target){
@@ -106,12 +107,14 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
             if(this.preventDefault !== false){
                 e.preventDefault();
             }
             if(this.preventDefault !== false){
                 e.preventDefault();
             }
-            var doc = Ext.getDoc();
-            doc.on('mouseup', this.onMouseUp, this);
-            doc.on('mousemove', this.onMouseMove, this);
-            doc.on('selectstart', this.stopSelect, this);
+            Ext.getDoc().on({
+                scope: this,
+                mouseup: this.onMouseUp,
+                mousemove: this.onMouseMove,
+                selectstart: this.stopSelect
+            });
             if(this.autoStart){
             if(this.autoStart){
-                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this);
+                this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this, [e]);
             }
         }
     },
             }
         }
     },
@@ -129,7 +132,7 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
         this.lastXY = xy;
         if(!this.active){
             if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
         this.lastXY = xy;
         if(!this.active){
             if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){
-                this.triggerStart();
+                this.triggerStart(e);
             }else{
                 return;
             }
             }else{
                 return;
             }
@@ -140,13 +143,14 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
     },
 
     onMouseUp: function(e) {
     },
 
     onMouseUp: function(e) {
-        var doc = Ext.getDoc();
+        var doc = Ext.getDoc(),
+            wasActive = this.active;
+            
         doc.un('mousemove', this.onMouseMove, this);
         doc.un('mouseup', this.onMouseUp, this);
         doc.un('selectstart', this.stopSelect, this);
         e.preventDefault();
         this.clearStart();
         doc.un('mousemove', this.onMouseMove, this);
         doc.un('mouseup', this.onMouseUp, this);
         doc.un('selectstart', this.stopSelect, this);
         e.preventDefault();
         this.clearStart();
-        var wasActive = this.active;
         this.active = false;
         delete this.elRegion;
         this.fireEvent('mouseup', this, e);
         this.active = false;
         delete this.elRegion;
         this.fireEvent('mouseup', this, e);
@@ -156,11 +160,11 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
         }
     },
 
         }
     },
 
-    triggerStart: function(isTimer) {
+    triggerStart: function(e) {
         this.clearStart();
         this.active = true;
         this.clearStart();
         this.active = true;
-        this.onStart(this.startXY);
-        this.fireEvent('dragstart', this, this.startXY);
+        this.onStart(e);
+        this.fireEvent('dragstart', this, e);
     },
 
     clearStart : function() {
     },
 
     clearStart : function() {
@@ -187,7 +191,7 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
     <div id="method-Ext.dd.DragTracker-onStart"></div>/**
      * Template method which should be overridden by each DragTracker instance. Called when a drag operation starts
      * (e.g. the user has moved the tracked element beyond the specified tolerance)
     <div id="method-Ext.dd.DragTracker-onStart"></div>/**
      * Template method which should be overridden by each DragTracker instance. Called when a drag operation starts
      * (e.g. the user has moved the tracked element beyond the specified tolerance)
-     * @param {Array} xy x and y co-ordinates of the original location of the tracked element
+     * @param {Ext.EventObject} e The event object
      */
     onStart : function(xy) {
 
      */
     onStart : function(xy) {
 
@@ -228,8 +232,8 @@ Ext.dd.DragTracker = Ext.extend(Ext.util.Observable,  {
     },
 
     getOffset : function(constrain){
     },
 
     getOffset : function(constrain){
-        var xy = this.getXY(constrain);
-        var s = this.startXY;
+        var xy = this.getXY(constrain),
+            s = this.startXY;
         return [s[0]-xy[0], s[1]-xy[1]];
     },
 
         return [s[0]-xy[0], s[1]-xy[1]];
     },