mirrors/ympd
1
0
Fork 0
mirror of https://github.com/SuperBFG7/ympd synced 2025-01-14 11:15:49 +00:00
Code Issues Releases Wiki Activity

Improved button states

Browse Source
This commit is contained in:
jcorporation 2018-06-24 18:57:47 +01:00
parent f5f5b23312
commit b6d1985d38
3 changed files with 84 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
htdocs/css/mpd.css
View File

@ -198,3 +198,9 @@ main {
background-color:#eee; background-color:#eee;
cursor:pointer; cursor:pointer;
} }
button.active {
color: #fff;
background-color: #28a745 !important;
border-color: #28a745 !important;
}

15
htdocs/index.html
View File

@ -111,7 +111,7 @@
<span class="material-icons float-left">vertical_align_top</span> <span class="material-icons float-left">vertical_align_top</span>
<span class="ml-3">Delete upward</span> <span class="ml-3">Delete upward</span>
</button> </button>
<button id="btntrashmodesingle" type="button" class="btn btn-success btn-block"> <button id="btntrashmodesingle" type="button" class="btn btn-secondary active btn-block">
<span class="material-icons float-left">delete</span> <span class="material-icons float-left">delete</span>
<span class="ml-3">Delete single</span> <span class="ml-3">Delete single</span>
</button> </button>
@ -142,7 +142,7 @@
</button> </button>
<div class="dropdown-menu bg-dark dropdown-menu-right px-2" id="searchqueuetag"> <div class="dropdown-menu bg-dark dropdown-menu-right px-2" id="searchqueuetag">
<h6 class="dropdown-header text-light">Search in Tag</h6> <h6 class="dropdown-header text-light">Search in Tag</h6>
<button type="button" class="btn btn-success btn-block">Any Tag</button> <button type="button" class="btn btn-secondary btn-block active">Any Tag</button>
<button type="button" class="btn btn-secondary btn-block">Title</button> <button type="button" class="btn btn-secondary btn-block">Title</button>
<button type="button" class="btn btn-secondary btn-block">Artist</button> <button type="button" class="btn btn-secondary btn-block">Artist</button>
<button type="button" class="btn btn-secondary btn-block">Album</button> <button type="button" class="btn btn-secondary btn-block">Album</button>
@ -412,7 +412,7 @@
</button> </button>
<div class="dropdown-menu bg-dark dropdown-menu-right px-2" id="searchtags2"> <div class="dropdown-menu bg-dark dropdown-menu-right px-2" id="searchtags2">
<h6 class="dropdown-header text-light">Search in Tag</h6> <h6 class="dropdown-header text-light">Search in Tag</h6>
<button type="button" class="btn btn-success btn-block">Any Tag</button> <button type="button" class="btn btn-secondary active btn-block">Any Tag</button>
<button type="button" class="btn btn-secondary btn-block">Title</button> <button type="button" class="btn btn-secondary btn-block">Title</button>
<button type="button" class="btn btn-secondary btn-block">Artist</button> <button type="button" class="btn btn-secondary btn-block">Artist</button>
<button type="button" class="btn btn-secondary btn-block">Album</button> <button type="button" class="btn btn-secondary btn-block">Album</button>
@ -510,8 +510,9 @@
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<form class="needs-validation" id="settingsFrm" novalidate>
<div class="row"> <div class="row">
<div class="form-group col-md-6"> <div class="form-group col-md-6" data-toggle="buttons">
<button id="btnrandom" type="button" class="btn btn-secondary btn-block" title="Random"> <button id="btnrandom" type="button" class="btn btn-secondary btn-block" title="Random">
Random Random
</button> </button>
@ -540,12 +541,13 @@
<div class="input-group-text bg-secondary text-light border-secondary">Crossfade</div> <div class="input-group-text bg-secondary text-light border-secondary">Crossfade</div>
</div> </div>
<input id="inputCrossfade" type="text" class="form-control border-secondary" value=""> <input id="inputCrossfade" type="text" class="form-control border-secondary" value="">
<div class="invalid-feedback">Must be a number.</div>
</div> </div>
<div class="form-group input-group col-md-6 border-secondary"> <div class="form-group input-group col-md-6 border-secondary">
<div class="input-group-prepend"> <div class="input-group-prepend">
<div class="input-group-text bg-secondary text-light border-secondary">Replaygain</div> <div class="input-group-text bg-secondary text-light border-secondary">Replaygain</div>
</div> </div>
<select id="selectReplaygain" class="form-control border-secondary"> <select id="selectReplaygain" class="form-control custom-select border-secondary">
<option value="off">Off</option> <option value="off">Off</option>
<option value="track">Track</option> <option value="track">Track</option>
<option value="album">Album</option> <option value="album">Album</option>
@ -558,12 +560,14 @@
<div class="input-group-text bg-secondary text-light border-secondary">Mixramp DB</div> <div class="input-group-text bg-secondary text-light border-secondary">Mixramp DB</div>
</div> </div>
<input id="inputMixrampdb" type="text" class="form-control border-secondary" value=""> <input id="inputMixrampdb" type="text" class="form-control border-secondary" value="">
<div class="invalid-feedback">Must be a number.</div>
</div> </div>
<div class="form-group input-group col-md-6 border-secondary"> <div class="form-group input-group col-md-6 border-secondary">
<div class="input-group-prepend"> <div class="input-group-prepend">
<div class="input-group-text bg-secondary text-light border-secondary">Mixramp Delay</div> <div class="input-group-text bg-secondary text-light border-secondary">Mixramp Delay</div>
</div> </div>
<input id="inputMixrampdelay" type="text" class="form-control border-secondary" value=""> <input id="inputMixrampdelay" type="text" class="form-control border-secondary" value="">
<div class="invalid-feedback">Must be a number.</div>
</div> </div>
</div> </div>
<hr/> <hr/>
@ -579,6 +583,7 @@
</button> </button>
</div> </div>
</div> </div>
</form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

165
htdocs/js/mpd.js
View File

@ -130,9 +130,9 @@ app.route=function() {
setPagination(app.current.page); setPagination(app.current.page);
} }
$('#searchqueuetag > button').each(function() { $('#searchqueuetag > button').each(function() {
$(this).addClass('btn-secondary').removeClass('btn-success'); $(this).removeClass('active');
if ($(this).text() == app.current.filter) { if ($(this).text() == app.current.filter) {
$(this).removeClass('btn-secondary').addClass('btn-success'); $(this).addClass('active');
$('#searchqueuetagdesc').text($(this).text()); $('#searchqueuetagdesc').text($(this).text());
} }
}); });
@ -189,9 +189,9 @@ app.route=function() {
$('#searchstr2').val(app.current.search); $('#searchstr2').val(app.current.search);
} }
$('#searchtags2 > button').each(function() { $('#searchtags2 > button').each(function() {
$(this).addClass('btn-secondary').removeClass('btn-success'); $(this).removeClass('active');
if ($(this).text() == app.current.filter) { if ($(this).text() == app.current.filter) {
$(this).removeClass('btn-secondary').addClass('btn-success'); $(this).addClass('active');
$('#searchtags2desc').text($(this).text()); $('#searchtags2desc').text($(this).text());
} }
}); });
@ -239,6 +239,10 @@ $(document).ready(function(){
$('#settings').on('shown.bs.modal', function () { $('#settings').on('shown.bs.modal', function () {
sendAPI({"cmd":"MPD_API_GET_SETTINGS"},parseSettings); sendAPI({"cmd":"MPD_API_GET_SETTINGS"},parseSettings);
document.getElementById('settingsFrm').classList.remove('was-validated');
document.getElementById('inputCrossfade').classList.remove('is-invalid');
document.getElementById('inputMixrampdb').classList.remove('is-invalid');
document.getElementById('inputMixrampdelay').classList.remove('is-invalid');
}) })
$('#addstream').on('shown.bs.modal', function () { $('#addstream').on('shown.bs.modal', function () {
@ -360,19 +364,24 @@ function parseStats(obj) {
function parseSettings(obj) { function parseSettings(obj) {
if (obj.data.random) if (obj.data.random)
$('#btnrandom').removeClass('btn-secondary').addClass("btn-success") $('#btnrandom').addClass("active").attr("aria-pressed","true");
else else
$('#btnrandom').removeClass("btn-success").addClass("btn-secondary"); $('#btnrandom').removeClass("active").attr("aria-pressed","false");
if (obj.data.consume) if (obj.data.consume)
$('#btnconsume').removeClass('btn-secondary').addClass("btn-success") $('#btnconsume').addClass("active").attr("aria-pressed","true");
else else
$('#btnconsume').removeClass("btn-success").addClass("btn-secondary"); $('#btnconsume').removeClass("active").attr("aria-pressed","false");
if (obj.data.single) if (obj.data.single)
$('#btnsingle').removeClass('btn-secondary').addClass("btn-success") $('#btnsingle').addClass("active").attr("aria-pressed","true");
else else
$('#btnsingle').removeClass("btn-success").addClass("btn-secondary"); $('#btnsingle').removeClass("active").attr("aria-pressed","false");
if (obj.data.repeat)
$('#btnrepeat').addClass("active").attr("aria-pressed","true");
else
$('#btnrepeat').removeClass("active").attr("aria-pressed","false");
if (obj.data.crossfade != undefined) if (obj.data.crossfade != undefined)
$('#inputCrossfade').removeAttr('disabled').val(obj.data.crossfade); $('#inputCrossfade').removeAttr('disabled').val(obj.data.crossfade);
@ -389,39 +398,34 @@ function parseSettings(obj) {
else else
$('#inputMixrampdb').attr('disabled', 'disabled'); $('#inputMixrampdb').attr('disabled', 'disabled');
if (obj.data.repeat)
$('#btnrepeat').removeClass('btn-secondary').addClass("btn-success")
else
$('#btnrepeat').removeClass("btn-success").addClass("btn-secondary");
$("#selectReplaygain").val(obj.data.replaygain); $("#selectReplaygain").val(obj.data.replaygain);
if (notificationsSupported()) { if (notificationsSupported()) {
if (obj.data.notificationWeb) { if (obj.data.notificationWeb) {
$('#btnnotifyWeb').removeClass('btn-secondary').addClass("btn-success") $('#btnnotifyWeb').addClass("active").attr("aria-pressed","true");
Notification.requestPermission(function (permission) { Notification.requestPermission(function (permission) {
if(!('permission' in Notification)) if(!('permission' in Notification))
Notification.permission = permission; Notification.permission = permission;
if (permission === 'granted') { if (permission === 'granted') {
$('#btnnotifyWeb').removeClass('btn-secondary').addClass('btn-success'); $('#btnnotifyWeb').addClass("active").attr("aria-pressed","true");
} else { } else {
$('#btnnotifyWeb').addClass('btn-secondary').removeClass('btn-success'); $('#btnnotifyWeb').removeClass("active").attr("aria-pressed","false");
obj.data.notificationWeb=0; obj.data.notificationWeb=0;
} }
}); });
} }
else else
$('#btnnotifyWeb').addClass('btn-secondary').removeClass("btn-success"); $('#btnnotifyWeb').removeClass("active").attr("aria-pressed","false");
} else { } else {
$('#btnnotifyWeb').addClass("disabled"); $('#btnnotifyWeb').addClass("disabled");
$('#btnnotifyWeb').addClass('btn-secondary').removeClass("btn-success"); $('#btnnotifyWeb').removeClass("active").attr("aria-pressed","false");
} }
if (obj.data.notificationPage) if (obj.data.notificationPage)
$('#btnnotifyPage').removeClass('btn-secondary').addClass("btn-success") $('#btnnotifyPage').addClass("active").attr("aria-pressed","true");
else else
$('#btnnotifyPage').addClass('btn-secondary').removeClass("btn-success"); $('#btnnotifyPage').removeClass("active").attr("aria-pressed","false");
settings=obj.data; settings=obj.data;
setLocalStream(obj.data.mpdhost,obj.data.streamport); setLocalStream(obj.data.mpdhost,obj.data.streamport);
@ -432,18 +436,18 @@ function getSettings() {
} }
function parseOutputnames(obj) { function parseOutputnames(obj) {
$('#btn-outputs-block button').remove(); $('#btn-outputs-block button').remove();
if ( Object.keys(obj.data).length ) { if ( Object.keys(obj.data).length ) {
$.each(obj.data, function(id, name){ $.each(obj.data, function(id, name){
var btn = $('<button id="btnoutput'+id+'" class="btn btn-secondary btn-block" onclick="toggleoutput(this, '+id+')">'+ var btn = $('<button id="btnoutput'+id+'" class="btn btn-secondary btn-block" onclick="toggleoutput(this, '+id+')">'+
'<span class="material-icons float-left">volume_up</span> '+name+'</button>'); '<span class="material-icons float-left">volume_up</span> '+name+'</button>');
btn.appendTo($('#btn-outputs-block')); btn.appendTo($('#btn-outputs-block'));
}); });
} else { } else {
$('#btn-outputs-block').addClass('hide'); $('#btn-outputs-block').addClass('hide');
} }
/* remove cache, since the buttons have been recreated */ /* remove cache, since the buttons have been recreated */
last_outputs = ''; last_outputs = '';
} }
function parseState(obj) { function parseState(obj) {
@ -490,9 +494,9 @@ function parseState(obj) {
$.each(obj.data.outputs, function(id, enabled){ $.each(obj.data.outputs, function(id, enabled){
if (enabled) if (enabled)
$('#btnoutput'+id).removeClass('btn-secondary').addClass("btn-success") $('#btnoutput'+id).addClass("active")
else else
$('#btnoutput'+id).removeClass("btn-success").addClass("btn-secondary"); $('#btnoutput'+id).removeClass("active");
}); });
last_outputs = obj.data.outputs; last_outputs = obj.data.outputs;
} }
@ -553,9 +557,9 @@ function parseQueue(obj) {
$('#QueueList > tbody > tr').on({ $('#QueueList > tbody > tr').on({
mouseover: function(){ mouseover: function(){
var doomed = $(this); var doomed = $(this);
if ( $('#btntrashmodeup').hasClass('btn-success') ) if ( $('#btntrashmodeup').hasClass('active') )
doomed = $('#QueueList > tbody > tr:lt(' + ($(this).index() + 1) + ')'); doomed = $('#QueueList > tbody > tr:lt(' + ($(this).index() + 1) + ')');
if ( $('#btntrashmodedown').hasClass('btn-success') ) if ( $('#btntrashmodedown').hasClass('active') )
doomed = $('#QueueList > tbody > tr:gt(' + ($(this).index() - 1) + ')'); doomed = $('#QueueList > tbody > tr:gt(' + ($(this).index() - 1) + ')');
$.each(doomed, function(){ $.each(doomed, function(){
if($(this).children().last().has('a').length == 0) if($(this).children().last().has('a').length == 0)
@ -568,9 +572,9 @@ function parseQueue(obj) {
}, },
mouseleave: function(){ mouseleave: function(){
var doomed = $(this); var doomed = $(this);
if ( $('#btntrashmodeup').hasClass('btn-success') ) if ( $('#btntrashmodeup').hasClass('active') )
doomed = $("#QueueList > tbody > tr:lt(" + ($(this).index() + 1) + ")"); doomed = $("#QueueList > tbody > tr:lt(" + ($(this).index() + 1) + ")");
if ( $('#btntrashmodedown').hasClass('btn-success') ) if ( $('#btntrashmodedown').hasClass('active') )
doomed = $("#QueueList > tbody > tr:gt(" + ($(this).index() - 1) + ")"); doomed = $("#QueueList > tbody > tr:gt(" + ($(this).index() - 1) + ")");
$.each(doomed, function(){$(this).children().last().find("a").stop().remove();}); $.each(doomed, function(){$(this).children().last().find("a").stop().remove();});
} }
@ -991,11 +995,11 @@ function setLocalStream(mpdhost,streamport) {
function delQueueSong(tr,event) { function delQueueSong(tr,event) {
event.stopPropagation(); event.stopPropagation();
if ( $('#btntrashmodeup').hasClass('btn-success') ) { if ( $('#btntrashmodeup').hasClass('active') ) {
sendAPI({"cmd":"MPD_API_RM_RANGE", "data": {"start":0, "end": (tr.index() + 1)}}); sendAPI({"cmd":"MPD_API_RM_RANGE", "data": {"start":0, "end": (tr.index() + 1)}});
} else if ( $('#btntrashmodesingle').hasClass('btn-success') ) { } else if ( $('#btntrashmodesingle').hasClass('active') ) {
sendAPI({"cmd":"MPD_API_RM_TRACK", "data": { "track": tr.attr('trackid')}}); sendAPI({"cmd":"MPD_API_RM_TRACK", "data": { "track": tr.attr('trackid')}});
} else if ( $('#btntrashmodedown').hasClass('btn-success') ) { } else if ( $('#btntrashmodedown').hasClass('active') ) {
sendAPI({"cmd":"MPD_API_RM_RANGE", "data": {"start": tr.index(), "end":-1}}); sendAPI({"cmd":"MPD_API_RM_RANGE", "data": {"start": tr.index(), "end":-1}});
}; };
} }
@ -1009,35 +1013,6 @@ function basename(path) {
return path.split('/').reverse()[0]; return path.split('/').reverse()[0];
} }
function toggleBtn(btn) {
if ($(btn).hasClass('btn-success')) {
$(btn).removeClass('btn-success').addClass('btn-secondary');
}
else {
$(btn).removeClass('btn-secondary').addClass('btn-success');
}
}
$('#btnrandom').on('click', function (e) {
toggleBtn(this);
});
$('#btnconsume').on('click', function (e) {
toggleBtn(this);
});
$('#btnsingle').on('click', function (e) {
toggleBtn(this);
});
$('#btnrepeat').on('click', function (e) {
toggleBtn(this);
});
$('#btnnotifyPage').on('click', function (e) {
toggleBtn(this);
});
$('#btnnotifyWeb').on('click', function (e) {
toggleBtn(this);
});
$('#cardBrowseNavFilesystem').on('click', function (e) { $('#cardBrowseNavFilesystem').on('click', function (e) {
app.goto('Browse','Filesystem'); app.goto('Browse','Filesystem');
e.preventDefault(); e.preventDefault();
@ -1090,9 +1065,7 @@ function confirmSettings() {
if (!isNaN(value)) { if (!isNaN(value)) {
$('#inputCrossfade').val(value); $('#inputCrossfade').val(value);
} else { } else {
$('#inputCrossfade').popover({"content":"Must be a number","trigger":"manual"}); document.getElementById('inputCrossfade').classList.add('is-invalid');
$('#inputCrossfade').popover('show');
$('#inputCrossfade').focus();
formOK=false; formOK=false;
} }
} }
@ -1101,9 +1074,7 @@ function confirmSettings() {
if (!isNaN(value)) { if (!isNaN(value)) {
$('#inputMixrampdb').val(value); $('#inputMixrampdb').val(value);
} else { } else {
$('#inputMixrampdb').popover({"content":"Must be a number","trigger":"manual"}); document.getElementById('inputMixrampdb').classList.add('is-invalid');
$('#inputMixrampdb').popover('show');
$('#inputMixrampdb').focus();
formOK=false; formOK=false;
} }
} }
@ -1113,36 +1084,36 @@ function confirmSettings() {
if (!isNaN(value)) { if (!isNaN(value)) {
$('#inputMixrampdelay').val(value); $('#inputMixrampdelay').val(value);
} else { } else {
$('#inputMixrampdelay').popover({"content":"Must be a number, -1 to disable","trigger":"manual"}); document.getElementById('inputMixrampdelay').classList.add('is-invalid');
$('#inputMixrampdelay').popover('show');
$('#inputMixrampdelay').focus();
formOK=false; formOK=false;
} }
} }
if (formOK == true) { if (formOK == true) {
sendAPI({"cmd":"MPD_API_SET_SETTINGS", "data": { sendAPI({"cmd":"MPD_API_SET_SETTINGS", "data": {
"consume": ($('#btnconsume').hasClass('btn-success') ? 1 : 0), "consume": ($('#btnconsume').hasClass('active') ? 1 : 0),
"random": ($('#btnrandom').hasClass('btn-success') ? 1 : 0), "random": ($('#btnrandom').hasClass('active') ? 1 : 0),
"single": ($('#btnsingle').hasClass('btn-success') ? 1 : 0), "single": ($('#btnsingle').hasClass('active') ? 1 : 0),
"repeat": ($('#btnrepeat').hasClass('btn-success') ? 1 : 0), "repeat": ($('#btnrepeat').hasClass('active') ? 1 : 0),
"replaygain": $('#selectReplaygain').val(), "replaygain": $('#selectReplaygain').val(),
"crossfade": $('#inputCrossfade').val(), "crossfade": $('#inputCrossfade').val(),
"mixrampdb": $('#inputMixrampdb').val(), "mixrampdb": $('#inputMixrampdb').val(),
"mixrampdelay": $('#inputMixrampdelay').val(), "mixrampdelay": $('#inputMixrampdelay').val(),
"notificationWeb": ($('#btnnotifyWeb').hasClass('btn-success') ? 1 : 0), "notificationWeb": ($('#btnnotifyWeb').hasClass('active') ? 1 : 0),
"notificationPage": ($('#btnnotifyPage').hasClass('btn-success') ? 1 : 0) "notificationPage": ($('#btnnotifyPage').hasClass('active') ? 1 : 0)
}},getSettings); }},getSettings);
$('#settings').modal('hide'); $('#settings').modal('hide');
} else {
document.getElementById('settingsFrm').classList.add('was-validated');
} }
} }
function toggleoutput(button, id) { function toggleoutput(button, id) {
sendAPI({"cmd":"MPD_API_TOGGLE_OUTPUT", "data": {"output": id, "state": ($(button).hasClass('btn-success') ? 0 : 1)}}); sendAPI({"cmd":"MPD_API_TOGGLE_OUTPUT", "data": {"output": id, "state": ($(button).hasClass('active') ? 0 : 1)}});
} }
$('#trashmodebtns > button').on('click', function(e) { $('#trashmodebtns > button').on('click', function(e) {
$('#trashmodebtns').children("button").removeClass("btn-success").addClass('btn-secondary'); $('#trashmodebtns').children('button').removeClass('active');
$(this).removeClass("btn-secondary").addClass("btn-success"); $(this).addClass('active');
}); });
@ -1177,8 +1148,8 @@ $('#searchstr2').keyup(function (event) {
}); });
$('#searchtags2 > button').on('click',function (e) { $('#searchtags2 > button').on('click',function (e) {
$('#searchtags2 > button').removeClass('btn-success').addClass('btn-secondary'); $('#searchtags2 > button').removeClass('active');
$(this).removeClass('btn-secondary').addClass('btn-success'); $(this).removeClass('btn-secondary').addClass('active');
app.current.filter=$(this).text(); app.current.filter=$(this).text();
app.goto(app.current.app,app.current.tab,app.current.view,app.current.page + '/' + app.current.filter + '/' + app.current.search); app.goto(app.current.app,app.current.tab,app.current.view,app.current.page + '/' + app.current.filter + '/' + app.current.search);
}); });
@ -1190,8 +1161,8 @@ $('#searchqueuestr').keyup(function (event) {
}); });
$('#searchqueuetag > button').on('click',function (e) { $('#searchqueuetag > button').on('click',function (e) {
$('#searchqueuetag > button').removeClass('btn-success').addClass('btn-secondary'); $('#searchqueuetag > button').removeClass('active');
$(this).removeClass('btn-secondary').addClass('btn-success'); $(this).removeClass('btn-secondary').addClass('active');
app.current.filter=$(this).text(); app.current.filter=$(this).text();
$('#searchqueuetagdesc').text(app.current.filter); $('#searchqueuetagdesc').text(app.current.filter);
app.goto(app.current.app,app.current.tab,app.current.view,app.current.page + '/' + app.current.filter + '/' + app.current.search); app.goto(app.current.app,app.current.tab,app.current.view,app.current.page + '/' + app.current.filter + '/' + app.current.search);
@ -1325,19 +1296,19 @@ function setFilterLetter(filter) {
} }
function doSetFilterLetter(x) { function doSetFilterLetter(x) {
$(x+'Letters > button').removeClass('btn-success').addClass('btn-secondary'); $(x+'Letters > button').removeClass('active');
if (app.current.filter == '0') { if (app.current.filter == '0') {
$(x).text('Filter: #'); $(x).text('Filter: #');
$(x+'Letters > button').each(function() { $(x+'Letters > button').each(function() {
if ($(this).text() == '#') { if ($(this).text() == '#') {
$(this).addClass('btn-success'); $(this).addClass('active');
} }
}); });
} else if (app.current.filter != '-') { } else if (app.current.filter != '-') {
$(x).text('Filter: '+app.current.filter); $(x).text('Filter: '+app.current.filter);
$(x+'Letters > button').each(function() { $(x+'Letters > button').each(function() {
if ($(this).text() == app.current.filter) { if ($(this).text() == app.current.filter) {
$(this).addClass('btn-success'); $(this).addClass('active');
} }
}); });
} else { } else {