diff --git a/deluge/ui/web/js/deluge-all/Deluge.Details.Files.js b/deluge/ui/web/js/deluge-all/Deluge.Details.Files.js index b96fe95b0..47f51c0b6 100644 --- a/deluge/ui/web/js/deluge-all/Deluge.Details.Files.js +++ b/deluge/ui/web/js/deluge-all/Deluge.Details.Files.js @@ -40,7 +40,7 @@ Copyright: return String.format('
{1}
', FILE_PRIORITY_CSS[value], _(FILE_PRIORITY[value])); } - Ext.deluge.details.FilesTab = Ext.extend(Ext.tree.ColumnTree, { + Ext.deluge.details.FilesTab = Ext.extend(Ext.ux.tree.TreeGrid, { constructor: function(config) { config = Ext.apply({ @@ -54,16 +54,19 @@ Copyright: width: 330, dataIndex: 'filename' }, { + xtype: 'tgcustomcolumn', header: _('Size'), width: 150, dataIndex: 'size', renderer: fsize }, { + xtype: 'tgcustomcolumn', header: _('Progress'), width: 150, dataIndex: 'progress', renderer: fileProgressRenderer }, { + xtype: 'tgcustomcolumn', header: _('Priority'), width: 150, dataIndex: 'priority', @@ -74,8 +77,14 @@ Copyright: text: 'Files' }) }, config); + Ext.deluge.details.FilesTab.superclass.constructor.call(this, config); }, + + initComponent: function() { + + Ext.deluge.details.FilesTab.superclass.initComponent.call(this); + }, onRender: function(ct, position) { Ext.deluge.details.FilesTab.superclass.onRender.call(this, ct, position); @@ -173,14 +182,15 @@ Copyright: if (!child) { child = new Ext.tree.TreeNode({ id: file, - text: file + text: file, + filename: file }); parent.appendChild(child); } walk(item, child); } else { if (!child) { - child = new Ext.tree.ColumnTreeNode({ + child = new Ext.tree.TreeNode({ id: file, filename: file, text: file, // this needs to be here for sorting @@ -190,13 +200,10 @@ Copyright: priority: item[3], leaf: true, iconCls: 'x-deluge-file', - uiProvider: Ext.tree.ColumnNodeUI + uiProvider: Ext.ux.tree.TreeGridNodeUI }); parent.appendChild(child); } - child.setColumnValue(1, item[1]); - child.setColumnValue(2, item[2]); - child.setColumnValue(3, item[3]); } } } diff --git a/deluge/ui/web/js/deluge-all/Deluge.Formatters.js b/deluge/ui/web/js/deluge-all/Deluge.Formatters.js index be2ac0fa6..6a64f0c17 100644 --- a/deluge/ui/web/js/deluge-all/Deluge.Formatters.js +++ b/deluge/ui/web/js/deluge-all/Deluge.Formatters.js @@ -64,6 +64,7 @@ Deluge.Formatters = { * @returns {string} formatted string with KiB, MiB or GiB units. */ size: function(bytes) { + if (!bytes) return ''; bytes = bytes / 1024.0; if (bytes < 1024) { return bytes.toFixed(1) + ' KiB'; } diff --git a/deluge/ui/web/js/ext-extensions/.build b/deluge/ui/web/js/ext-extensions/.build index 4ea8f8ffa..476cc2989 100644 --- a/deluge/ui/web/js/ext-extensions/.build +++ b/deluge/ui/web/js/ext-extensions/.build @@ -12,4 +12,5 @@ add_file "TreeGridColumnResizer.js" add_file "TreeGridNodeUI.js" add_file "TreeGridLoader.js" add_file "TreeGridColumns.js" +add_file "TreeGridCustomColumn.js" add_file "TreeGrid.js" diff --git a/deluge/ui/web/js/ext-extensions/TreeGridCustomColumn.js b/deluge/ui/web/js/ext-extensions/TreeGridCustomColumn.js new file mode 100644 index 000000000..b4b0f0e7c --- /dev/null +++ b/deluge/ui/web/js/ext-extensions/TreeGridCustomColumn.js @@ -0,0 +1,9 @@ +Ext.tree.CustomColumn = Ext.extend(Ext.tree.Column, { + + constructor: function(c) { + c.tpl = c.tpl || new Ext.XTemplate('{' + c.dataIndex + ':this.format}'); + c.tpl.format = c.renderer; + Ext.tree.CustomColumn.superclass.constructor.call(this, c); + } +}); +Ext.reg('tgcustomcolumn', Ext.tree.CustomColumn); diff --git a/deluge/ui/web/server.py b/deluge/ui/web/server.py index 8fe70126b..8f5c94b56 100644 --- a/deluge/ui/web/server.py +++ b/deluge/ui/web/server.py @@ -331,6 +331,7 @@ class TopLevel(resource.Resource): "/js/ext-extensions/TreeGridNodeUI.js", "/js/ext-extensions/TreeGridLoader.js", "/js/ext-extensions/TreeGridColumns.js", + "/js/ext-extensions/TreeGridCustomColumn.js", "/js/ext-extensions/TreeGrid.js", "/config.js", "/gettext.js",