diff --git a/htdocs/css/mpd.css b/htdocs/css/mpd.css
index 46244c7..0b271a5 100644
--- a/htdocs/css/mpd.css
+++ b/htdocs/css/mpd.css
@@ -28,3 +28,14 @@ body {
min-width: 50px;
}
+.btn-group-hover .btn {
+ border-color: white;
+ background: white;
+ text-shadow: 0 1px 1px white;
+ -webkit-box-shadow: inset 0 1px 0 white;
+ -moz-box-shadow: inset 0 1px 0 white;
+ box-shadow: inset 0 1px 0 white;
+}
+.btn-group-hover {
+ opacity: 0;
+}
diff --git a/htdocs/index.html b/htdocs/index.html
index 32a6ea0..eb8c102 100644
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -37,9 +37,9 @@
diff --git a/htdocs/js/mpd.js b/htdocs/js/mpd.js
index c813fe7..6fe91df 100644
--- a/htdocs/js/mpd.js
+++ b/htdocs/js/mpd.js
@@ -6,14 +6,10 @@ $('#volumeslider').slider().on('slide', function(event) {
socket.send("MPD_API_SET_VOLUME,"+event.value);
});
-$('#nav_links > li').on('click', function(e) {
- //$('#nav_links > li:contains(' + History.getState().title + ')').removeClass('active');
- //History.pushState({state:$(this).attr('id')}, $(this).text(), '?' + $(this).attr('id'));
-});
-
var app = $.sammy(function() {
this.before('/', function(e, data) {
socket.send("MPD_API_GET_TRACK_INFO");
+ $('#nav_links > li').removeClass('active');
});
this.get('#/', function() {
@@ -21,7 +17,9 @@ var app = $.sammy(function() {
$('#salamisandwich').find("tr:gt(0)").remove();
socket.send("MPD_API_GET_PLAYLIST");
$('#panel-heading').text("Playlist");
+ $('#playlist').addClass('active');
});
+
this.get(/\#\/browse\/(.*)/, function() {
current_app = 'browse';
$('#salamisandwich').find("tr:gt(0)").remove();
@@ -31,50 +29,26 @@ var app = $.sammy(function() {
socket.send("MPD_API_GET_BROWSE,"+path);
$('#panel-heading').text("Browse database: "+path+"");
+ $('#browse').addClass('active');
});
- this.get('#/about', function() {
+
+ this.get('#/about/', function() {
current_app = 'about';
$('#panel-heading').text("About");
- });
+ $('#about').addClass('active');
+ });
+
this.get("/", function(context) {
context.redirect("#/");
});
});
-
-
-/*
-History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
-
- if(!State.data.state) {
- //$('#' + State.data).
- }
-
- $('#panel-heading').text(State.title);
- switch(State.data.state) {
- case "nav_browse":
- socket.send('MPD_API_GET_BROWSE,/');
- break;
- case "nav_about":
- break;
- case "nav_playlist":
- default:
-
- }
- $(this).addClass('active');
-
- console.log(" Browser State: ");
- console.log(State);
- socket.send("MPD_API_GET_TRACK_INFO");
-});
-*/
$(document).ready(function(){
webSocketConnect();
});
function webSocketConnect() {
-
if (typeof MozWebSocket != "undefined") {
socket = new MozWebSocket(get_appropriate_ws_url(), "ympd-client");
} else {
@@ -99,19 +73,36 @@ function webSocketConnect() {
case "playlist":
//if(state.data.state !== 'nav_playlist')
// break;
+ console.log("Got Playlist...");
if(current_app !== 'playlist')
break;
+ $('#salamisandwich > tbody').empty();
for (var song in obj.data) {
var minutes = Math.floor(obj.data[song].duration / 60);
var seconds = obj.data[song].duration - minutes * 60;
- $('#salamisandwich tr:last').after(
- "" + obj.data[song].pos + " | " +
+ $('#salamisandwich > tbody').append(
+ "
" + obj.data[song].pos + " | " +
""+ obj.data[song].title +" | " +
""+ minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
- " |
");
+ "");
}
+
+ $('#salamisandwich > tbody > tr').on({
+ mouseover: function(){
+ if($(this).children().last().has("a").length == 0)
+ $(this).children().last().append(
+ "" +
+ "")
+ .find('a').fadeTo('fast',1);
+ },
+ mouseleave: function(){
+ $(this).children().last().find("a").stop().remove();
+ }
+ });
+
break;
case "browse":
//if(state.data.state !== 'nav_browse')
@@ -123,8 +114,9 @@ function webSocketConnect() {
for (var item in obj.data) {
switch(obj.data[item].type) {
case "directory":
- $('#salamisandwich tr:last').after(
- " | " +
+ $('#salamisandwich > tbody').append(
+ "
" +
+ " | " +
"" + obj.data[item].dir +" | " +
" |
");
break;
@@ -132,15 +124,33 @@ function webSocketConnect() {
var minutes = Math.floor(obj.data[item].duration / 60);
var seconds = obj.data[item].duration - minutes * 60;
- $('#salamisandwich tr:last').after(
- " | " +
- "" + obj.data[item].title +" | " +
+ $('#salamisandwich > tbody').append(
+ "
" +
+ " | " +
+ "" + obj.data[item].title +" | " +
""+ minutes + ":" + (seconds < 10 ? '0' : '') + seconds +" |
");
break;
+
case "playlist":
break;
}
}
+
+ $('#salamisandwich > tbody > tr').on({
+ mouseover: function(){
+ if($(this).children().last().has("a").length == 0)
+ if($(this).attr("uri").length > 0)
+ $(this).children().last().append(
+ "" +
+ "")
+ .find('a').fadeTo('fast',1);
+ },
+ mouseleave: function(){
+ $(this).children().last().find("a").stop().remove();
+ }
+ });
+
$('#salamisandwich td:eq(1)').click(function(){
console.log($(this).children().attr("path"));
//socket.send('MPD_API_GET_BROWSE,'+;
@@ -209,7 +219,10 @@ function webSocketConnect() {
case "current_song":
$('#currenttrack').text(" " + obj.data.title);
-
+ if(obj.data.album)
+ $('#album').text(obj.data.album);
+ if(obj.data.artist)
+ $('#artist').text(obj.data.artist);
default:
break;
}
diff --git a/src/mpd_client.c b/src/mpd_client.c
index 500640c..950f521 100644
--- a/src/mpd_client.c
+++ b/src/mpd_client.c
@@ -103,6 +103,14 @@ int callback_ympd(struct libwebsocket_context *context,
mpd_send_next(conn);
mpd_response_finish(conn);
}
+ else if(!strcmp((const char *)in, MPD_API_RM_ALL)) {
+ mpd_run_clear(conn);
+ }
+ else if(!strncmp((const char *)in, MPD_API_RM_TRACK, sizeof(MPD_API_RM_TRACK)-1)) {
+ unsigned id;
+ if(sscanf(in, "MPD_API_RM_TRACK,%d", &id))
+ mpd_run_delete_id(conn, id);
+ }
else if(!strncmp((const char *)in, MPD_API_TOGGLE_RANDOM, sizeof(MPD_API_TOGGLE_RANDOM)-1)) {
unsigned random;
if(sscanf(in, "MPD_API_TOGGLE_RANDOM,%d", &random))
@@ -136,6 +144,14 @@ int callback_ympd(struct libwebsocket_context *context,
pss->browse_path = dir;
}
}
+ else if(!strncmp((const char *)in, MPD_API_ADD_TRACK, sizeof(MPD_API_ADD_TRACK)-1)) {
+ char *uri;
+ if(sscanf(in, "MPD_API_ADD_TRACK,%m[^\t\n]", &uri) && uri != NULL) {
+ printf("sending '%s'\n", uri);
+ mpd_run_add(conn, uri);
+ free(uri);
+ }
+ }
break;
@@ -247,11 +263,11 @@ int mpd_put_current_song(char *buffer)
return 0;
len = snprintf(buffer, MAX_SIZE, "{\"type\": \"current_song\", \"data\":"
- "{\"id\":%d, \"pos\":%d, \"duration\":%d, \"title\":\"%s\"}}",
- mpd_song_get_id(song),
+ "{\"pos\":%d, \"title\":\"%s\", \"artist\":\"%s\", \"album\":\"%s\"}}",
mpd_song_get_pos(song),
- mpd_song_get_duration(song),
- mpd_get_title(song)
+ mpd_get_title(song),
+ mpd_song_get_tag(song, MPD_TAG_ARTIST, 0),
+ mpd_song_get_tag(song, MPD_TAG_ALBUM, 0)
);
mpd_song_free(song);
mpd_response_finish(conn);
diff --git a/src/mpd_client.h b/src/mpd_client.h
index 1fe6313..b710230 100644
--- a/src/mpd_client.h
+++ b/src/mpd_client.h
@@ -25,6 +25,8 @@ enum mpd_conn_states {
#define MPD_API_GET_TRACK_INFO "MPD_API_GET_TRACK_INFO"
#define MPD_API_GET_BROWSE "MPD_API_GET_BROWSE"
#define MPD_API_ADD_TRACK "MPD_API_ADD_TRACK"
+#define MPD_API_RM_TRACK "MPD_API_RM_TRACK"
+#define MPD_API_RM_ALL "MPD_API_RM_ALL"
#define MPD_API_SET_VOLUME "MPD_API_SET_VOLUME"
#define MPD_API_SET_PAUSE "MPD_API_SET_PAUSE"
#define MPD_API_SET_PLAY "MPD_API_SET_PLAY"