X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6a7e4474cba9d8be4b2ec445e10f1691f7277c50..b37ceabb82336ee82757cd32efe353cfab8ec267:/examples/ux/LockingGridView.js diff --git a/examples/ux/LockingGridView.js b/examples/ux/LockingGridView.js index 39673dca..a4d1c9ba 100644 --- a/examples/ux/LockingGridView.js +++ b/examples/ux/LockingGridView.js @@ -1,5 +1,5 @@ /*! - * Ext JS Library 3.2.0 + * Ext JS Library 3.2.2 * Copyright(c) 2006-2010 Ext JS, Inc. * licensing@extjs.com * http://www.extjs.com/license @@ -11,17 +11,17 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { unlockText : 'Unlock', rowBorderWidth : 1, lockedBorderWidth : 1, - + /* * This option ensures that height between the rows is synchronized * between the locked and unlocked sides. This option only needs to be used * when the row heights aren't predictable. */ syncHeights: false, - + initTemplates : function(){ var ts = this.templates || {}; - + if (!ts.master) { ts.master = new Ext.Template( '
', @@ -38,21 +38,21 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { '
' ); } - + this.templates = ts; - + Ext.ux.grid.LockingGridView.superclass.initTemplates.call(this); }, - + getEditorParent : function(ed){ return this.el.dom; }, - + initElements : function(){ var E = Ext.Element, el = this.grid.getGridEl().dom.firstChild, cs = el.childNodes; - + this.el = new E(el); this.lockedWrap = new E(cs[0]); this.lockedHd = new E(this.lockedWrap.dom.firstChild); @@ -61,35 +61,35 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.lockedBody = new E(this.lockedScroller.dom.firstChild); this.mainWrap = new E(cs[1]); this.mainHd = new E(this.mainWrap.dom.firstChild); - + if (this.grid.hideHeaders) { this.lockedHd.setDisplayed(false); this.mainHd.setDisplayed(false); } - + this.innerHd = this.mainHd.dom.firstChild; this.scroller = new E(this.mainWrap.dom.childNodes[1]); - + if(this.forceFit){ this.scroller.setStyle('overflow-x', 'hidden'); } - + this.mainBody = new E(this.scroller.dom.firstChild); this.focusEl = new E(this.scroller.dom.childNodes[1]); this.resizeMarker = new E(cs[2]); this.resizeProxy = new E(cs[3]); - + this.focusEl.swallowEvent('click', true); }, - + getLockedRows : function(){ return this.hasRows() ? this.lockedBody.dom.childNodes : []; }, - + getLockedRow : function(row){ return this.getLockedRows()[row]; }, - + getCell : function(row, col){ var llen = this.cm.getLockedCount(); if(col < llen){ @@ -97,7 +97,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } return Ext.ux.grid.LockingGridView.superclass.getCell.call(this, row, col - llen); }, - + getHeaderCell : function(index){ var llen = this.cm.getLockedCount(); if(index < llen){ @@ -105,7 +105,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } return Ext.ux.grid.LockingGridView.superclass.getHeaderCell.call(this, index - llen); }, - + addRowClass : function(row, cls){ var r = this.getLockedRow(row); if(r){ @@ -113,7 +113,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } Ext.ux.grid.LockingGridView.superclass.addRowClass.call(this, row, cls); }, - + removeRowClass : function(row, cls){ var r = this.getLockedRow(row); if(r){ @@ -121,12 +121,12 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } Ext.ux.grid.LockingGridView.superclass.removeRowClass.call(this, row, cls); }, - + removeRow : function(row) { Ext.removeNode(this.getLockedRow(row)); Ext.ux.grid.LockingGridView.superclass.removeRow.call(this, row); }, - + removeRows : function(firstRow, lastRow){ var bd = this.lockedBody.dom; for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){ @@ -134,13 +134,13 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } Ext.ux.grid.LockingGridView.superclass.removeRows.call(this, firstRow, lastRow); }, - + syncScroll : function(e){ var mb = this.scroller.dom; this.lockedScroller.dom.scrollTop = mb.scrollTop; Ext.ux.grid.LockingGridView.superclass.syncScroll.call(this, e); }, - + updateSortIcon : function(col, dir){ var sc = this.sortClasses, lhds = this.lockedHd.select('td').removeClass(sc), @@ -153,7 +153,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { hds.item(col - llen).addClass(cls); } }, - + updateAllColumnWidths : function(){ var tw = this.getTotalWidth(), clen = this.cm.getColumnCount(), @@ -190,7 +190,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.onAllColumnWidthsUpdated(ws, tw); this.syncHeaderHeight(); }, - + updateColumnWidth : function(col, width){ var w = this.getColumnWidth(col), llen = this.cm.getLockedCount(), @@ -218,7 +218,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.onColumnWidthUpdated(col, w, this.getTotalWidth()); this.syncHeaderHeight(); }, - + updateColumnHidden : function(col, hidden){ var llen = this.cm.getLockedCount(), ns, rw, c, row, @@ -247,7 +247,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { delete this.lastViewWidth; this.layout(); }, - + doRender : function(cs, rs, ds, startRow, colCount, stripe){ var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount-1, tstyle = 'width:'+this.getTotalWidth()+';', @@ -324,9 +324,9 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { el2 = Ext.get(lrow), h1 = el1.getHeight(), h2 = el2.getHeight(); - + if(h1 > h2){ - el2.setHeight(h1); + el2.setHeight(h1); }else if(h2 > h1){ el1.setHeight(h2); } @@ -339,7 +339,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { Ext.fly(rows[rows.length - 1]).addClass(this.lastRowCls); Ext.fly(lrows[lrows.length - 1]).addClass(this.lastRowCls); }, - + afterRender : function(){ if(!this.ds || !this.cm){ return; @@ -351,8 +351,9 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { if(this.deferEmptyText !== true){ this.applyEmptyText(); } + this.grid.fireEvent('viewready', this.grid); }, - + renderUI : function(){ var header = this.renderHeaders(); var body = this.templates.body.apply({rows:' '}); @@ -435,7 +436,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { mouseout: this.onRowOut }); } - + if(g.enableDragDrop || g.enableDrag){ this.dragZone = new Ext.grid.GridDragZone(g, { ddGroup : g.ddGroup || 'GridDD' @@ -443,7 +444,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } this.updateHeaderSortState(); }, - + layout : function(){ if(!this.mainBody){ return; @@ -480,11 +481,11 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } this.onLayout(vw, vh); }, - + getOffsetWidth : function() { return (this.cm.getTotalWidth() - this.cm.getTotalLockedWidth() + this.getScrollOffset()) + 'px'; }, - + renderHeaders : function(){ var cm = this.cm, ts = this.templates, @@ -514,7 +515,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { return [ts.header.apply({cells: cb.join(''), tstyle:'width:'+this.getTotalWidth()+';'}), ts.header.apply({cells: lcb.join(''), tstyle:'width:'+this.getLockedWidth()+';'})]; }, - + updateHeaders : function(){ var hd = this.renderHeaders(); this.innerHd.firstChild.innerHTML = hd[0]; @@ -525,7 +526,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.lockedInnerHd.firstChild.style.width = lw; this.lockedInnerHd.firstChild.firstChild.style.width = lw; }, - + getResolvedXY : function(resolved){ if(!resolved){ return null; @@ -533,15 +534,15 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { var c = resolved.cell, r = resolved.row; return c ? Ext.fly(c).getXY() : [this.scroller.getX(), Ext.fly(r).getY()]; }, - + syncFocusEl : function(row, col, hscroll){ Ext.ux.grid.LockingGridView.superclass.syncFocusEl.call(this, row, col, col < this.cm.getLockedCount() ? false : hscroll); }, - + ensureVisible : function(row, col, hscroll){ return Ext.ux.grid.LockingGridView.superclass.ensureVisible.call(this, row, col, col < this.cm.getLockedCount() ? false : hscroll); }, - + insertRows : function(dm, firstRow, lastRow, isUpdate){ var last = dm.getCount() - 1; if(!isUpdate && firstRow === 0 && lastRow >= last){ @@ -573,7 +574,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } this.syncFocusEl(firstRow); }, - + getColumnStyle : function(col, isHeader){ var style = !isHeader ? this.cm.config[col].cellStyle || this.cm.config[col].css || '' : this.cm.config[col].headerStyle || ''; style += 'width:'+this.getColumnWidth(col)+';'; @@ -586,15 +587,15 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } return style; }, - + getLockedWidth : function() { return this.cm.getTotalLockedWidth() + 'px'; }, - + getTotalWidth : function() { return (this.cm.getTotalWidth() - this.cm.getTotalLockedWidth()) + 'px'; }, - + getColumnData : function(){ var cs = [], cm = this.cm, colCount = cm.getColumnCount(); for(var i = 0; i < colCount; i++){ @@ -609,18 +610,18 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } return cs; }, - + renderBody : function(){ var markup = this.renderRows() || [' ', ' ']; return [this.templates.body.apply({rows: markup[0]}), this.templates.body.apply({rows: markup[1]})]; }, - + refreshRow : function(record){ Ext.ux.grid.LockingGridView.superclass.refreshRow.call(this, record); var index = Ext.isNumber(record) ? record : this.ds.indexOf(record); this.getLockedRow(index).rowIndex = index; }, - + refresh : function(headersToo){ this.fireEvent('beforerefresh', this); this.grid.stopEditing(true); @@ -636,11 +637,11 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.applyEmptyText(); this.fireEvent('refresh', this); }, - + onDenyColumnLock : function(){ }, - + initData : function(ds, cm){ if(this.cm){ this.cm.un('columnlockchange', this.onColumnLock, this); @@ -650,11 +651,11 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.cm.on('columnlockchange', this.onColumnLock, this); } }, - + onColumnLock : function(){ this.refresh(true); }, - + handleHdMenuClick : function(item){ var index = this.hdCtxIndex, cm = this.cm, @@ -666,12 +667,10 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.onDenyColumnLock(); return; } + cm.setLocked(index, true); if(llen != index){ - cm.setLocked(index, true, true); cm.moveColumn(index, llen); this.grid.fireEvent('columnmove', index, llen); - }else{ - cm.setLocked(index, true); } break; case 'unlock': @@ -688,7 +687,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } return true; }, - + handleHdDown : function(e, t){ Ext.ux.grid.LockingGridView.superclass.handleHdDown.call(this, e, t); if(this.grid.enableColLock !== false){ @@ -701,7 +700,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { } } }, - + syncHeaderHeight: function(){ this.innerHd.firstChild.firstChild.style.height = 'auto'; this.lockedInnerHd.firstChild.firstChild.style.height = 'auto'; @@ -711,7 +710,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, { this.innerHd.firstChild.firstChild.style.height = height; this.lockedInnerHd.firstChild.firstChild.style.height = height; }, - + updateLockedWidth: function(){ var lw = this.cm.getTotalLockedWidth(), tw = this.cm.getTotalWidth() - lw, @@ -751,7 +750,7 @@ Ext.ux.grid.LockingColumnModel = Ext.extend(Ext.grid.ColumnModel, { isLocked : function(colIndex){ return this.config[colIndex].locked === true; }, - + /** * Locks or unlocks a given column * @param {Number} colIndex The column index @@ -767,7 +766,7 @@ Ext.ux.grid.LockingColumnModel = Ext.extend(Ext.grid.ColumnModel, { this.fireEvent('columnlockchange', this, colIndex, value); } }, - + /** * Returns the total width of all locked columns * @return {Number} The width of all locked columns @@ -779,27 +778,27 @@ Ext.ux.grid.LockingColumnModel = Ext.extend(Ext.grid.ColumnModel, { totalWidth += this.getColumnWidth(i); } } - + return totalWidth; }, - + /** * Returns the total number of locked columns * @return {Number} The number of locked columns */ getLockedCount : function() { var len = this.config.length; - + for (var i = 0; i < len; i++) { if (!this.isLocked(i)) { return i; } } - + //if we get to this point all of the columns are locked so we return the total return len; }, - + /** * Moves a column from one position to another * @param {Number} oldIndex The current column index @@ -808,13 +807,13 @@ Ext.ux.grid.LockingColumnModel = Ext.extend(Ext.grid.ColumnModel, { moveColumn : function(oldIndex, newIndex){ var oldLocked = this.isLocked(oldIndex), newLocked = this.isLocked(newIndex); - + if (oldIndex < newIndex && oldLocked && !newLocked) { this.setLocked(oldIndex, false, true); } else if (oldIndex > newIndex && !oldLocked && newLocked) { this.setLocked(oldIndex, true, true); } - + Ext.ux.grid.LockingColumnModel.superclass.moveColumn.apply(this, arguments); } });