Upgrade to ExtJS 3.1.0 - Released 12/16/2009
[extjs.git] / src / widgets / list / ListView.js
index 72400f0..8dee5c8 100644 (file)
@@ -1,13 +1,13 @@
 /*!
- * 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
  */
 /**\r
- * @class Ext.ListView\r
+ * @class Ext.list.ListView\r
  * @extends Ext.DataView\r
- * <p>Ext.ListView is a fast and light-weight implentation of a\r
+ * <p>Ext.list.ListView is a fast and light-weight implentation of a\r
  * {@link Ext.grid.GridPanel Grid} like view with the following characteristics:</p>\r
  * <div class="mdetail-params"><ul>\r
  * <li>resizable columns</li>\r
@@ -48,7 +48,7 @@ var store = new Ext.data.JsonStore({
 });\r
 store.load();\r
 \r
-var listView = new Ext.ListView({\r
+var listView = new Ext.list.ListView({\r
     store: store,\r
     multiSelect: true,\r
     emptyText: 'No images to display',\r
@@ -93,7 +93,7 @@ listView.on('selectionchange', function(view, nodes){
  * @param {Object} config\r
  * @xtype listview\r
  */\r
-Ext.ListView = Ext.extend(Ext.DataView, {\r
+Ext.list.ListView = Ext.extend(Ext.DataView, {\r
     /**\r
      * Set this property to <tt>true</tt> to disable the header click handler disabling sort\r
      * (defaults to <tt>false</tt>).\r
@@ -144,7 +144,7 @@ Ext.ListView = Ext.extend(Ext.DataView, {
     scrollOffset : undefined,\r
     /**\r
      * @cfg {Boolean/Object} columnResize\r
-     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.ListView.ColumnResizer}\r
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.ColumnResizer}\r
      * to enable the columns to be resizable (defaults to <tt>true</tt>).\r
      */\r
     columnResize: true,\r
@@ -180,7 +180,7 @@ Ext.ListView = Ext.extend(Ext.DataView, {
      */\r
     /**\r
      * @cfg {Boolean/Object} columnSort\r
-     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.ListView.Sorter}\r
+     * Specify <tt>true</tt> or specify a configuration object for {@link Ext.list.ListView.Sorter}\r
      * to enable the columns to be sortable (defaults to <tt>true</tt>).\r
      */\r
     columnSort: true,\r
@@ -196,18 +196,18 @@ Ext.ListView = Ext.extend(Ext.DataView, {
     \r
     initComponent : function(){\r
         if(this.columnResize){\r
-            this.colResizer = new Ext.ListView.ColumnResizer(this.colResizer);\r
+            this.colResizer = new Ext.list.ColumnResizer(this.colResizer);\r
             this.colResizer.init(this);\r
         }\r
         if(this.columnSort){\r
-            this.colSorter = new Ext.ListView.Sorter(this.columnSort);\r
+            this.colSorter = new Ext.list.Sorter(this.columnSort);\r
             this.colSorter.init(this);\r
         }\r
         if(!this.internalTpl){\r
             this.internalTpl = new Ext.XTemplate(\r
                 '<div class="x-list-header"><div class="x-list-header-inner">',\r
                     '<tpl for="columns">',\r
-                    '<div style="width:{width}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',\r
+                    '<div style="width:{[values.width*100]}%;text-align:{align};"><em unselectable="on" id="',this.id, '-xlhd-{#}">',\r
                         '{header}',\r
                     '</em></div>',\r
                     '</tpl>',\r
@@ -222,7 +222,8 @@ Ext.ListView = Ext.extend(Ext.DataView, {
                 '<tpl for="rows">',\r
                     '<dl>',\r
                         '<tpl for="parent.columns">',\r
-                        '<dt style="width:{width}%;text-align:{align};"><em unselectable="on">',\r
+                        '<dt style="width:{[values.width*100]}%;text-align:{align};">',\r
+                        '<em unselectable="on"<tpl if="cls"> class="{cls}</tpl>">',\r
                             '{[values.tpl.apply(parent)]}',\r
                         '</em></dt>',\r
                         '</tpl>',\r
@@ -231,48 +232,49 @@ Ext.ListView = Ext.extend(Ext.DataView, {
                 '</tpl>'\r
             );\r
         };\r
+        \r
         var cs = this.columns, \r
             allocatedWidth = 0, \r
             colsWithWidth = 0, \r
             len = cs.length, \r
             columns = [];\r
+            \r
         for(var i = 0; i < len; i++){\r
-            var c = Ext.apply({}, cs[i]);\r
-            if(!c.tpl){\r
-                c.tpl = new Ext.XTemplate('{' + c.dataIndex + '}');\r
-            }else if(Ext.isString(c.tpl)){\r
-                c.tpl = new Ext.XTemplate(c.tpl);\r
+            var c = cs[i];\r
+            if(!c.isColumn) {\r
+                c.xtype = c.xtype ? (/^lv/.test(c.xtype) ? c.xtype : 'lv' + c.xtype) : 'lvcolumn';\r
+                c = Ext.create(c);\r
             }\r
-            c.align = c.align || 'left';\r
-            if(Ext.isNumber(c.width)){\r
-                c.width *= 100;\r
-                allocatedWidth += c.width;\r
+            if(c.width) {\r
+                allocatedWidth += c.width*100;\r
                 colsWithWidth++;\r
             }\r
             columns.push(c);\r
         }\r
+        \r
         cs = this.columns = columns;\r
+        \r
         // auto calculate missing column widths\r
         if(colsWithWidth < len){\r
             var remaining = len - colsWithWidth;\r
             if(allocatedWidth < this.maxWidth){\r
-                var perCol = ((this.maxWidth-allocatedWidth) / remaining);\r
+                var perCol = ((this.maxWidth-allocatedWidth) / remaining)/100;\r
                 for(var j = 0; j < len; j++){\r
                     var c = cs[j];\r
-                    if(!Ext.isNumber(c.width)){\r
+                    if(!c.width){\r
                         c.width = perCol;\r
                     }\r
                 }\r
             }\r
         }\r
-        Ext.ListView.superclass.initComponent.call(this);\r
+        Ext.list.ListView.superclass.initComponent.call(this);\r
     },\r
 \r
     onRender : function(){\r
         this.autoEl = {\r
             cls: 'x-list-wrap'  \r
         };\r
-        Ext.ListView.superclass.onRender.apply(this, arguments);\r
+        Ext.list.ListView.superclass.onRender.apply(this, arguments);\r
 \r
         this.internalTpl.overwrite(this.el, {columns: this.columns});\r
         \r
@@ -303,7 +305,7 @@ Ext.ListView = Ext.extend(Ext.DataView, {
      * XTemplate as described above.\r
      */\r
     collectData : function(){\r
-        var rs = Ext.ListView.superclass.collectData.apply(this, arguments);\r
+        var rs = Ext.list.ListView.superclass.collectData.apply(this, arguments);\r
         return {\r
             columns: this.columns,\r
             rows: rs\r
@@ -346,7 +348,7 @@ Ext.ListView = Ext.extend(Ext.DataView, {
     },\r
 \r
     updateIndexes : function(){\r
-        Ext.ListView.superclass.updateIndexes.apply(this, arguments);\r
+        Ext.list.ListView.superclass.updateIndexes.apply(this, arguments);\r
         this.verifyInternalSize();\r
     },\r
 \r
@@ -364,9 +366,12 @@ Ext.ListView = Ext.extend(Ext.DataView, {
     setHdWidths : function(){\r
         var els = this.innerHd.dom.getElementsByTagName('div');\r
         for(var i = 0, cs = this.columns, len = cs.length; i < len; i++){\r
-            els[i].style.width = cs[i].width + '%';\r
+            els[i].style.width = (cs[i].width*100) + '%';\r
         }\r
     }\r
 });\r
 \r
-Ext.reg('listview', Ext.ListView);
\ No newline at end of file
+Ext.reg('listview', Ext.list.ListView);\r
+\r
+// Backwards compatibility alias\r
+Ext.ListView = Ext.list.ListView;
\ No newline at end of file