开通博客赚积分
发布资源赚积分
分类

源码开发语言/平台
当前位置：首页 > 源码/资料 > Java编程 > JavaScript > 查看源码
LockingGridView.js
资源名称：ext-3.1.0.zip　[点击查看]
上传用户：dawnssy
上传日期：2022-08-06
资源大小：9345k
文件大小：29k
源码类别：

JavaScript

开发平台：

JavaScript

LockingGridView.js：源码内容
  1. /*!  * Ext JS Library 3.1.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ Ext.ns('Ext.ux.grid');
  3. Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, {
  4.     lockText : 'Lock',
  5.     unlockText : 'Unlock',
  6.     rowBorderWidth : 1,
  7.     lockedBorderWidth : 1,
  8.     /*
  9.      * This option ensures that height between the rows is synchronized
  10.      * between the locked and unlocked sides. This option only needs to be used
  11.      * when the row heights isn't predictable.
  12.      */
  13.     syncHeights: false,
  14.     initTemplates : function(){
  15.         var ts = this.templates || {};
  16.         if(!ts.master){
  17.             ts.master = new Ext.Template(
  18.                 '<div class="x-grid3" hidefocus="true">',
  19.                     '<div class="x-grid3-locked">',
  20.                         '<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset" style="{lstyle}">{lockedHeader}</div></div><div class="x-clear"></div></div>',
  21.                         '<div class="x-grid3-scroller"><div class="x-grid3-body" style="{lstyle}">{lockedBody}</div><div class="x-grid3-scroll-spacer"></div></div>',
  22.                     '</div>',
  23.                     '<div class="x-grid3-viewport x-grid3-unlocked">',
  24.                         '<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset" style="{ostyle}">{header}</div></div><div class="x-clear"></div></div>',
  25.                         '<div class="x-grid3-scroller"><div class="x-grid3-body" style="{bstyle}">{body}</div><a href="#" class="x-grid3-focus" tabIndex="-1"></a></div>',
  26.                     '</div>',
  27.                     '<div class="x-grid3-resize-marker">&#160;</div>',
  28.                     '<div class="x-grid3-resize-proxy">&#160;</div>',
  29.                 '</div>'
  30.             );
  31.         }
  32.         this.templates = ts;
  33.         Ext.ux.grid.LockingGridView.superclass.initTemplates.call(this);
  34.     },
  35.     getEditorParent : function(ed){
  36.         return this.el.dom;
  37.     },
  38.     initElements : function(){
  39.         var E = Ext.Element;
  40.         var el = this.grid.getGridEl().dom.firstChild;
  41.         var cs = el.childNodes;
  42.         this.el = new E(el);
  43.         this.lockedWrap = new E(cs[0]);
  44.         this.lockedHd = new E(this.lockedWrap.dom.firstChild);
  45.         this.lockedInnerHd = this.lockedHd.dom.firstChild;
  46.         this.lockedScroller = new E(this.lockedWrap.dom.childNodes[1]);
  47.         this.lockedBody = new E(this.lockedScroller.dom.firstChild);
  48.         this.mainWrap = new E(cs[1]);
  49.         this.mainHd = new E(this.mainWrap.dom.firstChild);
  50.         if(this.grid.hideHeaders){
  51.             this.lockedHd.setDisplayed(false);
  52.             this.mainHd.setDisplayed(false);
  53.         }
  54.         this.innerHd = this.mainHd.dom.firstChild;
  55.         this.scroller = new E(this.mainWrap.dom.childNodes[1]);
  56.         if(this.forceFit){
  57.             this.scroller.setStyle('overflow-x', 'hidden');
  58.         }
  59.         this.mainBody = new E(this.scroller.dom.firstChild);
  60.         this.focusEl = new E(this.scroller.dom.childNodes[1]);
  61.         this.focusEl.swallowEvent('click', true);
  62.         this.resizeMarker = new E(cs[2]);
  63.         this.resizeProxy = new E(cs[3]);
  64.     },
  65.     
  66.     getLockedRows : function(){
  67.         return this.hasRows() ? this.lockedBody.dom.childNodes : [];
  68.     },
  69.     
  70.     getLockedRow : function(row){
  71.         return this.getLockedRows()[row];
  72.     },
  73.     
  74.     getCell : function(row, col){
  75.         var llen = this.cm.getLockedCount();
  76.         if(col < llen){
  77.             return this.getLockedRow(row).getElementsByTagName('td')[col];
  78.         }
  79.         return Ext.ux.grid.LockingGridView.superclass.getCell.call(this, row, col - llen);
  80.     },
  81.     
  82.     getHeaderCell : function(index){
  83.         var llen = this.cm.getLockedCount();
  84.         if(index < llen){
  85.             return this.lockedHd.dom.getElementsByTagName('td')[index];
  86.         }
  87.         return Ext.ux.grid.LockingGridView.superclass.getHeaderCell.call(this, index - llen);
  88.     },
  89.     
  90.     addRowClass : function(row, cls){
  91.         var r = this.getLockedRow(row);
  92.         if(r){
  93.             this.fly(r).addClass(cls);
  94.         }
  95.         Ext.ux.grid.LockingGridView.superclass.addRowClass.call(this, row, cls);
  96.     },
  97.     
  98.     removeRowClass : function(row, cls){
  99.         var r = this.getLockedRow(row);
  100.         if(r){
  101.             this.fly(r).removeClass(cls);
  102.         }
  103.         Ext.ux.grid.LockingGridView.superclass.removeRowClass.call(this, row, cls);
  104.     },
  105.     
  106.     removeRow : function(row) {
  107.         Ext.removeNode(this.getLockedRow(row));
  108.         Ext.ux.grid.LockingGridView.superclass.removeRow.call(this, row);
  109.     },
  110.     
  111.     removeRows : function(firstRow, lastRow){
  112.         var bd = this.lockedBody.dom;
  113.         for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
  114.             Ext.removeNode(bd.childNodes[firstRow]);
  115.         }
  116.         Ext.ux.grid.LockingGridView.superclass.removeRows.call(this, firstRow, lastRow);
  117.     },
  118.     
  119.     syncScroll : function(e){
  120.         var mb = this.scroller.dom;
  121.         this.lockedScroller.dom.scrollTop = mb.scrollTop;
  122.         Ext.ux.grid.LockingGridView.superclass.syncScroll.call(this, e);
  123.     },
  124.     
  125.     updateSortIcon : function(col, dir){
  126.         var sc = this.sortClasses,
  127.             lhds = this.lockedHd.select('td').removeClass(sc),
  128.             hds = this.mainHd.select('td').removeClass(sc),
  129.             llen = this.cm.getLockedCount(),
  130.             cls = sc[dir == 'DESC' ? 1 : 0];
  131.         if(col < llen){
  132.             lhds.item(col).addClass(cls);
  133.         }else{
  134.             hds.item(col - llen).addClass(cls);
  135.         }
  136.     },
  137.     
  138.     updateAllColumnWidths : function(){
  139.         var tw = this.getTotalWidth(),
  140.             clen = this.cm.getColumnCount(),
  141.             lw = this.getLockedWidth(),
  142.             llen = this.cm.getLockedCount(),
  143.             ws = [], len, i;
  144.         this.updateLockedWidth();
  145.         for(i = 0; i < clen; i++){
  146.             ws[i] = this.getColumnWidth(i);
  147.             var hd = this.getHeaderCell(i);
  148.             hd.style.width = ws[i];
  149.         }
  150.         var lns = this.getLockedRows(), ns = this.getRows(), row, trow, j;
  151.         for(i = 0, len = ns.length; i < len; i++){
  152.             row = lns[i];
  153.             row.style.width = lw;
  154.             if(row.firstChild){
  155.                 row.firstChild.style.width = lw;
  156.                 trow = row.firstChild.rows[0];
  157.                 for (j = 0; j < llen; j++) {
  158.                    trow.childNodes[j].style.width = ws[j];
  159.                 }
  160.             }
  161.             row = ns[i];
  162.             row.style.width = tw;
  163.             if(row.firstChild){
  164.                 row.firstChild.style.width = tw;
  165.                 trow = row.firstChild.rows[0];
  166.                 for (j = llen; j < clen; j++) {
  167.                    trow.childNodes[j - llen].style.width = ws[j];
  168.                 }
  169.             }
  170.         }
  171.         this.onAllColumnWidthsUpdated(ws, tw);
  172.         this.syncHeaderHeight();
  173.     },
  174.     
  175.     updateColumnWidth : function(col, width){
  176.         var w = this.getColumnWidth(col),
  177.             llen = this.cm.getLockedCount(),
  178.             ns, rw, c, row;
  179.         this.updateLockedWidth();
  180.         if(col < llen){
  181.             ns = this.getLockedRows();
  182.             rw = this.getLockedWidth();
  183.             c = col;
  184.         }else{
  185.             ns = this.getRows();
  186.             rw = this.getTotalWidth();
  187.             c = col - llen;
  188.         }
  189.         var hd = this.getHeaderCell(col);
  190.         hd.style.width = w;
  191.         for(var i = 0, len = ns.length; i < len; i++){
  192.             row = ns[i];
  193.             row.style.width = rw;
  194.             if(row.firstChild){
  195.                 row.firstChild.style.width = rw;
  196.                 row.firstChild.rows[0].childNodes[c].style.width = w;
  197.             }
  198.         }
  199.         this.onColumnWidthUpdated(col, w, this.getTotalWidth());
  200.         this.syncHeaderHeight();
  201.     },
  202.     
  203.     updateColumnHidden : function(col, hidden){
  204.         var llen = this.cm.getLockedCount(),
  205.             ns, rw, c, row,
  206.             display = hidden ? 'none' : '';
  207.         this.updateLockedWidth();
  208.         if(col < llen){
  209.             ns = this.getLockedRows();
  210.             rw = this.getLockedWidth();
  211.             c = col;
  212.         }else{
  213.             ns = this.getRows();
  214.             rw = this.getTotalWidth();
  215.             c = col - llen;
  216.         }
  217.         var hd = this.getHeaderCell(col);
  218.         hd.style.display = display;
  219.         for(var i = 0, len = ns.length; i < len; i++){
  220.             row = ns[i];
  221.             row.style.width = rw;
  222.             if(row.firstChild){
  223.                 row.firstChild.style.width = rw;
  224.                 row.firstChild.rows[0].childNodes[c].style.display = display;
  225.             }
  226.         }
  227.         this.onColumnHiddenUpdated(col, hidden, this.getTotalWidth());
  228.         delete this.lastViewWidth;
  229.         this.layout();
  230.     },
  231.     
  232.     doRender : function(cs, rs, ds, startRow, colCount, stripe){
  233.         var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount-1,
  234.             tstyle = 'width:'+this.getTotalWidth()+';',
  235.             lstyle = 'width:'+this.getLockedWidth()+';',
  236.             buf = [], lbuf = [], cb, lcb, c, p = {}, rp = {}, r;
  237.         for(var j = 0, len = rs.length; j < len; j++){
  238.             r = rs[j]; cb = []; lcb = [];
  239.             var rowIndex = (j+startRow);
  240.             for(var i = 0; i < colCount; i++){
  241.                 c = cs[i];
  242.                 p.id = c.id;
  243.                 p.css = (i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '')) +
  244.                     (this.cm.config[i].cellCls ? ' ' + this.cm.config[i].cellCls : '');
  245.                 p.attr = p.cellAttr = '';
  246.                 p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);
  247.                 p.style = c.style;
  248.                 if(Ext.isEmpty(p.value)){
  249.                     p.value = '&#160;';
  250.                 }
  251.                 if(this.markDirty && r.dirty && Ext.isDefined(r.modified[c.name])){
  252.                     p.css += ' x-grid3-dirty-cell';
  253.                 }
  254.                 if(c.locked){
  255.                     lcb[lcb.length] = ct.apply(p);
  256.                 }else{
  257.                     cb[cb.length] = ct.apply(p);
  258.                 }
  259.             }
  260.             var alt = [];
  261.             if(stripe && ((rowIndex+1) % 2 === 0)){
  262.                 alt[0] = 'x-grid3-row-alt';
  263.             }
  264.             if(r.dirty){
  265.                 alt[1] = ' x-grid3-dirty-row';
  266.             }
  267.             rp.cols = colCount;
  268.             if(this.getRowClass){
  269.                 alt[2] = this.getRowClass(r, rowIndex, rp, ds);
  270.             }
  271.             rp.alt = alt.join(' ');
  272.             rp.cells = cb.join('');
  273.             rp.tstyle = tstyle;
  274.             buf[buf.length] = rt.apply(rp);
  275.             rp.cells = lcb.join('');
  276.             rp.tstyle = lstyle;
  277.             lbuf[lbuf.length] = rt.apply(rp);
  278.         }
  279.         return [buf.join(''), lbuf.join('')];
  280.     },
  281.     processRows : function(startRow, skipStripe){
  282.         if(!this.ds || this.ds.getCount() < 1){
  283.             return;
  284.         }
  285.         var rows = this.getRows(),
  286.             lrows = this.getLockedRows(),
  287.             row, lrow;
  288.         skipStripe = skipStripe || !this.grid.stripeRows;
  289.         startRow = startRow || 0;
  290.         for(var i = 0, len = rows.length; i < len; ++i){
  291.             row = rows[i];
  292.             lrow = lrows[i];
  293.             row.rowIndex = i;
  294.             lrow.rowIndex = i;
  295.             if(!skipStripe){
  296.                 row.className = row.className.replace(this.rowClsRe, ' ');
  297.                 lrow.className = lrow.className.replace(this.rowClsRe, ' ');
  298.                 if ((idx + 1) % 2 === 0){
  299.                     row.className += ' x-grid3-row-alt';
  300.                     lrow.className += ' x-grid3-row-alt';
  301.                 }
  302.             }
  303.             if(this.syncHeights){
  304.                 var el1 = Ext.get(row),
  305.                     el2 = Ext.get(lrow),
  306.                     h1 = el1.getHeight(),
  307.                     h2 = el2.getHeight();
  308.                 
  309.                 if(h1 > h2){
  310.                     el2.setHeight(h1);    
  311.                 }else if(h2 > h1){
  312.                     el1.setHeight(h2);
  313.                 }
  314.             }
  315.         }
  316.         if(startRow === 0){
  317.             Ext.fly(rows[0]).addClass(this.firstRowCls);
  318.             Ext.fly(lrows[0]).addClass(this.firstRowCls);
  319.         }
  320.         Ext.fly(rows[rows.length - 1]).addClass(this.lastRowCls);
  321.         Ext.fly(lrows[lrows.length - 1]).addClass(this.lastRowCls);
  322.     },
  323.     
  324.     afterRender : function(){
  325.         if(!this.ds || !this.cm){
  326.             return;
  327.         }
  328.         var bd = this.renderRows() || ['&#160;', '&#160;'];
  329.         this.mainBody.dom.innerHTML = bd[0];
  330.         this.lockedBody.dom.innerHTML = bd[1];
  331.         this.processRows(0, true);
  332.         if(this.deferEmptyText !== true){
  333.             this.applyEmptyText();
  334.         }
  335.     },
  336.     
  337.     renderUI : function(){
  338.         var header = this.renderHeaders();
  339.         var body = this.templates.body.apply({rows:'&#160;'});
  340.         var html = this.templates.master.apply({
  341.             body: body,
  342.             header: header[0],
  343.             ostyle: 'width:'+this.getOffsetWidth()+';',
  344.             bstyle: 'width:'+this.getTotalWidth()+';',
  345.             lockedBody: body,
  346.             lockedHeader: header[1],
  347.             lstyle: 'width:'+this.getLockedWidth()+';'
  348.         });
  349.         var g = this.grid;
  350.         g.getGridEl().dom.innerHTML = html;
  351.         this.initElements();
  352.         Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
  353.         Ext.fly(this.lockedInnerHd).on('click', this.handleHdDown, this);
  354.         this.mainHd.on({
  355.             scope: this,
  356.             mouseover: this.handleHdOver,
  357.             mouseout: this.handleHdOut,
  358.             mousemove: this.handleHdMove
  359.         });
  360.         this.lockedHd.on({
  361.             scope: this,
  362.             mouseover: this.handleHdOver,
  363.             mouseout: this.handleHdOut,
  364.             mousemove: this.handleHdMove
  365.         });
  366.         this.scroller.on('scroll', this.syncScroll,  this);
  367.         if(g.enableColumnResize !== false){
  368.             this.splitZone = new Ext.grid.GridView.SplitDragZone(g, this.mainHd.dom);
  369.             this.splitZone.setOuterHandleElId(Ext.id(this.lockedHd.dom));
  370.             this.splitZone.setOuterHandleElId(Ext.id(this.mainHd.dom));
  371.         }
  372.         if(g.enableColumnMove){
  373.             this.columnDrag = new Ext.grid.GridView.ColumnDragZone(g, this.innerHd);
  374.             this.columnDrag.setOuterHandleElId(Ext.id(this.lockedInnerHd));
  375.             this.columnDrag.setOuterHandleElId(Ext.id(this.innerHd));
  376.             this.columnDrop = new Ext.grid.HeaderDropZone(g, this.mainHd.dom);
  377.         }
  378.         if(g.enableHdMenu !== false){
  379.             this.hmenu = new Ext.menu.Menu({id: g.id + '-hctx'});
  380.             this.hmenu.add(
  381.                 {itemId: 'asc', text: this.sortAscText, cls: 'xg-hmenu-sort-asc'},
  382.                 {itemId: 'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
  383.             );
  384.             if(this.grid.enableColLock !== false){
  385.                 this.hmenu.add('-',
  386.                     {itemId: 'lock', text: this.lockText, cls: 'xg-hmenu-lock'},
  387.                     {itemId: 'unlock', text: this.unlockText, cls: 'xg-hmenu-unlock'}
  388.                 );
  389.             }
  390.             if(g.enableColumnHide !== false){
  391.                 this.colMenu = new Ext.menu.Menu({id:g.id + '-hcols-menu'});
  392.                 this.colMenu.on({
  393.                     scope: this,
  394.                     beforeshow: this.beforeColMenuShow,
  395.                     itemclick: this.handleHdMenuClick
  396.                 });
  397.                 this.hmenu.add('-', {
  398.                     itemId:'columns',
  399.                     hideOnClick: false,
  400.                     text: this.columnsText,
  401.                     menu: this.colMenu,
  402.                     iconCls: 'x-cols-icon'
  403.                 });
  404.             }
  405.             this.hmenu.on('itemclick', this.handleHdMenuClick, this);
  406.         }
  407.         if(g.trackMouseOver){
  408.             this.mainBody.on({
  409.                 scope: this,
  410.                 mouseover: this.onRowOver,
  411.                 mouseout: this.onRowOut
  412.             });
  413.             this.lockedBody.on({
  414.                 scope: this,
  415.                 mouseover: this.onRowOver,
  416.                 mouseout: this.onRowOut
  417.             });
  418.         }
  419.         
  420.         if(g.enableDragDrop || g.enableDrag){
  421.             this.dragZone = new Ext.grid.GridDragZone(g, {
  422.                 ddGroup : g.ddGroup || 'GridDD'
  423.             });
  424.         }
  425.         this.updateHeaderSortState();
  426.     },
  427.     
  428.     layout : function(){
  429.         if(!this.mainBody){
  430.             return;
  431.         }
  432.         var g = this.grid;
  433.         var c = g.getGridEl();
  434.         var csize = c.getSize(true);
  435.         var vw = csize.width;
  436.         if(!g.hideHeaders && (vw < 20 || csize.height < 20)){
  437.             return;
  438.         }
  439.         this.syncHeaderHeight();
  440.         if(g.autoHeight){
  441.             this.scroller.dom.style.overflow = 'visible';
  442.             this.lockedScroller.dom.style.overflow = 'visible';
  443.             if(Ext.isWebKit){
  444.                 this.scroller.dom.style.position = 'static';
  445.                 this.lockedScroller.dom.style.position = 'static';
  446.             }
  447.         }else{
  448.             this.el.setSize(csize.width, csize.height);
  449.             var hdHeight = this.mainHd.getHeight();
  450.             var vh = csize.height - (hdHeight);
  451.         }
  452.         this.updateLockedWidth();
  453.         if(this.forceFit){
  454.             if(this.lastViewWidth != vw){
  455.                 this.fitColumns(false, false);
  456.                 this.lastViewWidth = vw;
  457.             }
  458.         }else {
  459.             this.autoExpand();
  460.             this.syncHeaderScroll();
  461.         }
  462.         this.onLayout(vw, vh);
  463.     },
  464.     
  465.     getOffsetWidth : function() {
  466.         return (this.cm.getTotalWidth() - this.cm.getTotalLockedWidth() + this.getScrollOffset()) + 'px';
  467.     },
  468.     
  469.     renderHeaders : function(){
  470.         var cm = this.cm,
  471.             ts = this.templates,
  472.             ct = ts.hcell,
  473.             cb = [], lcb = [],
  474.             p = {},
  475.             len = cm.getColumnCount(),
  476.             last = len - 1;
  477.         for(var i = 0; i < len; i++){
  478.             p.id = cm.getColumnId(i);
  479.             p.value = cm.getColumnHeader(i) || '';
  480.             p.style = this.getColumnStyle(i, true);
  481.             p.tooltip = this.getColumnTooltip(i);
  482.             p.css = (i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '')) +
  483.                 (cm.config[i].headerCls ? ' ' + cm.config[i].headerCls : '');
  484.             if(cm.config[i].align == 'right'){
  485.                 p.istyle = 'padding-right:16px';
  486.             } else {
  487.                 delete p.istyle;
  488.             }
  489.             if(cm.isLocked(i)){
  490.                 lcb[lcb.length] = ct.apply(p);
  491.             }else{
  492.                 cb[cb.length] = ct.apply(p);
  493.             }
  494.         }
  495.         return [ts.header.apply({cells: cb.join(''), tstyle:'width:'+this.getTotalWidth()+';'}),
  496.                 ts.header.apply({cells: lcb.join(''), tstyle:'width:'+this.getLockedWidth()+';'})];
  497.     },
  498.     
  499.     updateHeaders : function(){
  500.         var hd = this.renderHeaders();
  501.         this.innerHd.firstChild.innerHTML = hd[0];
  502.         this.innerHd.firstChild.style.width = this.getOffsetWidth();
  503.         this.innerHd.firstChild.firstChild.style.width = this.getTotalWidth();
  504.         this.lockedInnerHd.firstChild.innerHTML = hd[1];
  505.         var lw = this.getLockedWidth();
  506.         this.lockedInnerHd.firstChild.style.width = lw;
  507.         this.lockedInnerHd.firstChild.firstChild.style.width = lw;
  508.     },
  509.     
  510.     getResolvedXY : function(resolved){
  511.         if(!resolved){
  512.             return null;
  513.         }
  514.         var c = resolved.cell, r = resolved.row;
  515.         return c ? Ext.fly(c).getXY() : [this.scroller.getX(), Ext.fly(r).getY()];
  516.     },
  517.     
  518.     syncFocusEl : function(row, col, hscroll){
  519.         Ext.ux.grid.LockingGridView.superclass.syncFocusEl.call(this, row, col, col < this.cm.getLockedCount() ? false : hscroll);
  520.     },
  521.     
  522.     ensureVisible : function(row, col, hscroll){
  523.         return Ext.ux.grid.LockingGridView.superclass.ensureVisible.call(this, row, col, col < this.cm.getLockedCount() ? false : hscroll);
  524.     },
  525.     
  526.     insertRows : function(dm, firstRow, lastRow, isUpdate){
  527.         var last = dm.getCount() - 1;
  528.         if(!isUpdate && firstRow === 0 && lastRow >= last){
  529.             this.refresh();
  530.         }else{
  531.             if(!isUpdate){
  532.                 this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
  533.             }
  534.             var html = this.renderRows(firstRow, lastRow),
  535.                 before = this.getRow(firstRow);
  536.             if(before){
  537.                 if(firstRow === 0){
  538.                     this.removeRowClass(0, this.firstRowCls);
  539.                 }
  540.                 Ext.DomHelper.insertHtml('beforeBegin', before, html[0]);
  541.                 before = this.getLockedRow(firstRow);
  542.                 Ext.DomHelper.insertHtml('beforeBegin', before, html[1]);
  543.             }else{
  544.                 this.removeRowClass(last - 1, this.lastRowCls);
  545.                 Ext.DomHelper.insertHtml('beforeEnd', this.mainBody.dom, html[0]);
  546.                 Ext.DomHelper.insertHtml('beforeEnd', this.lockedBody.dom, html[1]);
  547.             }
  548.             if(!isUpdate){
  549.                 this.fireEvent('rowsinserted', this, firstRow, lastRow);
  550.                 this.processRows(firstRow);
  551.             }else if(firstRow === 0 || firstRow >= last){
  552.                 this.addRowClass(firstRow, firstRow === 0 ? this.firstRowCls : this.lastRowCls);
  553.             }
  554.         }
  555.         this.syncFocusEl(firstRow);
  556.     },
  557.     
  558.     getColumnStyle : function(col, isHeader){
  559.         var style = !isHeader ? this.cm.config[col].cellStyle || this.cm.config[col].css || '' : this.cm.config[col].headerStyle || '';
  560.         style += 'width:'+this.getColumnWidth(col)+';';
  561.         if(this.cm.isHidden(col)){
  562.             style += 'display:none;';
  563.         }
  564.         var align = this.cm.config[col].align;
  565.         if(align){
  566.             style += 'text-align:'+align+';';
  567.         }
  568.         return style;
  569.     },
  570.     
  571.     getLockedWidth : function() {
  572.         return this.cm.getTotalLockedWidth() + 'px';
  573.     },
  574.     
  575.     getTotalWidth : function() {
  576.         return (this.cm.getTotalWidth() - this.cm.getTotalLockedWidth()) + 'px';
  577.     },
  578.     
  579.     getColumnData : function(){
  580.         var cs = [], cm = this.cm, colCount = cm.getColumnCount();
  581.         for(var i = 0; i < colCount; i++){
  582.             var name = cm.getDataIndex(i);
  583.             cs[i] = {
  584.                 name : (!Ext.isDefined(name) ? this.ds.fields.get(i).name : name),
  585.                 renderer : cm.getRenderer(i),
  586.                 id : cm.getColumnId(i),
  587.                 style : this.getColumnStyle(i),
  588.                 locked : cm.isLocked(i)
  589.             };
  590.         }
  591.         return cs;
  592.     },
  593.     
  594.     renderBody : function(){
  595.         var markup = this.renderRows() || ['&#160;', '&#160;'];
  596.         return [this.templates.body.apply({rows: markup[0]}), this.templates.body.apply({rows: markup[1]})];
  597.     },
  598.     
  599.     refreshRow : function(record){
  600.         Ext.ux.grid.LockingGridView.superclass.refreshRow.call(this, record);
  601.         var index = Ext.isNumber(record) ? record : this.ds.indexOf(record);
  602.         this.getLockedRow(index).rowIndex = index;
  603.     },
  604.     
  605.     refresh : function(headersToo){
  606.         this.fireEvent('beforerefresh', this);
  607.         this.grid.stopEditing(true);
  608.         var result = this.renderBody();
  609.         this.mainBody.update(result[0]).setWidth(this.getTotalWidth());
  610.         this.lockedBody.update(result[1]).setWidth(this.getLockedWidth());
  611.         if(headersToo === true){
  612.             this.updateHeaders();
  613.             this.updateHeaderSortState();
  614.         }
  615.         this.processRows(0, true);
  616.         this.layout();
  617.         this.applyEmptyText();
  618.         this.fireEvent('refresh', this);
  619.     },
  620.     
  621.     onDenyColumnLock : function(){
  623.     },
  624.     
  625.     initData : function(ds, cm){
  626.         if(this.cm){
  627.             this.cm.un('columnlockchange', this.onColumnLock, this);
  628.         }
  629.         Ext.ux.grid.LockingGridView.superclass.initData.call(this, ds, cm);
  630.         if(this.cm){
  631.             this.cm.on('columnlockchange', this.onColumnLock, this);
  632.         }
  633.     },
  634.     
  635.     onColumnLock : function(){
  636.         this.refresh(true);
  637.     },
  638.     
  639.     handleHdMenuClick : function(item){
  640.         var index = this.hdCtxIndex,
  641.             cm = this.cm,
  642.             id = item.getItemId(),
  643.             llen = cm.getLockedCount();
  644.         switch(id){
  645.             case 'lock':
  646.                 if(cm.getColumnCount(true) <= llen + 1){
  647.                     this.onDenyColumnLock();
  648.                     return;
  649.                 }
  650.                 if(llen != index){
  651.                     cm.setLocked(index, true, true);
  652.                     cm.moveColumn(index, llen);
  653.                     this.grid.fireEvent('columnmove', index, llen);
  654.                 }else{
  655.                     cm.setLocked(index, true);
  656.                 }
  657.             break;
  658.             case 'unlock':
  659.                 if(llen - 1 != index){
  660.                     cm.setLocked(index, false, true);
  661.                     cm.moveColumn(index, llen - 1);
  662.                     this.grid.fireEvent('columnmove', index, llen - 1);
  663.                 }else{
  664.                     cm.setLocked(index, false);
  665.                 }
  666.             break;
  667.             default:
  668.                 return Ext.ux.grid.LockingGridView.superclass.handleHdMenuClick.call(this, item);
  669.         }
  670.         return true;
  671.     },
  672.     
  673.     handleHdDown : function(e, t){
  674.         Ext.ux.grid.LockingGridView.superclass.handleHdDown.call(this, e, t);
  675.         if(this.grid.enableColLock !== false){
  676.             if(Ext.fly(t).hasClass('x-grid3-hd-btn')){
  677.                 var hd = this.findHeaderCell(t),
  678.                     index = this.getCellIndex(hd),
  679.                     ms = this.hmenu.items, cm = this.cm;
  680.                 ms.get('lock').setDisabled(cm.isLocked(index));
  681.                 ms.get('unlock').setDisabled(!cm.isLocked(index));
  682.             }
  683.         }
  684.     },
  685.     
  686.     syncHeaderHeight: function(){
  687.         this.innerHd.firstChild.firstChild.style.height = 'auto';
  688.         this.lockedInnerHd.firstChild.firstChild.style.height = 'auto';
  689.         var hd = this.innerHd.firstChild.firstChild.offsetHeight,
  690.             lhd = this.lockedInnerHd.firstChild.firstChild.offsetHeight,
  691.             height = (lhd > hd ? lhd : hd) + 'px';
  692.         this.innerHd.firstChild.firstChild.style.height = height;
  693.         this.lockedInnerHd.firstChild.firstChild.style.height = height;
  694.     },
  695.     
  696.     updateLockedWidth: function(){
  697.         var lw = this.cm.getTotalLockedWidth(),
  698.             tw = this.cm.getTotalWidth() - lw,
  699.             csize = this.grid.getGridEl().getSize(true),
  700.             lp = Ext.isBorderBox ? 0 : this.lockedBorderWidth,
  701.             rp = Ext.isBorderBox ? 0 : this.rowBorderWidth,
  702.             vw = (csize.width - lw - lp - rp) + 'px',
  703.             so = this.getScrollOffset();
  704.         if(!this.grid.autoHeight){
  705.             var vh = (csize.height - this.mainHd.getHeight()) + 'px';
  706.             this.lockedScroller.dom.style.height = vh;
  707.             this.scroller.dom.style.height = vh;
  708.         }
  709.         this.lockedWrap.dom.style.width = (lw + rp) + 'px';
  710.         this.scroller.dom.style.width = vw;
  711.         this.mainWrap.dom.style.left = (lw + lp + rp) + 'px';
  712.         if(this.innerHd){
  713.             this.lockedInnerHd.firstChild.style.width = lw + 'px';
  714.             this.lockedInnerHd.firstChild.firstChild.style.width = lw + 'px';
  715.             this.innerHd.style.width = vw;
  716.             this.innerHd.firstChild.style.width = (tw + rp + so) + 'px';
  717.             this.innerHd.firstChild.firstChild.style.width = tw + 'px';
  718.         }
  719.         if(this.mainBody){
  720.             this.lockedBody.dom.style.width = (lw + rp) + 'px';
  721.             this.mainBody.dom.style.width = (tw + rp) + 'px';
  722.         }
  723.     }
  724. });
  726. Ext.ux.grid.LockingColumnModel = Ext.extend(Ext.grid.ColumnModel, {
  727.     isLocked : function(colIndex){
  728.         return this.config[colIndex].locked === true;
  729.     },
  730.     
  731.     setLocked : function(colIndex, value, suppressEvent){
  732.         if(this.isLocked(colIndex) == value){
  733.             return;
  734.         }
  735.         this.config[colIndex].locked = value;
  736.         if(!suppressEvent){
  737.             this.fireEvent('columnlockchange', this, colIndex, value);
  738.         }
  739.     },
  740.     
  741.     getTotalLockedWidth : function(){
  742.         var totalWidth = 0;
  743.         for(var i = 0, len = this.config.length; i < len; i++){
  744.             if(this.isLocked(i) && !this.isHidden(i)){
  745.                 totalWidth += this.getColumnWidth(i);
  746.             }
  747.         }
  748.         return totalWidth;
  749.     },
  750.     
  751.     getLockedCount : function(){
  752.         for(var i = 0, len = this.config.length; i < len; i++){
  753.             if(!this.isLocked(i)){
  754.                 return i;
  755.             }
  756.         }
  757.     },
  758.     
  759.     moveColumn : function(oldIndex, newIndex){
  760.         if(oldIndex < newIndex && this.isLocked(oldIndex) && !this.isLocked(newIndex)){
  761.             this.setLocked(oldIndex, false, true);
  762.         }else if(oldIndex > newIndex && !this.isLocked(oldIndex) && this.isLocked(newIndex)){
  763.             this.setLocked(oldIndex, true, true);
  764.         }
  765.         Ext.ux.grid.LockingColumnModel.superclass.moveColumn.apply(this, arguments);
  766.     }
  767. });