From 8f0766bfe568427ab30c6c73c8a57ff347adbc02 Mon Sep 17 00:00:00 2001 From: Damien Churchill Date: Sat, 21 Feb 2009 01:23:17 +0000 Subject: [PATCH] update stats on the details tab and add updating when the tab is changed --- deluge/ui/web/css/deluge.css | 2 +- deluge/ui/web/js/deluge-details.js | 101 ++++++++++++++++++++++------- 2 files changed, 78 insertions(+), 25 deletions(-) diff --git a/deluge/ui/web/css/deluge.css b/deluge/ui/web/css/deluge.css index 7b1bea492..1686f5223 100644 --- a/deluge/ui/web/css/deluge.css +++ b/deluge/ui/web/css/deluge.css @@ -69,7 +69,7 @@ html, body { clear: left; } -.deluge-status dd.torrent_name, .deluge-status dd.tracker, .deluge-status dd.path { +.deluge-status dd.torrent_name, .deluge-status dd.status, .deluge-status dd.tracker, .deluge-status dd.path { width: 500px; } diff --git a/deluge/ui/web/js/deluge-details.js b/deluge/ui/web/js/deluge-details.js index 9cf655d2d..0e3ae54ef 100644 --- a/deluge/ui/web/js/deluge-details.js +++ b/deluge/ui/web/js/deluge-details.js @@ -22,26 +22,6 @@ Copyright: Boston, MA 02110-1301, USA. */ -Deluge.Details = { - update: function() { - var torrent = Deluge.Torrents.getSelected(); - if (!torrent) return; - - var tab = this.Panel.getActiveTab(); - if (tab.update) { - tab.update(torrent.id); - } - }, - - onRender: function(panel) { - Deluge.Torrents.Grid.on('rowclick', this.onTorrentsClick.bindWithEvent(this)); - }, - - onTorrentsClick: function(grid, rowIndex, e) { - this.update(); - } -} - Deluge.ProgressBar = Ext.extend(Ext.ProgressBar, { initComponent: function() { Deluge.ProgressBar.superclass.initComponent.call(this); @@ -56,7 +36,7 @@ Deluge.ProgressBar = Ext.extend(Ext.ProgressBar, { if (this.rendered) { var w = Math.floor(value*this.el.dom.firstChild.offsetWidth / 100.0); this.progressBar.setWidth(w, animate === true || (animate !== false && this.animate)); - if(this.textTopEl){ + if (this.textTopEl) { //textTopEl should be the same width as the bar so overflow will clip as the bar moves this.textTopEl.removeClass('x-hidden').setWidth(w); } @@ -67,6 +47,30 @@ Deluge.ProgressBar = Ext.extend(Ext.ProgressBar, { }); Ext.reg('deluge-progress', Deluge.ProgressBar); +Deluge.Details = { + update: function(tab) { + var torrent = Deluge.Torrents.getSelected(); + if (!torrent) return; + + tab = tab || this.Panel.getActiveTab(); + if (tab.update) { + tab.update(torrent.id); + } + }, + + onRender: function(panel) { + Deluge.Torrents.Grid.on('rowclick', this.onTorrentsClick.bindWithEvent(this)); + }, + + onTabChange: function(panel, tab) { + this.update(tab); + }, + + onTorrentsClick: function(grid, rowIndex, e) { + this.update(); + } +} + Deluge.Details.Status = { onRender: function(panel) { this.panel = panel; @@ -139,7 +143,51 @@ Deluge.Details.Status = { Deluge.Details.Details = { onRender: function(panel) { this.panel = panel.load({ - url: '/render/tab_details.html' + url: '/render/tab_details.html', + text: _('Loading') + '...', + callback: this.onLoaded.bindWithEvent(this) + }); + this.panel.update = this.update.bind(this); + }, + + onLoaded: function() { + this.getFields(); + if (Deluge.Details.Panel.getActiveTab() == this.panel) { + Deluge.Details.update(this.panel); + } + }, + + onRequestComplete: function(torrent) { + var fsize = Deluge.Formatters.size; + var data = { + torrent_name: torrent.name, + hash: torrent.id, + path: torrent.save_path, + size: fsize(torrent.total_size), + files: torrent.num_files, + status: torrent.tracker_status, + tracker: torrent.tracker + }; + this.fields.each(function(value, key) { + value.set('text', data[key]); + }, this); + }, + + getFields: function() { + this.fields = new Hash(); + this.panel.body.dom.getElements('dd').each(function(item) { + this.fields[item.getProperty('class')] = item; + }, this); + }, + + update: function(torrentId) { + if (!this.fields) { + this.getFields(torrentId); + // the pane isn't loaded yet and subsequently needs to pause + if (!this.fields) return; + } + Deluge.Client.core.get_torrent_status(torrentId, Deluge.Keys.Details, { + onSuccess: this.onRequestComplete.bind(this) }); } } @@ -155,11 +203,13 @@ Deluge.Details.Panel = new Ext.TabPanel({ items: [{ id: 'status', title: _('Status'), + cls: 'deluge-status', listeners: {'render': {fn: Deluge.Details.Status.onRender, scope: Deluge.Details.Status}} },{ id: 'details', title: _('Details'), - listeners: {'render': {fn: Deluge.Details.Details.onRender, scope: Deluge.Details.Status}} + cls: 'deluge-status', + listeners: {'render': {fn: Deluge.Details.Details.onRender, scope: Deluge.Details.Details}} },{ id: 'files', title: _('Files') @@ -170,5 +220,8 @@ Deluge.Details.Panel = new Ext.TabPanel({ id: 'options', title: _('Options') }], - listeners: {'render': {fn: Deluge.Details.onRender, scope: Deluge.Details}} + listeners: { + 'render': {fn: Deluge.Details.onRender, scope: Deluge.Details}, + 'tabchange': {fn: Deluge.Details.onTabChange, scope: Deluge.Details} + } }); \ No newline at end of file