SONAR-6040 improve display of file path

11 files changed, 146 insertions, 81 deletions

diff --git a/server/sonar-web/src/main/hbs/nav/nav-search-item.hbs b/server/sonar-web/src/main/hbs/nav/nav-search-item.hbs
index e1b4bed6f00..fe80ef05c58 100644
--- a/server/sonar-web/src/main/hbs/nav/nav-search-item.hbs
+++ b/server/sonar-web/src/main/hbs/nav/nav-search-item.hbs
@@ -9,10 +9,13 @@
 
 <a href="{{url}}" title="{{name}}">
   {{#if q}}{{qualifierIcon q}}{{/if}}
-  {{#if subtitle}}
-    {{title}}
-    <span class="subtitle">{{subtitle}}</span>
+  {{#eq q 'FIL'}}
+    {{collapsedDirFromPath name}}{{fileFromPath name}}
   {{else}}
-    {{name}}
-  {{/if}}
+    {{#eq q 'UTS'}}
+      {{collapsedDirFromPath name}}{{fileFromPath name}}
+    {{else}}
+      {{name}}
+    {{/eq}}
+  {{/eq}}
 </a>
diff --git a/server/sonar-web/src/main/hbs/source-viewer/source-viewer-duplication-popup.hbs b/server/sonar-web/src/main/hbs/source-viewer/source-viewer-duplication-popup.hbs
index bf134d7fd62..2e83c813a0e 100644
--- a/server/sonar-web/src/main/hbs/source-viewer/source-viewer-duplication-popup.hbs
+++ b/server/sonar-web/src/main/hbs/source-viewer/source-viewer-duplication-popup.hbs
@@ -2,25 +2,36 @@
   <div class="bubble-popup-title">{{t 'component_viewer.transition.duplication'}}</div>
   {{#each duplications}}
     <div class="bubble-popup-section">
-      {{#notEqComponents file ../component}}
-        <div class="component-viewer-popup-label" title="{{projectFullName file}}">
-          <i class="icon-qualifier-trk"></i> {{projectFullName file}}
-        </div>
-      {{/notEqComponents}}
+      <div class="component-name">
+        {{#notEqComponents file ../component}}
+          <div class="component-name-parent">
+            <i class="icon-qualifier-trk"></i>&nbsp;<a href="{{dashboardUrl file.project}}">{{file.projectName}}</a>
+          </div>
+          {{#if file.subProjectName}}
+            <div class="component-name-parent">
+              <i class="icon-qualifier-trk"></i>&nbsp;<a
+                href="{{dashboardUrl file.subProject}}">{{file.subProjectName}}</a>
+            </div>
+          {{/if}}
+        {{/notEqComponents}}
 
-      {{#notEq file.key ../component.key}}
-        <a class="link-action" data-key="{{file.key}}" title="{{file.name}}">
-          {{file.name}}
-        </a>
-      {{/notEq}}
+        {{#notEq file.key ../component.key}}
+          <div class="component-name-path">
+            <a class="link-action" data-key="{{file.key}}" title="{{file.name}}">
+              <span>{{collapsedDirFromPath file.name}}</span><span
+                class="component-name-file">{{fileFromPath file.name}}</span>
+            </a>
+          </div>
+        {{/notEq}}
 
-      <div class="component-viewer-popup-duplications">
-        Lines:
-        {{#joinEach blocks ','}}
-          <a class="link-action" data-key="{{../file.key}}" data-line="{{from}}">
-            {{from}} – {{sum from size}}
-          </a>
-        {{/joinEach}}
+        <div class="component-name-path">
+          Lines:
+          {{#joinEach blocks ','}}
+            <a class="link-action" data-key="{{../file.key}}" data-line="{{from}}">
+              {{from}} – {{sum from size}}
+            </a>
+          {{/joinEach}}
+        </div>
       </div>
     </div>
   {{else}}
diff --git a/server/sonar-web/src/main/hbs/source-viewer/source-viewer-header.hbs b/server/sonar-web/src/main/hbs/source-viewer/source-viewer-header.hbs
index 14cc0e9e58f..a9b0d6ebae3 100644
--- a/server/sonar-web/src/main/hbs/source-viewer/source-viewer-header.hbs
+++ b/server/sonar-web/src/main/hbs/source-viewer/source-viewer-header.hbs
@@ -1,28 +1,31 @@
 <div class="source-viewer-header-component">
-  {{#unless removed}}
-    {{#if projectName}}
-      <div class="source-viewer-header-component-project">
-        {{qualifierIcon 'TRK'}}&nbsp;<a href="{{dashboardUrl project}}">{{projectName}}</a>
+  <div class="component-name">
+
+    {{#unless removed}}
+      {{#if projectName}}
+        <div class="component-name-parent">
+          {{qualifierIcon 'TRK'}}&nbsp;<a href="{{dashboardUrl project}}">{{projectName}}</a>
+        </div>
         {{#if subProjectName}}
-          &nbsp;&nbsp;&nbsp;
-          {{qualifierIcon 'TRK'}}&nbsp;<a href="{{dashboardUrl subProject}}">{{subProjectName}}</a>
+          <div class="component-name-parent">
+            {{qualifierIcon 'TRK'}}&nbsp;<a href="{{dashboardUrl subProject}}">{{subProjectName}}</a>
+          </div>
         {{/if}}
-      </div>
-    {{/if}}
+      {{/if}}
 
-    <div class="source-viewer-header-component-name">
-      {{qualifierIcon q}} {{default path longName}}
+      <div class="component-name-path">
+        {{qualifierIcon q}}&nbsp;<span>{{collapsedDirFromPath path}}</span><span class="component-name-file">{{fileFromPath path}}</span>
 
-      {{#if canMarkAsFavourite}}
-        <a class="js-favorite source-viewer-header-favorite"
-           title="{{#if fav}}{{t 'click_to_remove_from_favorites'}}{{else}}{{t 'click_to_add_to_favorites'}}{{/if}}">
-          <i class="{{#if fav}}icon-favorite{{else}}icon-not-favorite{{/if}}"></i>
-        </a>
-      {{/if}}
-    </div>
-  {{else}}
-    <div class="source-viewer-header-component-project removed">{{removedMessage}}</div>
-  {{/unless}}
+        {{#if canMarkAsFavourite}}
+          <a class="js-favorite component-name-favorite {{#if fav}}icon-favorite{{else}}icon-not-favorite{{/if}}"
+             title="{{#if fav}}{{t 'click_to_remove_from_favorites'}}{{else}}{{t 'click_to_add_to_favorites'}}{{/if}}">
+          </a>
+        {{/if}}
+      </div>
+    {{else}}
+      <div class="source-viewer-header-component-project removed">{{removedMessage}}</div>
+    {{/unless}}
+  </div>
 </div>
 
 {{#unless removed}}
diff --git a/server/sonar-web/src/main/js/common/handlebars-extensions.js b/server/sonar-web/src/main/js/common/handlebars-extensions.js
index eb3af1e038d..679f23af31e 100644
--- a/server/sonar-web/src/main/js/common/handlebars-extensions.js
+++ b/server/sonar-web/src/main/js/common/handlebars-extensions.js
@@ -440,6 +440,47 @@
     return component.projectName + (component.subProjectName ? (' / ' + component.subProjectName) : '');
   });
 
+  Handlebars.registerHelper('dirFromPath', function (path) {
+    if (typeof path === 'string') {
+      var tokens = path.split('/');
+      return tokens.length > 1 ? _.initial(tokens).join('/') + '/' : '';
+    } else {
+      return null;
+    }
+  });
+
+  Handlebars.registerHelper('collapsedDirFromPath', function (path) {
+    var limit = 30;
+    if (typeof path === 'string') {
+      var tokens = _.initial(path.split('/'));
+      if (tokens.length > 2) {
+        var head = _.first(tokens),
+            tail = _.last(tokens),
+            middle = _.initial(_.rest(tokens)),
+            cut = false;
+        while (middle.join().length > limit && middle.length > 0) {
+          middle.shift();
+          cut = true;
+        }
+        var body = [].concat(head, cut ? ['...'] : [], middle, tail);
+        return body.join('/') + '/';
+      } else {
+        return tokens.join('/') + '/';
+      }
+    } else {
+      return null;
+    }
+  });
+
+  Handlebars.registerHelper('fileFromPath', function (path) {
+    if (typeof path === 'string') {
+      var tokens = path.split('/');
+      return _.last(tokens);
+    } else {
+      return null;
+    }
+  });
+
   Handlebars.registerHelper('repeat', function (number, options) {
     var ret = '';
     for (var i = 0; i < number; i++) {
diff --git a/server/sonar-web/src/main/js/nav/search-view.js b/server/sonar-web/src/main/js/nav/search-view.js
index ac0332a0b9d..e3258e61477 100644
--- a/server/sonar-web/src/main/js/nav/search-view.js
+++ b/server/sonar-web/src/main/js/nav/search-view.js
@@ -136,16 +136,8 @@ define([
         var collection = [];
         r.results.forEach(function (domain) {
           domain.items.forEach(function (item, index) {
-            var title = item.name,
-                subtitle = null;
-            if (domain.q === 'FIL' || domain.q === 'UTS') {
-              subtitle = title.substr(0, title.lastIndexOf('/'));
-              title = title.substr(title.lastIndexOf('/') + 1);
-            }
             collection.push(_.extend(item, {
               q: domain.q,
-              title: title,
-              subtitle: subtitle,
               extra: index === 0 ? domain.name : null,
               url: baseUrl + '/dashboard/index?id=' + encodeURIComponent(item.key) + dashboardParameters(true)
             }));
diff --git a/server/sonar-web/src/main/js/source-viewer/header.js b/server/sonar-web/src/main/js/source-viewer/header.js
index 51fefe340e2..46718c65eba 100644
--- a/server/sonar-web/src/main/js/source-viewer/header.js
+++ b/server/sonar-web/src/main/js/source-viewer/header.js
@@ -70,6 +70,12 @@ define([
         model: this.model,
         large: true
       }).render();
+    },
+
+    serializeData: function () {
+      return _.extend(Marionette.ItemView.prototype.serializeData.apply(this, arguments), {
+        path: this.model.get('path') || this.model.get('longName')
+      });
     }
   });
 
diff --git a/server/sonar-web/src/main/js/tests/e2e/tests/source-viewer-spec.js b/server/sonar-web/src/main/js/tests/e2e/tests/source-viewer-spec.js
index 8a686a1bcc8..fb6897afe6f 100644
--- a/server/sonar-web/src/main/js/tests/e2e/tests/source-viewer-spec.js
+++ b/server/sonar-web/src/main/js/tests/e2e/tests/source-viewer-spec.js
@@ -22,11 +22,10 @@ casper.test.begin(testName('Base'), function (test) {
         casper.waitForSelector('.source-line', function () {
           // Check header elements
           test.assertExists('.source-viewer-header');
-          test.assertSelectorContains('.source-viewer-header-component-project', 'SonarQube');
-          test.assertSelectorContains('.source-viewer-header-component-project', 'SonarQube :: Batch');
-          test.assertSelectorContains('.source-viewer-header-component-name',
-              'src/main/java/org/sonar/batch/index/Cache.java');
-          test.assertExists('.source-viewer-header-favorite');
+          test.assertSelectorContains('.source-viewer-header', 'SonarQube');
+          test.assertSelectorContains('.source-viewer-header', 'SonarQube :: Batch');
+          test.assertSelectorContains('.source-viewer-header', 'src/main/java/org/sonar/batch/index/Cache.java');
+          test.assertExists('.source-viewer-header .js-favorite');
           test.assertExists('.source-viewer-header-actions');
 
           // Check main measures
diff --git a/server/sonar-web/src/main/less/components.less b/server/sonar-web/src/main/less/components.less
index 16cc0489a93..2e8bcc3eb72 100644
--- a/server/sonar-web/src/main/less/components.less
+++ b/server/sonar-web/src/main/less/components.less
@@ -1,4 +1,3 @@
-@import "components/component-issues";
 @import "components/source";
 @import "components/facets";
 @import "components/modals";
@@ -11,3 +10,4 @@
 @import "components/dropdowns";
 @import "components/menu";
 @import "components/page";
+@import "components/component-name";
diff --git a/server/sonar-web/src/main/less/components/component-issues.less b/server/sonar-web/src/main/less/components/component-issues.less
deleted file mode 100644
index 9b07304a6e5..00000000000
--- a/server/sonar-web/src/main/less/components/component-issues.less
+++ /dev/null
@@ -1,24 +0,0 @@
-@import (reference) "../variables";
-@import (reference) "../mixins";
-
-.issues-distribution-bar {
-  display: inline-block;
-  vertical-align: middle;
-  width: 45px;
-}
-
-.issues-distribution-bar-item {
-  display: block;
-  min-width: 1px;
-  height: 3px;
-
-  &.s-blocker { background-color: @severityBlockerColor; }
-  &.s-critical { background-color: @severityCriticalColor; }
-  &.s-major { background-color: @severityMajorColor; }
-  &.s-minor { background-color: @severityMinorColor; }
-  &.s-info { background-color: @severityInfoColor; }
-}
-
-.issues-distribution-bar-item + .issues-distribution-bar-item {
-  margin-top: 1px;
-}
diff --git a/server/sonar-web/src/main/less/components/component-name.less b/server/sonar-web/src/main/less/components/component-name.less
new file mode 100644
index 00000000000..9621942992d
--- /dev/null
+++ b/server/sonar-web/src/main/less/components/component-name.less
@@ -0,0 +1,35 @@
+@import (reference) "../variables";
+@import (reference) "../mixins";
+@import (reference) "../ui";
+
+.component-name {
+  .clearfix;
+  line-height: 20px;
+  font-size: @smallFontSize;
+}
+
+.component-name-parent {
+  float: left;
+  margin-right: 20px;
+
+  &:last-child {
+    margin-right: 0;
+  }
+}
+
+.component-name-path {
+  float: left;
+  clear: left;
+}
+
+.component-name-file {
+
+}
+
+.component-name-favorite {
+  position: relative;
+  top: -1px;
+  margin-left: 4px;
+  padding: 2px 0;
+}
+
diff --git a/server/sonar-web/src/main/less/components/source.less b/server/sonar-web/src/main/less/components/source.less
index 4ef5008fc92..46033159c20 100644
--- a/server/sonar-web/src/main/less/components/source.less
+++ b/server/sonar-web/src/main/less/components/source.less
@@ -224,7 +224,6 @@
 
 .source-viewer-header-component {
   float: left;
-  line-height: 20px;
 }
 
 .source-viewer-header-component-project {