docs/source/ColumnDD.html

   1 <html>
   2 <head>
   3   <title>The source code</title>
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   6 </head>
   7 <body  onload="prettyPrint();">
   8     <pre class="prettyprint lang-js">/*!
   9  * Ext JS Library 3.0.3
  10  * Copyright(c) 2006-2009 Ext JS, LLC
  11  * licensing@extjs.com
  12  * http://www.extjs.com/license
  13  */
  14 // private\r
  15 // This is a support class used internally by the Grid components\r
  16 Ext.grid.HeaderDragZone = function(grid, hd, hd2){\r
  17     this.grid = grid;\r
  18     this.view = grid.getView();\r
  19     this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
  20     Ext.grid.HeaderDragZone.superclass.constructor.call(this, hd);\r
  21     if(hd2){\r
  22         this.setHandleElId(Ext.id(hd));\r
  23         this.setOuterHandleElId(Ext.id(hd2));\r
  24     }\r
  25     this.scroll = false;\r
  26 };\r
  27 Ext.extend(Ext.grid.HeaderDragZone, Ext.dd.DragZone, {\r
  28     maxDragWidth: 120,\r
  29     getDragData : function(e){\r
  30         var t = Ext.lib.Event.getTarget(e);\r
  31         var h = this.view.findHeaderCell(t);\r
  32         if(h){\r
  33             return {ddel: h.firstChild, header:h};\r
  34         }\r
  35         return false;\r
  36     },\r
  37 \r
  38     onInitDrag : function(e){\r
  39         this.view.headersDisabled = true;\r
  40         var clone = this.dragData.ddel.cloneNode(true);\r
  41         clone.id = Ext.id();\r
  42         clone.style.width = Math.min(this.dragData.header.offsetWidth,this.maxDragWidth) + "px";\r
  43         this.proxy.update(clone);\r
  44         return true;\r
  45     },\r
  46 \r
  47     afterValidDrop : function(){\r
  48         var v = this.view;\r
  49         setTimeout(function(){\r
  50             v.headersDisabled = false;\r
  51         }, 50);\r
  52     },\r
  53 \r
  54     afterInvalidDrop : function(){\r
  55         var v = this.view;\r
  56         setTimeout(function(){\r
  57             v.headersDisabled = false;\r
  58         }, 50);\r
  59     }\r
  60 });\r
  61 \r
  62 // private\r
  63 // This is a support class used internally by the Grid components\r
  64 Ext.grid.HeaderDropZone = function(grid, hd, hd2){\r
  65     this.grid = grid;\r
  66     this.view = grid.getView();\r
  67     // split the proxies so they don't interfere with mouse events\r
  68     this.proxyTop = Ext.DomHelper.append(document.body, {\r
  69         cls:"col-move-top", html:"&#160;"\r
  70     }, true);\r
  71     this.proxyBottom = Ext.DomHelper.append(document.body, {\r
  72         cls:"col-move-bottom", html:"&#160;"\r
  73     }, true);\r
  74     this.proxyTop.hide = this.proxyBottom.hide = function(){\r
  75         this.setLeftTop(-100,-100);\r
  76         this.setStyle("visibility", "hidden");\r
  77     };\r
  78     this.ddGroup = "gridHeader" + this.grid.getGridEl().id;\r
  79     // temporarily disabled\r
  80     //Ext.dd.ScrollManager.register(this.view.scroller.dom);\r
  81     Ext.grid.HeaderDropZone.superclass.constructor.call(this, grid.getGridEl().dom);\r
  82 };\r
  83 Ext.extend(Ext.grid.HeaderDropZone, Ext.dd.DropZone, {\r
  84     proxyOffsets : [-4, -9],\r
  85     fly: Ext.Element.fly,\r
  86 \r
  87     getTargetFromEvent : function(e){\r
  88         var t = Ext.lib.Event.getTarget(e);\r
  89         var cindex = this.view.findCellIndex(t);\r
  90         if(cindex !== false){\r
  91             return this.view.getHeaderCell(cindex);\r
  92         }\r
  93     },\r
  94 \r
  95     nextVisible : function(h){\r
  96         var v = this.view, cm = this.grid.colModel;\r
  97         h = h.nextSibling;\r
  98         while(h){\r
  99             if(!cm.isHidden(v.getCellIndex(h))){\r
 100                 return h;\r
 101             }\r
 102             h = h.nextSibling;\r
 103         }\r
 104         return null;\r
 105     },\r
 106 \r
 107     prevVisible : function(h){\r
 108         var v = this.view, cm = this.grid.colModel;\r
 109         h = h.prevSibling;\r
 110         while(h){\r
 111             if(!cm.isHidden(v.getCellIndex(h))){\r
 112                 return h;\r
 113             }\r
 114             h = h.prevSibling;\r
 115         }\r
 116         return null;\r
 117     },\r
 118 \r
 119     positionIndicator : function(h, n, e){\r
 120         var x = Ext.lib.Event.getPageX(e);\r
 121         var r = Ext.lib.Dom.getRegion(n.firstChild);\r
 122         var px, pt, py = r.top + this.proxyOffsets[1];\r
 123         if((r.right - x) <= (r.right-r.left)/2){\r
 124             px = r.right+this.view.borderWidth;\r
 125             pt = "after";\r
 126         }else{\r
 127             px = r.left;\r
 128             pt = "before";\r
 129         }\r
 130 \r
 131         if(this.grid.colModel.isFixed(this.view.getCellIndex(n))){\r
 132             return false;\r
 133         }\r
 134 \r
 135         px +=  this.proxyOffsets[0];\r
 136         this.proxyTop.setLeftTop(px, py);\r
 137         this.proxyTop.show();\r
 138         if(!this.bottomOffset){\r
 139             this.bottomOffset = this.view.mainHd.getHeight();\r
 140         }\r
 141         this.proxyBottom.setLeftTop(px, py+this.proxyTop.dom.offsetHeight+this.bottomOffset);\r
 142         this.proxyBottom.show();\r
 143         return pt;\r
 144     },\r
 145 \r
 146     onNodeEnter : function(n, dd, e, data){\r
 147         if(data.header != n){\r
 148             this.positionIndicator(data.header, n, e);\r
 149         }\r
 150     },\r
 151 \r
 152     onNodeOver : function(n, dd, e, data){\r
 153         var result = false;\r
 154         if(data.header != n){\r
 155             result = this.positionIndicator(data.header, n, e);\r
 156         }\r
 157         if(!result){\r
 158             this.proxyTop.hide();\r
 159             this.proxyBottom.hide();\r
 160         }\r
 161         return result ? this.dropAllowed : this.dropNotAllowed;\r
 162     },\r
 163 \r
 164     onNodeOut : function(n, dd, e, data){\r
 165         this.proxyTop.hide();\r
 166         this.proxyBottom.hide();\r
 167     },\r
 168 \r
 169     onNodeDrop : function(n, dd, e, data){\r
 170         var h = data.header;\r
 171         if(h != n){\r
 172             var cm = this.grid.colModel;\r
 173             var x = Ext.lib.Event.getPageX(e);\r
 174             var r = Ext.lib.Dom.getRegion(n.firstChild);\r
 175             var pt = (r.right - x) <= ((r.right-r.left)/2) ? "after" : "before";\r
 176             var oldIndex = this.view.getCellIndex(h);\r
 177             var newIndex = this.view.getCellIndex(n);\r
 178             if(pt == "after"){\r
 179                 newIndex++;\r
 180             }\r
 181             if(oldIndex < newIndex){\r
 182                 newIndex--;\r
 183             }\r
 184             cm.moveColumn(oldIndex, newIndex);\r
 185             return true;\r
 186         }\r
 187         return false;\r
 188     }\r
 189 });\r
 190 \r
 191 \r
 192 Ext.grid.GridView.ColumnDragZone = function(grid, hd){\r
 193     Ext.grid.GridView.ColumnDragZone.superclass.constructor.call(this, grid, hd, null);\r
 194     this.proxy.el.addClass('x-grid3-col-dd');\r
 195 };\r
 196 \r
 197 Ext.extend(Ext.grid.GridView.ColumnDragZone, Ext.grid.HeaderDragZone, {\r
 198     handleMouseDown : function(e){\r
 199 \r
 200     },\r
 201 \r
 202     callHandleMouseDown : function(e){\r
 203         Ext.grid.GridView.ColumnDragZone.superclass.handleMouseDown.call(this, e);\r
 204     }\r
 205 });</pre>
 206 </body>
 207 </html>