SONAR-5165 It should be possible to use up and down arrows to navigate through result...

diff --git a/sonar-server/src/main/js/issues/app.js b/sonar-server/src/main/js/issues/app.js
index 4a291cc45f78c196c2a79d7353f4e616c5a6812a..36a93117eb1deadfb22b1a8a8b7348b8e051bc37 100644 (file)
--- a/sonar-server/src/main/js/issues/app.js
+++ b/sonar-server/src/main/js/issues/app.js
@@ -369,6 +369,7 @@ requirejs(
             data: fetchQuery,
             success: function () {
               that.issuesView.$el.removeClass('navigator-fetching');
+              that.issuesView.selectFirst();
             }
           });
           this.detailsRegion.reset();

diff --git a/sonar-server/src/main/js/issues/extra.js b/sonar-server/src/main/js/issues/extra.js
index 66fa821b014dd18b918291dc73404ff664229cea..630952805b01026aa596c0afbc53c108949fdb18 100644 (file)
--- a/sonar-server/src/main/js/issues/extra.js
+++ b/sonar-server/src/main/js/issues/extra.js
@@ -164,6 +164,9 @@ define(
 
 
         showDetails: function () {
+          key.setScope('list');
+          this.options.issuesView.selected = this.$el.parent().children().index(this.$el);
+
           this.$el.parent().children().removeClass('active');
           this.$el.addClass('active');
 
@@ -250,6 +253,41 @@ define(
         },
 
 
+        selectFirst: function() {
+          this.selected = -1;
+          this.selectNext();
+        },
+
+
+        selectNext: function() {
+          if (this.selected < this.collection.length - 1) {
+            this.selected++;
+            var child = this.$el.children().eq(this.selected),
+                container = jQuery('.navigator-results'),
+                containerHeight = container.height(),
+                bottom = child.position().top + child.outerHeight();
+            if (bottom > containerHeight) {
+              container.scrollTop(container.scrollTop() - containerHeight + bottom);
+            }
+            child.click();
+          }
+        },
+
+
+        selectPrev: function() {
+          if (this.selected > 0) {
+            this.selected--;
+            var child = this.$el.children().eq(this.selected),
+                container = jQuery('.navigator-results'),
+                top = child.position().top;
+            if (top < 0) {
+              container.scrollTop(container.scrollTop() + top);
+            }
+            child.click();
+          }
+        },
+
+
         onRender: function () {
           var that = this,
               $scrollEl = jQuery('.navigator-results'),
@@ -261,6 +299,7 @@ define(
               },
               throttledScroll = _.throttle(onScroll, 300);
           $scrollEl.off('scroll').on('scroll', throttledScroll);
+          this.bindShortcuts();
         },
 
 
@@ -275,6 +314,13 @@ define(
           var scrollEl = jQuery('.navigator-results');
           scrollEl.off('scroll');
           Marionette.CollectionView.prototype.close.call(this);
+        },
+
+
+        bindShortcuts: function () {
+          var that = this;
+          key('up', 'list', function() { that.selectPrev(); });
+          key('down', 'list', function() { that.selectNext(); });
         }
 
       });
@@ -832,6 +878,8 @@ define(
 
 
         events: {
+          'click': 'setDetailScope',
+
           'click .code-issue-toggle': 'toggleCollapsed',
 
           'click [href=#tab-issue-rule]': 'fetchRule',
@@ -853,6 +901,11 @@ define(
         },
 
 
+        setDetailScope: function() {
+          key.setScope('detail');
+        },
+
+
         onRender: function () {
           this.$('.code-issue-details').tabs();
           this.$('.code-issue-form').hide();

diff --git a/sonar-server/src/main/js/navigator/filters/base-filters.js b/sonar-server/src/main/js/navigator/filters/base-filters.js
index e07a3517bfe6cc94cfe158e26e4f8fa9127e7c17..8699c601f448b334a2d8a909d8d95715136eb0dc 100644 (file)
--- a/sonar-server/src/main/js/navigator/filters/base-filters.js
+++ b/sonar-server/src/main/js/navigator/filters/base-filters.js
@@ -111,8 +111,10 @@ define(['backbone', 'backbone.marionette', 'common/handlebars-extensions'], func
     toggleDetails: function(e) {
       e.stopPropagation();
       if (this.$el.hasClass('active')) {
+        key.setScope('list');
         this.hideDetails();
       } else {
+        key.setScope('filter');
         this.showDetails();
       }
     },