From 93274f899322fdc4704015d1d7a4dfb0dc917b7e Mon Sep 17 00:00:00 2001
From: Joel Pettersson <petterssonjoel@gmail.com>
Date: Wed, 11 Sep 2013 04:07:05 +0200
Subject: [PATCH] List tracks in jQuery table widget.

Currently, the tracks are just listed in the table and no action can be
taken on them. Eventually, the same popup menu as before or something
equivalent should be added.
---
 webclient/index.html    | 24 ++++++++++++++++++------
 webclient/js/library.js | 33 +++++++++++++++++++++++----------
 2 files changed, 41 insertions(+), 16 deletions(-)

diff --git a/webclient/index.html b/webclient/index.html
index e5064c9..9cfd7cc 100755
--- a/webclient/index.html
+++ b/webclient/index.html
@@ -222,12 +222,24 @@
                     </div>
                     <!-- grid a -->
 
-<!--                    <div class="" style="text-align: center" id="expandsearch">
-                        <a href="#" onclick="toggleSearch(); return false;"><img src="images/icons/arrow_down_16x16.png"></a>
-                    </div>
--->                    <div class="" id="searchtracks">
-                        <h4>Tracks</h4>
-                        <ul id="trackresulttable"  class="table"></ul>
+                    <div class="" id="searchtracks">
+                        <div data-role="header">
+                            <h4>Tracks</h4>
+                        </div>
+                        <div data-role="content">
+                            <table data-role="table" data-mode="reflow" id="trackresulttable" class="ui-responsive table-stroke">
+                                <thead>
+                                    <tr>
+                                        <th>Track</th>
+                                        <th data-priority="1">Artist</th>
+                                        <th data-priority="2">Time</th>
+                                        <th data-priority="3">Album</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                </tbody>
+                            </table>
+                        </div>
                     </div>
                 </div>
             </div>
diff --git a/webclient/js/library.js b/webclient/js/library.js
index ded4f4b..a4237f3 100755
--- a/webclient/js/library.js
+++ b/webclient/js/library.js
@@ -22,9 +22,6 @@ function initSearch() {
         document.activeElement.blur();
         $("input").blur();
 
-        $('#artistresulttable').empty();
-        $('#albumresulttable').empty();
-        $('#trackresulttable').empty();
         delete customTracklists['allresultscache'];
         delete customTracklists['artistresultscache'];
         delete customTracklists['albumresultscache'];
@@ -41,10 +38,6 @@ function initSearch() {
  * process results of a search
  *********************************************************/
 function processSearchResults(resultArr) {
-    $(SEARCH_TRACK_TABLE).empty();
-    $(SEARCH_ARTIST_TABLE).empty();
-    $(SEARCH_ALBUM_TABLE).empty();
-
     // Merge results from different backends.
     var results = {'tracks': [], 'artists': [], 'albums': []};
     var emptyResult = true;
@@ -134,10 +127,30 @@ function processSearchResults(resultArr) {
     // Inject list items, refresh listview and hide superfluous items.
     $(SEARCH_ALBUM_TABLE).html(child).listview('refresh').find('.overflow').hide();
 
-    $('#expandsearch').show();
-
     // Track results
-    playlisttotable(results.tracks, SEARCH_TRACK_TABLE, 'trackresultscache');
+    child = '';
+    pattern = '<tr><td>{track}</td><td>{artist}</td><td>{time}</td><td>{album}</td></tr>';
+
+    //playlisttotable(results.tracks, SEARCH_TRACK_TABLE, 'trackresultscache');
+    for (var i = 0; i < results.tracks.length; ++i) {
+        tokens = {
+            'track': results.tracks[i].name,
+            'artist': '',
+            'time': results.tracks[i].length,
+            'album': results.tracks[i].album.name,
+            'listuri': undefined,
+            'trackuri': results.tracks[i].uri,
+        };
+
+        for (var j = 0; j < results.tracks[i].artists.length; ++j) {
+            tokens.artist += results.tracks[i].artists[j].name + ', ';
+        }
+
+        child += theme(pattern, tokens);
+    }
+
+    $(SEARCH_TRACK_TABLE).children('tbody').html(child);
+    $(SEARCH_TRACK_TABLE).table('refresh');
 
     setSongInfo();
     showLoading(false);