diff --git a/web/index.html b/web/index.html
index 0eccef808..117ca8682 100755
--- a/web/index.html
+++ b/web/index.html
@@ -47,6 +47,21 @@
+
+ Show
+
+
+ —
+
+
+
diff --git a/web/javascript/transmission.js b/web/javascript/transmission.js
index 43b3930a9..a5d0345e7 100644
--- a/web/javascript/transmission.js
+++ b/web/javascript/transmission.js
@@ -65,6 +65,9 @@ Transmission.prototype =
$('#toolbar-inspector').click($.proxy(this.toggleInspector,this));
+ $('#filter-mode').change($.proxy(this.onFilterModeClicked,this));
+ $('#filter-tracker').change($.proxy(this.onFilterTrackerClicked,this));
+
if (!isMobileDevice) {
$(document).bind('keydown', $.proxy(this.keyDown,this) );
$(document).bind('keyup', $.proxy(this.keyUp, this) );
@@ -97,8 +100,6 @@ Transmission.prototype =
this.refreshTorrents();
this.togglePeriodicSessionRefresh(true);
- this.filterSetup();
-
this.updateButtonsSoon();
},
@@ -1059,8 +1060,6 @@ Transmission.prototype =
fmt = Transmission.fmt,
torrents = this.getAllTorrents();
- this.refreshFilterButton();
-
// up/down speed
for (i=0; row=torrents[i]; ++i) {
u += row.getUploadSpeed();
@@ -1072,6 +1071,9 @@ Transmission.prototype =
$('#speed-dn-container').toggleClass('active', d>0 );
$('#speed-dn-label').text( fmt.speedBps( d ) );
+
+ // visible torrents
+ $('#filter-count').text( fmt.plural(this._rows.length, 'Transfer') );
},
setEnabled: function(key, flag)
@@ -1079,6 +1081,36 @@ Transmission.prototype =
$(key).toggleClass('disabled', !flag);
},
+ updateFilterSelect: function()
+ {
+ var i, names, name, str, o,
+ e = $('#filter-tracker'),
+ trackers = this.getTrackers();
+
+ // build a sorted list of names
+ names = [];
+ for (name in trackers)
+ names.push (name);
+ names.sort();
+
+ // build the new html
+ if (!this.filterTracker)
+ str = '';
+ else
+ str = '';
+ for (i=0; name=names[i]; ++i) {
+ o = trackers[name];
+ str += '';
+ }
+
+ if (!this.filterTrackersStr || (this.filterTrackersStr !== str)) {
+ this.filterTrackersStr = str;
+ $('#filter-tracker').html(str);
+ }
+ },
+
updateButtonsSoon: function()
{
if (!this.buttonRefreshTimer)
@@ -1153,69 +1185,6 @@ Transmission.prototype =
*****
****/
- filterSetup: function()
- {
- var tr = this,
- popup = $('#filter-popup');
-
- popup.dialog({
- autoOpen: false,
- position: isMobileDevice ? 'center' : [40,40],
- show: 'blind',
- hide: 'blind',
- title: 'Show',
- width: 315
- });
-
- $('#filter-button').click(function() {
- if (popup.is(":visible"))
- popup.dialog('close');
- else {
- tr.refreshFilterPopup();
- popup.dialog('open');
- }
- });
- this.refreshFilterButton();
- },
-
- refreshFilterButton: function()
- {
- var o, tmp, text, torrent_count,
- state = this[Prefs._FilterMode],
- state_all = state === Prefs._FilterAll,
- state_string = this.getStateString(state),
- tracker = this.filterTracker,
- tracker_all = !tracker,
- tracker_string = tracker ? this.getReadableDomain(tracker) : '',
- visible_count = this._rows.length;
-
- // count the total number of torrents
- torrent_count = 0;
- o = this._torrents;
- for (tmp in o)
- if (o.hasOwnProperty(tmp))
- ++torrent_count;
-
- text = 'Show ';
- if (state_all && tracker_all)
- text += 'All';
- else if (state_all)
- text += tracker_string;
- else if (tracker_all)
- text += state_string;
- else
- text += state_string + ' at ' + tracker_string;
- text += ' — ';
-
- if (torrent_count !== visible_count)
- text += visible_count.toStringWithCommas() + ' of ' + torrent_count.toStringWithCommas();
- else if (torrent_count === 1)
- text += '1 Transfer';
- else
- text += torrent_count.toStringWithCommas() + ' Transfers';
- $('#filter-button').html(text);
- },
-
refilterSoon: function()
{
if (!this.refilterTimer) {
@@ -1257,6 +1226,8 @@ Transmission.prototype =
list = this.elements.torrent_list,
old_sel_count = $(list).children('.selected').length;
+ this.updateFilterSelect();
+
clearTimeout(this.refilterTimer);
delete this.refilterTimer;
@@ -1361,7 +1332,6 @@ Transmission.prototype =
// sync gui
this.updateStatusbar();
- this.refreshFilterButton();
if (old_sel_count !== $(list).children('.selected').length)
this.selectionChanged();
},
@@ -1375,103 +1345,15 @@ Transmission.prototype =
this.refilter(true);
},
- refreshFilterPopup: function()
+ onFilterModeClicked: function(ev)
{
- var i, j, o, s, state, states, counts,
- sel_state, fragment, div,
- tor, torrents, name, names,
- trackers = this.getTrackers(),
- tr = this;
-
- /***
- **** States
- ***/
-
- states = [ Prefs._FilterAll,
- Prefs._FilterActive,
- Prefs._FilterDownloading,
- Prefs._FilterSeeding,
- Prefs._FilterPaused,
- Prefs._FilterFinished ];
-
- counts = {};
- for (i=0; state=states[i]; ++i)
- counts[state] = 0;
-
- torrents = this.getAllTorrents();
- for (i=0; tor=torrents[i]; ++i)
- for (j=0; state=states[j]; ++j)
- if (tor.testState(state))
- counts[state]++;
-
- sel_state = tr[Prefs._FilterMode];
- fragment = document.createDocumentFragment();
- for (i=0; s=states[i]; ++i)
- {
- div = document.createElement('div');
- div.id = 'show-state-' + s;
- div.className = 'row' + (s === sel_state ? ' selected':'');
- div.innerHTML = ''
- + '' + tr.getStateString(s) + ''
- + '' + counts[s].toStringWithCommas() + '';
- $(div).click({'state':s}, function(ev) {
- tr.setFilterMode(ev.data.state);
- $('#filter-popup').dialog('close');
- });
- fragment.appendChild(div);
- }
- $('#filter-by-state .row').remove();
- $('#filter-by-state')[0].appendChild(fragment);
-
- /***
- **** Trackers
- ***/
-
- names = [];
- for (name in trackers)
- names.push (name);
- names.sort();
-
- fragment = document.createDocumentFragment();
- div = document.createElement('div');
- div.id = 'show-tracker-all';
- div.className = 'row' + (tr.filterTracker ? '' : ' selected');
- div.innerHTML = ''
- + 'All'
- + '' + torrents.length.toStringWithCommas() + '';
- $(div).click(function() {
- tr.setFilterTracker(null);
- $('#filter-popup').dialog('close');
- });
- fragment.appendChild(div);
- for (i=0; name=names[i]; ++i) {
- o = trackers[name];
- div = document.createElement('div');
- div.id = 'show-tracker-' + name;
- div.className = 'row' + (o.domain === tr.filterTracker ? ' selected':'');
- div.innerHTML = ''+ name + ''
- + ''+ o.count.toStringWithCommas() + '';
- $(div).click({domain:o.domain}, function(ev) {
- tr.setFilterTracker(ev.data.domain);
- $('#filter-popup').dialog('close');
- });
- fragment.appendChild(div);
- }
- $('#filter-by-tracker .row').remove();
- $('#filter-by-tracker')[0].appendChild(fragment);
+ this.setFilterMode($('#filter-mode').val());
},
- getStateString: function(mode)
+ onFilterTrackerClicked: function(ev)
{
- switch (mode)
- {
- case Prefs._FilterActive: return 'Active';
- case Prefs._FilterSeeding: return 'Seeding';
- case Prefs._FilterDownloading: return 'Downloading';
- case Prefs._FilterPaused: return 'Paused';
- case Prefs._FilterFinished: return 'Finished';
- default: return 'All';
- }
+ var tracker = $('#filter-tracker').val();
+ this.setFilterTracker(tracker==='all' ? null : tracker);
},
setFilterTracker: function(domain)
diff --git a/web/style/transmission/common.css b/web/style/transmission/common.css
index cc94edf33..c7e333f83 100644
--- a/web/style/transmission/common.css
+++ b/web/style/transmission/common.css
@@ -326,16 +326,9 @@ div#toolbar {
display: none; }
#statusbar #speed-info #speed-dn-container.active {
display: inline; }
- #statusbar #filter-button {
+ #statusbar #filter-select {
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-button .filter-selection {
- text-decoration: underline; }
+ margin-left: 5px; }
#statusbar input#torrent_search {
float: right;
height: 15px;
diff --git a/web/style/transmission/common.scss b/web/style/transmission/common.scss
index 1ae099219..62c400ecf 100644
--- a/web/style/transmission/common.scss
+++ b/web/style/transmission/common.scss
@@ -233,14 +233,9 @@ $statusbar-gradient-bottom: #bbb;
}
}
- #filter-button {
+ #filter-select {
float: left;
- text-shadow: 0 1px 0 #ccc;
- margin: 5px 8px;
- -moz-user-select: none;
- -webkit-user-select: none;
- &:hover { cursor: pointer };
- #filter-button .filter-selection { text-decoration: underline; }
+ margin-left: 5px;
}
input#torrent_search {
diff --git a/web/style/transmission/mobile.css b/web/style/transmission/mobile.css
index 66c34bba0..8fac0d7a7 100644
--- a/web/style/transmission/mobile.css
+++ b/web/style/transmission/mobile.css
@@ -349,16 +349,9 @@ div#toolbar {
display: none; }
#statusbar #speed-info #speed-dn-container.active {
display: inline; }
- #statusbar #filter-button {
+ #statusbar #filter-select {
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-button .filter-selection {
- text-decoration: underline; }
+ margin-left: 5px; }
#statusbar input#torrent_search {
display: none; }
diff --git a/web/style/transmission/mobile.scss b/web/style/transmission/mobile.scss
index fb2f9eef0..a7a73542b 100644
--- a/web/style/transmission/mobile.scss
+++ b/web/style/transmission/mobile.scss
@@ -226,15 +226,10 @@ $statusbar-gradient-bottom: #bbb;
}
}
- #filter-button {
- float: left;
- text-shadow: 0 1px 0 #ccc;
- margin: 5px 8px;
- -moz-user-select: none;
- -webkit-user-select: none;
- &:hover { cursor: pointer };
- #filter-button .filter-selection { text-decoration: underline; }
- }
+ #filter-select {
+ float: left;
+ margin-left: 5px;
+ }
input#torrent_search {
display: none;