mirror of https://github.com/SuperBFG7/ympd
Merge pull request #159 from eb041592/unclutter_interface
Unclutter Interface
This commit is contained in:
Andy
GitHub
commit
17b97c8f6b
|
|
@ -93,3 +93,9 @@ td:last-child, td:first-child {
|
|||
button {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#trashmode span:last-child {
|
||||
display:inline-block;
|
||||
text-align:left;
|
||||
width:2.8em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@
|
|||
</ul>
|
||||
</div><!-- /.col-md-10 -->
|
||||
|
||||
<div class="col-md-2 col-xs-12" >
|
||||
<div class="col-md-2 col-xs-12">
|
||||
<div class="btn-toolbar">
|
||||
<div class="btn-group-vertical btn-block btn-group-lg" data-toggle="buttons">
|
||||
<button id="btnrandom" type="button" class="btn btn-default">
|
||||
|
|
@ -177,15 +177,15 @@
|
|||
<div id="trashmode" class="btn-group-vertical btn-block btn-group-lg" data-toggle="radio">
|
||||
<button id="btntrashmodeup" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-up"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> up
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Up</span>
|
||||
</button>
|
||||
<button id="btntrashmodesingle" type="button" class="btn btn-default active">
|
||||
<span class="glyphicon glyphicon-star-empty"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> single
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Single</span>
|
||||
</button>
|
||||
<button id="btntrashmodedown" type="button" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-down"></span>
|
||||
<span class="glyphicon glyphicon-trash"></span> down
|
||||
<span class="glyphicon glyphicon-trash"></span> <span>Down</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
@ -198,11 +198,6 @@
|
|||
</a>
|
||||
</div>
|
||||
|
||||
<div id="btn-responsive-block" class="btn-group-vertical btn-block btn-group-lg" data-toggle="buttons">
|
||||
<button type="button" class="btn btn-default" id="btnnotify">
|
||||
<span class="glyphicon glyphicon-comment"></span> Notifications
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.col-md-2 -->
|
||||
</div><!-- /.row -->
|
||||
|
|
@ -223,6 +218,19 @@
|
|||
<h5>ympd uses following excellent software:</h5>
|
||||
<h6><a href="http://cesanta.com/docs.html">Mongoose</a> <small>GPLv2</small></h6>
|
||||
<h6><a href="http://www.musicpd.org/libs/libmpdclient/">libMPDClient</a> <small>BSD License</small></h6>
|
||||
<hr />
|
||||
<div class="row">
|
||||
<div class="form-group col-md-6">
|
||||
<button type="button" class="btn btn-default btn-block" onclick="updateDB();">
|
||||
<span class="glyphicon glyphicon-refresh"></span> Update Database
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group col-md-6" data-toggle="buttons">
|
||||
<button type="button" class="btn btn-default btn-block" id="btnnotify">
|
||||
<span class="glyphicon glyphicon-comment"></span> Enable Notifications
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<form role="form">
|
||||
<div class="row">
|
||||
|
|
@ -252,14 +260,6 @@
|
|||
MPD Password is set
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="form-group col-md-12">
|
||||
<button type="button" class="btn btn-default" onclick="updateDB();">
|
||||
<span class="glyphicon glyphicon-refresh"></span> Update DB
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -282,7 +282,7 @@
|
|||
<div class="modal-body">
|
||||
<form role="form">
|
||||
<div class="row">
|
||||
<div class="form-group col-md-9">
|
||||
<div class="form-group col-md-12">
|
||||
<label class="control-label" for="streamurl">Stream URL</label>
|
||||
<input type="text" class="form-control" id="streamurl" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -110,7 +110,6 @@ var app = $.sammy(function() {
|
|||
$('#panel-heading').text("Search: "+searchstr);
|
||||
});
|
||||
|
||||
|
||||
this.get(/\#\/dirble\/(\d+)\/(\d+)/, function() {
|
||||
prepare();
|
||||
current_app = 'dirble';
|
||||
|
|
@ -134,14 +133,9 @@ var app = $.sammy(function() {
|
|||
|
||||
dirble_stations = true;
|
||||
|
||||
if(dirble_api_token) {
|
||||
dirble_load_stations();
|
||||
} else {
|
||||
getDirbleApiToken();
|
||||
}
|
||||
if (dirble_api_token) { dirble_load_stations(); }
|
||||
});
|
||||
|
||||
|
||||
this.get(/\#\/dirble\//, function() {
|
||||
prepare();
|
||||
current_app = 'dirble';
|
||||
|
|
@ -157,11 +151,7 @@ var app = $.sammy(function() {
|
|||
|
||||
dirble_stations = false;
|
||||
|
||||
if(dirble_api_token) {
|
||||
dirble_load_categories();
|
||||
} else {
|
||||
getDirbleApiToken();
|
||||
}
|
||||
if (dirble_api_token) { dirble_load_categories(); }
|
||||
});
|
||||
|
||||
this.get("/", function(context) {
|
||||
|
|
@ -199,7 +189,6 @@ $(document).ready(function(){
|
|||
add_filter();
|
||||
});
|
||||
|
||||
|
||||
function webSocketConnect() {
|
||||
if (typeof MozWebSocket != "undefined") {
|
||||
socket = new MozWebSocket(get_appropriate_ws_url());
|
||||
|
|
@ -217,7 +206,9 @@ function webSocketConnect() {
|
|||
|
||||
app.run();
|
||||
/* emit initial request for output names */
|
||||
socket.send("MPD_API_GET_OUTPUTS");
|
||||
socket.send('MPD_API_GET_OUTPUTS');
|
||||
/* emit initial request for dirble api token */
|
||||
socket.send('MPD_API_GET_DIRBLEAPITOKEN');
|
||||
}
|
||||
|
||||
socket.onmessage = function got_packet(msg) {
|
||||
|
|
@ -446,7 +437,7 @@ function webSocketConnect() {
|
|||
});
|
||||
|
||||
break;
|
||||
case "state":
|
||||
case 'state':
|
||||
updatePlayIcon(obj.data.state);
|
||||
updateVolumeIcon(obj.data.volume);
|
||||
|
||||
|
|
@ -500,16 +491,20 @@ function webSocketConnect() {
|
|||
|
||||
last_state = obj;
|
||||
break;
|
||||
case "outputnames":
|
||||
case 'outputnames':
|
||||
$('#btn-outputs-block button').remove();
|
||||
$.each(obj.data, function(id, name){
|
||||
var btn = $('<button id="btnoutput'+id+'" class="btn btn-default" onclick="toggleoutput(this, '+id+')"><span class="glyphicon glyphicon-volume-up"></span> '+name+'</button>');
|
||||
btn.appendTo($('#btn-outputs-block'));
|
||||
});
|
||||
if (obj.data.length > 1) {
|
||||
$.each(obj.data, function(id, name){
|
||||
var btn = $('<button id="btnoutput'+id+'" class="btn btn-default" onclick="toggleoutput(this, '+id+')"><span class="glyphicon glyphicon-volume-up"></span> '+name+'</button>');
|
||||
btn.appendTo($('#btn-outputs-block'));
|
||||
});
|
||||
} else {
|
||||
$('#btn-outputs-block').addClass('hide');
|
||||
}
|
||||
/* remove cache, since the buttons have been recreated */
|
||||
last_outputs = '';
|
||||
break;
|
||||
case "outputs":
|
||||
case 'outputs':
|
||||
if(JSON.stringify(obj) === JSON.stringify(last_outputs))
|
||||
break;
|
||||
$.each(obj.data, function(id, enabled){
|
||||
|
|
@ -520,7 +515,7 @@ function webSocketConnect() {
|
|||
});
|
||||
last_outputs = obj;
|
||||
break;
|
||||
case "disconnected":
|
||||
case 'disconnected':
|
||||
if($('.top-right').has('div').length == 0)
|
||||
$('.top-right').notify({
|
||||
message:{text:"ympd lost connection to MPD "},
|
||||
|
|
@ -528,11 +523,11 @@ function webSocketConnect() {
|
|||
fadeOut: { enabled: true, delay: 1000 },
|
||||
}).show();
|
||||
break;
|
||||
case "update_queue":
|
||||
case 'update_queue':
|
||||
if(current_app === 'queue')
|
||||
socket.send('MPD_API_GET_QUEUE,'+pagination);
|
||||
break;
|
||||
case "song_change":
|
||||
case 'song_change':
|
||||
|
||||
$('#album').text("");
|
||||
$('#artist').text("");
|
||||
|
|
@ -560,22 +555,26 @@ function webSocketConnect() {
|
|||
}).show();
|
||||
|
||||
break;
|
||||
case "mpdhost":
|
||||
case 'mpdhost':
|
||||
$('#mpdhost').val(obj.data.host);
|
||||
$('#mpdport').val(obj.data.port);
|
||||
if(obj.data.passwort_set)
|
||||
$('#mpd_password_set').removeClass('hide');
|
||||
break;
|
||||
case "dirbleapitoken":
|
||||
case 'dirbleapitoken':
|
||||
dirble_api_token = obj.data;
|
||||
|
||||
if(dirble_stations) {
|
||||
dirble_load_stations();
|
||||
if (dirble_api_token) {
|
||||
$('#dirble').removeClass('hide');
|
||||
|
||||
if (dirble_stations) { dirble_load_stations(); }
|
||||
else { dirble_load_categories(); }
|
||||
|
||||
} else {
|
||||
dirble_load_categories();
|
||||
}
|
||||
$('#dirble').addClass('hide');
|
||||
}
|
||||
break;
|
||||
case "error":
|
||||
case 'error':
|
||||
$('.top-right').notify({
|
||||
message:{text: obj.data},
|
||||
type: "danger",
|
||||
|
|
@ -583,9 +582,8 @@ function webSocketConnect() {
|
|||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
socket.onclose = function(){
|
||||
console.log("disconnected");
|
||||
$('.top-right').notify({
|
||||
|
|
@ -777,10 +775,6 @@ function getHost() {
|
|||
$('#mpd_pw_con').keypress(onEnter);
|
||||
}
|
||||
|
||||
function getDirbleApiToken() {
|
||||
socket.send('MPD_API_GET_DIRBLEAPITOKEN');
|
||||
}
|
||||
|
||||
$('#search').submit(function () {
|
||||
app.setLocation("#/search/"+$('#search > div > input').val());
|
||||
$('#wait').modal('show');
|
||||
|
|
|
|||
|
|
@ -80,8 +80,6 @@ int main(int argc, char **argv)
|
|||
mpd.port = 6600;
|
||||
strcpy(mpd.host, "127.0.0.1");
|
||||
|
||||
strcpy(dirble_api_token, "2e223c9909593b94fc6577361a");
|
||||
|
||||
static struct option long_options[] = {
|
||||
{"host", required_argument, 0, 'h'},
|
||||
{"port", required_argument, 0, 'p'},
|
||||
|
|
|
|||
Loading…
Reference in New Issue