docs/source/ColumnDD.html

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