mirror of
https://github.com/qbittorrent/qBittorrent.git
synced 2025-12-20 15:37:26 -06:00
WebUI: Load properties tabs once
Don't reload HTML on tab change. Load the entire structure once and keep the unused bits hidden. Keep also the JS code separately, one file per tab. NOTE: tabs content is not loaded. This will be fixed in the next commit.
This commit is contained in:
Gabriele
348
src/webui/www/public/scripts/prop-files.js
Normal file
348
src/webui/www/public/scripts/prop-files.js
Normal file
@@ -0,0 +1,348 @@
|
||||
var waitingTorrentFiles = false;
|
||||
var is_seed = true;
|
||||
var current_hash = "";
|
||||
|
||||
if (!(Browser.name == "ie" && Browser.version < 9)) {
|
||||
$("all_files_cb").removeClass("tristate");
|
||||
$("all_files_cb").removeClass("partial");
|
||||
$("all_files_cb").removeClass("checked");
|
||||
$("tristate_cb").style.display = "inline";
|
||||
}
|
||||
|
||||
var setCBState = function(state) {
|
||||
if (Browser.name == "ie" && Browser.version < 9) {
|
||||
if (state == "partial") {
|
||||
if (!$("all_files_cb").hasClass("partial")) {
|
||||
$("all_files_cb").removeClass("checked");
|
||||
$("all_files_cb").addClass("partial");
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (state == "checked") {
|
||||
if (!$("all_files_cb").hasClass("checked")) {
|
||||
$("all_files_cb").removeClass("partial");
|
||||
$("all_files_cb").addClass("checked");
|
||||
}
|
||||
return;
|
||||
}
|
||||
$("all_files_cb").removeClass("partial");
|
||||
$("all_files_cb").removeClass("checked");
|
||||
}
|
||||
else {
|
||||
if (state == "partial") {
|
||||
$("tristate_cb").indeterminate = true;
|
||||
}
|
||||
else if (state == "checked") {
|
||||
$("tristate_cb").indeterminate = false;
|
||||
$("tristate_cb").checked = true;
|
||||
}
|
||||
else {
|
||||
$("tristate_cb").indeterminate = false;
|
||||
$("tristate_cb").checked = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var switchCBState = function() {
|
||||
// Uncheck
|
||||
if ($("all_files_cb").hasClass("partial")) {
|
||||
$("all_files_cb").removeClass("partial");
|
||||
// Uncheck all checkboxes
|
||||
$$('input.DownloadedCB').each(function(item, index) {
|
||||
item.erase("checked");
|
||||
setFilePriority(index, 0);
|
||||
});
|
||||
return;
|
||||
}
|
||||
if ($("all_files_cb").hasClass("checked")) {
|
||||
$("all_files_cb").removeClass("checked");
|
||||
// Uncheck all checkboxes
|
||||
$$('input.DownloadedCB').each(function(item, index) {
|
||||
item.erase("checked");
|
||||
setFilePriority(index, 0);
|
||||
});
|
||||
return;
|
||||
}
|
||||
// Check
|
||||
$("all_files_cb").addClass("checked");
|
||||
// Check all checkboxes
|
||||
$$('input.DownloadedCB').each(function(item, index) {
|
||||
item.set("checked", "checked");
|
||||
setFilePriority(index, 1);
|
||||
});
|
||||
}
|
||||
|
||||
var allCBChecked = function() {
|
||||
var CBs = $$('input.DownloadedCB');
|
||||
for (var i = 0; i < CBs.length; i += 1) {
|
||||
var item = CBs[i];
|
||||
if (!$defined(item.get('checked')) || !item.get('checked'))
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
var allCBUnchecked = function() {
|
||||
var CBs = $$('input.DownloadedCB');
|
||||
for (var i = 0; i < CBs.length; i += 1) {
|
||||
var item = CBs[i];
|
||||
if ($defined(item.get('checked')) && item.get('checked'))
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
var setFilePriority = function(id, priority) {
|
||||
if (current_hash == "") return;
|
||||
new Request({
|
||||
url: 'command/setFilePrio',
|
||||
method: 'post',
|
||||
data: {
|
||||
'hash': current_hash,
|
||||
'id': id,
|
||||
'priority': priority
|
||||
}
|
||||
}).send();
|
||||
// Display or add combobox
|
||||
if (priority > 0) {
|
||||
$('comboPrio' + id).set("value", 1);
|
||||
$('comboPrio' + id).removeClass("invisible");
|
||||
}
|
||||
else {
|
||||
$('comboPrio' + id).addClass("invisible");
|
||||
}
|
||||
}
|
||||
|
||||
var createDownloadedCB = function(id, downloaded) {
|
||||
var CB = new Element('input');
|
||||
CB.set('type', 'checkbox');
|
||||
if (downloaded)
|
||||
CB.set('checked', 'checked');
|
||||
CB.set('id', 'cbPrio' + id);
|
||||
CB.set('class', 'DownloadedCB');
|
||||
CB.addEvent('change', function(e) {
|
||||
var checked = 0;
|
||||
if ($defined($('cbPrio' + id).get('checked')) && $('cbPrio' + id).get('checked'))
|
||||
checked = 1;
|
||||
setFilePriority(id, checked);
|
||||
if (allCBChecked()) {
|
||||
setCBState("checked");
|
||||
}
|
||||
else {
|
||||
if (allCBUnchecked()) {
|
||||
setCBState("unchecked");
|
||||
}
|
||||
else {
|
||||
setCBState("partial");
|
||||
}
|
||||
}
|
||||
});
|
||||
return CB;
|
||||
}
|
||||
|
||||
var createPriorityCombo = function(id, selected_prio) {
|
||||
var select = new Element('select');
|
||||
select.set('id', 'comboPrio' + id);
|
||||
select.addEvent('change', function(e) {
|
||||
var new_prio = $('comboPrio' + id).get('value');
|
||||
setFilePriority(id, new_prio);
|
||||
});
|
||||
var opt = new Element("option");
|
||||
opt.set('value', '1')
|
||||
opt.set('html', "_(Normal)");
|
||||
if (selected_prio <= 1)
|
||||
opt.setAttribute('selected', '');
|
||||
opt.injectInside(select);
|
||||
opt = new Element("option");
|
||||
opt.set('value', '2')
|
||||
opt.set('html', "_(High)");
|
||||
if (selected_prio == 2)
|
||||
opt.setAttribute('selected', '');
|
||||
opt.injectInside(select);
|
||||
opt = new Element("option");
|
||||
opt.set('value', '7')
|
||||
opt.set('html', "_(Maximum)");
|
||||
if (selected_prio == 7)
|
||||
opt.setAttribute('selected', '');
|
||||
opt.injectInside(select);
|
||||
if (is_seed || selected_prio < 1) {
|
||||
select.addClass("invisible");
|
||||
}
|
||||
else {
|
||||
select.removeClass("invisible");
|
||||
}
|
||||
select.addClass("combo_priority");
|
||||
return select;
|
||||
}
|
||||
|
||||
var filesDynTable = new Class({
|
||||
|
||||
initialize: function() {},
|
||||
|
||||
setup: function(table) {
|
||||
this.table = $(table);
|
||||
this.rows = new Hash();
|
||||
},
|
||||
|
||||
removeRow: function(id) {
|
||||
if (this.rows.has(id)) {
|
||||
var tr = this.rows.get(id);
|
||||
tr.dispose();
|
||||
this.rows.erase(id);
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
|
||||
removeAllRows: function() {
|
||||
this.rows.each(function(tr, id) {
|
||||
this.removeRow(id);
|
||||
}.bind(this));
|
||||
},
|
||||
|
||||
updateRow: function(tr, row, id) {
|
||||
var tds = tr.getElements('td');
|
||||
for (var i = 0; i < row.length; i++) {
|
||||
if (i == 3) {
|
||||
$('pbf_' + id).setValue(row[i].toFloat());
|
||||
}
|
||||
else {
|
||||
if (i == 0) {
|
||||
if (row[i] > 0)
|
||||
tds[i].getChildren('input')[0].set('checked', 'checked');
|
||||
else
|
||||
tds[i].getChildren('input')[0].removeProperty('checked')
|
||||
}
|
||||
else {
|
||||
if (i == 4) {
|
||||
if (!is_seed && row[i] > 0) {
|
||||
tds[i].getChildren('select').set('value', row[i]);
|
||||
$('comboPrio' + id).removeClass("invisible");
|
||||
}
|
||||
else {
|
||||
if (!$('comboPrio' + id).hasClass("invisible"))
|
||||
$('comboPrio' + id).addClass("invisible");
|
||||
}
|
||||
}
|
||||
else {
|
||||
tds[i].set('html', row[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
insertRow: function(id, row) {
|
||||
if (this.rows.has(id)) {
|
||||
var tr = this.rows.get(id);
|
||||
this.updateRow(tr, row, id);
|
||||
return;
|
||||
}
|
||||
//this.removeRow(id);
|
||||
var tr = new Element('tr');
|
||||
this.rows.set(id, tr);
|
||||
for (var i = 0; i < row.length; i++) {
|
||||
var td = new Element('td');
|
||||
if (i == 3) {
|
||||
td.adopt(new ProgressBar(row[i].toFloat(), {
|
||||
'id': 'pbf_' + id,
|
||||
'width': 80
|
||||
}));
|
||||
}
|
||||
else {
|
||||
if (i == 0) {
|
||||
var tree_img = new Element('img', {
|
||||
src: 'images/L.gif',
|
||||
style: 'margin-bottom: -2px'
|
||||
});
|
||||
td.adopt(tree_img, createDownloadedCB(id, row[i]));
|
||||
}
|
||||
else {
|
||||
if (i == 4) {
|
||||
td.adopt(createPriorityCombo(id, row[i]));
|
||||
}
|
||||
else {
|
||||
td.set('html', row[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
td.injectInside(tr);
|
||||
}
|
||||
tr.injectInside(this.table);
|
||||
},
|
||||
});
|
||||
|
||||
var loadTorrentFilesData = function() {
|
||||
if ($('prop_files').hasClass('invisible')) {
|
||||
// Tab changed, don't do anything
|
||||
return;
|
||||
}
|
||||
var new_hash = myTable.getCurrentTorrentHash();
|
||||
if (new_hash == "") {
|
||||
fTable.removeAllRows();
|
||||
loadTorrentFilesData.delay(1500);
|
||||
return;
|
||||
}
|
||||
if (new_hash != current_hash) {
|
||||
fTable.removeAllRows();
|
||||
current_hash = new_hash;
|
||||
}
|
||||
var url = 'json/propertiesFiles/' + current_hash;
|
||||
if (!waitingTorrentFiles) {
|
||||
waitingTorrentFiles = true;
|
||||
var request = new Request.JSON({
|
||||
url: url,
|
||||
noCache: true,
|
||||
method: 'get',
|
||||
onFailure: function() {
|
||||
$('error_div').set('html', '_(qBittorrent client is not reachable)');
|
||||
waitingTorrentFiles = false;
|
||||
loadTorrentFilesData.delay(2000);
|
||||
},
|
||||
onSuccess: function(files) {
|
||||
$('error_div').set('html', '');
|
||||
if (files) {
|
||||
// Update Trackers data
|
||||
var i = 0;
|
||||
files.each(function(file) {
|
||||
if (i == 0) {
|
||||
is_seed = file.is_seed;
|
||||
}
|
||||
var row = new Array();
|
||||
row.length = 4;
|
||||
row[0] = file.priority;
|
||||
row[1] = file.name;
|
||||
row[2] = friendlyUnit(file.size, false);
|
||||
row[3] = (file.progress * 100).round(1);
|
||||
if (row[3] == 100.0 && file.progress < 1.0)
|
||||
row[3] = 99.9
|
||||
row[4] = file.priority;
|
||||
fTable.insertRow(i, row);
|
||||
i++;
|
||||
}.bind(this));
|
||||
// Set global CB state
|
||||
if (allCBChecked()) {
|
||||
setCBState("checked");
|
||||
}
|
||||
else {
|
||||
if (allCBUnchecked()) {
|
||||
setCBState("unchecked");
|
||||
}
|
||||
else {
|
||||
setCBState("partial");
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
fTable.removeAllRows();
|
||||
}
|
||||
waitingTorrentFiles = false;
|
||||
loadTorrentFilesData.delay(1500);
|
||||
}
|
||||
}).send();
|
||||
}
|
||||
|
||||
}
|
||||
fTable = new filesDynTable();
|
||||
fTable.setup($('filesTable'));
|
||||
Reference in New Issue
Block a user