Merge pull request #3374 from ngosang/webui_info

[Web UI] Add information in General tab
This commit is contained in:
sledgehammer999
2015-07-28 03:03:45 +03:00
7 changed files with 232 additions and 85 deletions

View File

@@ -358,6 +358,13 @@ ul.filterList li:hover a {
color: white;
}
td.generalLabel {
white-space: nowrap;
text-align: right;
width: 1px;
vertical-align: top;
}
#filesTable {
line-height: 20px;
}

View File

@@ -1,24 +1,49 @@
<div id="prop_general">
<fieldset>
<legend><b>QBT_TR(Transfer)QBT_TR</b></legend>
<table>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Uploaded:)QBT_TR</td><td style="padding-right: 20px;" id="total_uploaded"></td><td style="text-align:right; padding: 4px;">QBT_TR(UP limit:)QBT_TR</td><td style="padding-right: 20px;" id="up_limit"></td><td style="text-align:right; padding: 4px;">QBT_TR(Share ratio:)QBT_TR</td><td id="share_ratio"></td></tr>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Downloaded:)QBT_TR</td><td style="padding-right: 20px;" id="total_downloaded"></td><td style="text-align:right; padding: 4px;">QBT_TR(DL limit:)QBT_TR</td><td style="padding-right: 20px;" id="dl_limit"></td><td style="text-align:right; padding: 4px;">QBT_TR(Connections:)QBT_TR</td><td id="nb_connections"></td></tr>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Wasted:)QBT_TR</td><td style="padding-right: 20px;" id="total_wasted"></td><td style="text-align:right; padding: 4px;">QBT_TR(Time active:)QBT_TR</td><td style="padding-right: 20px;" id="time_elapsed"></td><td></td></tr>
<table style="width: 100%">
<tr>
<td class="generalLabel">QBT_TR(Time Active:)QBT_TR</td><td id="time_elapsed"></td>
<td class="generalLabel">QBT_TR(ETA:)QBT_TR</td><td id="eta"></td>
<td class="generalLabel">QBT_TR(Connections:)QBT_TR</td><td id="nb_connections"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Downloaded:)QBT_TR</td><td id="total_downloaded"></td>
<td class="generalLabel">QBT_TR(Uploaded:)QBT_TR</td><td id="total_uploaded"></td>
<td class="generalLabel">QBT_TR(Seeds:)QBT_TR</td><td id="seeds"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Download Speed:)QBT_TR</td><td id="dl_speed"></td>
<td class="generalLabel">QBT_TR(Upload Speed:)QBT_TR</td><td id="up_speed"></td>
<td class="generalLabel">QBT_TR(Peers:)QBT_TR</td><td id="peers"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Download Limit:)QBT_TR</td><td id="dl_limit"></td>
<td class="generalLabel">QBT_TR(Upload Limit:)QBT_TR</td><td id="up_limit"></td>
<td class="generalLabel">QBT_TR(Wasted:)QBT_TR</td><td id="total_wasted"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Share Ratio:)QBT_TR</td><td id="share_ratio"></td>
<td class="generalLabel">QBT_TR(Reannounce In:)QBT_TR</td><td id="reannounce"></td>
<td class="generalLabel">QBT_TR(Last Seen Complete:)QBT_TR</td><td id="last_seen"></td>
</tr>
</table>
</fieldset>
<fieldset>
<legend><b>QBT_TR(Information)QBT_TR</b></legend>
<table>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Save path:)QBT_TR</td><td id="save_path"></td></tr>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Created on:)QBT_TR</td><td id="creation_date"></td></tr>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Piece size:)QBT_TR</td><td id="piece_size"></td></tr>
<tr><td style="text-align:right; padding: 4px;">QBT_TR(Torrent hash:)QBT_TR</td><td id="torrent_hash"></td></tr>
<tr><td style="vertical-align: top; padding: 4px; text-align:right;">QBT_TR(Comment:)QBT_TR</td>
<td><textarea name="comment" id="comment" rows="5" cols="80" readonly></textarea></td></tr>
<table style="width: 100%">
<tr>
<td class="generalLabel">QBT_TR(Total Size:)QBT_TR</td><td id="total_size"></td>
<td class="generalLabel">QBT_TR(Pieces:)QBT_TR</td><td id="pieces"></td>
<td class="generalLabel">QBT_TR(Created By:)QBT_TR</td><td id="created_by"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Added On:)QBT_TR</td><td id="addition_date"></td>
<td class="generalLabel">QBT_TR(Completed On:)QBT_TR</td><td id="completion_date"></td>
<td class="generalLabel">QBT_TR(Created On:)QBT_TR</td><td id="creation_date"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Torrent Hash:)QBT_TR</td><td colspan="5" id="torrent_hash"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Save Path:)QBT_TR</td><td colspan="5" id="save_path"></td>
</tr><tr>
<td class="generalLabel">QBT_TR(Comment:)QBT_TR</td><td colspan="5" style="white-space: pre-wrap;" id="comment"></td>
</tr>
</table>
<br/>
</fieldset>
</div>

View File

@@ -12,12 +12,19 @@ function friendlyUnit(value, isSpeed) {
if (value < 0)
return "QBT_TR(Unknown)QBT_TR";
var i = 0;
while (value >= 1024. && i++ < 6)
while (value >= 1024. && i < 4) {
value /= 1024.;
++i;
}
var ret;
ret = (Math.floor(10 * value) / 10).toFixed(1) //Don't round up
if (i == 0)
ret = value + " " + units[i];
else
ret = (Math.floor(10 * value) / 10).toFixed(1) //Don't round up
+ " " + units[i];
if (isSpeed)
ret += "QBT_TR(/s)QBT_TR";
return ret;
@@ -75,8 +82,16 @@ if (!Date.prototype.toISOString) {
}());
}
/*
* JS counterpart of the function in src/misc.cpp
*/
function parseHtmlLinks(text) {
var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
return text.replace(exp,"<a target='_blank' href='$1'>$1</a>");
}
function escapeHtml(str) {
var div = document.createElement('div');
div.appendChild(document.createTextNode(str));
return div.innerHTML;
};
};

View File

@@ -1,17 +1,28 @@
var clearData = function() {
$('time_elapsed').set('html', '');
$('eta').set('html', '');
$('nb_connections').set('html', '');
$('total_downloaded').set('html', '');
$('total_uploaded').set('html', '');
$('dl_speed').set('html', '');
$('up_speed').set('html', '');
$('dl_limit').set('html', '');
$('up_limit').set('html', '');
$('total_wasted').set('html', '');
$('seeds').set('html', '');
$('peers').set('html', '');
$('share_ratio').set('html', '');
$('reannounce').set('html', '');
$('last_seen').set('html', '');
$('total_size').set('html', '');
$('pieces').set('html', '');
$('created_by').set('html', '');
$('addition_date').set('html', '');
$('completion_date').set('html', '');
$('creation_date').set('html', '');
$('torrent_hash').set('html', '');
$('save_path').set('html', '');
$('creation_date').set('html', '');
$('piece_size').set('html', '');
$('comment').set('html', '');
$('total_uploaded').set('html', '');
$('total_downloaded').set('html', '');
$('total_wasted').set('html', '');
$('up_limit').set('html', '');
$('dl_limit').set('html', '');
$('time_elapsed').set('html', '');
$('nb_connections').set('html', '');
$('share_ratio').set('html', '');
}
var loadTorrentDataTimer;
@@ -45,31 +56,65 @@ var loadTorrentData = function() {
if (data) {
var temp;
// Update Torrent data
$('save_path').set('html', data.save_path);
temp = data.creation_date;
var timestamp = "QBT_TR(Unknown)QBT_TR";
if (temp != -1)
timestamp = new Date(data.creation_date * 1000).toISOString();
$('creation_date').set('html', timestamp);
$('piece_size').set('html', friendlyUnit(data.piece_size));
$('comment').set('html', data.comment);
$('total_uploaded').set('html', friendlyUnit(data.total_uploaded) +
" (" + friendlyUnit(data.total_uploaded_session) +
" QBT_TR(this session)QBT_TR" + ")");
$('total_downloaded').set('html', friendlyUnit(data.total_downloaded) +
" (" + friendlyUnit(data.total_downloaded_session) +
" QBT_TR(this session)QBT_TR" + ")");
$('total_wasted').set('html', friendlyUnit(data.total_wasted));
temp = data.up_limit;
$('up_limit').set('html', temp == -1 ? "∞" : temp);
temp = data.dl_limit;
$('dl_limit').set('html', temp == -1 ? "∞" : temp);
temp = friendlyDuration(data.time_elapsed) +
" (" + "QBT_TR(Seeded for %1)QBT_TR".replace("%1", friendlyDuration(data.seeding_time)) + ")";
temp = friendlyDuration(data.time_elapsed)
if (data.seeding_time > 0)
temp += " (" + "QBT_TR(seeded for %1)QBT_TR".replace("%1", friendlyDuration(data.seeding_time)) + ")";
$('time_elapsed').set('html', temp);
$('eta').set('html', friendlyDuration(data.eta));
temp = data.nb_connections + " (" + "QBT_TR(%1 max)QBT_TR".replace("%1", data.nb_connections_limit) + ")";
$('nb_connections').set('html', temp);
temp = friendlyUnit(data.total_downloaded) +
" (" + friendlyUnit(data.total_downloaded_session) +
" QBT_TR(this session)QBT_TR" + ")";
$('total_downloaded').set('html', temp);
temp = friendlyUnit(data.total_uploaded) +
" (" + friendlyUnit(data.total_uploaded_session) +
" QBT_TR(this session)QBT_TR" + ")";
$('total_uploaded').set('html', temp);
temp = friendlyUnit(data.dl_speed, true) + " QBT_TR((%1/s avg.))QBT_TR".replace("%1", friendlyUnit(data.dl_speed_avg));
$('dl_speed').set('html', temp);
temp = friendlyUnit(data.up_speed, true) + " QBT_TR((%1/s avg.))QBT_TR".replace("%1", friendlyUnit(data.up_speed_avg));
$('up_speed').set('html', temp);
temp = (data.dl_limit == -1 ? "∞" : friendlyUnit(data.dl_limit, true));
$('dl_limit').set('html', temp);
temp = (data.up_limit == -1 ? "∞" : friendlyUnit(data.up_limit, true));
$('up_limit').set('html', temp);
$('total_wasted').set('html', friendlyUnit(data.total_wasted));
temp = data.seeds + " QBT_TR((%1 total))QBT_TR".replace("%1", data.seeds_total);
$('seeds').set('html', temp);
temp = data.peers + " QBT_TR((%1 total))QBT_TR".replace("%1", data.peers_total);
$('peers').set('html', temp);
$('share_ratio').set('html', data.share_ratio.toFixed(2));
$('reannounce').set('html', friendlyDuration(data.reannounce));
if (data.last_seen != -1)
temp = new Date(data.last_seen * 1000).toLocaleString();
else
temp = "QBT_TR(Never)QBT_TR";
$('last_seen').set('html', temp);
$('total_size').set('html', friendlyUnit(data.total_size));
if (data.pieces_num != -1)
temp = "QBT_TR(%1 x %2 (have %3))QBT_TR".replace("%1", data.pieces_num).replace("%2", friendlyUnit(data.piece_size)).replace("%3", data.pieces_have);
else
temp = "QBT_TR(Unknown)QBT_TR";
$('pieces').set('html', temp);
$('created_by').set('html', data.created_by);
if (data.addition_date != -1)
temp = new Date(data.addition_date * 1000).toLocaleString();
else
temp = "QBT_TR(Unknown)QBT_TR";
$('addition_date').set('html', temp);
if (data.completion_date != -1)
temp = new Date(data.completion_date * 1000).toLocaleString();
else
temp = "";
$('completion_date').set('html', temp);
if (data.creation_date != -1)
temp = new Date(data.creation_date * 1000).toLocaleString();
else
temp = "QBT_TR(Unknown)QBT_TR";
$('creation_date').set('html', temp);
$('save_path').set('html', data.save_path);
$('comment').set('html', parseHtmlLinks(data.comment));
}
else {
clearData();