X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..6e39d509471fe9b4e2660e0d1631b350d0c66f40:/src/widgets/grid/GridView.js

diff --git a/src/widgets/grid/GridView.js b/src/widgets/grid/GridView.js
index 492b49ce..407b7aa6 100644
--- a/src/widgets/grid/GridView.js
+++ b/src/widgets/grid/GridView.js
@@ -1,5 +1,5 @@
 /*!
- * Ext JS Library 3.0.3
+ * Ext JS Library 3.1.0
  * Copyright(c) 2006-2009 Ext JS, LLC
  * licensing@extjs.com
  * http://www.extjs.com/license
@@ -15,67 +15,7 @@
  * @constructor
  * @param {Object} config
  */
-Ext.grid.GridView = function(config){
-    Ext.apply(this, config);
-    // These events are only used internally by the grid components
-    this.addEvents(
-        /**
-         * @event beforerowremoved
-         * Internal UI Event. Fired before a row is removed.
-         * @param {Ext.grid.GridView} view
-         * @param {Number} rowIndex The index of the row to be removed.
-         * @param {Ext.data.Record} record The Record to be removed
-         */
-        'beforerowremoved',
-        /**
-         * @event beforerowsinserted
-         * Internal UI Event. Fired before rows are inserted.
-         * @param {Ext.grid.GridView} view
-         * @param {Number} firstRow The index of the first row to be inserted.
-         * @param {Number} lastRow The index of the last row to be inserted.
-         */
-        'beforerowsinserted',
-        /**
-         * @event beforerefresh
-         * Internal UI Event. Fired before the view is refreshed.
-         * @param {Ext.grid.GridView} view
-         */
-        'beforerefresh',
-        /**
-         * @event rowremoved
-         * Internal UI Event. Fired after a row is removed.
-         * @param {Ext.grid.GridView} view
-         * @param {Number} rowIndex The index of the row that was removed.
-         * @param {Ext.data.Record} record The Record that was removed
-         */
-        'rowremoved',
-        /**
-         * @event rowsinserted
-         * Internal UI Event. Fired after rows are inserted.
-         * @param {Ext.grid.GridView} view
-         * @param {Number} firstRow The index of the first inserted.
-         * @param {Number} lastRow The index of the last row inserted.
-         */
-        'rowsinserted',
-        /**
-         * @event rowupdated
-         * Internal UI Event. Fired after a row has been updated.
-         * @param {Ext.grid.GridView} view
-         * @param {Number} firstRow The index of the row updated.
-         * @param {Ext.data.record} record The Record backing the row updated.
-         */
-        'rowupdated',
-        /**
-         * @event refresh
-         * Internal UI Event. Fired after the GridView's body has been refreshed.
-         * @param {Ext.grid.GridView} view
-         */
-        'refresh'
-    );
-    Ext.grid.GridView.superclass.constructor.call(this);
-};
-
-Ext.extend(Ext.grid.GridView, Ext.util.Observable, {
+Ext.grid.GridView = Ext.extend(Ext.util.Observable, {
     /**
      * Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
      * parameters to the row template for the current row to customize how it is rendered using the <b>rowParams</b>
@@ -224,6 +164,11 @@ viewConfig: {
      * @cfg {Number} rowSelectorDepth The number of levels to search for rows in event delegation (defaults to <tt>10</tt>)
      */
     rowSelectorDepth : 10,
+    
+    /**
+     * @cfg {Number} rowBodySelectorDepth The number of levels to search for row bodies in event delegation (defaults to <tt>10</tt>)
+     */
+    rowBodySelectorDepth : 10,
 
     /**
      * @cfg {String} cellSelector The selector used to find cells internally (defaults to <tt>'td.x-grid3-cell'</tt>)
@@ -234,10 +179,75 @@ viewConfig: {
      */
     rowSelector : 'div.x-grid3-row',
     
+    /**
+     * @cfg {String} rowBodySelector The selector used to find row bodies internally (defaults to <tt>'div.x-grid3-row'</tt>)
+     */
+    rowBodySelector : 'div.x-grid3-row-body',
+    
     // private
     firstRowCls: 'x-grid3-row-first',
     lastRowCls: 'x-grid3-row-last',
     rowClsRe: /(?:^|\s+)x-grid3-row-(first|last|alt)(?:\s+|$)/g,
+    
+    constructor : function(config){
+        Ext.apply(this, config);
+	    // These events are only used internally by the grid components
+	    this.addEvents(
+	        /**
+	         * @event beforerowremoved
+	         * Internal UI Event. Fired before a row is removed.
+	         * @param {Ext.grid.GridView} view
+	         * @param {Number} rowIndex The index of the row to be removed.
+	         * @param {Ext.data.Record} record The Record to be removed
+	         */
+	        'beforerowremoved',
+	        /**
+	         * @event beforerowsinserted
+	         * Internal UI Event. Fired before rows are inserted.
+	         * @param {Ext.grid.GridView} view
+	         * @param {Number} firstRow The index of the first row to be inserted.
+	         * @param {Number} lastRow The index of the last row to be inserted.
+	         */
+	        'beforerowsinserted',
+	        /**
+	         * @event beforerefresh
+	         * Internal UI Event. Fired before the view is refreshed.
+	         * @param {Ext.grid.GridView} view
+	         */
+	        'beforerefresh',
+	        /**
+	         * @event rowremoved
+	         * Internal UI Event. Fired after a row is removed.
+	         * @param {Ext.grid.GridView} view
+	         * @param {Number} rowIndex The index of the row that was removed.
+	         * @param {Ext.data.Record} record The Record that was removed
+	         */
+	        'rowremoved',
+	        /**
+	         * @event rowsinserted
+	         * Internal UI Event. Fired after rows are inserted.
+	         * @param {Ext.grid.GridView} view
+	         * @param {Number} firstRow The index of the first inserted.
+	         * @param {Number} lastRow The index of the last row inserted.
+	         */
+	        'rowsinserted',
+	        /**
+	         * @event rowupdated
+	         * Internal UI Event. Fired after a row has been updated.
+	         * @param {Ext.grid.GridView} view
+	         * @param {Number} firstRow The index of the row updated.
+	         * @param {Ext.data.record} record The Record backing the row updated.
+	         */
+	        'rowupdated',
+	        /**
+	         * @event refresh
+	         * Internal UI Event. Fired after the GridView's body has been refreshed.
+	         * @param {Ext.grid.GridView} view
+	         */
+	        'refresh'
+	    );
+	    Ext.grid.GridView.superclass.constructor.call(this);    
+    },
 
     /* -------------------------------- UI Specific ----------------------------- */
 
@@ -296,7 +306,7 @@ viewConfig: {
 
         for(var k in ts){
             var t = ts[k];
-            if(t && typeof t.compile == 'function' && !t.compiled){
+            if(t && Ext.isFunction(t.compile) && !t.compiled){
                 t.disableFormats = true;
                 t.compile();
             }
@@ -429,6 +439,18 @@ viewConfig: {
         var r = this.findRow(el);
         return r ? r.rowIndex : false;
     },
+    
+    /**
+     * Return the HtmlElement representing the grid row body which contains the passed element.
+     * @param {HTMLElement} el The target HTMLElement
+     * @return {HTMLElement} The row body element, or null if the target element is not within a row body of this GridView.
+     */
+    findRowBody : function(el){
+        if(!el){
+            return false;
+        }
+        return this.fly(el).findParent(this.rowBodySelector, this.rowBodySelectorDepth);
+    },
 
     // getter methods for fetching elements dynamically in the grid
 
@@ -634,12 +656,12 @@ viewConfig: {
                 p.id = c.id;
                 p.css = i === 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
                 p.attr = p.cellAttr = '';
-                p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);
+                p.value = c.renderer.call(c.scope, r.data[c.name], p, r, rowIndex, i, ds);
                 p.style = c.style;
                 if(Ext.isEmpty(p.value)){
                     p.value = '&#160;';
                 }
-                if(this.markDirty && r.dirty && typeof r.modified[c.name] !== 'undefined'){
+                if(this.markDirty && r.dirty && Ext.isDefined(r.modified[c.name])){
                     p.css += ' x-grid3-dirty-cell';
                 }
                 cb[cb.length] = ct.apply(p);
@@ -667,18 +689,24 @@ viewConfig: {
         if(!this.ds || this.ds.getCount() < 1){
             return;
         }
-        var rows = this.getRows();
+        var rows = this.getRows(),
+            len = rows.length,
+            i, r;
+            
         skipStripe = skipStripe || !this.grid.stripeRows;
         startRow = startRow || 0;
-        Ext.each(rows, function(row, idx){
-            row.rowIndex = idx;
-            if(!skipStripe){
-                row.className = row.className.replace(this.rowClsRe, ' ');
-                if ((idx + 1) % 2 === 0){
-                    row.className += ' x-grid3-row-alt';
-                }
-            }
-        }, this);
+        for(i = 0; i<len; i++) {
+            r = rows[i];
+            if(r) {
+                r.rowIndex = i;
+                if(!skipStripe){
+                    r.className = r.className.replace(this.rowClsRe, ' ');
+                    if ((i + 1) % 2 === 0){
+                        r.className += ' x-grid3-row-alt';
+                    }
+                }   
+            }          
+        }
         // add first/last-row classes
         if(startRow === 0){
             Ext.fly(rows[0]).addClass(this.firstRowCls);
@@ -696,6 +724,7 @@ viewConfig: {
         if(this.deferEmptyText !== true){
             this.applyEmptyText();
         }
+        this.grid.fireEvent('viewready', this.grid);
     },
 
     // private
@@ -778,6 +807,9 @@ viewConfig: {
         this.updateHeaderSortState();
 
     },
+    
+    // private
+    processEvent: Ext.emptyFn,
 
     // private
     layout : function(){
@@ -945,7 +977,7 @@ viewConfig: {
     },
 
     resolveCell : function(row, col, hscroll){
-        if(typeof row != "number"){
+        if(!Ext.isNumber(row)){
             row = row.rowIndex;
         }
         if(!this.ds){
@@ -1038,7 +1070,9 @@ viewConfig: {
     insertRows : function(dm, firstRow, lastRow, isUpdate){
         var last = dm.getCount() - 1;
         if(!isUpdate && firstRow === 0 && lastRow >= last){
+	    this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
             this.refresh();
+	    this.fireEvent('rowsinserted', this, firstRow, lastRow);
         }else{
             if(!isUpdate){
                 this.fireEvent('beforerowsinserted', this, firstRow, lastRow);
@@ -1099,7 +1133,7 @@ viewConfig: {
     // private
     getColumnWidth : function(col){
         var w = this.cm.getColumnWidth(col);
-        if(typeof w == 'number'){
+        if(Ext.isNumber(w)){
             return (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2) ? w : (w - this.borderWidth > 0 ? w - this.borderWidth : 0)) + 'px';
         }
         return w;
@@ -1126,7 +1160,7 @@ viewConfig: {
         }
 
         var vc = cm.getColumnCount(true);
-        var ac = vc-(typeof omitColumn == 'number' ? 1 : 0);
+        var ac = vc-(Ext.isNumber(omitColumn) ? 1 : 0);
         if(ac === 0){
             ac = 1;
             omitColumn = undefined;
@@ -1193,8 +1227,9 @@ viewConfig: {
         for(var i = 0; i < colCount; i++){
             var name = cm.getDataIndex(i);
             cs[i] = {
-                name : (typeof name == 'undefined' ? this.ds.fields.get(i).name : name),
+                name : (!Ext.isDefined(name) ? this.ds.fields.get(i).name : name),
                 renderer : cm.getRenderer(i),
+                scope: cm.getRendererScope(i),
                 id : cm.getColumnId(i),
                 style : this.getColumnStyle(i)
             };
@@ -1215,7 +1250,7 @@ viewConfig: {
         var cs = this.getColumnData();
 
         startRow = startRow || 0;
-        endRow = typeof endRow == "undefined"? ds.getCount()-1 : endRow;
+        endRow = !Ext.isDefined(endRow) ? ds.getCount()-1 : endRow;
 
         // records to render
         var rs = ds.getRange(startRow, endRow);
@@ -1232,7 +1267,7 @@ viewConfig: {
     // private
     refreshRow : function(record){
         var ds = this.ds, index;
-        if(typeof record == 'number'){
+        if(Ext.isNumber(record)){
             index = record;
             record = ds.getAt(index);
             if(!record){
@@ -1294,6 +1329,16 @@ viewConfig: {
         }
     },
 
+    // private
+    clearHeaderSortState : function(){
+        if(!this.sortState){
+            return;
+        }
+        this.grid.fireEvent('sortchange', this.grid, null);
+        this.mainHd.select('td').removeClass(this.sortClasses);
+        delete this.sortState;
+    },
+
     // private
     destroy : function(){
         if(this.colMenu){
@@ -1340,9 +1385,9 @@ viewConfig: {
             delete Ext.dd.DDM.ids[this.columnDrop.ddGroup];
         }
 
-        if (this.splitone){ // enableColumnResize
-            this.splitone.destroy();
-            delete this.splitone._domRef;
+        if (this.splitZone){ // enableColumnResize
+            this.splitZone.destroy();
+            delete this.splitZone._domRef;
             delete Ext.dd.DDM.ids["gridSplitters" + this.grid.getGridEl().id];
         }
 
@@ -1471,6 +1516,7 @@ viewConfig: {
 
     // private
     onAdd : function(ds, records, index){
+	
         this.insertRows(ds, index, index + (records.length-1));
     },
 
@@ -1767,11 +1813,15 @@ Ext.extend(Ext.grid.GridView.SplitDragZone, Ext.dd.DDProxy, {
         this.startPos = x;
         Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
     },
+    
+    allowHeaderDrag : function(e){
+        return true;
+    },
 
 
     handleMouseDown : function(e){
         var t = this.view.findHeaderCell(e.getTarget());
-        if(t){
+        if(t && this.allowHeaderDrag(e)){
             var xy = this.view.fly(t).getXY(), x = xy[0], y = xy[1];
             var exy = e.getXY(), ex = exy[0];
             var w = t.offsetWidth, adjust = false;