Upgrade to ExtJS 3.2.1 - Released 04/27/2010
[extjs.git] / docs / source / ColumnDD.html
index 52eea4c..42d3c1b 100644 (file)
-<html>\r
-<head>\r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
-    <pre class="prettyprint lang-js">// private\r
-// This is a support class used internally by the Grid components\r
-Ext.grid.HeaderDragZone = function(grid, hd, hd2){\r
-    this.grid = grid;\r
-    this.view = grid.getView();\r
-    this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
-    Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);\r
-    if(hd2){\r
-        this.setHandleElId(Ext.id(hd));\r
-        this.setOuterHandleElId(Ext.id(hd2));\r
-    }\r
-    this.scroll = false;\r
-};\r
-Ext.extend(Ext.grid.HeaderDragZone, Ext.dd.DragZone, {\r
-    maxDragWidth: 120,\r
-    getDragData : function(e){\r
-        var t = Ext.lib.Event.getTarget(e);\r
-        var h = this.view.findHeaderCell(t);\r
-        if(h){\r
-            return {ddel: h.firstChild, header:h};\r
-        }\r
-        return false;\r
-    },\r
-\r
-    onInitDrag : function(e){\r
-        this.view.headersDisabled = true;\r
-        var clone = this.dragData.ddel.cloneNode(true);\r
-        clone.id = Ext.id();\r
-        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";\r
-        this.proxy.update(clone);\r
-        return true;\r
-    },\r
-\r
-    afterValidDrop : function(){\r
-        var v = this.view;\r
-        setTimeout(function(){\r
-            v.headersDisabled = false;\r
-        }, 50);\r
-    },\r
-\r
-    afterInvalidDrop : function(){\r
-        var v = this.view;\r
-        setTimeout(function(){\r
-            v.headersDisabled = false;\r
-        }, 50);\r
-    }\r
-});\r
-\r
-// private\r
-// This is a support class used internally by the Grid components\r
-Ext.grid.HeaderDropZone = function(grid, hd, hd2){\r
-    this.grid = grid;\r
-    this.view = grid.getView();\r
-    // split the proxies so they don't interfere with mouse events\r
-    this.proxyTop = Ext.DomHelper.append(document.body, {\r
-        cls:"col-move-top", html:"&#160;"\r
-    }, true);\r
-    this.proxyBottom = Ext.DomHelper.append(document.body, {\r
-        cls:"col-move-bottom", html:"&#160;"\r
-    }, true);\r
-    this.proxyTop.hide = this.proxyBottom.hide = function(){\r
-        this.setLeftTop(-100,-100);\r
-        this.setStyle("visibility", "hidden");\r
-    };\r
-    this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
-    // temporarily disabled\r
-    //Ext.dd.ScrollManager.register(this.view.scroller.dom);\r
-    Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);\r
-};\r
-Ext.extend(Ext.grid.HeaderDropZone, Ext.dd.DropZone, {\r
-    proxyOffsets : [-4, -9],\r
-    fly: Ext.Element.fly,\r
-\r
-    getTargetFromEvent : function(e){\r
-        var t = Ext.lib.Event.getTarget(e);\r
-        var cindex = this.view.findCellIndex(t);\r
-        if(cindex !== false){\r
-            return this.view.getHeaderCell(cindex);\r
-        }\r
-    },\r
-\r
-    nextVisible : function(h){\r
-        var v = this.view, cm = this.grid.colModel;\r
-        h = h.nextSibling;\r
-        while(h){\r
-            if(!cm.isHidden(v.getCellIndex(h))){\r
-                return h;\r
-            }\r
-            h = h.nextSibling;\r
-        }\r
-        return null;\r
-    },\r
-\r
-    prevVisible : function(h){\r
-        var v = this.view, cm = this.grid.colModel;\r
-        h = h.prevSibling;\r
-        while(h){\r
-            if(!cm.isHidden(v.getCellIndex(h))){\r
-                return h;\r
-            }\r
-            h = h.prevSibling;\r
-        }\r
-        return null;\r
-    },\r
-\r
-    positionIndicator : function(h, n, e){\r
-        var x = Ext.lib.Event.getPageX(e);\r
-        var r = Ext.lib.Dom.getRegion(n.firstChild);\r
-        var px, pt, py = r.top + this.proxyOffsets[1];\r
-        if((r.right - x) <= (r.right-r.left)/2){\r
-            px = r.right+this.view.borderWidth;\r
-            pt = "after";\r
-        }else{\r
-            px = r.left;\r
-            pt = "before";\r
-        }\r
-\r
-        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){\r
-            return false;\r
-        }\r
-\r
-        px +=  this.proxyOffsets[0];\r
-        this.proxyTop.setLeftTop(px, py);\r
-        this.proxyTop.show();\r
-        if(!this.bottomOffset){\r
-            this.bottomOffset = this.view.mainHd.getHeight();\r
-        }\r
-        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);\r
-        this.proxyBottom.show();\r
-        return pt;\r
-    },\r
-\r
-    onNodeEnter : function(n, dd, e, data){\r
-        if(data.header != n){\r
-            this.positionIndicator(data.header, n, e);\r
-        }\r
-    },\r
-\r
-    onNodeOver : function(n, dd, e, data){\r
-        var result = false;\r
-        if(data.header != n){\r
-            result = this.positionIndicator(data.header, n, e);\r
-        }\r
-        if(!result){\r
-            this.proxyTop.hide();\r
-            this.proxyBottom.hide();\r
-        }\r
-        return result ? this.dropAllowed : this.dropNotAllowed;\r
-    },\r
-\r
-    onNodeOut : function(n, dd, e, data){\r
-        this.proxyTop.hide();\r
-        this.proxyBottom.hide();\r
-    },\r
-\r
-    onNodeDrop : function(n, dd, e, data){\r
-        var h = data.header;\r
-        if(h != n){\r
-            var cm = this.grid.colModel;\r
-            var x = Ext.lib.Event.getPageX(e);\r
-            var r = Ext.lib.Dom.getRegion(n.firstChild);\r
-            var pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before";\r
-            var oldIndex = this.view.getCellIndex(h);\r
-            var newIndex = this.view.getCellIndex(n);\r
-            if(pt == "after"){\r
-                newIndex++;\r
-            }\r
-            if(oldIndex < newIndex){\r
-                newIndex--;\r
-            }\r
-            cm.moveColumn(oldIndex, newIndex);\r
-            this.grid.fireEvent("columnmove", oldIndex, newIndex);\r
-            return true;\r
-        }\r
-        return false;\r
-    }\r
-});\r
-\r
-\r
-Ext.grid.GridView.ColumnDragZone = function(grid, hd){\r
-    Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);\r
-    this.proxy.el.addClass('x-grid3-col-dd');\r
-};\r
-\r
-Ext.extend(Ext.grid.GridView.ColumnDragZone, Ext.grid.HeaderDragZone, {\r
-    handleMouseDown : function(e){\r
-\r
-    },\r
-\r
-    callHandleMouseDown : function(e){\r
-        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);\r
-    }\r
-});</pre>    \r
-</body>\r
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
+  <title>The source code</title>
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body  onload="prettyPrint();">
+    <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.2.1
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDragZone = Ext.extend(Ext.dd.DragZone, {
+    maxDragWidth: 120,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);
+        if(hd2){
+            this.setHandleElId(Ext.id(hd));
+            this.setOuterHandleElId(Ext.id(hd2));
+        }
+        this.scroll = false;
+    },
+    
+    getDragData : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            h = this.view.findHeaderCell(t);
+        if(h){
+            return {ddel: h.firstChild, header:h};
+        }
+        return false;
+    },
+
+    onInitDrag : function(e){
+        // keep the value here so we can restore it;
+        this.dragHeadersDisabled = this.view.headersDisabled;
+        this.view.headersDisabled = true;
+        var clone = this.dragData.ddel.cloneNode(true);
+        clone.id = Ext.id();
+        clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";
+        this.proxy.update(clone);
+        return true;
+    },
+
+    afterValidDrop : function(){
+        this.completeDrop();
+    },
+
+    afterInvalidDrop : function(){
+        this.completeDrop();
+    },
+    
+    completeDrop: function(){
+        var v = this.view,
+            disabled = this.dragHeadersDisabled;
+        setTimeout(function(){
+            v.headersDisabled = disabled;
+        }, 50);
+    }
+});
+
+// private
+// This is a support class used internally by the Grid components
+Ext.grid.HeaderDropZone = Ext.extend(Ext.dd.DropZone, {
+    proxyOffsets : [-4, -9],
+    fly: Ext.Element.fly,
+    
+    constructor : function(grid, hd, hd2){
+        this.grid = grid;
+        this.view = grid.getView();
+        // split the proxies so they don't interfere with mouse events
+        this.proxyTop = Ext.DomHelper.append(document.body, {
+            cls:"col-move-top", html:"&#160;"
+        }, true);
+        this.proxyBottom = Ext.DomHelper.append(document.body, {
+            cls:"col-move-bottom", html:"&#160;"
+        }, true);
+        this.proxyTop.hide = this.proxyBottom.hide = function(){
+            this.setLeftTop(-100,-100);
+            this.setStyle("visibility", "hidden");
+        };
+        this.ddGroup = "gridHeader" + this.grid.getGridEl().id;
+        // temporarily disabled
+        //Ext.dd.ScrollManager.register(this.view.scroller.dom);
+        Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);
+    },
+
+    getTargetFromEvent : function(e){
+        var t = Ext.lib.Event.getTarget(e),
+            cindex = this.view.findCellIndex(t);
+        if(cindex !== false){
+            return this.view.getHeaderCell(cindex);
+        }
+    },
+
+    nextVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.nextSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.nextSibling;
+        }
+        return null;
+    },
+
+    prevVisible : function(h){
+        var v = this.view, cm = this.grid.colModel;
+        h = h.prevSibling;
+        while(h){
+            if(!cm.isHidden(v.getCellIndex(h))){
+                return h;
+            }
+            h = h.prevSibling;
+        }
+        return null;
+    },
+
+    positionIndicator : function(h, n, e){
+        var x = Ext.lib.Event.getPageX(e),
+            r = Ext.lib.Dom.getRegion(n.firstChild),
+            px, 
+            pt, 
+            py = r.top + this.proxyOffsets[1];
+        if((r.right - x) <= (r.right-r.left)/2){
+            px = r.right+this.view.borderWidth;
+            pt = "after";
+        }else{
+            px = r.left;
+            pt = "before";
+        }
+
+        if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){
+            return false;
+        }
+
+        px +=  this.proxyOffsets[0];
+        this.proxyTop.setLeftTop(px, py);
+        this.proxyTop.show();
+        if(!this.bottomOffset){
+            this.bottomOffset = this.view.mainHd.getHeight();
+        }
+        this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);
+        this.proxyBottom.show();
+        return pt;
+    },
+
+    onNodeEnter : function(n, dd, e, data){
+        if(data.header != n){
+            this.positionIndicator(data.header, n, e);
+        }
+    },
+
+    onNodeOver : function(n, dd, e, data){
+        var result = false;
+        if(data.header != n){
+            result = this.positionIndicator(data.header, n, e);
+        }
+        if(!result){
+            this.proxyTop.hide();
+            this.proxyBottom.hide();
+        }
+        return result ? this.dropAllowed : this.dropNotAllowed;
+    },
+
+    onNodeOut : function(n, dd, e, data){
+        this.proxyTop.hide();
+        this.proxyBottom.hide();
+    },
+
+    onNodeDrop : function(n, dd, e, data){
+        var h = data.header;
+        if(h != n){
+            var cm = this.grid.colModel,
+                x = Ext.lib.Event.getPageX(e),
+                r = Ext.lib.Dom.getRegion(n.firstChild),
+                pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before",
+                oldIndex = this.view.getCellIndex(h),
+                newIndex = this.view.getCellIndex(n);
+            if(pt == "after"){
+                newIndex++;
+            }
+            if(oldIndex < newIndex){
+                newIndex--;
+            }
+            cm.moveColumn(oldIndex, newIndex);
+            return true;
+        }
+        return false;
+    }
+});
+
+Ext.grid.GridView.ColumnDragZone = Ext.extend(Ext.grid.HeaderDragZone, {
+    
+    constructor : function(grid, hd){
+        Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);
+        this.proxy.el.addClass('x-grid3-col-dd');
+    },
+    
+    handleMouseDown : function(e){
+    },
+
+    callHandleMouseDown : function(e){
+        Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);
+    }
+});</pre>    
+</body>
 </html>
\ No newline at end of file