kznavbar-001.patch

diff --git a/src/app/browse/browse.controller.js b/src/app/browse/browse.controller.js
index 74410e9..52ee1f3 100644
--- a/src/app/browse/browse.controller.js
+++ b/src/app/browse/browse.controller.js
@@ -17,6 +17,7 @@ class BrowseController {
     this.$scope = $scope;
     this.$rootScope = $rootScope;
     this.uiSettingsService = uiSettingsService;
+    this.isMusicLibrary = false;

     if (this.browseService.isBrowsing || this.browseService.isSearching) {
       this.renderBrowseTable();
@@ -25,11 +26,16 @@ class BrowseController {
       this.renderBrowseTable();
     });

+    $scope.alphabet = "0abcdefghijklmnopqrstuvwxyz".split("");
+    $scope.showkznavbar = false;
     this.initController();
   }

+
   fetchLibrary(item, back = false) {
     this.$log.debug(item);
+    if (item.uri.startsWith('music-library')) { this.isMusicLibrary = true;}
+    else { this.isMusicLibrary = false;}
     if (item.uri !== 'cd') {
       this.browseService.fetchLibrary(item, back);
     }
@@ -37,6 +43,7 @@ class BrowseController {

   backHome() {
     this.searchField = '';
+    this.isMusicLibrary = false;
     this.browseService.backHome();
   }

@@ -79,6 +86,7 @@ class BrowseController {
       this.playQueueService.playPlaylist({title: item.name});
     }
   }
+
   clickListItemByIndex(listIndex, itemIndex) {
     let item = this.browseService.lists[listIndex].items[itemIndex];
     this.clickListItem(item);
@@ -195,6 +203,7 @@ class BrowseController {
         item.type === 'folder-with-favourites';
     return ret;
   }
+
   showAddToQueueButton(item) {
     let ret = item.type === 'folder' || item.type === 'song' ||
         item.type === 'mywebradio' || item.type === 'webradio' ||
@@ -202,6 +211,7 @@ class BrowseController {
         item.type === 'cuefile' || item.type === 'folder-with-favourites';
     return ret;
   }
+
   showAddToPlaylist(item) {
     let ret = item.type === 'folder' || item.type === 'song' ||
     item.type === 'remdisk' || item.type === 'folder-with-favourites';
@@ -282,9 +292,35 @@ class BrowseController {
         }

         this.table += `<div class="listWrapper">`;
+
+        // 20180626 - add filter ids
+        var firstChar = '';
+
         list.items.forEach((item, itemIndex) => {
           //Print items
           this.table += `<div class="itemWrapper"><div class="itemTab">`;
+
+          // 20180626 - add filter ids
+          var currentChar = item.title.charAt(0).toLowerCase();
+
+          var isNumber = RegExp('[0-9]');
+          var isAlpha = RegExp('[a-z]');
+
+          if (!isNumber.test(currentChar) && !isAlpha.test(currentChar)) {
+            // if 1char is not a number and not an alpha, then use # as first char
+            currentChar = '0';
+          }
+          else if (isNumber.test(currentChar)) {
+            // if 1char is a number, then use # as first char
+            currentChar = '0';
+          }
+
+          if (firstChar != currentChar) {
+            this.table += `<a id="scrollto-${currentChar}"></a>`;
+            firstChar = currentChar;
+          }
+
+
           if (item.icon || item.albumart) {
           this.table += `<div class="image" id="${item.active ? 'source-active': ''}"
               onclick="${angularThis}.clickListItemByIndex(${listIndex}, ${itemIndex})">`;
@@ -393,6 +429,20 @@ class BrowseController {
       }
     }
   }
+
+  togglekzNavBar() {
+    this.$scope.showkznavbar = ! this.$scope.showkznavbar;
+  }
+
+  scrollTo(hash) {
+    var element = angular.element('#scrollto-'+hash);
+    if(element.length > 0) {
+      var container = angular.element('#browseTablesWrapper');
+      container.scrollTop(0);
+      var scrolling = element.offset().top - container.offset().top;
+      container.animate({scrollTop: scrolling}, "fast");
+    }
+  }
 }

 export default BrowseController;
diff --git a/src/app/browse/components/browse-nav-buttons.html b/src/app/browse/components/browse-nav-buttons.html
index 48bcc9a..495a57b 100644
--- a/src/app/browse/components/browse-nav-buttons.html
+++ b/src/app/browse/components/browse-nav-buttons.html
@@ -33,3 +33,10 @@
     title="{{'COMMON.RIP' | translate}}">
   <i class="fa fa-download"></i>
 </button>
+<button
+    class="btn-link"
+    ng-click="browse.togglekzNavBar()"
+    ng-if="browse.isMusicLibrary">
+  <i ng-if="showkznavbar" class="fa fa-times"></i>
+  <i ng-if="!showkznavbar" class="fa fa-filter"></i>
+</button>
diff --git a/src/app/themes/volumio/browse/volumio-browse.html b/src/app/themes/volumio/browse/volumio-browse.html
index 07f4d5c..e5337a3 100644
--- a/src/app/themes/volumio/browse/volumio-browse.html
+++ b/src/app/themes/volumio/browse/volumio-browse.html
@@ -11,6 +11,9 @@
           ng-include src="'app/browse/components/browse-search-box.html'">
       </div>
       <div class="clearfix"></div>
+      <div
+          ng-include src="'app/browse/components/browse-kznavbar.html'">
+      </div>
     </div>

     <div id="browseTablesWrapper">