git.roojs.org Git - roojs1/blob - docs/src/Roo_grid_SplitDragZone.js.html

   1 <html><head><title>Roo/grid/SplitDragZone.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * &lt;script type=&quot;text/javascript&quot;&gt;
  10  */
  11  /**
  12  * @extends Roo.dd.DDProxy
  13  * @class Roo.grid.SplitDragZone
  14  * Support for Column Header resizing
  15  * @constructor
  16  * @param {Object} config
  17  */
  18 // private
  19 // This is a support class used internally by the Grid components
  20 </span><span class="jsdoc-var">Roo.grid.SplitDragZone </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hd2</span><span class="jsdoc-syntax">){
  21     </span><span class="jsdoc-var">this.grid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">grid</span><span class="jsdoc-syntax">;
  22     </span><span class="jsdoc-var">this.view </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">grid.getView</span><span class="jsdoc-syntax">();
  23     </span><span class="jsdoc-var">this.proxy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.view.resizeProxy</span><span class="jsdoc-syntax">;
  24     </span><span class="jsdoc-var">Roo.grid.SplitDragZone.superclass.constructor.call</span><span class="jsdoc-syntax">(
  25         </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
  26         </span><span class="jsdoc-var">hd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// ID
  27         </span><span class="jsdoc-string">&quot;gridSplitters&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.grid.getGridEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// SGROUP
  28         </span><span class="jsdoc-syntax">{  </span><span class="jsdoc-comment">// CONFIG
  29             </span><span class="jsdoc-var">dragElId </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.proxy.dom</span><span class="jsdoc-syntax">),
  30             </span><span class="jsdoc-var">resizeFrame</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false
  31         </span><span class="jsdoc-syntax">}
  32     );
  33
  34     </span><span class="jsdoc-var">this.setHandleElId</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hd</span><span class="jsdoc-syntax">));
  35     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hd2 </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
  36         </span><span class="jsdoc-var">this.setOuterHandleElId</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hd2</span><span class="jsdoc-syntax">));
  37     }
  38
  39     </span><span class="jsdoc-var">this.scroll </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
  40 };
  41 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.grid.SplitDragZone</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.dd.DDProxy</span><span class="jsdoc-syntax">, {
  42     </span><span class="jsdoc-var">fly</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.Element.fly</span><span class="jsdoc-syntax">,
  43
  44     </span><span class="jsdoc-var">b4StartDrag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">){
  45         </span><span class="jsdoc-var">this.view.headersDisabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  46         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.view.mainWrap </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.view.mainWrap.getHeight</span><span class="jsdoc-syntax">() : (
  47                     </span><span class="jsdoc-var">this.view.headEl.getHeight</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.view.bodyEl.getHeight</span><span class="jsdoc-syntax">()
  48         );
  49         </span><span class="jsdoc-var">this.proxy.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
  50
  51         </span><span class="jsdoc-comment">// for old system colWidth really stored the actual width?
  52         // in bootstrap we tried using xs/ms/etc.. to do % sizing?
  53         // which in reality did not work.. - it worked only for fixed sizes
  54         // for resizable we need to use actual sizes.
  55         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cm.getColumnWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">);
  56         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.view.mainWrap</span><span class="jsdoc-syntax">) {
  57             </span><span class="jsdoc-comment">// bootstrap.
  58             </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.view.getHeaderIndex</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getWidth</span><span class="jsdoc-syntax">();
  59         }
  60
  61
  62
  63         </span><span class="jsdoc-comment">// this was w-this.grid.minColumnWidth;
  64         // doesnt really make sense? - w = thie curren width or the rendered one?
  65         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">minw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">this.grid.minColumnWidth</span><span class="jsdoc-syntax">, 0);
  66         </span><span class="jsdoc-var">this.resetConstraints</span><span class="jsdoc-syntax">();
  67         </span><span class="jsdoc-var">this.setXConstraint</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">minw</span><span class="jsdoc-syntax">, 1000);
  68         </span><span class="jsdoc-var">this.setYConstraint</span><span class="jsdoc-syntax">(0, 0);
  69         </span><span class="jsdoc-var">this.minX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">minw</span><span class="jsdoc-syntax">;
  70         </span><span class="jsdoc-var">this.maxX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ 1000;
  71         </span><span class="jsdoc-var">this.startPos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">;
  72         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.view.mainWrap</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// this is Bootstrap code..
  73             </span><span class="jsdoc-var">this.getDragEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.style.display</span><span class="jsdoc-syntax">=</span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">;
  74         }
  75
  76         </span><span class="jsdoc-var">Roo.dd.DDProxy.prototype.b4StartDrag.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
  77     },
  78
  79
  80     </span><span class="jsdoc-var">handleMouseDown </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
  81         </span><span class="jsdoc-var">ev </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.EventObject.setEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
  82         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ev.getTarget</span><span class="jsdoc-syntax">());
  83         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-grid-split&quot;</span><span class="jsdoc-syntax">)){
  84             </span><span class="jsdoc-var">this.cellIndex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.view.getCellIndex</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.dom</span><span class="jsdoc-syntax">);
  85             </span><span class="jsdoc-var">this.split </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t.dom</span><span class="jsdoc-syntax">;
  86             </span><span class="jsdoc-var">this.cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.grid.colModel</span><span class="jsdoc-syntax">;
  87             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cm.isResizable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">) &amp;&amp; !</span><span class="jsdoc-var">this.cm.isFixed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">)){
  88                 </span><span class="jsdoc-var">Roo.grid.SplitDragZone.superclass.handleMouseDown.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">);
  89             }
  90         }
  91     },
  92
  93     </span><span class="jsdoc-var">endDrag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
  94         </span><span class="jsdoc-var">this.view.headersDisabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
  95         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">endX </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minX</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.lib.Event.getPageX</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">));
  96         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">diff </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">endX </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.startPos</span><span class="jsdoc-syntax">;
  97         </span><span class="jsdoc-comment">//
  98         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cm.getColumnWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">);
  99         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.view.mainWrap</span><span class="jsdoc-syntax">) {
 100             </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= 0;
 101         }
 102         </span><span class="jsdoc-var">this.view.onColumnSplitterMoved</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cellIndex</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">diff</span><span class="jsdoc-syntax">);
 103     },
 104
 105     </span><span class="jsdoc-var">autoOffset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 106         </span><span class="jsdoc-var">this.setDelta</span><span class="jsdoc-syntax">(0,0);
 107     }
 108 });</span></code></body></html>