X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/src/dd/DragSource.js?ds=sidebyside

diff --git a/src/dd/DragSource.js b/src/dd/DragSource.js
index 19fe4c3c..e3daf013 100644
--- a/src/dd/DragSource.js
+++ b/src/dd/DragSource.js
@@ -1,9 +1,3 @@
-/*!
- * Ext JS Library 3.3.1
- * Copyright(c) 2006-2010 Sencha Inc.
- * licensing@sencha.com
- * http://www.sencha.com/license
- */
 /**
  * @class Ext.dd.DragSource
  * @extends Ext.dd.DDProxy
@@ -12,39 +6,62 @@
  * @param {Mixed} el The container element
  * @param {Object} config
  */
-Ext.dd.DragSource = function(el, config){
-    this.el = Ext.get(el);
-    if(!this.dragData){
-        this.dragData = {};
-    }
-    
-    Ext.apply(this, config);
-    
-    if(!this.proxy){
-        this.proxy = new Ext.dd.StatusProxy();
-    }
-    Ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
-          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
-    
-    this.dragging = false;
-};
+Ext.define('Ext.dd.DragSource', {
+    extend: 'Ext.dd.DDProxy',
+    requires: [
+        'Ext.dd.StatusProxy',
+        'Ext.dd.DragDropManager'
+    ],
 
-Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
     /**
      * @cfg {String} ddGroup
      * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
      * interact with other drag drop objects in the same group (defaults to undefined).
      */
+
     /**
      * @cfg {String} dropAllowed
      * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
      */
-    dropAllowed : "x-dd-drop-ok",
+
+    dropAllowed : Ext.baseCSSPrefix + 'dd-drop-ok',
     /**
      * @cfg {String} dropNotAllowed
      * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
      */
-    dropNotAllowed : "x-dd-drop-nodrop",
+    dropNotAllowed : Ext.baseCSSPrefix + 'dd-drop-nodrop',
+
+    /**
+     * @cfg {Boolean} animRepair
+     * Defaults to true. If true, animates the proxy element back to the position of the handle element used to trigger the drag.
+     */
+    animRepair: true,
+
+    /**
+     * @cfg {String} repairHighlightColor The color to use when visually highlighting the drag source in the afterRepair
+     * method after a failed drop (defaults to 'c3daf9' - light blue). The color must be a 6 digit hex value, without
+     * a preceding '#'.
+     */
+    repairHighlightColor: 'c3daf9',
+
+    constructor: function(el, config) {
+        this.el = Ext.get(el);
+        if(!this.dragData){
+            this.dragData = {};
+        }
+
+        Ext.apply(this, config);
+
+        if(!this.proxy){
+            this.proxy = Ext.create('Ext.dd.StatusProxy', {
+                animRepair: this.animRepair
+            });
+        }
+        this.callParent([this.el.dom, this.ddGroup || this.group,
+              {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true}]);
+
+        this.dragging = false;
+    },
 
     /**
      * Returns the data object associated with this drag source
@@ -56,17 +73,17 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
 
     // private
     onDragEnter : function(e, id){
-        var target = Ext.dd.DragDropMgr.getDDById(id);
+        var target = Ext.dd.DragDropManager.getDDById(id);
         this.cachedTarget = target;
-        if(this.beforeDragEnter(target, e, id) !== false){
-            if(target.isNotifyTarget){
+        if (this.beforeDragEnter(target, e, id) !== false) {
+            if (target.isNotifyTarget) {
                 var status = target.notifyEnter(this, e, this.dragData);
                 this.proxy.setStatus(status);
-            }else{
+            } else {
                 this.proxy.setStatus(this.dropAllowed);
             }
-            
-            if(this.afterDragEnter){
+
+            if (this.afterDragEnter) {
                 /**
                  * An empty function by default, but provided so that you can perform a custom action
                  * when the dragged item enters the drop target by providing an implementation.
@@ -88,26 +105,26 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {String} id The id of the dragged element
      * @return {Boolean} isValid True if the drag event is valid, else false to cancel
      */
-    beforeDragEnter : function(target, e, id){
+    beforeDragEnter: function(target, e, id) {
         return true;
     },
 
     // private
     alignElWithMouse: function() {
-        Ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.callParent(arguments);
         this.proxy.sync();
     },
 
     // private
-    onDragOver : function(e, id){
-        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
-        if(this.beforeDragOver(target, e, id) !== false){
+    onDragOver: function(e, id) {
+        var target = this.cachedTarget || Ext.dd.DragDropManager.getDDById(id);
+        if (this.beforeDragOver(target, e, id) !== false) {
             if(target.isNotifyTarget){
                 var status = target.notifyOver(this, e, this.dragData);
                 this.proxy.setStatus(status);
             }
 
-            if(this.afterDragOver){
+            if (this.afterDragOver) {
                 /**
                  * An empty function by default, but provided so that you can perform a custom action
                  * while the dragged item is over the drop target by providing an implementation.
@@ -129,19 +146,19 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {String} id The id of the dragged element
      * @return {Boolean} isValid True if the drag event is valid, else false to cancel
      */
-    beforeDragOver : function(target, e, id){
+    beforeDragOver: function(target, e, id) {
         return true;
     },
 
     // private
-    onDragOut : function(e, id){
-        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
-        if(this.beforeDragOut(target, e, id) !== false){
-            if(target.isNotifyTarget){
+    onDragOut: function(e, id) {
+        var target = this.cachedTarget || Ext.dd.DragDropManager.getDDById(id);
+        if (this.beforeDragOut(target, e, id) !== false) {
+            if (target.isNotifyTarget) {
                 target.notifyOut(this, e, this.dragData);
             }
             this.proxy.reset();
-            if(this.afterDragOut){
+            if (this.afterDragOut) {
                 /**
                  * An empty function by default, but provided so that you can perform a custom action
                  * after the dragged item is dragged out of the target without dropping.
@@ -164,25 +181,25 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {String} id The id of the dragged element
      * @return {Boolean} isValid True if the drag event is valid, else false to cancel
      */
-    beforeDragOut : function(target, e, id){
+    beforeDragOut: function(target, e, id){
         return true;
     },
-    
+
     // private
-    onDragDrop : function(e, id){
-        var target = this.cachedTarget || Ext.dd.DragDropMgr.getDDById(id);
-        if(this.beforeDragDrop(target, e, id) !== false){
-            if(target.isNotifyTarget){
-                if(target.notifyDrop(this, e, this.dragData)){ // valid drop?
+    onDragDrop: function(e, id){
+        var target = this.cachedTarget || Ext.dd.DragDropManager.getDDById(id);
+        if (this.beforeDragDrop(target, e, id) !== false) {
+            if (target.isNotifyTarget) {
+                if (target.notifyDrop(this, e, this.dragData) !== false) { // valid drop?
                     this.onValidDrop(target, e, id);
-                }else{
+                } else {
                     this.onInvalidDrop(target, e, id);
                 }
-            }else{
+            } else {
                 this.onValidDrop(target, e, id);
             }
-            
-            if(this.afterDragDrop){
+
+            if (this.afterDragDrop) {
                 /**
                  * An empty function by default, but provided so that you can perform a custom action
                  * after a valid drag drop has occurred by providing an implementation.
@@ -205,18 +222,18 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {String} id The id of the dragged element
      * @return {Boolean} isValid True if the drag drop event is valid, else false to cancel
      */
-    beforeDragDrop : function(target, e, id){
+    beforeDragDrop: function(target, e, id){
         return true;
     },
 
     // private
-    onValidDrop : function(target, e, id){
+    onValidDrop: function(target, e, id){
         this.hideProxy();
         if(this.afterValidDrop){
             /**
              * An empty function by default, but provided so that you can perform a custom action
              * after a valid drop has occurred by providing an implementation.
-             * @param {Object} target The target DD 
+             * @param {Object} target The target DD
              * @param {Event} e The event object
              * @param {String} id The id of the dropped element
              * @method afterInvalidDrop
@@ -226,14 +243,14 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
     },
 
     // private
-    getRepairXY : function(e, data){
-        return this.el.getXY();  
+    getRepairXY: function(e, data){
+        return this.el.getXY();
     },
 
     // private
-    onInvalidDrop : function(target, e, id){
+    onInvalidDrop: function(target, e, id) {
         this.beforeInvalidDrop(target, e, id);
-        if(this.cachedTarget){
+        if (this.cachedTarget) {
             if(this.cachedTarget.isNotifyTarget){
                 this.cachedTarget.notifyOut(this, e, this.dragData);
             }
@@ -241,7 +258,7 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
         }
         this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
 
-        if(this.afterInvalidDrop){
+        if (this.afterInvalidDrop) {
             /**
              * An empty function by default, but provided so that you can perform a custom action
              * after an invalid drop has occurred by providing an implementation.
@@ -254,11 +271,12 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
     },
 
     // private
-    afterRepair : function(){
-        if(Ext.enableFx){
-            this.el.highlight(this.hlColor || "c3daf9");
+    afterRepair: function() {
+        var me = this;
+        if (Ext.enableFx) {
+            me.el.highlight(me.repairHighlightColor);
         }
-        this.dragging = false;
+        me.dragging = false;
     },
 
     /**
@@ -269,21 +287,21 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {String} id The id of the dragged element
      * @return {Boolean} isValid True if the invalid drop should proceed, else false to cancel
      */
-    beforeInvalidDrop : function(target, e, id){
+    beforeInvalidDrop: function(target, e, id) {
         return true;
     },
 
     // private
-    handleMouseDown : function(e){
-        if(this.dragging) {
+    handleMouseDown: function(e) {
+        if (this.dragging) {
             return;
         }
         var data = this.getDragData(e);
-        if(data && this.onBeforeDrag(data, e) !== false){
+        if (data && this.onBeforeDrag(data, e) !== false) {
             this.dragData = data;
             this.proxy.stop();
-            Ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
-        } 
+            this.callParent(arguments);
+        }
     },
 
     /**
@@ -293,7 +311,7 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {Event} e The event object
      * @return {Boolean} isValid True if the drag event is valid, else false to cancel
      */
-    onBeforeDrag : function(data, e){
+    onBeforeDrag: function(data, e){
         return true;
     },
 
@@ -303,10 +321,10 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * @param {Number} x The x position of the click on the dragged object
      * @param {Number} y The y position of the click on the dragged object
      */
-    onStartDrag : Ext.emptyFn,
+    onStartDrag: Ext.emptyFn,
 
     // private override
-    startDrag : function(x, y){
+    startDrag: function(x, y) {
         this.proxy.reset();
         this.dragging = true;
         this.proxy.update("");
@@ -315,7 +333,7 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
     },
 
     // private
-    onInitDrag : function(x, y){
+    onInitDrag: function(x, y) {
         var clone = this.el.dom.cloneNode(true);
         clone.id = Ext.id(); // prevent duplicate ids
         this.proxy.update(clone);
@@ -327,21 +345,21 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
      * Returns the drag source's underlying {@link Ext.dd.StatusProxy}
      * @return {Ext.dd.StatusProxy} proxy The StatusProxy
      */
-    getProxy : function(){
-        return this.proxy;  
+    getProxy: function() {
+        return this.proxy;
     },
 
     /**
      * Hides the drag source's {@link Ext.dd.StatusProxy}
      */
-    hideProxy : function(){
-        this.proxy.hide();  
+    hideProxy: function() {
+        this.proxy.hide();
         this.proxy.reset(true);
         this.dragging = false;
     },
 
     // private
-    triggerCacheRefresh : function(){
+    triggerCacheRefresh: function() {
         Ext.dd.DDM.refreshCache(this.groups);
     },
 
@@ -357,14 +375,14 @@ Ext.extend(Ext.dd.DragSource, Ext.dd.DDProxy, {
     // private
     onEndDrag : function(data, e){
     },
-    
+
     // private - pin to cursor
     autoOffset : function(x, y) {
         this.setDelta(-12, -20);
     },
-    
+
     destroy: function(){
-        Ext.dd.DragSource.superclass.destroy.call(this);
+        this.callParent();
         Ext.destroy(this.proxy);
     }
-});
\ No newline at end of file
+});