From fe0277bfbecff18f58ccc0b37ff7ae462f3bee86 Mon Sep 17 00:00:00 2001
From: eb041592 <35889760+eb041592@users.noreply.github.com>
Date: Sat, 3 Feb 2018 12:03:33 +0100
Subject: [PATCH] Rearranged artist and album information in queue and search
 results.

---
 htdocs/css/mpd.css |  7 ++++++-
 htdocs/index.html  |  2 +-
 htdocs/js/mpd.js   | 20 +++++++++++++-------
 src/mpd_client.c   | 14 ++++++++++----
 4 files changed, 30 insertions(+), 13 deletions(-)

diff --git a/htdocs/css/mpd.css b/htdocs/css/mpd.css
index 647bfc7..88987e2 100644
--- a/htdocs/css/mpd.css
+++ b/htdocs/css/mpd.css
@@ -55,10 +55,15 @@ body {
   }
 }
 
-#salamisandwich td:nth-child(3), th:nth-child(3) {
+#salamisandwich td:nth-last-child(2), th:nth-last-child(2) {
   text-align: right;
 }
 
+#salamisandwich td:nth-child(2) span {
+	font-style:italic;
+	font-size:90%;
+}
+
 tbody {
   cursor: pointer;
 }
diff --git a/htdocs/index.html b/htdocs/index.html
index d74dc67..726d193 100644
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -114,7 +114,7 @@
             <thead>
               <tr>
                 <th>#</th>
-                <th>Title</th>
+                <th colspan="2">Track</th>
                 <th>Duration</th>
                 <th></th>
               </tr>
diff --git a/htdocs/js/mpd.js b/htdocs/js/mpd.js
index ef760bf..6c8841a 100644
--- a/htdocs/js/mpd.js
+++ b/htdocs/js/mpd.js
@@ -238,7 +238,8 @@ function webSocketConnect() {
 
                         $('#salamisandwich > tbody').append(
                             "<tr trackid=\"" + obj.data[song].id + "\"><td>" + (obj.data[song].pos + 1) + "</td>" +
-                                "<td>" + obj.data[song].artist + " [" + obj.data[song].album  + "] - " + obj.data[song].title  + "</td>" +
+                                "<td>" + obj.data[song].artist + "<br /><span>" + obj.data[song].album  + "</span></td>" +
+                                "<td>" + obj.data[song].title  + "</td>" +
                                 "<td>" + minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
                         "</td><td></td></tr>");
                     }
@@ -334,7 +335,7 @@ function webSocketConnect() {
                                 $('#salamisandwich > tbody').append(
                                     "<tr uri=\"" + encodeURI(obj.data[item].dir) + "\" class=\"" + clazz + "\">" +
                                     "<td><span class=\"glyphicon glyphicon-folder-open\"></span></td>" +
-                                    "<td><a>" + basename(obj.data[item].dir) + "</a></td>" +
+                                    "<td colspan=\"2\"><a>" + basename(obj.data[item].dir) + "</a></td>" +
                                     "<td></td><td></td></tr>"
                                 );
                                 break;
@@ -346,7 +347,7 @@ function webSocketConnect() {
                                 $('#salamisandwich > tbody').append(
                                     "<tr uri=\"" + encodeURI(obj.data[item].plist) + "\" class=\"" + clazz + "\">" +
                                     "<td><span class=\"glyphicon glyphicon-list\"></span></td>" +
-                                    "<td><a>" + basename(obj.data[item].plist) + "</a></td>" +
+                                    "<td colspan=\"2\"><a>" + basename(obj.data[item].plist) + "</a></td>" +
                                     "<td></td><td></td></tr>"
                                 );
                                 break;
@@ -354,10 +355,15 @@ function webSocketConnect() {
                                 var minutes = Math.floor(obj.data[item].duration / 60);
                                 var seconds = obj.data[item].duration - minutes * 60;
 
+                                if (typeof obj.data[item].artist === 'undefined') {
+                                    var details = "<td colspan=\"2\">" + obj.data[item].title + "</td>";
+                                } else {
+                                    var details = "<td>" + obj.data[item].artist + "<br /><span>" + obj.data[item].album + "</span></td><td>" + obj.data[item].title + "</td>";
+                                }
+
 				$('#salamisandwich > tbody').append(
                                     "<tr uri=\"" + encodeURI(obj.data[item].uri) + "\" class=\"song\">" +
-                                    "<td><span class=\"glyphicon glyphicon-music\"></span></td>" +
-                                    "<td>" + (typeof obj.data[item].artist !== 'undefined' ? obj.data[item].artist + " [" + obj.data[item].album + "] - " : '') + obj.data[item].title + "</td>" +
+                                    "<td><span class=\"glyphicon glyphicon-music\"></span></td>" + details +
                                     "<td>" + minutes + ":" + (seconds < 10 ? '0' : '') + seconds +
                                     "</td><td></td></tr>"
                                 );
@@ -367,8 +373,8 @@ function webSocketConnect() {
                                     $('#next').removeClass('hide');
                                 } else {
                                     $('#salamisandwich > tbody').append(
-                                        "<tr><td><span class=\"glyphicon glyphicon-remove\"></span></td>" + 
-                                        "<td>Too many results, please refine your search!</td>" + 
+                                        "<tr><td><span class=\"glyphicon glyphicon-remove\"></span></td>" +
+                                        "<td colspan=\"2\">Too many results, please refine your search!</td>" +
                                         "<td></td><td></td></tr>"
                                     );
                                 }
diff --git a/src/mpd_client.c b/src/mpd_client.c
index 099f673..1054ede 100644
--- a/src/mpd_client.c
+++ b/src/mpd_client.c
@@ -480,8 +480,11 @@ char* mpd_get_artist(struct mpd_song const *song)
     char *str;
 
     str = (char *)mpd_song_get_tag(song, MPD_TAG_ARTIST, 0);
-
-    return str;
+    if (str == NULL) {
+	return "";
+    } else {
+	return str;
+    }
 }
 
 char* mpd_get_album(struct mpd_song const *song)
@@ -489,8 +492,11 @@ char* mpd_get_album(struct mpd_song const *song)
     char *str;
 
     str = (char *)mpd_song_get_tag(song, MPD_TAG_ALBUM, 0);
-
-    return str;
+    if (str == NULL) {
+	return "";
+    } else {
+	return str;
+    }
 }
 
 int mpd_put_state(char *buffer, int *current_song_id, unsigned *queue_version)
-- 
2.20.1