various layout fixups

diff --git a/CMakeLists.txt b/CMakeLists.txt
index b27c5b3..2e50618 100644 (file)
--- a/CMakeLists.txt
+++ b/CMakeLists.txt
@@ -5,11 +5,10 @@ project (ympd)
 set(CPACK_PACKAGE_DESCRIPTION_SUMMARY "MPD web client based on Websockets and
 Bootstrap")
 set(CPACK_PACKAGE_VENDOR "Andrew Karpow <andy@ndyk.de>")
-SET(CPACK_DEBIAN_PACKAGE_MAINTAINER "andy@ndyk.de")
+set(CPACK_DEBIAN_PACKAGE_MAINTAINER "andy@ndyk.de")
 set(CPACK_PACKAGE_VERSION_MAJOR "0")
 set(CPACK_PACKAGE_VERSION_MINOR "1")
-set(CPACK_PACKAGE_VERSION_PATCH "")
-set(CPACK_BINARY_DEB "ON")
+set(CPACK_PACKAGE_VERSION_PATCH "0")
 set(CMAKE_MODULE_PATH ${CMAKE_MODULE_PATH} "${PROJECT_SOURCE_DIR}/cmake/")
 
 find_package(LibWebSockets REQUIRED)
@@ -17,13 +16,13 @@ find_package(LibMPDClient REQUIRED)
 include(CheckCSourceCompiles)
 include(CPack)
 
-SET(CMAKE_C_FLAGS_DEBRELEASE "-O2 -DNDEBUG -pipe")
+set(CMAKE_C_FLAGS_DEBRELEASE "-O2 -DNDEBUG -pipe")
 
 set(SOURCES
     src/ympd.c
     src/http_server.c
     src/mpd_client.c
-    )
+)
 
 add_executable(ympd ${SOURCES})
 add_definitions(-DDATADIR="${CMAKE_INSTALL_PREFIX}/share/${PROJECT_NAME}")
@@ -37,3 +36,11 @@ install(FILES contrib/init.debian DESTINATION /etc/init.d
     WORLD_READ WORLD_EXECUTE CONFIGURATIONS debrelease RENAME ${PROJECT_NAME})
 install(FILES contrib/default.debian DESTINATION /etc/default/${PROJECT_NAME}
     CONFIGURATIONS debrelease RENAME ${PROJECT_NAME})
+
+if(CMAKE_BUILD_TYPE STREQUAL "debrelease")
+    set(CPACK_BINARY_DEB "ON")
+    set(CPACK_BINARY_STGZ "OFF")
+    set(CPACK_BINARY_TGZ "OFF")
+    set(CPACK_BINARY_TZ "OFF")
+endif()
+

diff --git a/htdocs/css/mpd.css b/htdocs/css/mpd.css
index 0b271a5..deb280c 100644 (file)
--- a/htdocs/css/mpd.css
+++ b/htdocs/css/mpd.css
@@ -28,14 +28,7 @@ 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 22aae15..0f4d5b4 100644 (file)
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -42,15 +42,6 @@
           <li><a href="#" data-toggle="modal" data-target="#about">About</a></li>
         </ul>
 
-        <form class="navbar-form navbar-right" role="search">
-          <div class="form-group">
-            <input type="text" class="form-control" placeholder="Search">
-          </div>
-          <button type="submit" class="btn btn-default">
-            <span class="glyphicon glyphicon-search"></span>
-          </button>
-        </form>
-
         <div class="btn-toolbar navbar-btn navbar-right" role="toolbar">
           <div class="btn-group">
             <button type="button" class="btn btn-default" onclick="socket.send('MPD_API_SET_NEXT');">
@@ -78,7 +69,7 @@
   <div class="container starter-template">
     <div class="row">
 
-      <div class="col-md-10">
+      <div class="col-md-10 col-xs-12">
         <div id="alert" class="alert hide"></div>
         
         <div class="panel panel-primary">
@@ -101,6 +92,10 @@
             </div>
           </div><!-- /.panel-body -->
 
+          <ol id="breadcrump" class="breadcrumb">
+          </ol>
+
+
           <!-- Table -->
           <table id="salamisandwich" class="table table-hover">
             <thead>
@@ -116,8 +111,8 @@
         </div><!-- /.panel -->
       </div><!-- /.col-md-10 -->
 
-      <div class="col-md-2" >
-        <div data-spy="affix">
+      <div class="col-md-2 col-xs-12" >
+        <div data-spy="affix" data-offset-bottom="10">
           <div class="btn-group-vertical btn-block btn-group-lg" data-toggle="buttons">
             <button id="btnrandom" type="button" class="btn btn-default">
               <span class="glyphicon glyphicon-random"></span> Random

diff --git a/htdocs/js/mpd.js b/htdocs/js/mpd.js
index 4376676..7d945eb 100644 (file)
--- a/htdocs/js/mpd.js
+++ b/htdocs/js/mpd.js
@@ -14,6 +14,7 @@ var app = $.sammy(function() {
 
        this.get('#/', function() {
                current_app = 'playlist';
+               $('#breadcrump').addClass('hide');
                $('#salamisandwich').find("tr:gt(0)").remove();
                socket.send("MPD_API_GET_PLAYLIST");
                $('#panel-heading').text("Playlist");
@@ -22,6 +23,7 @@ var app = $.sammy(function() {
 
        this.get(/\#\/browse\/(.*)/, function() {
                current_app = 'browse';
+               $('#breadcrump').removeClass('hide').empty();
                $('#salamisandwich').find("tr:gt(0)").remove();
                var path = this.params['splat'];
                if(path == '')
@@ -29,11 +31,19 @@ var app = $.sammy(function() {
 
                socket.send("MPD_API_GET_BROWSE,"+path);
                $('#panel-heading').text("Browse database: "+path+"");
-               $('#browse').addClass('active');
-       });
+               var path_array = path[0].split('/');
+               var full_path = "";
+               $.each(path_array, function(index, chunk) {
+                       if(path_array.length - 1 == index) {
+                               $('#breadcrump').append("<li class=\"active\">"+ chunk + "</li>");
+                               return;
+                       }
 
-       this.get('#/about/', function() {
-               $('#about').addClass('active');
+                       full_path = full_path + chunk;
+                       $('#breadcrump').append("<li><a href=\"#/browse/" + full_path + "\">"+chunk+"</a></li>");
+                       full_path += "/";
+               });
+               $('#browse').addClass('active');
        });
 
        this.get("/", function(context) {
@@ -91,13 +101,12 @@ function webSocketConnect() {
                                                mouseover: function(){
                                                        if($(this).children().last().has("a").length == 0)
                                                                $(this).children().last().append(
-                                                                       "<a class=\"btn btn-xs pull-right btn-group-hover\" href=\"#/\" " +
+                                                                       "<a class=\"pull-right btn-group-hover\" href=\"#/\" " +
                                                                        "onclick=\"socket.send('MPD_API_RM_TRACK," + $(this).attr("trackid") +"'); $(this).parents('tr').remove();\">" +
                                                                        "<span class=\"glyphicon glyphicon-trash\"></span></a>")
                                                                .find('a').fadeTo('fast',1);
                                                },
                                                click: function() {
-                                                       console.log($(this));
                                                        $('#salamisandwich > tbody > tr').removeClass('success');
                                                        socket.send('MPD_API_PLAY_TRACK,'+$(this).attr('trackid'));
                                                        $(this).addClass('success');
@@ -113,7 +122,6 @@ function webSocketConnect() {
                                        //      break;
                                        if(current_app !== 'browse')
                                                break;
-                                       console.log(app);
 
                                        for (var item in obj.data) {
                                                switch(obj.data[item].type) {
@@ -121,7 +129,7 @@ function webSocketConnect() {
                                                                $('#salamisandwich > tbody').append(
                                                                        "<tr uri=\"" + obj.data[item].dir + "\">" +
                                                                        "<td><span class=\"glyphicon glyphicon-folder-open\"></span></td>" + 
-                                                                       "<td><a href=\"#/browse/"+ obj.data[item].dir +"\">" + obj.data[item].dir +"</a></td>" + 
+                                                                       "<td><a href=\"#/browse/"+ obj.data[item].dir +"\">" + basename(obj.data[item].dir) +"</a></td>" + 
                                                                        "<td></td></tr>");
                                                                break;
                                                        case "song":
@@ -145,7 +153,7 @@ function webSocketConnect() {
                                                        if($(this).children().last().has("a").length == 0)
                                                                if($(this).attr("uri").length > 0)
                                                                        $(this).children().last().append(
-                                                                               "<a class=\"btn btn-xs pull-right btn-group-hover\" " +
+                                                                               "<a role=\"button\" class=\"pull-right btn-group-hover\" " +
                                                                                "onclick=\"socket.send('MPD_API_ADD_TRACK," + $(this).attr("uri") +"'); $(this).parents('tr').addClass('success');\">" +
                                                                                "<span class=\"glyphicon glyphicon-plus\"></span></a>")
                                                                                .find('a').fadeTo('fast',1);
@@ -155,11 +163,6 @@ function webSocketConnect() {
                                                }
                                        });
 
-                                       $('#salamisandwich td:eq(1)').click(function(){
-                                               console.log($(this).children().attr("path"));
-                                               //socket.send('MPD_API_GET_BROWSE,'+;
-                                       });
-
                                        break;
                                case "state":
                                        if(JSON.stringify(obj) === JSON.stringify(last_state))
@@ -335,6 +338,9 @@ function updateDB()
        }, 5000);
 }
 
+function basename(path) {
+   return path.split('/').reverse()[0];
+}
 
 $('#btnrandom').on('click', function (e) {
        socket.send("MPD_API_TOGGLE_RANDOM," + ($(this).hasClass('active') ? 0 : 1));