WebUI: Update torrent properties immediately

Don't wait for new data to be fetched, request them as soon as
they are required, i.e. when a property tab is loaded or when a
different torrent is selected.

src/webui/www/public/scripts/client.js

@@ -24,6 +24,8 @@
 
 myTable = new dynamicTable();
 
+var updatePropertiesPanel = function(){};
+
 var stateToImg = function (state) {
     if (state == "pausedUP" || state == "pausedDL") {
         state = "paused";
@@ -320,22 +322,34 @@ window.addEvent('load', function () {
         tabsOnload : function() {
             MochaUI.initializeTabs('propertiesTabs');
 
+            updatePropertiesPanel = function() {
+                if (!$('prop_general').hasClass('invisible'))
+                    updateTorrentData();
+                else if (!$('prop_trackers').hasClass('invisible'))
+                    updateTrackersData();
+                else if (!$('prop_files').hasClass('invisible'))
+                    updateTorrentFilesData();
+            }
+
             $('PropGeneralLink').addEvent('click', function(e){
                 $('prop_general').removeClass("invisible");
                 $('prop_trackers').addClass("invisible");
                 $('prop_files').addClass("invisible");
+                updatePropertiesPanel();
             });
 
             $('PropTrackersLink').addEvent('click', function(e){
                 $('prop_trackers').removeClass("invisible");
                 $('prop_general').addClass("invisible");
                 $('prop_files').addClass("invisible");
+                updatePropertiesPanel();
             });
 
             $('PropFilesLink').addEvent('click', function(e){
                 $('prop_files').removeClass("invisible");
                 $('prop_general').addClass("invisible");
                 $('prop_trackers').addClass("invisible");
+                updatePropertiesPanel();
             });
         },
         column : 'mainColumn',

src/webui/www/public/scripts/dynamicTable.js

@@ -220,7 +220,7 @@ var dynamicTable = new Class({
                             temptr.addClass('selected');
                         }
                         this.cur[0] = id;
-                        // TODO: Warn Properties panel
+                        updatePropertiesPanel();
                     }
                 }
                 return false;

src/webui/www/public/scripts/prop-files.js

@@ -1,4 +1,3 @@
-var waitingTorrentFiles = false;
 var is_seed = true;
 var current_hash = "";
 
@@ -273,6 +272,7 @@ var filesDynTable = new Class({
     },
 });
 
+var loadTorrentFilesDataTimer;
 var loadTorrentFilesData = function() {
     if ($('prop_files').hasClass('invisible')) {
         // Tab changed, don't do anything
@@ -281,7 +281,7 @@ var loadTorrentFilesData = function() {
     var new_hash = myTable.getCurrentTorrentHash();
     if (new_hash == "") {
         fTable.removeAllRows();
-        loadTorrentFilesData.delay(1500);
+        loadTorrentFilesDataTimer = loadTorrentFilesData.delay(1500);
         return;
     }
     if (new_hash != current_hash) {
@@ -289,60 +289,60 @@ var loadTorrentFilesData = function() {
         current_hash = new_hash;
     }
     var url = 'json/propertiesFiles/' + current_hash;
-    if (!waitingTorrentFiles) {
+    var request = new Request.JSON({
-        waitingTorrentFiles = true;
+        url: url,
-        var request = new Request.JSON({
+        noCache: true,
-            url: url,
+        method: 'get',
-            noCache: true,
+        onFailure: function() {
-            method: 'get',
+            $('error_div').set('html', '_(qBittorrent client is not reachable)');
-            onFailure: function() {
+            loadTorrentFilesDataTimer = loadTorrentFilesData.delay(2000);
-                $('error_div').set('html', '_(qBittorrent client is not reachable)');
+        },
-                waitingTorrentFiles = false;
+        onSuccess: function(files) {
-                loadTorrentFilesData.delay(2000);
+            $('error_div').set('html', '');
-            },
+            if (files) {
-            onSuccess: function(files) {
+                // Update Trackers data
-                $('error_div').set('html', '');
+                var i = 0;
-                if (files) {
+                files.each(function(file) {
-                    // Update Trackers data
+                    if (i == 0) {
-                    var i = 0;
+                        is_seed = file.is_seed;
-                    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");
-                        }
                     }
+                    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 {
-                    fTable.removeAllRows();
+                    if (allCBUnchecked()) {
+                        setCBState("unchecked");
+                    }
+                    else {
+                        setCBState("partial");
+                    }
                 }
-                waitingTorrentFiles = false;
-                loadTorrentFilesData.delay(1500);
             }
-        }).send();
+            else {
-    }
+                fTable.removeAllRows();
-
+            }
+            loadTorrentFilesDataTimer = loadTorrentFilesData.delay(1500);
+        }
+    }).send();
 }
+
+var updateTorrentFilesData = function() {
+    clearTimeout(loadTorrentFilesDataTimer);
+    loadTorrentFilesData();
+}
+
 fTable = new filesDynTable();
 fTable.setup($('filesTable'));

src/webui/www/public/scripts/prop-general.js

@@ -1,5 +1,3 @@
-var waiting = false;
-
 var clearData = function() {
     $('torrent_hash').set('html', '');
     $('save_path').set('html', '');
@@ -16,7 +14,8 @@ var clearData = function() {
     $('share_ratio').set('html', '');
 }
 
-var loadData = function() {
+var loadTorrentDataTimer;
+var loadTorrentData = function() {
     if ($('prop_general').hasClass('invisible')) {
         // Tab changed, don't do anything
         return;
@@ -24,61 +23,61 @@ var loadData = function() {
     var current_hash = myTable.getCurrentTorrentHash();
     if (current_hash == "") {
         clearData();
-        loadData.delay(1500);
+        loadTorrentDataTimer = loadTorrentData.delay(1500);
         return;
     }
     // Display hash
     $('torrent_hash').set('html', current_hash);
     var url = 'json/propertiesGeneral/' + current_hash;
-    if (!waiting) {
+    var request = new Request.JSON({
-        waiting = true;
+        url: url,
-        var request = new Request.JSON({
+        noCache: true,
-            url: url,
+        method: 'get',
-            noCache: true,
+        onFailure: function() {
-            method: 'get',
+            $('error_div').set('html', '_(qBittorrent client is not reachable)');
-            onFailure: function() {
+            loadTorrentDataTimer = loadTorrentData.delay(2000);
-                $('error_div').set('html', '_(qBittorrent client is not reachable)');
+        },
-                waiting = false;
+        onSuccess: function(data) {
-                loadData.delay(2000);
+            $('error_div').set('html', '');
-            },
+            if (data) {
-            onSuccess: function(data) {
+                var temp;
-                $('error_div').set('html', '');
+                // Update Torrent data
-                if (data) {
+                $('save_path').set('html', data.save_path);
-                    var temp;
+                temp = data.creation_date;
-                    // Update Torrent data
+                var timestamp = "_(Unknown)";
-                    $('save_path').set('html', data.save_path);
+                if (temp != -1)
-                    temp = data.creation_date;
+                    timestamp = new Date(data.creation_date * 1000).toISOString();
-                    var timestamp = "_(Unknown)";
+                $('creation_date').set('html', timestamp);
-                    if (temp != -1)
+                $('piece_size').set('html', friendlyUnit(data.piece_size));
-                        timestamp = new Date(data.creation_date * 1000).toISOString();
+                $('comment').set('html', data.comment);
-                    $('creation_date').set('html', timestamp);
+                $('total_uploaded').set('html', friendlyUnit(data.total_uploaded) +
-                    $('piece_size').set('html', friendlyUnit(data.piece_size));
+                    " (" + friendlyUnit(data.total_uploaded_session) +
-                    $('comment').set('html', data.comment);
+                    " (" + "_(this session)" + ")");
-                    $('total_uploaded').set('html', friendlyUnit(data.total_uploaded) +
+                $('total_downloaded').set('html', friendlyUnit(data.total_downloaded) +
-                        " (" + friendlyUnit(data.total_uploaded_session) +
+                    " (" + friendlyUnit(data.total_downloaded_session) +
-                        " (" + "_(this session)" + ")");
+                    " (" + "_(this session)" + ")");
-                    $('total_downloaded').set('html', friendlyUnit(data.total_downloaded) +
+                $('total_wasted').set('html', data.total_wasted);
-                        " (" + friendlyUnit(data.total_downloaded_session) +
+                temp = data.up_limit;
-                        " (" + "_(this session)" + ")");
+                $('up_limit').set('html', temp == -1 ? "∞" : temp);
-                    $('total_wasted').set('html', data.total_wasted);
+                temp = data.dl_limit;
-                    temp = data.up_limit;
+                $('dl_limit').set('html', temp == -1 ? "∞" : temp);
-                    $('up_limit').set('html', temp == -1 ? "∞" : temp);
+                temp = friendlyDuration(status.active_time);
-                    temp = data.dl_limit;
+                if (status.is_seed)
-                    $('dl_limit').set('html', temp == -1 ? "∞" : temp);
+                    temp += " (" + "_(Seeded for %1)".replace("%1", status.seeding_time) + ")";
-                    temp = friendlyDuration(status.active_time);
+                $('time_elapsed').set('html', temp);
-                    if (status.is_seed)
+                temp = data.nb_connections + " (" + "_(%1 max)".replace("%1", status.nb_connections_limit) + ")";
-                        temp += " (" + "_(Seeded for %1)".replace("%1", status.seeding_time) + ")";
+                $('nb_connections').set('html', temp);
-                    $('time_elapsed').set('html', temp);
+                $('share_ratio').set('html', data.share_ratio.toFixed(2));
-                    temp = data.nb_connections + " (" + "_(%1 max)".replace("%1", status.nb_connections_limit) + ")";
-                    $('nb_connections').set('html', temp);
-                    $('share_ratio').set('html', data.share_ratio.toFixed(2));
-                }
-                else {
-                    clearData();
-                }
-                waiting = false;
-                loadData.delay(1500);
             }
-        }).send();
+            else {
-    }
+                clearData();
+            }
+            loadTorrentDataTimer = loadTorrentData.delay(1500);
+        }
+    }).send();
+}
+
+var updateTorrentData = function() {
+    clearTimeout(loadTorrentDataTimer);
+    loadTorrentData();
 }

src/webui/www/public/scripts/prop-trackers.js

@@ -50,9 +50,9 @@ var trackersDynTable = new Class({
     },
 });
 
-var waitingTrackers = false;
 var current_hash = "";
 
+var loadTrackersDataTimer;
 var loadTrackersData = function() {
     if ($('prop_trackers').hasClass('invisible')) {
         // Tab changed, don't do anything
@@ -61,7 +61,7 @@ var loadTrackersData = function() {
     var new_hash = myTable.getCurrentTorrentHash();
     if (new_hash == "") {
         tTable.removeAllRows();
-        loadTrackersData.delay(1500);
+        loadTrackersDataTimer = loadTrackersData.delay(1500);
         return;
     }
     if (new_hash != current_hash) {
@@ -69,41 +69,41 @@ var loadTrackersData = function() {
         current_hash = new_hash;
     }
     var url = 'json/propertiesTrackers/' + current_hash;
-    if (!waitingTrackers) {
+    var request = new Request.JSON({
-        waitingTrackers = true;
+        url: url,
-        var request = new Request.JSON({
+        noCache: true,
-            url: url,
+        method: 'get',
-            noCache: true,
+        onFailure: function() {
-            method: 'get',
+            $('error_div').set('html', '_(qBittorrent client is not reachable)');
-            onFailure: function() {
+            loadTrackersDataTimer = loadTrackersData.delay(2000);
-                $('error_div').set('html', '_(qBittorrent client is not reachable)');
+        },
-                waitingTrackers = false;
+        onSuccess: function(trackers) {
-                loadTrackersData.delay(2000);
+            $('error_div').set('html', '');
-            },
+            if (trackers) {
-            onSuccess: function(trackers) {
+                // Update Trackers data
-                $('error_div').set('html', '');
+                trackers.each(function(tracker) {
-                if (trackers) {
+                    var row = new Array();
-                    // Update Trackers data
+                    row.length = 4;
-                    trackers.each(function(tracker) {
+                    row[0] = tracker.url;
-                        var row = new Array();
+                    row[1] = tracker.status;
-                        row.length = 4;
+                    row[2] = tracker.num_peers;
-                        row[0] = tracker.url;
+                    row[3] = tracker.msg;
-                        row[1] = tracker.status;
+                    tTable.insertRow(row);
-                        row[2] = tracker.num_peers;
+                });
-                        row[3] = tracker.msg;
-                        tTable.insertRow(row);
-                    });
-                }
-                else {
-                    tTable.removeAllRows();
-                }
-                waitingTrackers = false;
-                loadTrackersData.delay(1500);
             }
-        }).send();
+            else {
-    }
+                tTable.removeAllRows();
-
+            }
+            loadTrackersDataTimer = loadTrackersData.delay(1500);
+        }
+    }).send();
 }
+
+var updateTrackersData = function() {
+    clearTimeout(loadTrackersDataTimer);
+    loadTrackersData();
+}
+
 tTable = new trackersDynTable();
 tTable.setup($('trackersTable'));