From 9ada7c809bf93b4c1da716857dad853497d9a8c0 Mon Sep 17 00:00:00 2001 From: Christophe Dumez Date: Fri, 27 Nov 2009 15:48:45 +0000 Subject: [PATCH] - Made transfer list sortable in Web UI * As a default it is sorted by Name --- src/webui/scripts/client.js | 3 + src/webui/scripts/dynamicTable.js | 96 ++++++++++++++++++++++++++++++- src/webui/scripts/progressbar.js | 7 +++ src/webui/transferlist.html | 18 +++--- 4 files changed, 114 insertions(+), 10 deletions(-) diff --git a/src/webui/scripts/client.js b/src/webui/scripts/client.js index 2a6425ac2..a6fa7e68b 100644 --- a/src/webui/scripts/client.js +++ b/src/webui/scripts/client.js @@ -24,6 +24,9 @@ myTable = new dynamicTable(); ajaxfn = function(){}; +setSortedColumn = function(index){ + myTable.setSortedColumn(index); +}; window.addEvent('domready', function(){ diff --git a/src/webui/scripts/dynamicTable.js b/src/webui/scripts/dynamicTable.js index 3c1afd27c..bbd80863e 100644 --- a/src/webui/scripts/dynamicTable.js +++ b/src/webui/scripts/dynamicTable.js @@ -44,6 +44,90 @@ var dynamicTable = new Class ({ this.progressIndex = progressIndex; this.filter = 'all'; this.context_menu = context_menu; + this.table.sortedIndex = 1; // Default is NAME + this.table.sortOrder = 'ASC'; + }, + + sortfunction: function(tr1, tr2) { + var i = tr2.getParent().sortedIndex; + var order = tr2.getParent().sortOrder; + switch(i) { + case 1: // Name + if(order == "ASC") { + if(tr1.getElements('td')[i].get('html') > tr2.getElements('td')[i].get('html')) + return 1; + return -1; + } else { + if(tr1.getElements('td')[i].get('html') < tr2.getElements('td')[i].get('html')) + return 1; + return -1; + } + case 2: // Prio + if(order == "ASC") + return (tr1.getElements('td')[i].get('html').toInt() - tr2.getElements('td')[i].get('html')).toInt(); + else + return (tr2.getElements('td')[i].get('html').toInt() - tr1.getElements('td')[i].get('html')).toInt(); + case 3: // Size + case 7: // Up Speed + case 8: // Down Speed + var sizeStrToFloat = function(mystr) { + var val1 = mystr.split(' '); + var val1num = val1[0].toFloat() + var unit = val1[1].capitalize(); + switch(unit[0]) { + case 'G': + return val1num*1073741824; + case 'M': + return val1num*1048576; + case 'K': + return val1num*1024; + default: + return val1num; + } + }; + if(order == "ASC") + return (sizeStrToFloat(tr1.getElements('td')[i].get('html')) - sizeStrToFloat(tr2.getElements('td')[i].get('html'))); + else + return (sizeStrToFloat(tr2.getElements('td')[i].get('html')) - sizeStrToFloat(tr1.getElements('td')[i].get('html'))); + case 4: // Progress + if(order == "ASC") + return (tr1.getElements('td')[i].getChildren()[0].getValue() - tr2.getElements('td')[i].getChildren()[0].getValue()); + else + return (tr2.getElements('td')[i].getChildren()[0].getValue() - tr1.getElements('td')[i].getChildren()[0].getValue()); + case 5: // Seeds + case 6: // Peers + if(order == "ASC") + return (tr1.getElements('td')[i].get('html').split(' ')[0].toInt() - tr2.getElements('td')[i].get('html').split(' ')[0].toInt()); + else + return (tr2.getElements('td')[i].get('html').split(' ')[0].toInt() - tr1.getElements('td')[i].get('html').split(' ')[0].toInt()); + default: // Ratio + if(order == "ASC") + return (tr1.getElements('td')[i].get('html').toFloat() - tr2.getElements('td')[i].get('html')).toFloat(); + else + return (tr2.getElements('td')[i].get('html').toFloat() - tr1.getElements('td')[i].get('html')).toFloat(); + } + }, + + updateSort: function() { + var trs = this.table.getChildren('tr'); + trs.sort(this.sortfunction); + this.table.set('html', ''); + this.table.adopt(trs); + }, + + setSortedColumn: function(index) { + if(index != this.table.sortedIndex) { + this.table.sortedIndex = index; + this.table.sortOrder = 'ASC'; + } else { + // Toggle sort order + if(this.table.sortOrder == 'ASC') + this.table.sortOrder = 'DSC' + else + this.table.sortOrder = 'ASC' + } + this.updateSort(); + this.altRow(); }, getCurrentTorrentHash: function() { @@ -235,7 +319,17 @@ var dynamicTable = new Class ({ // Apply filter this.applyFilterOnRow(tr, status); // Insert - tr.injectInside(this.table); + var trs = this.table.getChildren('tr'); + var i=0; + while(i 0) { + i++; + } + if(i==trs.length) { + tr.inject(this.table); + } else { + tr.inject(trs[i], 'before'); + } + //tr.injectInside(this.table); this.altRow(); // Update context menu this.context_menu.addTarget(tr); diff --git a/src/webui/scripts/progressbar.js b/src/webui/scripts/progressbar.js index 1574c6aef..bd577879d 100644 --- a/src/webui/scripts/progressbar.js +++ b/src/webui/scripts/progressbar.js @@ -23,6 +23,7 @@ var ProgressBar=new Class({ } }); obj.vals=vals; + obj.vals.value = $pick(value, 0); // Fix by Chris obj.vals.dark=new Element('div',{ 'id':vals.id+'_dark', 'class':'progressbar_dark', @@ -55,12 +56,18 @@ var ProgressBar=new Class({ }); obj.appendChild(obj.vals.dark); obj.appendChild(obj.vals.light); + obj.getValue=ProgressBar_getValue; obj.setValue=ProgressBar_setValue; if(vals.width)obj.setValue(vals.value); else setTimeout('ProgressBar_checkForParent("'+obj.id+'")',1); return obj; } }); + +function ProgressBar_getValue(){ + return this.vals.value; +} + function ProgressBar_setValue(value){ value=parseFloat(value); if(isNaN(value))value=0; diff --git a/src/webui/transferlist.html b/src/webui/transferlist.html index 100d8b34c..5997cde3c 100644 --- a/src/webui/transferlist.html +++ b/src/webui/transferlist.html @@ -2,16 +2,16 @@ - _(Name) - # - _(Size) - _(Done) - _(Seeds) - _(Peers) - _(Down Speed) - _(Up Speed) + _(Name) + # + _(Size) + _(Done) + _(Seeds) + _(Peers) + _(Down Speed) + _(Up Speed) _(ETA) - _(Ratio) + _(Ratio)