Merge pull request #767 from Bakke/buffer-search-improved

Use arrow keys to select buffer in buffer search

css/glowingbear.css

@@ -285,6 +285,12 @@ input[type=text], input[type=password], #sendMessage {
     color: #222;
 }
 
+.nav-pills > li.highlight > a, .nav-pills > li.highlight > a span {
+    text-decoration: none;
+    color: #fff;
+    background: #428BCA;
+}
+
 .nav-pills > li > a {
     display: block;
     overflow: hidden;

css/themes/dark.css

@@ -35,6 +35,11 @@ html {
     color: #222;
 }
 
+.nav-pills > li.highlight > a, .nav-pills > li.highlight > a span {
+    color: #fff;
+    background: #428BCA;
+}
+
 tr.bufferline:hover {
     background-color: #222222;
 }

css/themes/light.css

@@ -22,6 +22,11 @@ html {
     background-color: #222;
 }
 
+.nav-pills > li.highlight > a, .nav-pills > li.highlight > a span {
+    color: #fff;
+    background: #428BCA;
+}
+
 .btn-send,
 .btn-send-image, {
     background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.3);

index.html

@@ -259,7 +259,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
               <input class="form-control favorite-font" type="text" id="bufferFilter" ng-model="search" ng-keydown="handleSearchBoxKey($event)" placeholder="Search" autocomplete="off">
             </form>
           </li>
-          <li class="buffer" ng-class="{'active': buffer.active, 'indent': buffer.indent, 'channel': buffer.type === 'channel', 'channel_hash': buffer.prefix === '#', 'channel_plus': buffer.prefix === '+', 'channel_ampersand': buffer.prefix === '&', 'private': buffer.type === 'private'}" ng-repeat="(key, buffer) in (filteredBuffers = (getBuffers() | toArray:'withidx' | filter:{fullName:search} | filter:hasUnread | orderBy:predicate | getBufferQuickKeys:this))">
+          <li class="buffer" ng-class="{'active': buffer.active, 'highlight': search && search_highlight_key === key, 'indent': buffer.indent, 'channel': buffer.type === 'channel', 'channel_hash': buffer.prefix === '#', 'channel_plus': buffer.prefix === '+', 'channel_ampersand': buffer.prefix === '&', 'private': buffer.type === 'private'}" ng-repeat="(key, buffer) in (filteredBuffers = (getBuffers() | toArray:'withidx' | filter:{fullName:search} | filter:hasUnread | orderBy:predicate | getBufferQuickKeys:this))">
             <a ng-click="setActiveBuffer(buffer.id)" title="{{ buffer.fullName }}" href="#">
               <span class="badge pull-right" ng-class="{'danger': buffer.notification}" ng-if="buffer.notification || buffer.unread" ng-bind="buffer.notification || buffer.unread"></span>
               <span class="buffer-quick-key">{{ buffer.$quickKey }}</span>

js/glowingbear.js

@@ -750,17 +750,39 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
     $scope.handleSearchBoxKey = function($event) {
         // Support different browser quirks
         var code = $event.keyCode ? $event.keyCode : $event.charCode;
+
         // Handle escape
         if (code === 27) {
             $event.preventDefault();
             $scope.search = '';
         } // Handle enter
         else if (code === 13) {
+            var index;
             $event.preventDefault();
             if ($scope.filteredBuffers.length > 0) {
-                $scope.setActiveBuffer($scope.filteredBuffers[0].id);
+                // Go to highlighted buffer if available
+                // or first one
+                if ($scope.search_highlight_key) {
+                    index = $scope.search_highlight_key;
+                } else {
+                    index = 0;
+                }
+                $scope.setActiveBuffer($scope.filteredBuffers[index].id);
             }
             $scope.search = '';
+        } // Handle arrow up
+        else if (code === 38) {
+            $event.preventDefault();
+            if ($scope.search_highlight_key && $scope.search_highlight_key > 0) {
+                $scope.search_highlight_key = $scope.search_highlight_key - 1;
+            }
+        } // Handle arrow down and tab
+        else if (code === 40 || code === 9) {
+            $event.preventDefault();
+            $scope.search_highlight_key = $scope.search_highlight_key + 1;
+        } // Set highlight key to zero on all other keypress
+        else {
+            $scope.search_highlight_key = 0;
         }
     };