d4708
/
qBittorrent
mirror of https://github.com/d47081/qBittorrent.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

WebUI: Drop client-side sorting.

adaptive-webui-19844
Vladimir Golovnev (Glassez) 10 years ago
parent
e279dcf904
commit
0e87b96beb
3 changed files with 48 additions and 62 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 23
      src/webui/www/public/scripts/client.js
  2. 67
      src/webui/www/public/scripts/dynamicTable.js
  3. 20
      src/webui/www/public/transferlist.html

23
src/webui/www/public/scripts/client.js
Unescape View File

@ -24,9 +24,6 @@
myTable = new dynamicTable(); myTable = new dynamicTable();
ajaxfn = function () {}; ajaxfn = function () {};
setSortedColumn = function (index) {
myTable.setSortedColumn(index);
};
window.addEvent('load', function () { window.addEvent('load', function () {
@ -135,7 +132,9 @@ window.addEvent('load', function () {
var ajaxfn = function () { var ajaxfn = function () {
var queueing_enabled = false; var queueing_enabled = false;
var url = new URI('json/torrents'); var url = new URI('json/torrents');
url.setData({'filter': filter}); url.setData('filter', filter);
url.setData('sort', myTable.table.sortedColumn);
url.setData('reverse', myTable.table.reverseSort);
if (!waiting) { if (!waiting) {
waiting = true; waiting = true;
var request = new Request.JSON({ var request = new Request.JSON({
@ -153,6 +152,7 @@ window.addEvent('load', function () {
// Add new torrents or update them // Add new torrents or update them
torrent_hashes = myTable.getRowIds(); torrent_hashes = myTable.getRowIds();
events_hashes = new Array(); events_hashes = new Array();
pos = 0;
events.each(function (event) { events.each(function (event) {
events_hashes[events_hashes.length] = event.hash; events_hashes[events_hashes.length] = event.hash;
var row = new Array(); var row = new Array();
@ -193,11 +193,13 @@ window.addEvent('load', function () {
// New unfinished torrent // New unfinished torrent
torrent_hashes[torrent_hashes.length] = event.hash; torrent_hashes[torrent_hashes.length] = event.hash;
//alert("Inserting row"); //alert("Inserting row");
myTable.insertRow(event.hash, row, data, event.state); myTable.insertRow(event.hash, row, data, event.state, pos);
} else { } else {
// Update torrent data // Update torrent data
myTable.updateRow(event.hash, row, data, event.state); myTable.updateRow(event.hash, row, data, event.state, pos);
} }
pos++;
}); });
// Remove deleted torrents // Remove deleted torrents
torrent_hashes.each(function (hash) { torrent_hashes.each(function (hash) {
@ -212,6 +214,8 @@ window.addEvent('load', function () {
$('queueingButtons').addClass('invisible'); $('queueingButtons').addClass('invisible');
myTable.hidePriority(); myTable.hidePriority();
} }
myTable.altRow();
} }
waiting = false; waiting = false;
ajaxfn.delay(1500); ajaxfn.delay(1500);
@ -219,6 +223,13 @@ window.addEvent('load', function () {
}).send(); }).send();
} }
}; };
setSortedColumn = function (column) {
myTable.setSortedColumn(column);
// reload torrents
ajaxfn();
};
new MochaUI.Panel({ new MochaUI.Panel({
id : 'transferList', id : 'transferList',
title : 'Panel', title : 'Panel',

67
src/webui/www/public/scripts/dynamicTable.js
Unescape View File

@ -42,51 +42,18 @@ var dynamicTable = new Class({
this.priority_hidden = false; this.priority_hidden = false;
this.progressIndex = progressIndex; this.progressIndex = progressIndex;
this.context_menu = context_menu; this.context_menu = context_menu;
this.table.sortedIndex = 1; // Default is NAME this.table.sortedColumn = 'name'; // Default is NAME
this.table.reverseSort = false; this.table.reverseSort = false;
}, },
sortfunction : function (tr1, tr2) { setSortedColumn : function (column) {
var i = tr2.getParent().sortedIndex; if (column != this.table.sortedColumn) {
var reverseSort = tr2.getParent().reverseSort; this.table.sortedColumn = column;
switch (i) {
case 1: // Name
if (!reverseSort)
return tr1.getElements('td')[i].get('html').localeCompare(tr2.getElements('td')[i].get('html'));
else
return tr2.getElements('td')[i].get('html').localeCompare(tr1.getElements('td')[i].get('html'));
case 2: // Prio
case 3: // Size
case 4: // Progress
case 5: // Seeds
case 6: // Peers
case 7: // Up Speed
case 8: // Down Speed
case 9: // ETA
default: // Ratio
if (!reverseSort)
return (tr1.getElements('td')[i].get('data-raw') - tr2.getElements('td')[i].get('data-raw'));
else
return (tr2.getElements('td')[i].get('data-raw') - tr1.getElements('td')[i].get('data-raw'));
}
},
updateSort : function () {
var trs = this.table.getChildren('tr');
trs.sort(this.sortfunction);
this.table.adopt(trs);
},
setSortedColumn : function (index) {
if (index != this.table.sortedIndex) {
this.table.sortedIndex = index;
this.table.reverseSort = false; this.table.reverseSort = false;
} else { } else {
// Toggle sort order // Toggle sort order
this.table.reverseSort = !this.table.reverseSort; this.table.reverseSort = !this.table.reverseSort;
} }
this.updateSort();
this.altRow();
}, },
getCurrentTorrentHash : function () { getCurrentTorrentHash : function () {
@ -130,7 +97,7 @@ var dynamicTable = new Class({
this.priority_hidden = false; this.priority_hidden = false;
}, },
insertRow : function (id, row, data, status) { insertRow : function (id, row, data, status, pos) {
if (this.rows.has(id)) { if (this.rows.has(id)) {
return; return;
} }
@ -254,17 +221,12 @@ var dynamicTable = new Class({
// Insert // Insert
var trs = this.table.getChildren('tr'); var trs = this.table.getChildren('tr');
var i = 0; if (pos >= trs.length) {
while (i < trs.length && this.sortfunction(tr, trs[i]) > 0) {
i++;
}
if (i == trs.length) {
tr.inject(this.table); tr.inject(this.table);
} else { } else {
tr.inject(trs[i], 'before'); tr.inject(trs[pos], 'before');
} }
//tr.injectInside(this.table); //tr.injectInside(this.table);
this.altRow();
// Update context menu // Update context menu
this.context_menu.addTarget(tr); this.context_menu.addTarget(tr);
}, },
@ -279,10 +241,11 @@ var dynamicTable = new Class({
}, this); }, this);
}, },
updateRow : function (id, row, data, status) { updateRow : function (id, row, data, status, newpos) {
if (!this.rows.has(id)) { if (!this.rows.has(id)) {
return false; return false;
} }
var tr = this.rows.get(id); var tr = this.rows.get(id);
var tds = tr.getElements('td'); var tds = tr.getElements('td');
for (var i = 0; i < row.length; i++) { for (var i = 0; i < row.length; i++) {
@ -300,6 +263,18 @@ var dynamicTable = new Class({
if (typeof data[i] != 'undefined') if (typeof data[i] != 'undefined')
tds[i].set('data-raw', data[i]) tds[i].set('data-raw', data[i])
}; };
// Prevent freezing of the backlight.
tr.removeClass('over');
// Move to 'newpos'
var trs = this.table.getChildren('tr');
if (newpos >= trs.length) {
tr.inject(this.table);
} else {
tr.inject(trs[newpos], 'before');
}
return true; return true;
}, },

20
src/webui/www/public/transferlist.html
Unescape View File

@ -2,16 +2,16 @@
<thead> <thead>
<tr> <tr>
<th style="width: 0"></th> <th style="width: 0"></th>
<th onClick="setSortedColumn(1);" style="cursor: pointer;">_(Name)</th> <th onClick="setSortedColumn('name');" style="cursor: pointer;">_(Name)</th>
<th id='prioHeader' onClick="setSortedColumn(2);" style="cursor: pointer;">#</th> <th id='prioHeader' onClick="setSortedColumn('priority');" style="cursor: pointer;">#</th>
<th onClick="setSortedColumn(3);" style="cursor: pointer;">_(Size)</th> <th onClick="setSortedColumn('size');" style="cursor: pointer;">_(Size)</th>
<th style="width: 90px;cursor: pointer;" onClick="setSortedColumn(4);">_(Done)</th> <th style="width: 90px;cursor: pointer;" onClick="setSortedColumn('progress');">_(Done)</th>
<th onClick="setSortedColumn(5);" style="cursor: pointer;">_(Seeds)</th> <th onClick="setSortedColumn('num_seeds');" style="cursor: pointer;">_(Seeds)</th>
<th onClick="setSortedColumn(6);" style="cursor: pointer;">_(Peers)</th> <th onClick="setSortedColumn('num_leechs');" style="cursor: pointer;">_(Peers)</th>
<th onClick="setSortedColumn(7);" style="cursor: pointer;">_(Down Speed)</th> <th onClick="setSortedColumn('dlspeed');" style="cursor: pointer;">_(Down Speed)</th>
<th onClick="setSortedColumn(8);" style="cursor: pointer;">_(Up Speed)</th> <th onClick="setSortedColumn('upspeed');" style="cursor: pointer;">_(Up Speed)</th>
<th onClick="setSortedColumn(9);" style="cursor: pointer;">_(ETA)</th> <th onClick="setSortedColumn('eta');" style="cursor: pointer;">_(ETA)</th>
<th onClick="setSortedColumn(10);" style="cursor: pointer;">_(Ratio)</th> <th onClick="setSortedColumn('ratio');" style="cursor: pointer;">_(Ratio)</th>
</tr> </tr>
</thead> </thead>

Write Preview
Loading…
Cancel
Save