Transmission/transmission
1
0
Fork 0
mirror of https://github.com/transmission/transmission.git synced 2025-12-20 10:28:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

(trunk web) modify the statusbar's speed display a bit.

Browse Source
This commit is contained in:
Jordan Lee
2011-10-26 04:14:39 +00:00
parent 74cb70503b
commit 773cd75d0e
6 changed files with 54 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/index.html
View File

@@ -50,8 +50,14 @@
<input type="search" id="torrent_search" placeholder="Filter" />
<div id='filter-button'></div>
<div id='speed-info'>
<span id="speed-dn-label">0 B/s</span>
<span id="speed-up-label">0 B/s</span>
<div id='speed-dn-container'>
<div id='speed-dn-icon'></div>
<div id='speed-dn-label'></div>
</div>
<div id='speed-up-container'>
<div id='speed-up-icon'></div>
<div id='speed-up-label'></div>
</div>
</div>
</div>

14
web/javascript/transmission.js
View File

@@ -1045,8 +1045,8 @@ Transmission.prototype =
updateStatusbar: function()
{
var i, row, text,
u=0, d=0,
var u=0, d=0,
i, row, text,
fmt = Transmission.fmt,
torrents = this.getAllTorrents();
@@ -1058,11 +1058,11 @@ Transmission.prototype =
d += row.getDownloadSpeed();
}
text = u ? '&uarr; ' + fmt.speedBps(u) : '';
setInnerHTML($('#statusbar #speed-up-label')[0], text);
$('#speed-up-container').toggleClass('active', u>0 );
$('#speed-up-label').text( fmt.speedBps( u ) );
text = d ? '&darr; ' + fmt.speedBps(d) : '';
setInnerHTML($('#statusbar #speed-dn-label')[0], text);
$('#speed-dn-container').toggleClass('active', d>0 );
$('#speed-dn-label').text( fmt.speedBps( d ) );
},
setEnabled: function(key, flag)
@@ -1130,7 +1130,7 @@ Transmission.prototype =
$('#torrent_inspector').toggle(visible);
$('#toolbar-inspector').toggleClass('selected',visible);
this.hideMobileAddressbar();
if (!isMobileDevice) {
if (isMobileDevice) {
$('body').toggleClass('inspector_showing',visible);
} else {
var w = visible ? $('#torrent_inspector').outerWidth() + 1 + 'px' : '0px';

9
web/style/transmission/common.css
View File

@@ -36,7 +36,7 @@ div#toolbar > div#toolbar-pause:active { background-color: #7dc9f2; background-i
div#toolbar > div#toolbar-select { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 20px; }
div#toolbar > div#toolbar-select:active { background-color: #7dc9f2; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-inspector { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; float: right; margin-right: 8px; }
div#toolbar > div#toolbar-inspector:active, div#toolbar > div#toolbar-inspector.selected { background-color: #7dc9f2; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-inspector:active { background-color: #7dc9f2; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > *.disabled { opacity: 0.25; }
/***
@@ -46,6 +46,13 @@ div#toolbar > *.disabled { opacity: 0.25; }
***/
#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; }
#statusbar #speed-info { margin-top: 5px; margin-left: 45%; text-align: left; }
#statusbar #speed-info * { display: inline-block; }
#statusbar #speed-info #speed-up-icon { margin-left: 8px; width: 8px; height: 8px; background: url("images/arrow-up.png") bottom no-repeat; }
#statusbar #speed-info #speed-dn-icon { width: 8px; height: 8px; background: url("images/arrow-down.png") bottom no-repeat; }
#statusbar #speed-info #speed-up-container { display: none; }
#statusbar #speed-info #speed-up-container.active { display: inline; }
#statusbar #speed-info #speed-dn-container { display: none; }
#statusbar #speed-info #speed-dn-container.active { display: inline; }
#statusbar #filter-button { float: left; text-shadow: 0 1px 0 #ccc; margin: 5px 8px; -moz-user-select: none; -webkit-user-select: none; }
#statusbar #filter-button:hover { cursor: pointer; }
#statusbar #filter-button .filter-selection { text-decoration: underline; }

33
web/style/transmission/common.scss
View File

@@ -195,7 +195,7 @@ div#toolbar
@include rightRoundedBox(5px);
$image-url: 'images/toolbar-info.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active, &.selected {
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
float: right;
@@ -221,10 +221,39 @@ div#toolbar
overflow: hidden;
position: relative;
#speed-info {
#speed-info
{
margin-top: 5px;
margin-left: 45%;
text-align: left;
* {
display: inline-block;
}
#speed-up-icon {
margin-left: 8px;
width: 8px;
height: 8px;
background: url('images/arrow-up.png') bottom no-repeat;
}
#speed-dn-icon {
width: 8px;
height: 8px;
background: url('images/arrow-down.png') bottom no-repeat;
}
#speed-up-container {
display: none;
&.active { display: inline; }
}
#speed-dn-container {
display: none;
&.active { display: inline; }
}
}
#filter-button {

BIN
web/style/transmission/images/arrow-down.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 193 B

BIN
web/style/transmission/images/arrow-up.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 194 B