mirror of
https://git.deluge-torrent.org/deluge
synced 2025-08-08 09:28:41 +00:00
web: fix the details status tab
Start porting over the status tab to the new extjs4 format
This commit is contained in:
parent
717e66b836
commit
f5e6eabee4
1 changed files with 77 additions and 19 deletions
|
@ -32,41 +32,79 @@
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @class Deluge.details.StatusTab
|
* @class Deluge.details.StatusTab
|
||||||
* @extends Ext.Panel
|
* @extends Ext.panel.Panel
|
||||||
*/
|
*/
|
||||||
Ext.define('Deluge.details.StatusTab', {
|
Ext.define('Deluge.details.StatusTab', {
|
||||||
extend: 'Ext.Panel',
|
extend: 'Ext.panel.Panel',
|
||||||
|
|
||||||
title: _('Status'),
|
title: _('Status'),
|
||||||
autoScroll: true,
|
autoScroll: true,
|
||||||
|
bodyPadding: 10,
|
||||||
|
|
||||||
initComponent: function() {
|
initComponent: function() {
|
||||||
this.callParent(arguments);
|
this.callParent(arguments);
|
||||||
|
|
||||||
this.columns = [];
|
this.columns = [];
|
||||||
|
this.queuedColumns = [];
|
||||||
this.queuedItems = {};
|
this.queuedItems = {};
|
||||||
|
this.fields = {};
|
||||||
this.progressBar = this.add({
|
this.progressBar = this.add({
|
||||||
xtype: 'progressbar',
|
xtype: 'progressbar',
|
||||||
cls: 'x-deluge-torrent-progressbar'
|
cls: 'x-deluge-torrent-progressbar'
|
||||||
});
|
});
|
||||||
this.torrentPanel = this.add({
|
this.torrentPanel = this.add({
|
||||||
xtype: 'panel'
|
xtype: 'panel',
|
||||||
|
cls: 'x-deluge-status',
|
||||||
|
bodyPadding: 10,
|
||||||
|
border: 0
|
||||||
});
|
});
|
||||||
this.body = this.torrentPanel.body;
|
this.body = this.torrentPanel.body;
|
||||||
|
|
||||||
|
this.addColumn();
|
||||||
|
this.addColumn();
|
||||||
|
this.addColumn({width: '300px'});
|
||||||
|
this.addColumn();
|
||||||
|
|
||||||
|
this.addItem(0, 'downloaded', _('Downloaded'));
|
||||||
|
this.addItem(0, 'uploaded', _('Uploaded'));
|
||||||
|
this.addItem(0, 'share', _('Share Ratio'));
|
||||||
|
this.addItem(0, 'announce', _('Next Announce'));
|
||||||
|
this.addItem(0, 'tracker', _('Tracker Status'));
|
||||||
|
|
||||||
|
this.addItem(1, 'downspeed', _('Speed'));
|
||||||
|
this.addItem(1, 'upspeed', _('Speed'));
|
||||||
|
this.addItem(1, 'eta', _('ETA'));
|
||||||
|
this.addItem(1, 'pieces', _('Pieces'));
|
||||||
|
|
||||||
|
this.addItem(2, 'seeders', _('Seeders'));
|
||||||
|
this.addItem(2, 'peers', _('Peers'));
|
||||||
|
this.addItem(2, 'avail', _('Availability'));
|
||||||
|
this.addItem(2, 'auto_managed', _('Auto Managed'));
|
||||||
|
this.addItem(2, 'last_seen_complete', _('Last Seen Complete'));
|
||||||
|
|
||||||
|
this.addItem(3, 'active_time', _('Active Time'));
|
||||||
|
this.addItem(3, 'seeding_time', _('Seeding Time'));
|
||||||
|
this.addItem(3, 'seed_rank', _('Seed Rank'));
|
||||||
|
this.addItem(3, 'time_rank', _('Date Added'));
|
||||||
},
|
},
|
||||||
|
|
||||||
addColumn: function() {
|
addColumn: function(style) {
|
||||||
var i = this.columns.push(false);
|
style = style || {};
|
||||||
if (this.rendered) {
|
|
||||||
this.doAddColumn();
|
|
||||||
}
|
|
||||||
return i;
|
|
||||||
},
|
|
||||||
|
|
||||||
addItem: function(id, label) {
|
|
||||||
if (!this.rendered) {
|
if (!this.rendered) {
|
||||||
this.queuedItems[id] = label;
|
this.queuedColumns.push(style);
|
||||||
} else {
|
} else {
|
||||||
this.doAddItem(id, label);
|
this.doAddColumn(style);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
addItem: function(col, id, label) {
|
||||||
|
if (!this.rendered) {
|
||||||
|
this.queuedItems[id] = {
|
||||||
|
col: col,
|
||||||
|
label: label
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
this.doAddItem(col, id, label);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -77,13 +115,20 @@ Ext.define('Deluge.details.StatusTab', {
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
doAddColumn: function() {
|
doAddColumn: function(style) {
|
||||||
var dl = Ext.core.DomHelper.append(this.body, {tag: 'dl'}, true);
|
var dl = Ext.core.DomHelper.append(this.body, {
|
||||||
|
tag: 'dl',
|
||||||
|
style: style
|
||||||
|
}, true);
|
||||||
return this.columns.push(dl);
|
return this.columns.push(dl);
|
||||||
},
|
},
|
||||||
|
|
||||||
doAddItem: function(id, label) {
|
doAddItem: function(col, id, label) {
|
||||||
//Ext.core.DomHelper.append(this.dl,
|
var col = this.columns[col],
|
||||||
|
dh = Ext.core.DomHelper;
|
||||||
|
|
||||||
|
dh.append(col, {tag: 'dt', cls: id, html: label + ':'});
|
||||||
|
this.fields[id] = dh.append(col, {tag: 'dd', cls: id, html: ''}, true);
|
||||||
},
|
},
|
||||||
|
|
||||||
clear: function() {
|
clear: function() {
|
||||||
|
@ -93,6 +138,19 @@ Ext.define('Deluge.details.StatusTab', {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onRender: function(ct, position) {
|
||||||
|
this.callParent(arguments);
|
||||||
|
var i = 0;
|
||||||
|
for (; i < this.queuedColumns.length; i++) {
|
||||||
|
this.doAddColumn(this.queuedColumns[i]);
|
||||||
|
}
|
||||||
|
|
||||||
|
for (var id in this.queuedItems) {
|
||||||
|
var item = this.queuedItems[id];
|
||||||
|
this.doAddItem(item.col, id, item.label);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
onPanelUpdate: function(el, response) {
|
onPanelUpdate: function(el, response) {
|
||||||
this.fields = {};
|
this.fields = {};
|
||||||
Ext.each(Ext.query('dd', this.torrent.body.dom), function(field) {
|
Ext.each(Ext.query('dd', this.torrent.body.dom), function(field) {
|
||||||
|
@ -132,7 +190,7 @@ Ext.define('Deluge.details.StatusTab', {
|
||||||
data.uploaded += ' (' + ((torrent.total_payload_download) ? fsize(torrent.total_payload_download): '0.0 KiB') + ')';
|
data.uploaded += ' (' + ((torrent.total_payload_download) ? fsize(torrent.total_payload_download): '0.0 KiB') + ')';
|
||||||
|
|
||||||
for (var field in this.fields) {
|
for (var field in this.fields) {
|
||||||
this.fields[field].innerHTML = data[field];
|
this.fields[field].dom.innerHTML = data[field];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue