-<div id="cls-Ext.ListView.ColumnResizer"></div>/**\r
- * @class Ext.ListView.ColumnResizer\r
- * @extends Ext.util.Observable\r
- * <p>Supporting Class for Ext.ListView.</p>\r
- * @constructor\r
- * @param {Object} config\r
- */\r
-Ext.ListView.ColumnResizer = Ext.extend(Ext.util.Observable, {\r
- <div id="cfg-Ext.ListView.ColumnResizer-minPct"></div>/**\r
- * @cfg {Number} minPct The minimum percentage to allot for any column (defaults to <tt>.05</tt>)\r
- */\r
- minPct: .05,\r
-\r
- constructor: function(config){\r
- Ext.apply(this, config);\r
- Ext.ListView.ColumnResizer.superclass.constructor.call(this);\r
- },\r
- init : function(listView){\r
- this.view = listView;\r
- listView.on('render', this.initEvents, this);\r
- },\r
-\r
- initEvents : function(view){\r
- view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);\r
- this.tracker = new Ext.dd.DragTracker({\r
- onBeforeStart: this.onBeforeStart.createDelegate(this),\r
- onStart: this.onStart.createDelegate(this),\r
- onDrag: this.onDrag.createDelegate(this),\r
- onEnd: this.onEnd.createDelegate(this),\r
- tolerance: 3,\r
- autoStart: 300\r
- });\r
- this.tracker.initEl(view.innerHd);\r
- view.on('beforedestroy', this.tracker.destroy, this.tracker);\r
- },\r
-\r
- handleHdMove : function(e, t){\r
- var hw = 5,\r
- x = e.getPageX(),\r
- hd = e.getTarget('em', 3, true);\r
- if(hd){\r
- var r = hd.getRegion(),\r
- ss = hd.dom.style,\r
- pn = hd.dom.parentNode;\r
-\r
- if(x - r.left <= hw && pn != pn.parentNode.firstChild){\r
- this.activeHd = Ext.get(pn.previousSibling.firstChild);\r
- ss.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';\r
- } else if(r.right - x <= hw && pn != pn.parentNode.lastChild.previousSibling){\r
- this.activeHd = hd;\r
- ss.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';\r
- } else{\r
- delete this.activeHd;\r
- ss.cursor = '';\r
- }\r
- }\r
- },\r
-\r
- onBeforeStart : function(e){\r
- this.dragHd = this.activeHd;\r
- return !!this.dragHd;\r
- },\r
-\r
- onStart: function(e){\r
- this.view.disableHeaders = true;\r
- this.proxy = this.view.el.createChild({cls:'x-list-resizer'});\r
- this.proxy.setHeight(this.view.el.getHeight());\r
-\r
- var x = this.tracker.getXY()[0],\r
- w = this.view.innerHd.getWidth();\r
-\r
- this.hdX = this.dragHd.getX();\r
- this.hdIndex = this.view.findHeaderIndex(this.dragHd);\r
-\r
- this.proxy.setX(this.hdX);\r
- this.proxy.setWidth(x-this.hdX);\r
-\r
- this.minWidth = w*this.minPct;\r
- this.maxWidth = w - (this.minWidth*(this.view.columns.length-1-this.hdIndex));\r
- },\r
-\r
- onDrag: function(e){\r
- var cursorX = this.tracker.getXY()[0];\r
- this.proxy.setWidth((cursorX-this.hdX).constrain(this.minWidth, this.maxWidth));\r
- },\r
-\r
- onEnd: function(e){\r
- var nw = this.proxy.getWidth();\r
- this.proxy.remove();\r
-\r
- var index = this.hdIndex,\r
- vw = this.view, \r
- cs = vw.columns, \r
- len = cs.length,\r
- w = this.view.innerHd.getWidth(), \r
- minPct = this.minPct * 100;\r
- pct = Math.ceil((nw * vw.maxWidth) / w),\r
- diff = cs[index].width - pct,\r
- each = Math.floor(diff / (len-1-index)),\r
- mod = diff - (each * (len-1-index));\r
-\r
- for(var i = index+1; i < len; i++){\r
- var cw = cs[i].width + each,\r
- ncw = Math.max(minPct, cw);\r
- if(cw != ncw){\r
- mod += cw - ncw;\r
- }\r
- cs[i].width = ncw;\r
- }\r
- cs[index].width = pct;\r
- cs[index+1].width += mod;\r
- delete this.dragHd;\r
- vw.setHdWidths();\r
- vw.refresh();\r
- setTimeout(function(){\r
- vw.disableHeaders = false;\r
- }, 100);\r
- }\r
-});</pre>
+<div id="cls-Ext.list.ColumnResizer"></div>/**
+ * @class Ext.list.ColumnResizer
+ * @extends Ext.util.Observable
+ * <p>Supporting Class for Ext.list.ListView</p>
+ * @constructor
+ * @param {Object} config
+ */
+Ext.list.ColumnResizer = Ext.extend(Ext.util.Observable, {
+ <div id="cfg-Ext.list.ColumnResizer-minPct"></div>/**
+ * @cfg {Number} minPct The minimum percentage to allot for any column (defaults to <tt>.05</tt>)
+ */
+ minPct: .05,
+
+ constructor: function(config){
+ Ext.apply(this, config);
+ Ext.list.ColumnResizer.superclass.constructor.call(this);
+ },
+ init : function(listView){
+ this.view = listView;
+ listView.on('render', this.initEvents, this);
+ },
+
+ initEvents : function(view){
+ view.mon(view.innerHd, 'mousemove', this.handleHdMove, this);
+ this.tracker = new Ext.dd.DragTracker({
+ onBeforeStart: this.onBeforeStart.createDelegate(this),
+ onStart: this.onStart.createDelegate(this),
+ onDrag: this.onDrag.createDelegate(this),
+ onEnd: this.onEnd.createDelegate(this),
+ tolerance: 3,
+ autoStart: 300
+ });
+ this.tracker.initEl(view.innerHd);
+ view.on('beforedestroy', this.tracker.destroy, this.tracker);
+ },
+
+ handleHdMove : function(e, t){
+ var handleWidth = 5,
+ x = e.getPageX(),
+ header = e.getTarget('em', 3, true);
+ if(header){
+ var region = header.getRegion(),
+ style = header.dom.style,
+ parentNode = header.dom.parentNode;
+
+ if(x - region.left <= handleWidth && parentNode != parentNode.parentNode.firstChild){
+ this.activeHd = Ext.get(parentNode.previousSibling.firstChild);
+ style.cursor = Ext.isWebKit ? 'e-resize' : 'col-resize';
+ } else if(region.right - x <= handleWidth && parentNode != parentNode.parentNode.lastChild.previousSibling){
+ this.activeHd = header;
+ style.cursor = Ext.isWebKit ? 'w-resize' : 'col-resize';
+ } else{
+ delete this.activeHd;
+ style.cursor = '';
+ }
+ }
+ },
+
+ onBeforeStart : function(e){
+ this.dragHd = this.activeHd;
+ return !!this.dragHd;
+ },
+
+ onStart: function(e){
+
+ var me = this,
+ view = me.view,
+ dragHeader = me.dragHd,
+ x = me.tracker.getXY()[0];
+
+ me.proxy = view.el.createChild({cls:'x-list-resizer'});
+ me.dragX = dragHeader.getX();
+ me.headerIndex = view.findHeaderIndex(dragHeader);
+
+ me.headersDisabled = view.disableHeaders;
+ view.disableHeaders = true;
+
+ me.proxy.setHeight(view.el.getHeight());
+ me.proxy.setX(me.dragX);
+ me.proxy.setWidth(x - me.dragX);
+
+ this.setBoundaries();
+
+ },
+
+ // Sets up the boundaries for the drag/drop operation
+ setBoundaries: function(relativeX){
+ var view = this.view,
+ headerIndex = this.headerIndex,
+ width = view.innerHd.getWidth(),
+ relativeX = view.innerHd.getX(),
+ minWidth = Math.ceil(width * this.minPct),
+ maxWidth = width - minWidth,
+ numColumns = view.columns.length,
+ headers = view.innerHd.select('em', true),
+ minX = minWidth + relativeX,
+ maxX = maxWidth + relativeX,
+ header;
+
+ if (numColumns == 2) {
+ this.minX = minX;
+ this.maxX = maxX;
+ }else{
+ header = headers.item(headerIndex + 2);
+ this.minX = headers.item(headerIndex).getX() + minWidth;
+ this.maxX = header ? header.getX() - minWidth : maxX;
+ if (headerIndex == 0) {
+ // First
+ this.minX = minX;
+ } else if (headerIndex == numColumns - 2) {
+ // Last
+ this.maxX = maxX;
+ }
+ }
+ },
+
+ onDrag: function(e){
+ var me = this,
+ cursorX = me.tracker.getXY()[0].constrain(me.minX, me.maxX);
+
+ me.proxy.setWidth(cursorX - this.dragX);
+ },
+
+ onEnd: function(e){
+ /* calculate desired width by measuring proxy and then remove it */
+ var newWidth = this.proxy.getWidth(),
+ index = this.headerIndex,
+ view = this.view,
+ columns = view.columns,
+ width = view.innerHd.getWidth(),
+ newPercent = Math.ceil(newWidth * view.maxColumnWidth / width) / 100,
+ disabled = this.headersDisabled,
+ headerCol = columns[index],
+ otherCol = columns[index + 1],
+ totalPercent = headerCol.width + otherCol.width;
+
+ this.proxy.remove();
+
+ headerCol.width = newPercent;
+ otherCol.width = totalPercent - newPercent;
+
+ delete this.dragHd;
+ view.setHdWidths();
+ view.refresh();
+
+ setTimeout(function(){
+ view.disableHeaders = disabled;
+ }, 100);
+ }
+});
+
+// Backwards compatibility alias
+Ext.ListView.ColumnResizer = Ext.list.ColumnResizer;</pre>
git.ithinksw.org / extjs.git / blobdiff