src/widgets/grid/ColumnDD.js

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