SONAR-5820 Create a new coding rules page

141 files changed, 2266 insertions, 823 deletions

diff --git a/server/sonar-web/src/main/coffee/coding-rules/app.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/app.coffee
index 953c0091080..26878007d07 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/app.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/app.coffee
@@ -19,21 +19,21 @@ requirejs.config
 requirejs [
   'backbone', 'backbone.marionette',
 
-  'coding-rules/layout',
-  'coding-rules/router',
+  'coding-rules-old/layout',
+  'coding-rules-old/router',
 
   # views
-  'coding-rules/views/header-view',
-  'coding-rules/views/actions-view',
-  'coding-rules/views/filter-bar-view',
-  'coding-rules/views/coding-rules-list-view',
-  'coding-rules/views/coding-rules-detail-view',
-  'coding-rules/views/coding-rules-bulk-change-view',
-  'coding-rules/views/coding-rules-quality-profile-activation-view',
-  'coding-rules/views/coding-rules-bulk-change-dropdown-view',
-  'coding-rules/views/coding-rules-facets-view',
-  'coding-rules/views/coding-rules-custom-rule-creation-view',
-  'coding-rules/views/coding-rules-manual-rule-creation-view',
+  'coding-rules-old/views/header-view',
+  'coding-rules-old/views/actions-view',
+  'coding-rules-old/views/filter-bar-view',
+  'coding-rules-old/views/coding-rules-list-view',
+  'coding-rules-old/views/coding-rules-detail-view',
+  'coding-rules-old/views/coding-rules-bulk-change-view',
+  'coding-rules-old/views/coding-rules-quality-profile-activation-view',
+  'coding-rules-old/views/coding-rules-bulk-change-dropdown-view',
+  'coding-rules-old/views/coding-rules-facets-view',
+  'coding-rules-old/views/coding-rules-custom-rule-creation-view',
+  'coding-rules-old/views/coding-rules-manual-rule-creation-view',
 
   # filters
   'navigator/filters/base-filters',
@@ -41,15 +41,15 @@ requirejs [
   'navigator/filters/string-filters',
   'navigator/filters/date-filter-view',
   'navigator/filters/read-only-filters',
-  'coding-rules/views/filters/query-filter-view',
-  'coding-rules/views/filters/quality-profile-filter-view',
-  'coding-rules/views/filters/inheritance-filter-view',
-  'coding-rules/views/filters/active-severities-filter-view',
-  'coding-rules/views/filters/activation-filter-view',
-  'coding-rules/views/filters/characteristic-filter-view',
-  'coding-rules/views/filters/repository-filter-view',
-  'coding-rules/views/filters/tag-filter-view',
-  'coding-rules/views/filters/language-filter-view',
+  'coding-rules-old/views/filters/query-filter-view',
+  'coding-rules-old/views/filters/quality-profile-filter-view',
+  'coding-rules-old/views/filters/inheritance-filter-view',
+  'coding-rules-old/views/filters/active-severities-filter-view',
+  'coding-rules-old/views/filters/activation-filter-view',
+  'coding-rules-old/views/filters/characteristic-filter-view',
+  'coding-rules-old/views/filters/repository-filter-view',
+  'coding-rules-old/views/filters/tag-filter-view',
+  'coding-rules-old/views/filters/language-filter-view',
 
   'common/handlebars-extensions'
 ], (
diff --git a/server/sonar-web/src/main/coffee/coding-rules/layout.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/layout.coffee
index 8008248f670..459c11d337f 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/layout.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/layout.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/mockjax.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/mockjax.coffee
index 30f37ba626b..30f37ba626b 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/mockjax.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/mockjax.coffee
diff --git a/server/sonar-web/src/main/coffee/coding-rules/router.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/router.coffee
index fe49b73dbbd..fe49b73dbbd 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/router.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/router.coffee
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/actions-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/actions-view.coffee
index b5f13553de5..b8559cb2639 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/actions-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/actions-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-bulk-change-dropdown-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-bulk-change-dropdown-view.coffee
index 27552173ff9..0a1ee73f23d 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-bulk-change-dropdown-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-bulk-change-dropdown-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-bulk-change-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-bulk-change-view.coffee
index 299d8026f4f..16b2689db4b 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-bulk-change-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-bulk-change-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-custom-rule-creation-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-custom-rule-creation-view.coffee
index 69df942c423..0efc2a00beb 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-custom-rule-creation-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-custom-rule-creation-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-debt-popup-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-debt-popup-view.coffee
index c8882d87fb4..3331b7d3fab 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-debt-popup-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-debt-popup-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'templates/coding-rules'
+  'templates/coding-rules-old'
   'common/popup'
 ], (
   Marionette
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-custom-rule-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-custom-rule-view.coffee
index 216704641ef..84c1f332153 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-custom-rule-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-custom-rule-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-custom-rules-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-custom-rules-view.coffee
index e43d4ca0e93..b5df8e77c0f 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-custom-rules-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-custom-rules-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'coding-rules/views/coding-rules-detail-custom-rule-view'
+  'coding-rules-old/views/coding-rules-detail-custom-rule-view'
 ], (
   Marionette
   CodingRulesDetailCustomRuleView
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-quality-profile-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-quality-profile-view.coffee
index 7a1544bc9c4..ef8a98db380 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-quality-profile-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-quality-profile-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-quality-profiles-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-quality-profiles-view.coffee
index 1a5a9f69462..b26bbeeef20 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-quality-profiles-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-quality-profiles-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'coding-rules/views/coding-rules-detail-quality-profile-view'
+  'coding-rules-old/views/coding-rules-detail-quality-profile-view'
 ], (
   Marionette,
   CodingRulesDetailQualityProfileView
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-view.coffee
index d9697a317d3..20bf8c789b5 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-detail-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-detail-view.coffee
@@ -1,13 +1,13 @@
 define [
   'backbone'
   'backbone.marionette'
-  'coding-rules/views/coding-rules-detail-quality-profiles-view'
-  'coding-rules/views/coding-rules-detail-quality-profile-view'
-  'coding-rules/views/coding-rules-detail-custom-rules-view'
-  'coding-rules/views/coding-rules-detail-custom-rule-view'
-  'coding-rules/views/coding-rules-parameter-popup-view'
-  'coding-rules/views/coding-rules-debt-popup-view'
-  'templates/coding-rules'
+  'coding-rules-old/views/coding-rules-detail-quality-profiles-view'
+  'coding-rules-old/views/coding-rules-detail-quality-profile-view'
+  'coding-rules-old/views/coding-rules-detail-custom-rules-view'
+  'coding-rules-old/views/coding-rules-detail-custom-rule-view'
+  'coding-rules-old/views/coding-rules-parameter-popup-view'
+  'coding-rules-old/views/coding-rules-debt-popup-view'
+  'templates/coding-rules-old'
 ], (
   Backbone
   Marionette
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-facets-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-facets-view.coffee
index a83094f7084..7a209398fff 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-facets-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-facets-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-empty-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-empty-view.coffee
index c3eb8d48c4e..a428e4cf256 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-empty-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-empty-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-item-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-item-view.coffee
index 0c77a630538..6b46abada7e 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-item-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-item-view.coffee
@@ -1,7 +1,7 @@
 define [
   'backbone.marionette',
-  'coding-rules/views/coding-rules-detail-view',
-  'templates/coding-rules'
+  'coding-rules-old/views/coding-rules-detail-view',
+  'templates/coding-rules-old'
 ], (
   Marionette,
   CodingRulesDetailView,
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-view.coffee
index b62e4a28866..7669b57870c 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-list-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-list-view.coffee
@@ -1,7 +1,7 @@
 define [
   'backbone.marionette',
-  'coding-rules/views/coding-rules-list-item-view',
-  'coding-rules/views/coding-rules-list-empty-view'
+  'coding-rules-old/views/coding-rules-list-item-view',
+  'coding-rules-old/views/coding-rules-list-empty-view'
 ], (
   Marionette,
   CodingRulesListItemView,
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-manual-rule-creation-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-manual-rule-creation-view.coffee
index fdae346c422..5d48f9cd6a2 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-manual-rule-creation-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-manual-rule-creation-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-parameter-popup-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-parameter-popup-view.coffee
index 52ece5db2a9..cdee87966e5 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-parameter-popup-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-parameter-popup-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette'
-  'templates/coding-rules'
+  'templates/coding-rules-old'
   'common/popup'
 ], (
   Marionette
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-quality-profile-activation-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-quality-profile-activation-view.coffee
index 9660c29a5c7..2d7f00aa7db 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/coding-rules-quality-profile-activation-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/coding-rules-quality-profile-activation-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filter-bar-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filter-bar-view.coffee
index b01ee86ab85..edd69fb4d19 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filter-bar-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filter-bar-view.coffee
@@ -4,7 +4,7 @@ define [
   'navigator/filters/favorite-filters',
   'navigator/filters/more-criteria-filters',
   'navigator/filters/read-only-filters',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   FilterBarView,
   BaseFilters,
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/activation-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/activation-filter-view.coffee
index da9e451a8c6..e6d33997d7e 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/activation-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/activation-filter-view.coffee
@@ -1,5 +1,5 @@
 define [
-  'coding-rules/views/filters/profile-dependent-filter-view'
+  'coding-rules-old/views/filters/profile-dependent-filter-view'
 ], (
   ProfileDependentFilterView
 ) ->
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/active-severities-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/active-severities-filter-view.coffee
index 8cbe81e9e50..5c07e2333d9 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/active-severities-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/active-severities-filter-view.coffee
@@ -1,6 +1,6 @@
 
 define [
-  'coding-rules/views/filters/profile-dependent-filter-view'
+  'coding-rules-old/views/filters/profile-dependent-filter-view'
 ], (
   ProfileDependentFilterView
 ) ->
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/characteristic-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/characteristic-filter-view.coffee
index efa29a733ff..efa29a733ff 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/characteristic-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/characteristic-filter-view.coffee
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/inheritance-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/inheritance-filter-view.coffee
index 145dc06267c..0a201375cf1 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/inheritance-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/inheritance-filter-view.coffee
@@ -1,5 +1,5 @@
 define [
-  'coding-rules/views/filters/profile-dependent-filter-view'
+  'coding-rules-old/views/filters/profile-dependent-filter-view'
 ], (
   ProfileDependentFilterView
 ) ->
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/language-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/language-filter-view.coffee
index b52dcb2bbbb..3e5ea0a5cdb 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/language-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/language-filter-view.coffee
@@ -1,6 +1,6 @@
 define [
   'navigator/filters/choice-filters',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   ChoiceFilters,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/profile-dependent-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/profile-dependent-filter-view.coffee
index 5afad402b92..5afad402b92 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/profile-dependent-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/profile-dependent-filter-view.coffee
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/quality-profile-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/quality-profile-filter-view.coffee
index d665930cbea..3dde4d0f0be 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/quality-profile-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/quality-profile-filter-view.coffee
@@ -1,6 +1,6 @@
 define [
   'navigator/filters/choice-filters',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   ChoiceFilters,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/query-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/query-filter-view.coffee
index ee8e70d044b..fa57264bd7a 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/query-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/query-filter-view.coffee
@@ -4,7 +4,7 @@ define [
   'navigator/filters/base-filters',
   'navigator/filters/string-filters',
   'navigator/filters/choice-filters',
-  'templates/coding-rules',
+  'templates/coding-rules-old',
   'common/handlebars-extensions'
 ], (
   Backbone,
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/repository-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/repository-filter-view.coffee
index aeae2bea056..82dc8e675dd 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/repository-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/repository-filter-view.coffee
@@ -1,6 +1,6 @@
 define [
   'navigator/filters/choice-filters',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   ChoiceFilters,
   Templates
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/filters/tag-filter-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/tag-filter-view.coffee
index 01366e7f2e4..01366e7f2e4 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/filters/tag-filter-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/filters/tag-filter-view.coffee
diff --git a/server/sonar-web/src/main/coffee/coding-rules/views/header-view.coffee b/server/sonar-web/src/main/coffee/coding-rules-old/views/header-view.coffee
index caa03b54779..13a71b5e75d 100644
--- a/server/sonar-web/src/main/coffee/coding-rules/views/header-view.coffee
+++ b/server/sonar-web/src/main/coffee/coding-rules-old/views/header-view.coffee
@@ -1,6 +1,6 @@
 define [
   'backbone.marionette',
-  'templates/coding-rules'
+  'templates/coding-rules-old'
 ], (
   Marionette,
   Templates
diff --git a/server/sonar-web/src/main/coffee/issues/app.coffee b/server/sonar-web/src/main/coffee/issues/app.coffee
index 9ae6f8b3604..c40aeee41de 100644
--- a/server/sonar-web/src/main/coffee/issues/app.coffee
+++ b/server/sonar-web/src/main/coffee/issues/app.coffee
@@ -22,7 +22,7 @@ requirejs [
   'issues/models/state'
   'issues/layout'
   'issues/models/issues'
-  'issues/models/facets'
+  'components/navigator/models/facets'
   'issues/models/filters'
 
   'issues/controller'
@@ -70,7 +70,7 @@ requirejs [
 
   App.addInitializer ->
     @state = new State()
-    @issues = new Issues()
+    @list = new Issues()
     @facets = new Facets()
     @filters = new Filters()
 
@@ -82,7 +82,7 @@ requirejs [
   App.addInitializer ->
     @issuesView = new WorkspaceListView
       app: @
-      collection: @issues
+      collection: @list
     @layout.workspaceListRegion.show @issuesView
     @issuesView.bindScrollEvents()
 
@@ -90,7 +90,7 @@ requirejs [
   App.addInitializer ->
     @workspaceHeaderView = new WorkspaceHeaderView
       app: @
-      collection: @issues
+      collection: @list
     @layout.workspaceHeaderRegion.show @workspaceHeaderView
 
 
diff --git a/server/sonar-web/src/main/coffee/issues/component-viewer/main.coffee b/server/sonar-web/src/main/coffee/issues/component-viewer/main.coffee
index 88dbf3311a3..31f3c0baff5 100644
--- a/server/sonar-web/src/main/coffee/issues/component-viewer/main.coffee
+++ b/server/sonar-web/src/main/coffee/issues/component-viewer/main.coffee
@@ -52,11 +52,11 @@ define [
         selectedIssueView.find(".js-issue-#{action}").click()
 
       key 'up', 'componentViewer', =>
-        @options.app.controller.selectPreviousIssue()
+        @options.app.controller.selectPrev()
         false
 
       key 'down', 'componentViewer', =>
-        @options.app.controller.selectNextIssue()
+        @options.app.controller.selectNext()
         false
 
       key 'left', 'componentViewer', =>
@@ -88,7 +88,7 @@ define [
 
     select: ->
       selected = @options.app.state.get 'selectedIndex'
-      selectedIssue = @options.app.issues.at selected
+      selectedIssue = @options.app.list.at selected
       if selectedIssue.get('component') == @model.get('key')
         @scrollToIssue selectedIssue.get('key')
       else
@@ -99,7 +99,7 @@ define [
     getSelectedIssueEl: ->
       selected = @options.app.state.get 'selectedIndex'
       return null unless selected?
-      selectedIssue = @options.app.issues.at selected
+      selectedIssue = @options.app.list.at selected
       return null unless selectedIssue?
       selectedIssueView = @$("#issue-#{selectedIssue.get('key')}")
       if selectedIssueView.length > 0 then selectedIssueView else null
@@ -108,7 +108,7 @@ define [
     selectIssue: (e) ->
       key = $(e.currentTarget).data 'issue-key'
       issue = @issues.find (issue) -> issue.get('key') == key
-      index = @options.app.issues.indexOf issue
+      index = @options.app.list.indexOf issue
       @options.app.state.set selectedIndex: index
 
 
@@ -120,7 +120,7 @@ define [
       else
         @unbindShortcuts()
         selected = @options.app.state.get 'selectedIndex'
-        selectedIssue = @options.app.issues.at selected
+        selectedIssue = @options.app.list.at selected
         @options.app.controller.showComponentViewer selectedIssue
 
 
@@ -149,11 +149,11 @@ define [
 
 
     requestIssues: ->
-      if @options.app.issues.last().get('component') == @model.get('key')
+      if @options.app.list.last().get('component') == @model.get('key')
         r = @options.app.controller.fetchNextPage()
       else r = $.Deferred().resolve().promise()
       r.done =>
-        @issues.reset @options.app.issues.filter (issue) => issue.get('component') == @model.key()
+        @issues.reset @options.app.list.filter (issue) => issue.get('component') == @model.key()
         @issues.reset @limitIssues @issues
         @addIssuesPerLineMeta @issues
 
@@ -174,7 +174,7 @@ define [
 
     addNextIssuesPage: ->
       componentKey = @model.get 'key'
-      @issues.add @options.app.issues.filter (issue) => issue.get('component') == componentKey
+      @issues.add @options.app.list.filter (issue) => issue.get('component') == componentKey
 
 
     scrollToLine: (line) ->
diff --git a/server/sonar-web/src/main/coffee/issues/controller.coffee b/server/sonar-web/src/main/coffee/issues/controller.coffee
index d937228a9e8..4bc75e7d472 100644
--- a/server/sonar-web/src/main/coffee/issues/controller.coffee
+++ b/server/sonar-web/src/main/coffee/issues/controller.coffee
@@ -1,10 +1,10 @@
 define [
-  'backbone.marionette'
+  'components/navigator/controller'
 
   'issues/component-viewer/main'
   'issues/component-viewer/state'
 ], (
-  Marionette
+  Controller
 
   ComponentViewer
   ComponentViewerState
@@ -12,56 +12,33 @@ define [
 
   $ = jQuery
   EXTRA_FIELDS = 'actions,transitions,assigneeName,reporterName,actionPlanName'
-  PAGE_SIZE = 50
-  ALL_FACETS = ['severities', 'statuses', 'resolutions', 'projectUuids', 'moduleUuids', 'componentUuids', 'assignees', 'reporters', 'rules',
-                'tags', 'languages', 'actionPlans', 'creationDate', 'issues']
   FACET_DATA_FIELDS = ['components', 'projects', 'users', 'rules', 'actionPlans', 'languages']
-  FACETS_FROM_SERVER = ['severities', 'statuses', 'resolutions', 'actionPlans', 'projectUuids', 'rules', 'tags'
-                        'assignees', 'reporters', 'componentUuids', 'languages']
-  TRANSFORM = {
-    'resolved': 'resolutions'
-    'assigned': 'assignees'
-    'planned': 'actionPlans'
-    'createdAt': 'creationDate'
-    'createdBefore': 'creationDate'
-    'createdAfter': 'creationDate'
-  }
 
 
-  class extends Marionette.Controller
-
-    initialize: (options) ->
-      @listenTo options.app.state, 'change:query', @fetchIssues
-
+  class extends Controller
+    allFacets: ['severities', 'statuses', 'resolutions', 'projectUuids', 'moduleUuids', 'componentUuids', 'assignees',
+                'reporters', 'rules', 'tags', 'languages', 'actionPlans', 'creationDate', 'issues'],
+    facetsFromServer: ['severities', 'statuses', 'resolutions', 'actionPlans', 'projectUuids', 'rules', 'tags',
+                       'assignees', 'reporters', 'componentUuids', 'languages'],
+    transform: {
+      'resolved': 'resolutions'
+      'assigned': 'assignees'
+      'planned': 'actionPlans'
+      'createdAt': 'creationDate'
+      'createdBefore': 'creationDate'
+      'createdAfter': 'creationDate'
+    },
 
     _issuesParameters: ->
       p: @options.app.state.get 'page'
-      ps: PAGE_SIZE
+      ps: @pageSize
       s: 'FILE_LINE'
       asc: true
       extra_fields: EXTRA_FIELDS
       facets: @_facetsFromServer().join()
 
 
-    _allFacets: ->
-      ALL_FACETS.map (facet) -> { property: facet }
-
-
-    _enabledFacets: ->
-      facets = @options.app.state.get 'facets'
-      criteria = Object.keys @options.app.state.get 'query'
-      facets = facets.concat criteria
-      facets = facets.map (facet) ->
-        if TRANSFORM[facet]? then TRANSFORM[facet] else facet
-      facets.filter (facet) -> ALL_FACETS.indexOf(facet) != -1
-
-
-    _facetsFromServer: ->
-      facets = @_enabledFacets()
-      facets.filter (facet) -> FACETS_FROM_SERVER.indexOf(facet) != -1
-
-
-    fetchIssues: (firstPage = true) ->
+    fetchList: (firstPage = true) ->
       if firstPage
         @options.app.state.set { selectedIndex: 0, page: 1 }, { silent: true }
         @closeComponentViewer()
@@ -72,12 +49,12 @@ define [
       fetchIssuesProcess = window.process.addBackgroundProcess()
       $.get "#{baseUrl}/api/issues/search", data
       .done (r) =>
-        issues = @options.app.issues.parseIssues r
+        issues = @options.app.list.parseIssues r
         if firstPage
-          @options.app.issues.reset issues
+          @options.app.list.reset issues
         else
-          @options.app.issues.add issues
-        @options.app.issues.setIndex()
+          @options.app.list.add issues
+        @options.app.list.setIndex()
         FACET_DATA_FIELDS.forEach (field) => @options.app.facets[field] = r[field]
         @options.app.facets.reset @_allFacets()
         @options.app.facets.add r.facets, merge: true
@@ -92,11 +69,6 @@ define [
         window.process.failBackgroundProcess fetchIssuesProcess
 
 
-    fetchNextPage: ->
-      @options.app.state.nextPage()
-      @fetchIssues false
-
-
     fetchFilters: ->
       $.get "#{baseUrl}/api/issue_filters/app", (r) =>
         @options.app.state.set
@@ -105,35 +77,6 @@ define [
         @options.app.filters.reset r.favorites
 
 
-    enableFacet: (id) ->
-      facet = @options.app.facets.get id
-      if facet.has('values') || FACETS_FROM_SERVER.indexOf(id) == -1
-        facet.set enabled: true
-      else
-        p = window.process.addBackgroundProcess()
-        @requestFacet(id)
-        .done =>
-          facet.set enabled: true
-          window.process.finishBackgroundProcess p
-        .fail ->
-          window.process.failBackgroundProcess p
-
-
-    disableFacet: (id) ->
-      facet = @options.app.facets.get id
-      facet.set enabled: false
-      @options.app.facetsView.children.findByModel(facet).disable()
-
-
-    toggleFacet: (id) ->
-      facet = @options.app.facets.get id
-      if facet.get('enabled') then @disableFacet(id) else @enableFacet(id)
-
-
-    enableFacets: (facets) ->
-      facets.forEach @enableFacet, @
-
-
     _mergeCollections: (a, b) ->
       collection = new Backbone.Collection a
       collection.add b, merge: true
@@ -162,29 +105,17 @@ define [
       @options.app.state.set filter: filter, changed: false
 
 
-    parseQuery: (query, separator = '|') ->
-      q = {}
-      (query || '').split(separator).forEach (t) ->
-        tokens = t.split('=')
-        if tokens[0] && tokens[1]?
-          q[tokens[0]] = decodeURIComponent tokens[1]
+    parseQuery: ->
+      q = super
       # Do not allow to modify the sorting
       delete q.asc
       delete q.s
       q
 
 
-    getQuery: (separator = '|') ->
-      filter = @options.app.state.get 'query'
-      route = []
-      _.map filter, (value, property) ->
-        route.push "#{property}=#{encodeURIComponent value}"
-      route.join separator
-
-
-    getRoute: (separator = '|') ->
+    getRoute: ->
       filter = @options.app.state.get 'filter'
-      query = @getQuery separator
+      query = super
       if filter?
         if @options.app.state.get('changed') && query.length > 0
           query = "id=#{filter.id}|#{query}"
@@ -220,20 +151,5 @@ define [
       @options.app.layout.workspaceComponentViewerRegion.reset()
       @options.app.layout.hideComponentViewer()
       @options.app.issuesView.bindScrollEvents()
-      @options.app.issuesView.scrollToIssue()
-
-
-    selectNextIssue: ->
-      index = @options.app.state.get('selectedIndex') + 1
-      if index < @options.app.issues.length
-        @options.app.state.set selectedIndex: index
-      else
-        unless @options.app.state.get('maxResultsReached')
-          @fetchNextPage().done =>
-            @options.app.state.set selectedIndex: index
-
+      @options.app.issuesView.scrollTo()
 
-    selectPreviousIssue: ->
-      index = @options.app.state.get('selectedIndex') - 1
-      if index >= 0
-        @options.app.state.set selectedIndex: index
diff --git a/server/sonar-web/src/main/coffee/issues/facets-view.coffee b/server/sonar-web/src/main/coffee/issues/facets-view.coffee
index b030690c29b..78f0860d3d7 100644
--- a/server/sonar-web/src/main/coffee/issues/facets-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets-view.coffee
@@ -1,5 +1,5 @@
 define [
-  'backbone.marionette'
+  'components/navigator/facets-view'
 
   'issues/facets/base-facet'
   'issues/facets/severity-facet'
@@ -17,7 +17,8 @@ define [
   'issues/facets/language-facet'
   'issues/facets/issue-key-facet'
 ], (
-  Marionette
+  FacetsView
+
   BaseFacet
   SeverityFacet
   StatusFacet
@@ -35,9 +36,7 @@ define [
   IssueKeyFacet
 ) ->
 
-  class extends Marionette.CollectionView
-    className: 'issues-facets-list'
-
+  class extends FacetsView
 
     getItemView: (model) ->
       switch model.get 'property'
@@ -56,17 +55,3 @@ define [
         when 'languages' then LanguageFacet
         when 'issues' then IssueKeyFacet
         else BaseFacet
-
-
-    itemViewOptions: ->
-      app: @options.app
-
-
-    collectionEvents: ->
-      'change:enabled': 'updateState'
-
-
-    updateState: ->
-      enabledFacets = @collection.filter (model) -> model.get('enabled')
-      enabledFacetIds = enabledFacets.map (model) -> model.id
-      @options.app.state.set facets: enabledFacetIds
diff --git a/server/sonar-web/src/main/coffee/issues/facets/action-plan-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/action-plan-facet.coffee
index 6ecc3a387be..4959fd2a728 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/action-plan-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/action-plan-facet.coffee
@@ -17,7 +17,7 @@ define [
       super
       value = @options.app.state.get('query')['planned']
       if value? && (!value || value == 'false')
-        @$('.js-issues-facet').filter("[data-unplanned]").addClass 'active'
+        @$('.js-facet').filter("[data-unplanned]").addClass 'active'
 
 
     toggleFacet: (e) ->
diff --git a/server/sonar-web/src/main/coffee/issues/facets/assignee-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/assignee-facet.coffee
index c2f1e99ac65..43c48eb193d 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/assignee-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/assignee-facet.coffee
@@ -21,7 +21,7 @@ define [
       super
       value = @options.app.state.get('query')['assigned']
       if value? && (!value || value == 'false')
-        @$('.js-issues-facet').filter("[data-unassigned]").addClass 'active'
+        @$('.js-facet').filter("[data-unassigned]").addClass 'active'
 
 
     toggleFacet: (e) ->
@@ -54,7 +54,7 @@ define [
 
     addCustomValue: ->
       property = @model.get 'property'
-      customValue = @$('.js-issues-custom-value').select2 'val'
+      customValue = @$('.js-custom-value').select2 'val'
       value = @getValue()
       value += ',' if value.length > 0
       value += customValue
diff --git a/server/sonar-web/src/main/coffee/issues/facets/base-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/base-facet.coffee
index b13643544b2..a9781dfcbe1 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/base-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/base-facet.coffee
@@ -1,69 +1,10 @@
 define [
-  'backbone.marionette'
+  'components/navigator/facets/base-facet'
   'templates/issues'
 ], (
-  Marionette
+  BaseFacet
   Templates
 ) ->
 
-  $ = jQuery
-
-
-  class extends Marionette.ItemView
-    className: 'issues-facet-box'
+  class extends BaseFacet
     template: Templates['issues-base-facet']
-
-
-    modelEvents: ->
-      'change': 'render'
-
-
-    events: ->
-      'click .js-issues-facet-toggle': 'toggle'
-      'click .js-issues-facet': 'toggleFacet'
-
-
-    onRender: ->
-      @$el.toggleClass 'issues-facet-box-collapsed', !@model.get('enabled')
-
-      property = @model.get 'property'
-      value = @options.app.state.get('query')[property]
-      if typeof value == 'string'
-        value.split(',').forEach (s) =>
-          facet = @$('.js-issues-facet').filter("[data-value='#{s}']")
-          if facet.length > 0
-            parent = facet.parent()
-            facet.addClass('active')#.detach().prependTo parent
-
-
-    toggle: ->
-      @options.app.controller.toggleFacet @model.id
-
-
-    getValue: ->
-      @$('.js-issues-facet.active').map(-> $(@).data 'value').get().join()
-
-
-    toggleFacet: (e) ->
-      $(e.currentTarget).toggleClass 'active'
-      property = @model.get 'property'
-      value = @getValue()
-      obj = {}
-      obj[property] = value
-      @options.app.state.updateFilter obj
-
-
-    disable: ->
-      property = @model.get 'property'
-      obj = {}
-      obj[property] = null
-      @options.app.state.updateFilter obj
-
-
-    sortValues: (values) ->
-      _.sortBy values, (v) -> -v.count
-
-
-    serializeData: ->
-      _.extend super,
-        values: @sortValues @model.getValues()
diff --git a/server/sonar-web/src/main/coffee/issues/facets/creation-date-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/creation-date-facet.coffee
index 2fd4c8f53a6..21ed4e09a3d 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/creation-date-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/creation-date-facet.coffee
@@ -19,7 +19,7 @@ define [
 
 
     onRender: ->
-      @$el.toggleClass 'issues-facet-box-collapsed', !@model.get('enabled')
+      @$el.toggleClass 'search-navigator-facet-box-collapsed', !@model.get('enabled')
 
       @$('input').datepicker
         dateFormat: 'yy-mm-dd'
diff --git a/server/sonar-web/src/main/coffee/issues/facets/custom-values-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/custom-values-facet.coffee
index 6a75a0cd776..6712695e8f2 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/custom-values-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/custom-values-facet.coffee
@@ -13,7 +13,7 @@ define [
 
     events: ->
       _.extend super,
-        'change .js-issues-custom-value': 'addCustomValue'
+        'change .js-custom-value': 'addCustomValue'
 
 
     getUrl: ->
@@ -42,7 +42,7 @@ define [
 
     addCustomValue: ->
       property = @model.get 'property'
-      customValue = @$('.js-issues-custom-value').select2 'val'
+      customValue = @$('.js-custom-value').select2 'val'
       value = @getValue()
       value += ',' if value.length > 0
       value += customValue
diff --git a/server/sonar-web/src/main/coffee/issues/facets/resolution-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/resolution-facet.coffee
index b017d613157..ed3bb7e5450 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/resolution-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/resolution-facet.coffee
@@ -18,7 +18,7 @@ define [
 
       value = @options.app.state.get('query')['resolved']
       if value? && (!value || value == 'false')
-        @$('.js-issues-facet').filter("[data-unresolved]").addClass 'active'
+        @$('.js-facet').filter("[data-unresolved]").addClass 'active'
 
 
     toggleFacet: (e) ->
diff --git a/server/sonar-web/src/main/coffee/issues/facets/rule-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/rule-facet.coffee
index c4db10359f9..ec4a576d8ec 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/rule-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/rule-facet.coffee
@@ -12,7 +12,7 @@ define [
       languages = @options.app.state.get('query').languages
       if languages?
         url += "&languages=#{languages}"
-      @$('.js-issues-custom-value').select2
+      @$('.js-custom-value').select2
         placeholder: 'Search...'
         minimumInputLength: 2
         allowClear: false
diff --git a/server/sonar-web/src/main/coffee/issues/facets/tag-facet.coffee b/server/sonar-web/src/main/coffee/issues/facets/tag-facet.coffee
index 159c0169356..81b3c33f3f9 100644
--- a/server/sonar-web/src/main/coffee/issues/facets/tag-facet.coffee
+++ b/server/sonar-web/src/main/coffee/issues/facets/tag-facet.coffee
@@ -12,7 +12,7 @@ define [
       tags = @options.app.state.get('query').tags
       if tags?
         url += "&tags=#{tags}"
-      @$('.js-issues-custom-value').select2
+      @$('.js-custom-value').select2
         placeholder: 'Search...'
         minimumInputLength: 0
         allowClear: false
diff --git a/server/sonar-web/src/main/coffee/issues/filters-view.coffee b/server/sonar-web/src/main/coffee/issues/filters-view.coffee
index 21d07786b85..a1dfae26087 100644
--- a/server/sonar-web/src/main/coffee/issues/filters-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/filters-view.coffee
@@ -14,13 +14,13 @@ define [
 
 
     events:
-      'click .js-issues-toggle-filters': 'toggleFilters'
-      'click .js-issues-filter': 'applyFilter'
-      'click #issues-new-search': 'newSearch'
-      'click #issues-filter-save-as': 'saveAs'
-      'click #issues-filter-save': 'save'
-      'click #issues-filter-copy': 'copy'
-      'click #issues-filter-edit': 'edit'
+      'click .js-toggle-filters': 'toggleFilters'
+      'click .js-filter': 'applyFilter'
+      'click .js-new-search': 'newSearch'
+      'click .js-filter-save-as': 'saveAs'
+      'click .js-filter-save': 'save'
+      'click .js-filter-copy': 'copy'
+      'click .js-filter-edit': 'edit'
 
 
     initialize: (options) ->
@@ -35,15 +35,15 @@ define [
 
 
     onRender: ->
-      @$el.toggleClass 'issues-filters-selected', @options.app.state.has('filter')
+      @$el.toggleClass 'search-navigator-filters-selected', @options.app.state.has('filter')
 
 
     toggleFilters: (e) ->
       e.stopPropagation()
-      @$('.issues-filters-list').toggle()
+      @$('.search-navigator-filters-list').toggle()
       $('body').on 'click.issues-filters', =>
         $('body').off 'click.issues-filters'
-        @$('.issues-filters-list').hide()
+        @$('.search-navigator-filters-list').hide()
 
 
     applyFilter: (e) ->
diff --git a/server/sonar-web/src/main/coffee/issues/layout.coffee b/server/sonar-web/src/main/coffee/issues/layout.coffee
index a39d515384b..85d06a2a3f1 100644
--- a/server/sonar-web/src/main/coffee/issues/layout.coffee
+++ b/server/sonar-web/src/main/coffee/issues/layout.coffee
@@ -15,10 +15,10 @@ define [
 
 
     regions:
-      filtersRegion: '.issues-filters'
-      facetsRegion: '.issues-facets'
-      workspaceHeaderRegion: '.issues-workspace-header'
-      workspaceListRegion: '.issues-workspace-list'
+      filtersRegion: '.search-navigator-filters'
+      facetsRegion: '.search-navigator-facets'
+      workspaceHeaderRegion: '.search-navigator-workspace-header'
+      workspaceListRegion: '.search-navigator-workspace-list'
       workspaceComponentViewerRegion: '.issues-workspace-component-viewer'
 
 
@@ -31,13 +31,13 @@ define [
 
 
     onRender: ->
-      @$('.issues-side').isolatedScroll()
+      @$('.search-navigator-side').isolatedScroll()
 
 
     onScroll: ->
       scrollTop = $(window).scrollTop()
-      $('.issues').toggleClass 'sticky', scrollTop >= @topOffset
-      @$('.issues-side').css top: Math.max(0, Math.min(@topOffset - scrollTop, @topOffset))
+      $('.search-navigator').toggleClass 'sticky', scrollTop >= @topOffset
+      @$('.search-navigator-side').css top: Math.max(0, Math.min(@topOffset - scrollTop, @topOffset))
 
 
     showSpinner: (region) ->
diff --git a/server/sonar-web/src/main/coffee/issues/models/state.coffee b/server/sonar-web/src/main/coffee/issues/models/state.coffee
index 49040ea3c79..197104042dd 100644
--- a/server/sonar-web/src/main/coffee/issues/models/state.coffee
+++ b/server/sonar-web/src/main/coffee/issues/models/state.coffee
@@ -1,48 +1,14 @@
 define [
-  'backbone'
+  'components/navigator/models/state'
 ], (
-  Backbone
+  State
 ) ->
 
-  class extends Backbone.Model
+  class extends State
 
     defaults:
       page: 1
       maxResultsReached: false
-
       query: {}
-
       facets: ['severities', 'statuses', 'resolutions']
 
-
-    nextPage: ->
-      page = @get 'page'
-      @set page: page + 1
-
-
-    cleanQuery: (query) ->
-      q = {}
-      Object.keys(query).forEach (key) ->
-        q[key] = query[key] if query[key]
-      q
-
-
-    _areQueriesEqual: (a, b) ->
-      equal = Object.keys(a).length == Object.keys(b).length
-      Object.keys(a).forEach (key) ->
-        equal = equal && (a[key] == b[key])
-      equal
-
-
-    updateFilter: (obj) ->
-      oldQuery = @get('query')
-      query = _.extend {}, oldQuery, obj
-      query = @cleanQuery query
-      @setQuery query unless @_areQueriesEqual oldQuery, query
-
-
-    setQuery: (query) ->
-      @set { query: query }, { silent: true }
-      @set changed: true
-      @trigger 'change:query'
-
diff --git a/server/sonar-web/src/main/coffee/issues/router.coffee b/server/sonar-web/src/main/coffee/issues/router.coffee
index b85773f6c43..79057861a9b 100644
--- a/server/sonar-web/src/main/coffee/issues/router.coffee
+++ b/server/sonar-web/src/main/coffee/issues/router.coffee
@@ -1,21 +1,18 @@
 define [
-  'backbone'
+  'components/navigator/router'
 ], (
-  Backbone
+  Router
 ) ->
 
-  class extends Backbone.Router
-    routeSeparator: '|'
-
+  class extends Router
     routes:
       '': 'emptyQuery'
       ':query': 'index'
 
 
     initialize: (options) ->
-      @options = options
-      @listenTo @options.app.state, 'change:query', @updateRoute
-      @listenTo @options.app.state, 'change:filter', @updateRoute
+      super
+      @listenTo options.app.state, 'change:filter', @updateRoute
 
 
     emptyQuery: ->
@@ -36,9 +33,3 @@ define [
             @options.app.controller.applyFilter filter
       else
         @options.app.state.setQuery query
-
-
-    updateRoute: ->
-      route = @options.app.controller.getRoute()
-      @navigate route
-
diff --git a/server/sonar-web/src/main/coffee/issues/workspace-header-view.coffee b/server/sonar-web/src/main/coffee/issues/workspace-header-view.coffee
index ec225348f47..696261ffab1 100644
--- a/server/sonar-web/src/main/coffee/issues/workspace-header-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/workspace-header-view.coffee
@@ -1,36 +1,29 @@
 define [
-  'backbone.marionette'
+  'components/navigator/workspace-header-view'
   'templates/issues'
 ], (
-  Marionette
+  WorkspaceHeaderView
   Templates
 ) ->
 
   $ = jQuery
 
 
-  class extends Marionette.ItemView
+  class extends WorkspaceHeaderView
     template: Templates['issues-workspace-header']
 
 
-    collectionEvents:
-      'all': 'render'
-
-
-    events:
-      'click .js-back': 'returnToList'
-      'click #issues-bulk-change': 'bulkChange'
-      'click #issues-reload': 'reloadIssues'
-      'click .js-issues-next': 'selectNextIssue'
-      'click .js-issues-prev': 'selectPrevIssue'
+    events: ->
+      _.extend super,
+        'click .js-back': 'returnToList'
 
 
-    initialize: (options) ->
-      @listenTo options.app.state, 'change', @render
+    initialize: ->
+      super
       @_onBulkIssues = window.onBulkIssues
       window.onBulkIssues = =>
         $('#modal').dialog 'close'
-        @options.app.controller.fetchIssues()
+        @options.app.controller.fetchList()
 
 
     onClose: ->
@@ -45,21 +38,3 @@ define [
       query = @options.app.controller.getQuery '&'
       url = "#{baseUrl}/issues/bulk_change_form?#{query}"
       openModalWindow url, {}
-
-
-    reloadIssues: ->
-      @options.app.controller.fetchIssues()
-
-
-    selectNextIssue: ->
-      @options.app.controller.selectNextIssue()
-
-
-    selectPrevIssue: ->
-      @options.app.controller.selectPreviousIssue()
-
-
-    serializeData: ->
-      _.extend super,
-        state: @options.app.state.toJSON()
-
diff --git a/server/sonar-web/src/main/coffee/issues/workspace-list-empty-view.coffee b/server/sonar-web/src/main/coffee/issues/workspace-list-empty-view.coffee
index f6514ea9ff9..f77d383a31a 100644
--- a/server/sonar-web/src/main/coffee/issues/workspace-list-empty-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/workspace-list-empty-view.coffee
@@ -5,7 +5,7 @@ define [
 ) ->
 
   class extends Marionette.ItemView
-    className: 'issues-no-results'
+    className: 'search-navigator-no-results'
 
 
     template: ->
diff --git a/server/sonar-web/src/main/coffee/issues/workspace-list-item-view.coffee b/server/sonar-web/src/main/coffee/issues/workspace-list-item-view.coffee
index d81b015538c..2e91d9053d3 100644
--- a/server/sonar-web/src/main/coffee/issues/workspace-list-item-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/workspace-list-item-view.coffee
@@ -14,13 +14,14 @@ define [
 
 
     initialize: (options) ->
+      super
       @listenTo options.app.state, 'change:selectedIndex', @select
 
 
     onRender: ->
       super
-      @$el.addClass 'issue-navigate-right'
       @select()
+      @$el.addClass 'issue-navigate-right'
 
 
     select: ->
diff --git a/server/sonar-web/src/main/coffee/issues/workspace-list-view.coffee b/server/sonar-web/src/main/coffee/issues/workspace-list-view.coffee
index d52d55bf4d5..7b139ff35b1 100644
--- a/server/sonar-web/src/main/coffee/issues/workspace-list-view.coffee
+++ b/server/sonar-web/src/main/coffee/issues/workspace-list-view.coffee
@@ -1,10 +1,10 @@
 define [
-  'backbone.marionette'
+  'components/navigator/workspace-list-view'
   'templates/issues'
   'issues/workspace-list-item-view'
   'issues/workspace-list-empty-view'
 ], (
-  Marionette
+  WorkspaceListView
   Templates
   IssueView
   EmptyView
@@ -17,50 +17,14 @@ define [
   BOTTOM_OFFSET = 10
 
 
-  class extends Marionette.CompositeView
+  class extends WorkspaceListView
     template: Templates['issues-workspace-list']
     componentTemplate: Templates['issues-workspace-list-component']
     itemView: IssueView
-    itemViewContainer: '.js-issues-list'
+    itemViewContainer: '.js-list'
     emptyView: EmptyView
 
 
-    ui:
-      loadMore: '.js-issues-more'
-
-
-    itemViewOptions: ->
-      app: @options.app
-
-
-    collectionEvents:
-      'reset': 'scrollToTop'
-
-
-    initialize: ->
-      @loadMoreThrottled = _.throttle @loadMore, 1000, { trailing: false }
-      @listenTo @options.app.state, 'change:maxResultsReached', @toggleLoadMore
-      @listenTo @options.app.state, 'change:selectedIndex', @scrollToIssue
-      @bindShortcuts()
-
-
-    onClose: ->
-      @unbindScrollEvents()
-      @unbindShortcuts()
-
-
-    toggleLoadMore: ->
-      @ui.loadMore.toggle !@options.app.state.get 'maxResultsReached'
-
-
-    bindScrollEvents: ->
-      $(window).on 'scroll.issues-workspace-list', (=> @onScroll())
-
-
-    unbindScrollEvents: ->
-      $(window).off 'scroll.issues-workspace-list'
-
-
     bindShortcuts: ->
       doTransition = (transition) =>
         selectedIssue = @collection.at @options.app.state.get 'selectedIndex'
@@ -74,13 +38,7 @@ define [
         selectedIssueView = @children.findByModel selectedIssue
         selectedIssueView.$(".js-issue-#{action}").click()
 
-      key 'up', 'list', =>
-        @options.app.controller.selectPreviousIssue()
-        false
-
-      key 'down', 'list', =>
-        @options.app.controller.selectNextIssue()
-        false
+      super
 
       key 'right,return', 'list', =>
         selectedIssue = @collection.at @options.app.state.get 'selectedIndex'
@@ -101,29 +59,7 @@ define [
       key 't', 'list', -> doAction 'edit-tags'
 
 
-    loadMore: ->
-      unless @options.app.state.get 'maxResultsReached'
-        @unbindScrollEvents()
-        @options.app.controller.fetchNextPage().done => @bindScrollEvents()
-
-
-    disablePointerEvents: ->
-      clearTimeout @scrollTimer
-      $('body').addClass 'disabled-pointer-events'
-      @scrollTimer = setTimeout (-> $('body').removeClass 'disabled-pointer-events'), 250
-
-
-    onScroll: ->
-      @disablePointerEvents()
-      if $(window).scrollTop() + $(window).height() >= @ui.loadMore.offset().top
-        @loadMoreThrottled()
-
-
-    scrollToTop: ->
-      @$el.scrollParent().scrollTop 0
-
-
-    scrollToIssue: ->
+    scrollTo: ->
       selectedIssue = @collection.at @options.app.state.get 'selectedIndex'
       return unless selectedIssue?
       selectedIssueView = @children.findByModel selectedIssue
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-actions.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-actions.hbs
index 2b3d0764b93..2b3d0764b93 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-actions.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-actions.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-bulk-change-dropdown.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-bulk-change-dropdown.hbs
index 3fcb25ba37a..3fcb25ba37a 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-bulk-change-dropdown.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-bulk-change-dropdown.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-bulk-change.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-bulk-change.hbs
index 441222f7557..441222f7557 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-bulk-change.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-bulk-change.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-custom-rule-creation.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-custom-rule-creation.hbs
index c1244ff82e6..c1244ff82e6 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-custom-rule-creation.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-custom-rule-creation.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-custom-rule-reactivation.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-custom-rule-reactivation.hbs
index 2de07a6a814..2de07a6a814 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-custom-rule-reactivation.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-custom-rule-reactivation.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-debt-popup.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-debt-popup.hbs
index 4c3b81cceda..4c3b81cceda 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-debt-popup.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-debt-popup.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail-custom-rule.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail-custom-rule.hbs
index 8bd8ba0893c..8bd8ba0893c 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail-custom-rule.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail-custom-rule.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail-quality-profile.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail-quality-profile.hbs
index 9f398ea3f2c..9f398ea3f2c 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail-quality-profile.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail-quality-profile.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail.hbs
index 7da358161f2..7da358161f2 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-detail.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-detail.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-facets.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-facets.hbs
index c274ffff513..c274ffff513 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-facets.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-facets.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-filter-bar.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-filter-bar.hbs
index 2e0f52a1b21..2e0f52a1b21 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-filter-bar.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-filter-bar.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-header.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-header.hbs
index 6f539db926b..6f539db926b 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-header.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-header.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-layout.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-layout.hbs
new file mode 100644
index 00000000000..d824a27fb19
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-layout.hbs
@@ -0,0 +1,16 @@
+<div class="navigator-header"></div>
+<div class="navigator-filters"></div>
+<div class="navigator-facets"></div>
+
+<div class="navigator-content">
+  <div class="navigator-side">
+    <div style="position:relative; overflow: visible; height: 100%;">
+      <div class="navigator-actions"></div>
+      <div class="navigator-results"></div>
+      <a class="navigator-resizer"><i class="icon-resizer"></i></a>
+    </div>
+  </div>
+  <div class="navigator-main">
+    <div class="navigator-details"></div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-list-empty.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-list-empty.hbs
index 75e2daf75af..75e2daf75af 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-list-empty.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-list-empty.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-list-item.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-list-item.hbs
index a4244ac7370..a4244ac7370 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-list-item.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-list-item.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-manual-rule-creation.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-manual-rule-creation.hbs
index 389dd69c661..389dd69c661 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-manual-rule-creation.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-manual-rule-creation.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-manual-rule-reactivation.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-manual-rule-reactivation.hbs
index 2410c7fd95f..2410c7fd95f 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-manual-rule-reactivation.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-manual-rule-reactivation.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-parameter-popup.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-parameter-popup.hbs
index 0299cedabc2..0299cedabc2 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-parameter-popup.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-parameter-popup.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-profile-filter-detail.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-profile-filter-detail.hbs
index 3a3b44cff8b..3a3b44cff8b 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-profile-filter-detail.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-profile-filter-detail.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-quality-profile-activation.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-quality-profile-activation.hbs
index e407448a8bb..e407448a8bb 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-quality-profile-activation.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-quality-profile-activation.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-query-filter.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-query-filter.hbs
index 392a69042f2..392a69042f2 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-query-filter.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-query-filter.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-repository-detail.hbs b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-repository-detail.hbs
index 3a3b44cff8b..3a3b44cff8b 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-repository-detail.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules-old/coding-rules-repository-detail.hbs
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-filters.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-filters.hbs
new file mode 100644
index 00000000000..45ce48c26c6
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-filters.hbs
@@ -0,0 +1,9 @@
+<div class="search-navigator-filters-header">
+  <span class="search-navigator-filters-name">{{t 'coding_rules.page'}}</span>
+</div>
+
+<div class="search-navigator-filters-actions">
+  <div class="button-group">
+    <button class="js-new-search" id="coding-rules-new-search">{{t 'issue_filter.new_search'}}</button>
+  </div>
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-layout.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-layout.hbs
index d824a27fb19..8f46e4f8fb1 100644
--- a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-layout.hbs
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-layout.hbs
@@ -1,16 +1,10 @@
-<div class="navigator-header"></div>
-<div class="navigator-filters"></div>
-<div class="navigator-facets"></div>
+<div class="search-navigator-side">
+  <div class="search-navigator-filters"></div>
+  <div class="search-navigator-facets"></div>
+</div>
 
-<div class="navigator-content">
-  <div class="navigator-side">
-    <div style="position:relative; overflow: visible; height: 100%;">
-      <div class="navigator-actions"></div>
-      <div class="navigator-results"></div>
-      <a class="navigator-resizer"><i class="icon-resizer"></i></a>
-    </div>
-  </div>
-  <div class="navigator-main">
-    <div class="navigator-details"></div>
-  </div>
-</div>
\ No newline at end of file
+<div class="search-navigator-workspace">
+  <div class="search-navigator-workspace-header"></div>
+  <div class="search-navigator-workspace-list"></div>
+  <div class="search-navigator-workspace-details"></div>
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-rule-details.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-rule-details.hbs
new file mode 100644
index 00000000000..935dd66e8cb
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-rule-details.hbs
@@ -0,0 +1,162 @@
+<h3 class="coding-rules-detail-header">
+  {{name}}
+  <a class="coding-rules-detail-permalink icon-link" target="_blank" href="#rule_key={{key}}"></a>
+</h3>
+<span class="subtitle">{{key}}</span>
+
+<ul class="coding-rules-detail-properties">
+  {{#unless isManual}}
+    <li class="coding-rules-detail-property">{{severityIcon severity}} {{t "severity" severity}}</li>
+  {{/unless}}
+  {{#notEq status 'READY'}}
+    <li class="coding-rules-detail-property">
+      <span class="coding-rules-detail-status coding-rules-detail-not-ready">{{status}}</span>
+    </li>
+  {{/notEq}}
+
+
+  <li class="coding-rules-detail-property coding-rules-detail-tag-list {{#if canWrite}}coding-rules-detail-tags-change{{/if}}">
+    <i class="icon-tags"></i>
+    <span>{{#if allTags}}{{join allTags ', '}}{{else}}{{t 'coding_rules.no_tags'}}{{/if}}</span>
+  </li>
+  {{#if canWrite}}<li class="coding-rules-detail-property coding-rules-detail-tag-edit">
+    {{#if sysTags}}<i class="icon-tags"></i>
+      <span>{{join sysTags ', '}}</span>{{/if}}
+    <input class="coding-rules-detail-tag-input" type="text" value="{{#if tags}}{{join tags ','}}{{/if}}">
+
+    <div class="button-group">
+      <button class="coding-rules-detail-tag-edit-done">{{t 'Done'}}</button>
+    </div>
+    <a class="coding-rules-details-tag-edit-cancel">{{t 'cancel'}}</a>
+  </li>{{/if}}
+
+  {{#if subCharacteristic}}
+    <li class="coding-rules-detail-property coding-rules-subcharacteristic">{{subCharacteristic}}</li>
+  {{/if}}
+  <li class="coding-rules-detail-property">{{t 'coding_rules.available_since'}} {{d createdAt}}</li>
+  <li class="coding-rules-detail-property">{{repository}}{{#unless isManual}} ({{language}}){{/unless}}</li>
+
+  {{#if isTemplate}}
+    <li class="coding-rules-detail-property" title="{{t 'coding_rules.rule_template.title'}}">{{t 'coding_rules.rule_template'}}</li>
+  {{/if}}
+  {{#if templateKey}}
+    <li class="coding-rules-detail-property" title="{{t 'coding_rules.custom_rule.title'}}">{{t 'coding_rules.custom_rule'}}
+      (<a href="#rule_key={{templateKey}}">{{t 'coding_rules.show_template'}}</a>)
+    </li>
+  {{/if}}
+</ul>
+
+<div class="coding-rules-detail-description rule-desc markdown">{{{htmlDesc}}}</div>
+
+{{#unless isEditable}}
+  {{#unless isManual}}
+    <div class="coding-rules-detail-description coding-rules-detail-description-extra">
+      <div id="coding-rules-detail-description-extra">
+        {{#if htmlNote}}
+          <div class="rule-desc marginbottom10 markdown">{{{htmlNote}}}</div>{{/if}}
+        {{#if canWrite}}<div class="button-group">
+          <button id="coding-rules-detail-extend-description">{{t 'coding_rules.extend_description'}}</button>
+        </div>{{/if}}
+      </div>
+
+      {{#if canWrite}}<div class="coding-rules-detail-extend-description-form">
+        <table class="width100">
+          <tbody>
+          <tr>
+            <td class="width100" colspan="2">
+            <textarea id="coding-rules-detail-extend-description-text" rows="4"
+                      style="width: 100%; margin-bottom: 4px;">{{mdNote}}</textarea>
+            </td>
+          </tr>
+          <tr>
+            <td>
+              <div class="button-group">
+                <button id="coding-rules-detail-extend-description-submit">{{t 'save'}}</button>
+                {{#if mdNote}}
+                  <button id="coding-rules-detail-extend-description-remove" class="button-red">{{t 'remove'}}</button>
+                {{/if}}
+              </div>
+              <a id="coding-rules-detail-extend-description-cancel" class="action">{{t 'cancel'}}</a>
+            </td>
+            <td class="right">
+              {{> '_markdown-tips' }}
+            </td>
+          </tr>
+          </tbody>
+        </table>
+      </div>
+
+        <div id="coding-rules-detail-extend-description-spinner">
+          <i class="spinner"></i>
+        </div>{{/if}}
+    </div>
+  {{/unless}}
+{{/unless}}
+
+
+{{#if params}}
+  <h3 class="coding-rules-detail-title">{{t 'coding_rules.parameters'}}</h3>
+  <div class="coding-rules-detail-parameters">
+    {{#each params}}
+      <dl class="coding-rules-detail-parameter">
+        <dt class="coding-rules-detail-parameter-name">{{key}}</dt>
+        <dd class="coding-rules-detail-parameter-description" data-key="{{key}}">
+          <p>{{{htmlDesc}}}</p>
+          {{#if ../../templateKey}}
+            <div class="subtitle">
+              {{#if defaultValue }}
+                <span class="value">{{defaultValue}}</span>
+              {{else}}
+                {{t 'coding_rules.parameter.empty'}}
+              {{/if}}
+            </div>
+          {{else}}
+            {{#if defaultValue}}
+              <div class="subtitle">{{t 'coding_rules.parameters.default_value'}} <span class="value">{{defaultValue}}</span></div>
+            {{/if}}
+          {{/if}}
+        </dd>
+      </dl>
+    {{/each}}
+  </div>
+{{/if}}
+
+{{#if isEditable}}
+  <div class="coding-rules-detail-description">
+    <div class="button-group">
+      {{#if isManual}}
+        <button id="coding-rules-detail-manual-rule-change">{{t 'edit'}}</button>
+      {{else}}
+        <button id="coding-rules-detail-custom-rule-change">{{t 'edit'}}</button>
+      {{/if}}
+      <button id="coding-rules-detail-rule-delete" class="button-red">{{t 'delete'}}</button>
+    </div>
+  </div>
+{{/if}}
+
+
+{{#if isTemplate}}
+  <div class="coding-rules-detail-custom-rules-section">
+    <h3 class="coding-rules-detail-title">{{t 'coding_rules.custom_rules'}}</h3>
+
+    {{#if canWrite}}<div class="button-group coding-rules-detail-quality-profiles-activation">
+      <button id="coding-rules-custom-rules-create">{{t 'coding_rules.create'}}</button>
+    </div>{{/if}}
+    <div id="coding-rules-detail-custom-rules"></div>
+  </div>
+{{/if}}
+
+
+{{#if qualityProfilesVisible}}
+  <div class="coding-rules-detail-quality-profiles-section">
+    <h3 class="coding-rules-detail-title">{{t 'coding_rules.quality_profiles'}}</h3>
+
+    {{#if canWrite}}{{#unless isTemplate}}<div class="button-group coding-rules-detail-quality-profiles-activation">
+      <button id="coding-rules-quality-profile-activate">{{t 'coding_rules.activate'}}</button>
+    </div>{{/unless}}{{/if}}
+    {{#if isTemplate}}
+      <div class="coding-rules-detail-quality-profiles-template-caption warning">{{t 'coding_rules.quality_profiles.template_caption'}}</div>
+    {{/if}}
+    <div id="coding-rules-detail-quality-profiles"></div>
+  </div>
+{{/if}}
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-header.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-header.hbs
new file mode 100644
index 00000000000..e91dbcd736b
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-header.hbs
@@ -0,0 +1,30 @@
+<div class="search-navigator-header-component">
+  {{#if state.rule}}
+    <a class="js-back">{{t 'coding_rules.return_to_list'}}</a>
+  {{else}}
+    &nbsp;
+  {{/if}}
+</div>
+
+
+<div class="search-navigator-header-actions">
+  {{#notNull state.total}}
+    <div class="search-navigator-header-pagination">
+      {{#gt state.total 0}}
+        <a class="js-prev icon-prev" title="{{t 'paging_previous'}}"></a>
+        <span class="current">{{sum state.selectedIndex 1}} / <span id="coding-rules-total">{{state.total}}</span></span>
+        <a class="js-next icon-next" title="{{t 'paging_next'}}"></a>
+      {{else}}
+        <span class="current">0 / <span id="coding-rules-total">0</span></span>
+      {{/gt}}
+    </div>
+  {{/notNull}}
+
+
+  <div class="search-navigator-header-buttons button-group">
+    <button class="js-reload">{{t 'reload'}}</button>
+    {{#if state.canBulkChange}}
+      <button class="js-bulk-change">{{t 'bulk_change'}}</button>
+    {{/if}}
+  </div>
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list-item.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list-item.hbs
new file mode 100644
index 00000000000..fffa5b5e9cc
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list-item.hbs
@@ -0,0 +1,15 @@
+<div class="coding-rule-inner">
+  <div class="coding-rule-title">
+    <a class="js-rule link-no-underline">{{name}}</a>
+  </div>
+  <div class="coding-rule-meta">
+    <a class="js-lang link-no-underline" data-lang="{{lang}}">{{langName}}</a>
+    {{#notEmpty sysTags}}
+      &nbsp;&nbsp;&nbsp;
+      <i class="icon-tags"></i>
+      {{#each sysTags}}
+        <a class="js-tag link-no-underline" data-tag="{{this}}">{{this}}</a>
+      {{/each}}
+    {{/notEmpty}}
+  </div>
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list.hbs b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list.hbs
new file mode 100644
index 00000000000..37421cb75c2
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/coding-rules-workspace-list.hbs
@@ -0,0 +1,5 @@
+<div class="js-list"></div>
+
+<div class="search-navigator-workspace-list-more js-more">
+  <i class="spinner"></i>
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/facets/_coding-rules-facet-header.hbs b/server/sonar-web/src/main/hbs/coding-rules/facets/_coding-rules-facet-header.hbs
new file mode 100644
index 00000000000..2251f570ee9
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/facets/_coding-rules-facet-header.hbs
@@ -0,0 +1,4 @@
+<a class="search-navigator-facet-header js-facet-toggle">
+  <i class="icon-checkbox {{#if enabled}}icon-checkbox-checked{{/if}}"></i>
+  {{t 'coding_rules.facet' property}}
+</a>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-base-facet.hbs b/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-base-facet.hbs
new file mode 100644
index 00000000000..fc7fef9f205
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-base-facet.hbs
@@ -0,0 +1,10 @@
+{{> '_coding-rules-facet-header'}}
+
+<div class="search-navigator-facet-list">
+  {{#each values}}
+    <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{default label val}}">
+      <span class="facet-name">{{default label val}}{{#if extra}} <span class="subtitle">{{extra}}</span>{{/if}}</span>
+      <span class="facet-stat">{{count}}</span>
+    </a>
+  {{/each}}
+</div>
diff --git a/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-severity-facet.hbs b/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-severity-facet.hbs
new file mode 100644
index 00000000000..b6a386b603b
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/coding-rules/facets/coding-rules-severity-facet.hbs
@@ -0,0 +1,10 @@
+{{> '_coding-rules-facet-header'}}
+
+<div class="search-navigator-facet-list">
+  {{#each values}}
+    <a class="facet search-navigator-facet search-navigator-facet-half js-facet" data-value="{{val}}" title="{{t 'severity' val}}">
+      <span class="facet-name">{{severityIcon val}} {{t 'severity' val}}</span>
+      <span class="facet-stat">{{count}}</span>
+    </a>
+  {{/each}}
+</div>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/_issues-facet-header.hbs b/server/sonar-web/src/main/hbs/issues/facets/_issues-facet-header.hbs
index 9b59a846155..3b57c6021ea 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/_issues-facet-header.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/_issues-facet-header.hbs
@@ -1,4 +1,4 @@
-<a class="issues-facet-header js-issues-facet-toggle">
+<a class="search-navigator-facet-header js-facet-toggle">
   <i class="icon-checkbox {{#if enabled}}icon-checkbox-checked{{/if}}"></i>
   {{t 'issues.facet' property}}
 </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-action-plan-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-action-plan-facet.hbs
index d0cdd871563..1b7d6dc39a7 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-action-plan-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-action-plan-facet.hbs
@@ -1,15 +1,15 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
     {{#eq val ''}}
       {{! unplanned }}
-      <a class="facet issues-facet js-issues-facet" data-unplanned title="{{t 'issue.unplanned'}}">
+      <a class="facet search-navigator-facet js-facet" data-unplanned title="{{t 'issue.unplanned'}}">
         <span class="facet-name">{{t 'issue.unplanned'}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
     {{else}}
-      <a class="facet issues-facet js-issues-facet" data-value="{{val}}" title="{{label}}">
+      <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{label}}">
         <span class="facet-name">{{label}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-assignee-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-assignee-facet.hbs
index 4fd181b9b98..6e6ab49b1d4 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-assignee-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-assignee-facet.hbs
@@ -1,22 +1,22 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
     {{#eq val ''}}
       {{! unassigned }}
-      <a class="facet issues-facet js-issues-facet" data-unassigned title="{{t 'unassigned'}}">
+      <a class="facet search-navigator-facet js-facet" data-unassigned title="{{t 'unassigned'}}">
         <span class="facet-name">{{t 'unassigned'}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
     {{else}}
-      <a class="facet issues-facet js-issues-facet" data-value="{{val}}" title="{{label}}">
+      <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{label}}">
         <span class="facet-name">{{label}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
     {{/eq}}
   {{/each}}
 
-  <div class="issues-facet-custom-value">
-    <input type="hidden" class="js-issues-custom-value">
+  <div class="search-navigator-facet-custom-value">
+    <input type="hidden" class="js-custom-value">
   </div>
 </div>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-base-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-base-facet.hbs
index 4fd48a68f4e..7e12ac12daa 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-base-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-base-facet.hbs
@@ -1,8 +1,8 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
-    <a class="facet issues-facet js-issues-facet" data-value="{{val}}" title="{{default label val}}">
+    <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{default label val}}">
       <span class="facet-name">{{default label val}}</span>
       <span class="facet-stat">{{count}}</span>
     </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-component-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-component-facet.hbs
index ec0d1bd7a6b..479bdc19abc 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-component-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-component-facet.hbs
@@ -1,8 +1,8 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list issues-facet-list-align-right">
+<div class="search-navigator-facet-list search-navigator-facet-list-align-right">
   {{#each values}}
-    <a class="facet issues-facet js-issues-facet" data-value="{{val}}" title="{{default label val}}">
+    <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{default label val}}">
       <span class="facet-name">{{default label val}}</span>
       <span class="facet-stat">{{count}}</span>
     </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-creation-date-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-creation-date-facet.hbs
index 5e33e15dd08..c5b3e5dd47e 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-creation-date-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-creation-date-facet.hbs
@@ -2,13 +2,13 @@
 
 {{#if createdAt}}
   <input type="hidden" name="createdAt">
-  <div class="issues-facet-container">
+  <div class="search-navigator-facet-container">
     {{dt createdAt}} ({{fromNow createdAt}})
   </div>
 {{else}}
-  <div class="issues-facet-container justify">
-    <input type="text" class="issues-facet-input" name="createdAfter" placeholder="From">
+  <div class="search-navigator-facet-container justify">
+    <input type="text" class="search-navigator-facet-input" name="createdAfter" placeholder="From">
     to
-    <input type="text" class="issues-facet-input" name="createdBefore" placeholder="To">
+    <input type="text" class="search-navigator-facet-input" name="createdBefore" placeholder="To">
   </div>
 {{/if}}
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-custom-values-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-custom-values-facet.hbs
index 79bf7ac15bd..bb0568a8171 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-custom-values-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-custom-values-facet.hbs
@@ -1,14 +1,14 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
-    <a class="facet issues-facet js-issues-facet" data-value="{{val}}" title="{{#if extra}}({{extra}}) {{/if}}{{default label val}}">
+    <a class="facet search-navigator-facet js-facet" data-value="{{val}}" title="{{#if extra}}({{extra}}) {{/if}}{{default label val}}">
       <span class="facet-name">{{default label val}}</span>
       <span class="facet-stat">{{count}}</span>
     </a>
   {{/each}}
 
-  <div class="issues-facet-custom-value">
-    <input type="hidden" class="js-issues-custom-value">
+  <div class="search-navigator-facet-custom-value">
+    <input type="hidden" class="js-custom-value">
   </div>
 </div>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-issue-key-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-issue-key-facet.hbs
index e146f5a64e6..7d82808b911 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-issue-key-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-issue-key-facet.hbs
@@ -1,5 +1,5 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-container">
+<div class="search-navigator-facet-container">
   {{issues}}
 </div>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-resolution-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-resolution-facet.hbs
index 1eb34815a92..72aba97d349 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-resolution-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-resolution-facet.hbs
@@ -1,15 +1,15 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
     {{#eq val ''}}
     {{! unresolved }}
-      <a class="facet issues-facet issues-facet-half js-issues-facet" data-unresolved title="{{t 'unresolved'}}">
+      <a class="facet search-navigator-facet search-navigator-facet-half js-facet" data-unresolved title="{{t 'unresolved'}}">
         <span class="facet-name">{{t 'unresolved'}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
     {{else}}
-      <a class="facet issues-facet issues-facet-half js-issues-facet" data-value="{{val}}" title="{{t 'issue.resolution' val}}">
+      <a class="facet search-navigator-facet search-navigator-facet-half js-facet" data-value="{{val}}" title="{{t 'issue.resolution' val}}">
         <span class="facet-name">{{t 'issue.resolution' val}}</span>
         <span class="facet-stat">{{count}}</span>
       </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-severity-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-severity-facet.hbs
index 062e275abb4..882b4780624 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-severity-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-severity-facet.hbs
@@ -1,8 +1,8 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
-    <a class="facet issues-facet issues-facet-half js-issues-facet" data-value="{{val}}" title="{{t 'severity' val}}">
+    <a class="facet search-navigator-facet search-navigator-facet-half js-facet" data-value="{{val}}" title="{{t 'severity' val}}">
       <span class="facet-name">{{severityIcon val}} {{t 'severity' val}}</span>
       <span class="facet-stat">{{count}}</span>
     </a>
diff --git a/server/sonar-web/src/main/hbs/issues/facets/issues-status-facet.hbs b/server/sonar-web/src/main/hbs/issues/facets/issues-status-facet.hbs
index 02cc4482eec..75023f2d9aa 100644
--- a/server/sonar-web/src/main/hbs/issues/facets/issues-status-facet.hbs
+++ b/server/sonar-web/src/main/hbs/issues/facets/issues-status-facet.hbs
@@ -1,8 +1,8 @@
 {{> '_issues-facet-header'}}
 
-<div class="issues-facet-list">
+<div class="search-navigator-facet-list">
   {{#each values}}
-    <a class="facet issues-facet issues-facet-half js-issues-facet" data-value="{{val}}" title="{{t 'issue.status' val}}">
+    <a class="facet search-navigator-facet search-navigator-facet-half js-facet" data-value="{{val}}" title="{{t 'issue.status' val}}">
       <span class="facet-name">{{statusIcon val}} {{t 'issue.status' val}}</span>
       <span class="facet-stat">{{count}}</span>
     </a>
diff --git a/server/sonar-web/src/main/hbs/issues/issues-filters.hbs b/server/sonar-web/src/main/hbs/issues/issues-filters.hbs
index b9e3266e3ca..cd51e685651 100644
--- a/server/sonar-web/src/main/hbs/issues/issues-filters.hbs
+++ b/server/sonar-web/src/main/hbs/issues/issues-filters.hbs
@@ -1,36 +1,36 @@
-<div class="issues-filters-list">
+<div class="search-navigator-filters-list">
   {{#each items}}
-    <a class="issues-filters-button issues-filters-filter js-issues-filter" data-id="{{id}}">{{name}}</a>
+    <a class="search-navigator-filters-button search-navigator-filters-filter js-filter" data-id="{{id}}">{{name}}</a>
     <br>
   {{/each}}
-  <a class="issues-filters-manage" href="{{link '/issues/manage'}}"><i class="icon-settings"></i> {{t 'manage'}}</a>
+  <a class="search-navigator-filters-manage" href="{{link '/issues/manage'}}"><i class="icon-settings"></i> {{t 'manage'}}</a>
 </div>
 
-<div class="issues-filters-header">
+<div class="search-navigator-filters-header">
   {{#if state.canManageFilters}}
-    <a class="issues-filters-show-list js-issues-toggle-filters">
+    <a class="search-navigator-filters-show-list js-toggle-filters">
       <i class="icon-list"></i>&nbsp;<span class="issues-filters-name">{{> '_issues-filter-name'}}</span>
     </a>
     {{#if filter.description}}
-      <div class="issues-filters-description">{{filter.description}}</div>
+      <div class="search-navigator-filters-description">{{filter.description}}</div>
     {{/if}}
   {{else}}
-    <span class="issues-filters-name">{{t 'issues'}}</span>
+    <span class="search-navigator-filters-name">{{t 'issues'}}</span>
   {{/if}}
 </div>
 
-<div class="issues-filters-actions">
+<div class="search-navigator-filters-actions">
   <div class="button-group">
-    <button id="issues-new-search">{{t 'issue_filter.new_search'}}</button>
+    <button class="js-new-search" id="issues-new-search">{{t 'issue_filter.new_search'}}</button>
 
     {{#if state.canManageFilters}}
       {{#if filter.canModify}}
-        {{#if state.changed}}<button id="issues-filter-save">{{t 'save'}}</button>{{/if}}
+        {{#if state.changed}}<button class="js-filter-save" id="issues-filter-save">{{t 'save'}}</button>{{/if}}
       {{/if}}
-      {{#unless filter.id}}<button id="issues-filter-save-as">{{t 'save_as'}}</button>{{/unless}}
-      {{#if filter.id}}<button id="issues-filter-copy">{{t 'copy'}}</button>{{/if}}
+      {{#unless filter.id}}<button class="js-filter-save-as" id="issues-filter-save-as">{{t 'save_as'}}</button>{{/unless}}
+      {{#if filter.id}}<button class="js-filter-copy" id="issues-filter-copy">{{t 'copy'}}</button>{{/if}}
       {{#if filter.canModify}}
-        {{#if filter.id}}<button id="issues-filter-edit">{{t 'edit'}}</button>{{/if}}
+        {{#if filter.id}}<button class="js-filter-edit" id="issues-filter-edit">{{t 'edit'}}</button>{{/if}}
       {{/if}}
     {{/if}}
   </div>
diff --git a/server/sonar-web/src/main/hbs/issues/issues-layout.hbs b/server/sonar-web/src/main/hbs/issues/issues-layout.hbs
index dfa704a6fb8..f60fecfb03f 100644
--- a/server/sonar-web/src/main/hbs/issues/issues-layout.hbs
+++ b/server/sonar-web/src/main/hbs/issues/issues-layout.hbs
@@ -1,10 +1,10 @@
-<div class="issues-side">
-  <div class="issues-filters"></div>
-  <div class="issues-facets"></div>
+<div class="search-navigator-side">
+  <div class="search-navigator-filters"></div>
+  <div class="search-navigator-facets"></div>
 </div>
 
-<div class="issues-workspace">
-  <div class="issues-workspace-header issues-header"></div>
-  <div class="issues-workspace-list"></div>
+<div class="search-navigator-workspace">
+  <div class="search-navigator-workspace-header"></div>
+  <div class="search-navigator-workspace-list"></div>
   <div class="issues-workspace-component-viewer"></div>
 </div>
diff --git a/server/sonar-web/src/main/hbs/issues/issues-workspace-header.hbs b/server/sonar-web/src/main/hbs/issues/issues-workspace-header.hbs
index d693e1d1bb5..93175e7c99b 100644
--- a/server/sonar-web/src/main/hbs/issues/issues-workspace-header.hbs
+++ b/server/sonar-web/src/main/hbs/issues/issues-workspace-header.hbs
@@ -13,13 +13,13 @@
 </div>
 
 
-<div class="issues-header-actions">
+<div class="search-navigator-header-actions">
   {{#notNull state.total}}
-    <div class="issues-header-pagination">
+    <div class="search-navigator-header-pagination">
       {{#gt state.total 0}}
-        <a class="js-issues-prev icon-prev" title="{{t 'paging_previous'}}"></a>
+        <a class="js-prev icon-prev" title="{{t 'paging_previous'}}"></a>
         <span class="current">{{sum state.selectedIndex 1}} / <span id="issues-total">{{state.total}}</span></span>
-        <a class="js-issues-next icon-next" title="{{t 'paging_next'}}"></a>
+        <a class="js-next icon-next" title="{{t 'paging_next'}}"></a>
       {{else}}
         <span class="current">0 / <span id="issues-total">0</span></span>
       {{/gt}}
@@ -27,10 +27,10 @@
   {{/notNull}}
 
 
-  <div class="issues-header-buttons button-group">
-    <button id="issues-reload">{{t 'reload'}}</button>
+  <div class="search-navigator-header-buttons button-group">
+    <button id="issues-reload" class="js-reload">{{t 'reload'}}</button>
     {{#if state.canBulkChange}}
-      <button id="issues-bulk-change">{{t 'bulk_change'}}</button>
+      <button id="issues-bulk-change" class="js-bulk-change">{{t 'bulk_change'}}</button>
     {{/if}}
   </div>
 </div>
diff --git a/server/sonar-web/src/main/hbs/issues/issues-workspace-list.hbs b/server/sonar-web/src/main/hbs/issues/issues-workspace-list.hbs
index 4f9c8376ab6..37421cb75c2 100644
--- a/server/sonar-web/src/main/hbs/issues/issues-workspace-list.hbs
+++ b/server/sonar-web/src/main/hbs/issues/issues-workspace-list.hbs
@@ -1,5 +1,5 @@
-<div class="js-issues-list"></div>
+<div class="js-list"></div>
 
-<div class="issues-workspace-list-more js-issues-more">
+<div class="search-navigator-workspace-list-more js-more">
   <i class="spinner"></i>
 </div>
diff --git a/server/sonar-web/src/main/js/coding-rules/app.js b/server/sonar-web/src/main/js/coding-rules/app.js
new file mode 100644
index 00000000000..c42f4a41a8b
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/app.js
@@ -0,0 +1,145 @@
+requirejs.config({
+  baseUrl: baseUrl + '/js',
+
+  paths: {
+    'backbone': 'third-party/backbone',
+    'backbone.marionette': 'third-party/backbone.marionette',
+    'handlebars': 'third-party/handlebars'
+  },
+
+  shim: {
+    'backbone.marionette': {
+      deps: ['backbone'],
+      exports: 'Marionette'
+    },
+    'backbone': {
+      exports: 'Backbone'
+    },
+    'handlebars': {
+      exports: 'Handlebars'
+    }
+  }
+});
+
+
+requirejs([
+  'backbone',
+  'backbone.marionette',
+
+  'coding-rules/models/state',
+  'coding-rules/layout',
+  'coding-rules/models/rules',
+  'components/navigator/models/facets',
+
+  'coding-rules/controller',
+  'components/navigator/router',
+
+  'coding-rules/workspace-list-view',
+  'coding-rules//workspace-header-view',
+
+  'coding-rules/facets-view',
+  'coding-rules/filters-view',
+
+  'common/handlebars-extensions'
+],
+    function (Backbone,
+              Marionette,
+              State,
+              Layout,
+              Rules,
+              Facets,
+              Controller,
+              Router,
+              WorkspaceListView,
+              WorkspaceHeaderView,
+              FacetsView,
+              FiltersView) {
+
+      var $ = jQuery,
+          App = new Marionette.Application(),
+          p = window.process.addBackgroundProcess();
+
+      App.addInitializer(function () {
+        this.layout = new Layout();
+        $('.coding-rules').empty().append(this.layout.render().el);
+      });
+
+      App.addInitializer(function () {
+        this.state = new State();
+        this.list = new Rules();
+        this.facets = new Facets();
+      });
+
+      App.addInitializer(function () {
+        this.controller = new Controller({
+          app: this
+        });
+      });
+
+      App.addInitializer(function () {
+        this.workspaceListView = new WorkspaceListView({
+          app: this,
+          collection: this.list
+        });
+        this.layout.workspaceListRegion.show(this.workspaceListView);
+        this.workspaceListView.bindScrollEvents();
+
+        this.workspaceHeaderView = new WorkspaceHeaderView({
+          app: this,
+          collection: this.list
+        });
+        this.layout.workspaceHeaderRegion.show(this.workspaceHeaderView);
+
+        this.facetsView = new FacetsView({
+          app: this,
+          collection: this.facets
+        });
+        this.layout.facetsRegion.show(this.facetsView);
+
+        this.filtersView = new FiltersView({
+          app: this
+        });
+        this.layout.filtersRegion.show(this.filtersView);
+      });
+
+      App.addInitializer(function () {
+        key.setScope('list');
+        this.router = new Router({
+          app: this
+        });
+        Backbone.history.start();
+        window.process.finishBackgroundProcess(p);
+      });
+
+      App.manualRepository = function () {
+        return {
+          key: 'manual',
+          name: t('coding_rules.manual_rules'),
+          language: 'none'
+        };
+      };
+
+      App.getSubCharacteristicName = function (name) {
+        return (App.characteristics[name] || '').replace(': ', ' > ');
+      };
+
+      var appXHR = $.get(baseUrl + '/api/rules/app').done(function(r) {
+        App.canWrite = r.canWrite;
+        App.qualityProfiles = _.sortBy(r.qualityprofiles, ['name', 'lang']);
+        App.languages = _.extend(r.languages, {
+          none: 'None'
+        });
+        _.map(App.qualityProfiles, function(profile) {
+          profile.language = App.languages[profile.lang];
+        });
+        App.repositories = r.repositories;
+        App.repositories.push(App.manualRepository());
+        App.statuses = r.statuses;
+        App.characteristics = r.characteristics;
+      });
+
+      $.when(window.requestMessages(), appXHR).done(function () {
+        App.start();
+      });
+
+    });
diff --git a/server/sonar-web/src/main/js/coding-rules/controller.js b/server/sonar-web/src/main/js/coding-rules/controller.js
new file mode 100644
index 00000000000..3eec23d697c
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/controller.js
@@ -0,0 +1,119 @@
+define([
+    'components/navigator/controller',
+    'coding-rules/rule-details-view'
+], function (Controller, RuleDetailsView) {
+
+  var $ = jQuery;
+
+  return Controller.extend({
+    allFacets: ['languages', 'repositories', 'tags', 'qprofile', 'debt_characteristics', 'severities', 'statuses'],
+    facetsFromServer: ['languages', 'repositories', 'tags'],
+    pageSize: 200,
+    ruleFields: ['name', 'lang', 'langName', 'sysTags', 'tags'],
+
+
+    _searchParameters: function () {
+      return {
+        p: this.app.state.get('page'),
+        ps: this.pageSize,
+        facets: true,
+        f: this.ruleFields.join()
+      };
+    },
+
+    fetchList: function (firstPage) {
+      firstPage = firstPage == null ? true : firstPage;
+      if (firstPage) {
+        this.app.state.set({ selectedIndex: 0, page: 1 }, { silent: true });
+      }
+
+      var that = this,
+          url = baseUrl + '/api/rules/search',
+          options = _.extend(this._searchParameters(), this.app.state.get('query')),
+          p = window.process.addBackgroundProcess();
+      return $.get(url, options).done(function (r) {
+        var rules = that.app.list.parseRules(r);
+        if (firstPage) {
+          that.app.list.reset(rules);
+        } else {
+          that.app.list.add(rules);
+        }
+        that.app.list.setIndex();
+        that.app.facets.reset(that._allFacets());
+        that.app.facets.add(r.facets, { merge: true });
+        that.enableFacets(that._enabledFacets());
+        that.app.state.set({
+          page: r.p,
+          pageSize: r.ps,
+          total: r.total,
+          maxResultsReached: r.p * r.ps >= r.total
+        });
+        window.process.finishBackgroundProcess(p);
+      }).fail(function () {
+        window.process.failBackgroundProcess(p);
+      });
+    },
+
+    requestFacet: function (id) {
+      var url = baseUrl + '/api/rules/search',
+          facet = this.app.facets.get(id),
+          options = _.extend({ facets: true, ps: 1 }, this.app.state.get('query'));
+      return $.get(url, options).done(function (r) {
+        var facetData = _.findWhere(r.facets, { property: id });
+        if (facetData) {
+          facet.set(facetData);
+        }
+      });
+    },
+
+    parseQuery: function () {
+      var q = Controller.prototype.parseQuery.apply(this, arguments);
+      delete q.asc;
+      delete q.s;
+      return q;
+    },
+
+    getRuleDetails: function (rule) {
+      var url = baseUrl + '/api/rules/show',
+          options = {
+            key: rule.id,
+            actives: true
+          };
+      return $.get(url, options).done(function (data) {
+        rule.set(data.rule);
+      });
+    },
+
+    showDetails: function (rule) {
+      var that = this;
+      this.app.layout.workspaceDetailsRegion.reset();
+      this.getRuleDetails(rule).done(function () {
+        key.setScope('details');
+        that.app.workspaceListView.unbindScrollEvents();
+        that.app.state.set({ rule: rule });
+        that.app.workspaceDetailsView = new RuleDetailsView({
+          app: that.app,
+          model: rule
+        });
+        that.app.layout.workspaceDetailsRegion.show(that.app.workspaceDetailsView);
+        that.app.layout.showDetails();
+      });
+    },
+
+    showDetailsForSelected: function () {
+      var rule = this.app.list.at(this.app.state.get('selectedIndex'));
+      this.showDetails(rule);
+    },
+
+    hideDetails: function () {
+      key.setScope('list');
+      this.app.state.unset('rule');
+      this.app.layout.workspaceDetailsRegion.reset();
+      this.app.layout.hideDetails();
+      this.app.workspaceListView.bindScrollEvents();
+      this.app.workspaceListView.scrollTo();
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets-view.js b/server/sonar-web/src/main/js/coding-rules/facets-view.js
new file mode 100644
index 00000000000..6c34b3939aa
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets-view.js
@@ -0,0 +1,43 @@
+define([
+  'components/navigator/facets-view',
+  'coding-rules/facets/base-facet',
+  'coding-rules/facets/language-facet',
+  'coding-rules/facets/repository-facet',
+  'coding-rules/facets/quality-profile-facet',
+  'coding-rules/facets/characteristic-facet',
+  'coding-rules/facets/severity-facet',
+  'coding-rules/facets/status-facet'
+],
+    function (FacetsView,
+              BaseFacet,
+              LanguageFacet,
+              RepositoryFacet,
+              QualityProfileFacet,
+              CharacteristicFacet,
+              SeverityFacet,
+              StatusFacet) {
+
+      return FacetsView.extend({
+
+        getItemView: function (model) {
+          switch (model.get('property')) {
+            case 'languages':
+              return LanguageFacet;
+            case 'repositories':
+              return RepositoryFacet;
+            case 'qprofile':
+              return QualityProfileFacet;
+            case 'debt_characteristics':
+              return CharacteristicFacet;
+            case 'severities':
+              return SeverityFacet;
+            case 'statuses':
+              return StatusFacet;
+            default:
+              return BaseFacet;
+          }
+        }
+
+      });
+
+    });
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/base-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/base-facet.js
new file mode 100644
index 00000000000..b757662d197
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/base-facet.js
@@ -0,0 +1,11 @@
+define([
+    'components/navigator/facets/base-facet',
+    'templates/coding-rules'
+], function (BaseFacet, Templates) {
+
+  return BaseFacet.extend({
+    className: 'search-navigator-facet-box',
+    template: Templates['coding-rules-base-facet']
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/characteristic-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/characteristic-facet.js
new file mode 100644
index 00000000000..f0ba53566bc
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/characteristic-facet.js
@@ -0,0 +1,37 @@
+define([
+    'coding-rules/facets/base-facet'
+], function (BaseFacet) {
+
+  var $ = jQuery;
+
+  return BaseFacet.extend({
+
+    getValues: function () {
+      var values = _.map(this.options.app.characteristics, function (value, key) {
+        return {
+          label: value,
+          val: key
+        };
+      });
+      return _.sortBy(values, 'label');
+    },
+
+    toggleFacet: function (e) {
+      var obj = {},
+          property = this.model.get('property');
+      if ($(e.currentTarget).is('.active')) {
+        obj[property] = null;
+      } else {
+        obj[property] = $(e.currentTarget).data('value');
+      }
+      this.options.app.state.updateFilter(obj);
+    },
+
+    serializeData: function () {
+      return _.extend(BaseFacet.prototype.serializeData.apply(this, arguments), {
+        values: this.getValues()
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/custom-labels-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/custom-labels-facet.js
new file mode 100644
index 00000000000..af54a48b2d2
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/custom-labels-facet.js
@@ -0,0 +1,28 @@
+define([
+  'coding-rules/facets/base-facet'
+], function (BaseFacet) {
+
+  return BaseFacet.extend({
+
+    getLabelsSource: function () {
+      return [];
+    },
+
+    getValues: function () {
+      var that = this,
+          labels = that.getLabelsSource();
+      return this.model.getValues().map(function (item) {
+        return _.extend(item, {
+          label: labels[item.val]
+        });
+      });
+    },
+
+    serializeData: function () {
+      return _.extend(BaseFacet.prototype.serializeData.apply(this, arguments), {
+        values: this.getValues()
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/language-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/language-facet.js
new file mode 100644
index 00000000000..6a89c42d93a
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/language-facet.js
@@ -0,0 +1,13 @@
+define([
+  'coding-rules/facets/custom-labels-facet'
+], function (CustomLabelsFacet) {
+
+  return CustomLabelsFacet.extend({
+
+    getLabelsSource: function () {
+      return this.options.app.languages;
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/quality-profile-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/quality-profile-facet.js
new file mode 100644
index 00000000000..1e90e2bacca
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/quality-profile-facet.js
@@ -0,0 +1,41 @@
+define([
+  'coding-rules/facets/base-facet'
+], function (BaseFacet) {
+
+  var $ = jQuery;
+
+  return BaseFacet.extend({
+
+    getValues: function () {
+      var that = this,
+          values = this.options.app.qualityProfiles.map(function (profile) {
+            return {
+              label: profile.name,
+              extra: that.options.app.languages[profile.lang],
+              val: profile.key
+            };
+          });
+      return _.sortBy(values, 'label');
+    },
+
+    toggleFacet: function (e) {
+      var obj = {},
+          property = this.model.get('property');
+      if ($(e.currentTarget).is('.active')) {
+        obj.activation = null;
+        obj[property] = null;
+      } else {
+        obj.activation = true;
+        obj[property] = $(e.currentTarget).data('value');
+      }
+      this.options.app.state.updateFilter(obj);
+    },
+
+    serializeData: function () {
+      return _.extend(BaseFacet.prototype.serializeData.apply(this, arguments), {
+        values: this.getValues()
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/repository-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/repository-facet.js
new file mode 100644
index 00000000000..5bf8361f6e1
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/repository-facet.js
@@ -0,0 +1,27 @@
+define([
+  'coding-rules/facets/custom-labels-facet'
+], function (CustomLabelsFacet) {
+
+  return CustomLabelsFacet.extend({
+
+    getLabelsSource: function () {
+      var repos = this.options.app.repositories;
+      return _.object(_.pluck(repos, 'key'), _.pluck(repos, 'name'));
+    },
+
+    getValues: function () {
+      var that = this,
+          values = CustomLabelsFacet.prototype.getValues.apply(this, arguments);
+      return values.map(function (value) {
+        var repo = _.findWhere(that.options.app.repositories, { key: value.val });
+        if (repo != null) {
+          var langName = that.options.app.languages[repo.language];
+          _.extend(value, { extra: langName });
+        }
+        return value;
+      });
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/severity-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/severity-facet.js
new file mode 100644
index 00000000000..133cc18c3a6
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/severity-facet.js
@@ -0,0 +1,30 @@
+define([
+    'coding-rules/facets/base-facet',
+    'templates/coding-rules'
+], function (BaseFacet, Templates) {
+
+  return BaseFacet.extend({
+    template: Templates['coding-rules-severity-facet'],
+    severities: ['BLOCKER', 'MINOR', 'CRITICAL', 'INFO', 'MAJOR'],
+
+    sortValues: function (values) {
+      var order = this.severities;
+      return _.sortBy(values, function (v) {
+        return order.indexOf(v.val);
+      });
+    },
+
+    getValues: function () {
+      return this.severities.map(function (s) {
+        return { val: s };
+      });
+    },
+
+    serializeData: function () {
+      return _.extend(BaseFacet.prototype.serializeData.apply(this, arguments), {
+        values: this.sortValues(this.getValues())
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/facets/status-facet.js b/server/sonar-web/src/main/js/coding-rules/facets/status-facet.js
new file mode 100644
index 00000000000..3429f1a5147
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/facets/status-facet.js
@@ -0,0 +1,23 @@
+define([
+    'coding-rules/facets/base-facet'
+], function (BaseFacet) {
+
+  return BaseFacet.extend({
+
+    getValues: function () {
+      return ['BETA', 'DEPRECATED', 'READY'].map(function (s) {
+        return {
+          label: t('rules.status', s.toLowerCase()),
+          val: s
+        };
+      });
+    },
+
+    serializeData: function () {
+      return _.extend(BaseFacet.prototype.serializeData.apply(this, arguments), {
+        values: this.sortValues(this.getValues())
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/filters-view.js b/server/sonar-web/src/main/js/coding-rules/filters-view.js
new file mode 100644
index 00000000000..9c2de652b4a
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/filters-view.js
@@ -0,0 +1,18 @@
+define([
+    'backbone.marionette',
+    'templates/coding-rules'
+], function (Marionette, Templates) {
+
+  return Marionette.ItemView.extend({
+    template: Templates['coding-rules-filters'],
+
+    events: {
+      'click .js-new-search': 'newSearch'
+    },
+
+    newSearch: function () {
+      this.options.app.controller.newSearch();
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/layout.js b/server/sonar-web/src/main/js/coding-rules/layout.js
new file mode 100644
index 00000000000..f6386fa375a
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/layout.js
@@ -0,0 +1,58 @@
+define([
+  'backbone.marionette',
+  'templates/coding-rules'
+], function (Marionette, Templates) {
+
+  var $ = jQuery;
+
+  return Marionette.Layout.extend({
+    template: Templates['coding-rules-layout'],
+    topOffset: 30,
+
+    regions: {
+      filtersRegion: '.search-navigator-filters',
+      facetsRegion: '.search-navigator-facets',
+      workspaceHeaderRegion: '.search-navigator-workspace-header',
+      workspaceListRegion: '.search-navigator-workspace-list',
+      workspaceDetailsRegion: '.search-navigator-workspace-details'
+    },
+
+    initialize: function () {
+      var that = this;
+      $(window).on('scroll.search-navigator-layout', function () {
+        that.onScroll();
+      });
+    },
+
+    onClose: function () {
+      $(window).off('scroll.search-navigator-layout');
+    },
+
+    onRender: function () {
+      this.$('.search-navigator-side').isolatedScroll();
+    },
+
+    onScroll: function () {
+      var scrollTop = $(window).scrollTop();
+      $('.search-navigator').toggleClass('sticky', scrollTop >= this.topOffset);
+      this.$('.search-navigator-side').css({
+        top: Math.max(0, Math.min(this.topOffset - scrollTop, this.topOffset))
+      });
+    },
+
+    showDetails: function () {
+      this.scroll = $(window).scrollTop();
+      $('.search-navigator').addClass('search-navigator-extended-view');
+    },
+
+
+    hideDetails: function () {
+      $('.search-navigator').removeClass('search-navigator-extended-view');
+      if (this.scroll != null) {
+        $(window).scrollTop(this.scroll);
+      }
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/models/rule.js b/server/sonar-web/src/main/js/coding-rules/models/rule.js
new file mode 100644
index 00000000000..78c1804a21d
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/models/rule.js
@@ -0,0 +1,9 @@
+define([
+    'backbone'
+], function (Backbone) {
+
+  return Backbone.Model.extend({
+    idAttribute: 'key'
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/models/rules.js b/server/sonar-web/src/main/js/coding-rules/models/rules.js
new file mode 100644
index 00000000000..ea0c3577a2d
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/models/rules.js
@@ -0,0 +1,20 @@
+define([
+  'backbone',
+  'coding-rules/models/rule'
+], function (Backbone, Rule) {
+
+  return Backbone.Collection.extend({
+    model: Rule,
+
+    parseRules: function (r) {
+      return r.rules;
+    },
+
+    setIndex: function () {
+      this.forEach(function (rule, index) {
+        rule.set({ index: index });
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/models/state.js b/server/sonar-web/src/main/js/coding-rules/models/state.js
new file mode 100644
index 00000000000..c69164b95a4
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/models/state.js
@@ -0,0 +1,15 @@
+define([
+  'components/navigator/models/state'
+], function (State) {
+
+  return State.extend({
+    defaults: {
+      page: 1,
+      maxResultsReached: false,
+      query: {},
+      facets: []
+    }
+  });
+
+});
+
diff --git a/server/sonar-web/src/main/js/coding-rules/rule-details-view.js b/server/sonar-web/src/main/js/coding-rules/rule-details-view.js
new file mode 100644
index 00000000000..202e1698dfd
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/rule-details-view.js
@@ -0,0 +1,56 @@
+define([
+    'backbone.marionette',
+    'templates/coding-rules'
+], function (Marionette, Templates) {
+
+  return Marionette.ItemView.extend({
+    template: Templates['coding-rules-rule-details'],
+
+    modelEvents: {
+      'change': 'render'
+    },
+
+    initialize: function () {
+      this.bindShortcuts();
+    },
+
+    onClose: function () {
+      this.unbindShortcuts();
+    },
+
+    bindShortcuts: function () {
+      var that = this;
+      key('up', 'details', function () {
+        that.options.app.controller.selectPrev();
+        that.options.app.controller.showDetailsForSelected();
+        return false;
+      });
+      key('down', 'details', function () {
+        that.options.app.controller.selectNext();
+        that.options.app.controller.showDetailsForSelected();
+        return false;
+      });
+      key('left', 'details', function () {
+        that.options.app.controller.hideDetails();
+        return false;
+      });
+    },
+
+    unbindShortcuts: function () {
+      key.deleteScope('details');
+    },
+
+    serializeData: function () {
+      var isManual = (this.options.app.manualRepository().key === this.model.get('repo'));
+
+      return _.extend(Marionette.ItemView.prototype.serializeData.apply(this, arguments), {
+        language: this.options.app.languages[this.model.get('lang')],
+        repository: _.findWhere(this.options.app.repositories, { key: this.model.get('repo') }).name,
+        isManual: isManual,
+        subCharacteristic: this.options.app.getSubCharacteristicName(this.model.get('debtSubChar')),
+        allTags: _.union(this.model.get('sysTags'), this.model.get('tags'))
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/workspace-header-view.js b/server/sonar-web/src/main/js/coding-rules/workspace-header-view.js
new file mode 100644
index 00000000000..fae2372a8dc
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/workspace-header-view.js
@@ -0,0 +1,20 @@
+define([
+  'components/navigator/workspace-header-view',
+  'templates/coding-rules'
+], function (WorkspaceHeaderView, Templates) {
+
+  return WorkspaceHeaderView.extend({
+    template: Templates['coding-rules-workspace-header'],
+
+    events: function () {
+      return _.extend(WorkspaceHeaderView.prototype.events.apply(this, arguments), {
+        'click .js-back': 'onBackClick'
+      });
+    },
+
+    onBackClick: function () {
+      this.options.app.controller.hideDetails();
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/workspace-list-item-view.js b/server/sonar-web/src/main/js/coding-rules/workspace-list-item-view.js
new file mode 100644
index 00000000000..890f05d2af9
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/workspace-list-item-view.js
@@ -0,0 +1,28 @@
+define([
+  'components/navigator/workspace-list-item-view',
+  'templates/coding-rules'
+], function (WorkspaceListItemView, Templates) {
+
+  return WorkspaceListItemView.extend({
+    className: 'coding-rule',
+    template: Templates['coding-rules-workspace-list-item'],
+
+    modelEvents: {
+      'change': 'render'
+    },
+
+    events: {
+      'click': 'selectCurrent',
+      'click .js-rule': 'openRule'
+    },
+
+    selectCurrent: function () {
+      this.options.app.state.set({ selectedIndex: this.model.get('index') });
+    },
+
+    openRule: function () {
+      this.options.app.controller.showDetails(this.model);
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/coding-rules/workspace-list-view.js b/server/sonar-web/src/main/js/coding-rules/workspace-list-view.js
new file mode 100644
index 00000000000..56d193d7398
--- /dev/null
+++ b/server/sonar-web/src/main/js/coding-rules/workspace-list-view.js
@@ -0,0 +1,49 @@
+define([
+  'components/navigator/workspace-list-view',
+  'coding-rules/workspace-list-item-view',
+  'templates/coding-rules'
+], function (WorkspaceListView, WorkspaceListItemView, Templates) {
+
+  var $ = jQuery;
+
+  return WorkspaceListView.extend({
+    template: Templates['coding-rules-workspace-list'],
+    itemView: WorkspaceListItemView,
+    itemViewContainer: '.js-list',
+
+    events: function () {
+      return {
+        'click .js-tag': 'onTagClick',
+        'click .js-lang': 'onLangClick'
+      };
+    },
+
+    bindShortcuts: function () {
+      WorkspaceListView.prototype.bindShortcuts.apply(this, arguments);
+      var that = this;
+      key('right', 'list', function () {
+        that.options.app.controller.showDetailsForSelected();
+        return false;
+      });
+    },
+
+    onTagClick: function (e) {
+      var tag = $(e.currentTarget).data('tag');
+      this.selectTag(tag);
+    },
+
+    onLangClick: function (e) {
+      var lang = $(e.currentTarget).data('lang');
+      this.selectLang(lang);
+    },
+
+    selectTag: function (tag) {
+      this.options.app.state.setQuery({ tags: tag });
+    },
+
+    selectLang: function (lang) {
+      this.options.app.state.setQuery({ languages: lang });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/controller.js b/server/sonar-web/src/main/js/components/navigator/controller.js
new file mode 100644
index 00000000000..d1ae597ce0a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/controller.js
@@ -0,0 +1,142 @@
+define([
+  'backbone.marionette'
+], function (Marionette) {
+
+  return Marionette.Controller.extend({
+    pageSize: 50,
+    allFacets: [],
+    facetsFromServer: [],
+    transform: {},
+
+    initialize: function (options) {
+      this.app = options.app;
+      this.listenTo(options.app.state, 'change:query', this.fetchList);
+    },
+
+    _allFacets: function () {
+      return this.allFacets.map(function (facet) {
+        return {property: facet};
+      });
+    },
+
+    _enabledFacets: function () {
+      var that = this,
+          facets = this.options.app.state.get('facets'),
+          criteria = Object.keys(this.options.app.state.get('query'));
+      facets = facets.concat(criteria);
+      facets = facets.map(function (facet) {
+        return that.transform[facet] != null ? that.transform[facet] : facet;
+      });
+      return facets.filter(function (facet) {
+        return that.allFacets.indexOf(facet) !== -1;
+      });
+    },
+
+    _facetsFromServer: function () {
+      var that = this,
+          facets = this._enabledFacets();
+      return facets.filter(function (facet) {
+        return that.facetsFromServer.indexOf(facet) !== -1;
+      });
+    },
+
+    fetchList: function () {
+
+    },
+
+    fetchNextPage: function () {
+      this.options.app.state.nextPage();
+      return this.fetchList(false);
+    },
+
+    enableFacet: function (id) {
+      var facet = this.options.app.facets.get(id);
+      if (facet.has('values') || this.facetsFromServer.indexOf(id) === -1) {
+        facet.set({enabled: true});
+      } else {
+        var p = window.process.addBackgroundProcess();
+        this.requestFacet(id)
+            .done(function () {
+              facet.set({enabled: true});
+              window.process.finishBackgroundProcess(p);
+            })
+            .fail(function () {
+              window.process.failBackgroundProcess(p);
+            });
+      }
+    },
+
+    disableFacet: function (id) {
+      var facet = this.options.app.facets.get(id);
+      facet.set({enabled: false});
+      this.options.app.facetsView.children.findByModel(facet).disable();
+    },
+
+    toggleFacet: function (id) {
+      var facet = this.options.app.facets.get(id);
+      if (facet.get('enabled')) {
+        this.disableFacet(id);
+      } else {
+        this.enableFacet(id);
+      }
+    },
+
+    enableFacets: function (facets) {
+      facets.forEach(this.enableFacet, this);
+    },
+
+    newSearch: function () {
+      this.options.app.state.setQuery({});
+    },
+
+    parseQuery: function (query, separator) {
+      separator = separator || '|';
+      var q = {};
+      (query || '').split(separator).forEach(function (t) {
+        var tokens = t.split('=');
+        if (tokens[0] && tokens[1] != null) {
+          q[tokens[0]] = decodeURIComponent(tokens[1]);
+        }
+      });
+      return q;
+    },
+
+    getQuery: function (separator) {
+      separator = separator || '|';
+      var filter = this.options.app.state.get('query'),
+          route = [];
+      _.map(filter, function (value, property) {
+        route.push('' + property + '=' + encodeURIComponent(value));
+      });
+      return route.join(separator);
+    },
+
+    getRoute: function (separator) {
+      separator = separator || '|';
+      return this.getQuery(separator);
+    },
+
+    selectNext: function () {
+      var index = this.options.app.state.get('selectedIndex') + 1;
+      if (index < this.options.app.list.length) {
+        this.options.app.state.set({ selectedIndex: index });
+      } else {
+        if (!this.options.app.state.get('maxResultsReached')) {
+          var that = this;
+          this.fetchNextPage().done(function () {
+            that.options.app.state.set({ selectedIndex: index });
+          });
+        }
+      }
+    },
+
+    selectPrev: function () {
+      var index = this.options.app.state.get('selectedIndex') - 1;
+      if (index >= 0) {
+        this.options.app.state.set({ selectedIndex: index });
+      }
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/facets-view.js b/server/sonar-web/src/main/js/components/navigator/facets-view.js
new file mode 100644
index 00000000000..0d3f9102833
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/facets-view.js
@@ -0,0 +1,37 @@
+define([
+  'backbone.marionette',
+  'components/navigator/facets/base-facet'
+], function (Marionette, BaseFacet) {
+
+  return Marionette.CollectionView.extend({
+    className: 'search-navigator-facets-list',
+
+    itemViewOptions: function () {
+      return {
+        app: this.options.app
+      };
+    },
+
+    getItemView: function () {
+      return BaseFacet;
+    },
+
+    collectionEvents: function () {
+      return {
+        'change:enabled': 'updateState'
+      };
+    },
+
+    updateState: function () {
+      var enabledFacets = this.collection.filter(function (model) {
+            return model.get('enabled');
+          }),
+          enabledFacetIds = enabledFacets.map(function (model) {
+            return model.id;
+          });
+      this.options.app.state.set({facets: enabledFacetIds});
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/facets/base-facet.js b/server/sonar-web/src/main/js/components/navigator/facets/base-facet.js
new file mode 100644
index 00000000000..c2c894ab45a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/facets/base-facet.js
@@ -0,0 +1,76 @@
+define([
+    'backbone.marionette'
+], function (Marionette) {
+
+  var $ = jQuery;
+
+  return Marionette.ItemView.extend({
+    className: 'search-navigator-facet-box',
+
+    modelEvents: function () {
+      return {
+        'change': 'render'
+      };
+    },
+
+    events: function () {
+      return {
+        'click .js-facet-toggle': 'toggle',
+        'click .js-facet': 'toggleFacet'
+      };
+    },
+
+    onRender: function () {
+      this.$el.toggleClass('search-navigator-facet-box-collapsed', !this.model.get('enabled'));
+      var that = this,
+          property = this.model.get('property'),
+          value = this.options.app.state.get('query')[property];
+      if (typeof value === 'string') {
+        value.split(',').forEach(function (s) {
+          var facet = that.$('.js-facet').filter('[data-value="' + s + '"]');
+          if (facet.length > 0) {
+            facet.addClass('active');
+          }
+        });
+      }
+    },
+
+    toggle: function () {
+      this.options.app.controller.toggleFacet(this.model.id);
+    },
+
+    getValue: function () {
+      return this.$('.js-facet.active').map(function () {
+        return $(this).data('value');
+      }).get().join();
+    },
+
+    toggleFacet: function (e) {
+      $(e.currentTarget).toggleClass('active');
+      var property = this.model.get('property'),
+          obj = {};
+      obj[property] = this.getValue();
+      this.options.app.state.updateFilter(obj);
+    },
+
+    disable: function () {
+      var property = this.model.get('property'),
+          obj = {};
+      obj[property] = null;
+      this.options.app.state.updateFilter(obj);
+    },
+
+    sortValues: function (values) {
+      return _.sortBy(values, function (v) {
+        return -v.count;
+      });
+    },
+
+    serializeData: function () {
+      return _.extend(Marionette.ItemView.prototype.serializeData.apply(this, arguments), {
+        values: this.sortValues(this.model.getValues())
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/models/facet.js b/server/sonar-web/src/main/js/components/navigator/models/facet.js
new file mode 100644
index 00000000000..7d15da0507a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/models/facet.js
@@ -0,0 +1,22 @@
+define([
+    'backbone'
+], function (Backbone) {
+
+  return Backbone.Model.extend({
+    idAttribute: 'property',
+
+    defaults: {
+      enabled: false
+    },
+
+    getValues: function () {
+      return this.get('values') || [];
+    },
+
+    toggle: function () {
+      var enabled = this.get('enabled');
+      this.set({ enabled: !enabled });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/models/facets.js b/server/sonar-web/src/main/js/components/navigator/models/facets.js
new file mode 100644
index 00000000000..88929deb8da
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/models/facets.js
@@ -0,0 +1,10 @@
+define([
+  'backbone',
+  'components/navigator/models/facet'
+], function (Backbone, Facet) {
+
+  return Backbone.Collection.extend({
+    model: Facet
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/models/state.js b/server/sonar-web/src/main/js/components/navigator/models/state.js
new file mode 100644
index 00000000000..8a4f2ff669c
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/models/state.js
@@ -0,0 +1,52 @@
+define([
+    'backbone'
+], function (Backbone) {
+
+  return Backbone.Model.extend({
+    defaults: {
+      page: 1,
+      maxResultsReached: false,
+      query: {},
+      facets: []
+    },
+
+    nextPage: function () {
+      var page = this.get('page');
+      this.set({ page: page + 1 });
+    },
+
+    clearQuery: function (query) {
+      var q = {};
+      Object.keys(query).forEach(function (key) {
+        if (query[key]) {
+          q[key] = query[key];
+        }
+      });
+      return q;
+    },
+
+    _areQueriesEqual: function (a, b) {
+      var equal = Object.keys(a).length === Object.keys(b).length;
+      Object.keys(a).forEach(function (key) {
+        equal = equal && a[key] === b[key];
+      });
+      return equal;
+    },
+
+    updateFilter: function (obj) {
+      var oldQuery = this.get('query'),
+          query = _.extend({}, oldQuery, obj);
+      query = this.clearQuery(query);
+      if (!this._areQueriesEqual(oldQuery, query)) {
+        this.setQuery(query);
+      }
+    },
+
+    setQuery: function (query) {
+      this.set({ query: query }, { silent: true });
+      this.set({ changed: true });
+      this.trigger('change:query');
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/router.js b/server/sonar-web/src/main/js/components/navigator/router.js
new file mode 100644
index 00000000000..8792dd519c7
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/router.js
@@ -0,0 +1,29 @@
+define([
+    'backbone'
+], function (Backbone) {
+
+  return Backbone.Router.extend({
+    routeSeparator: '|',
+
+    routes: {
+      '': 'index',
+      ':query': 'index'
+    },
+
+    initialize: function (options) {
+      this.options = options;
+      this.listenTo(this.options.app.state, 'change:query', this.updateRoute);
+    },
+
+    index: function (query) {
+      query = this.options.app.controller.parseQuery(query);
+      this.options.app.state.setQuery(query);
+    },
+
+    updateRoute: function () {
+      var route = this.options.app.controller.getRoute();
+      this.navigate(route);
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/workspace-header-view.js b/server/sonar-web/src/main/js/components/navigator/workspace-header-view.js
new file mode 100644
index 00000000000..aec6efa6284
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/workspace-header-view.js
@@ -0,0 +1,49 @@
+define([
+    'backbone.marionette'
+], function (Marionette) {
+
+  return Marionette.ItemView.extend({
+
+    collectionEvents: function () {
+      return {
+        'all': 'render'
+      };
+    },
+
+    events: function () {
+      return {
+        'click .js-bulk-change': 'bulkChange',
+        'click .js-reload': 'reload',
+        'click .js-next': 'selectNext',
+        'click .js-prev': 'selectPrev'
+      };
+    },
+
+    initialize: function (options) {
+      this.listenTo(options.app.state, 'change', this.render);
+    },
+
+    bulkChange: function () {
+
+    },
+
+    reload: function () {
+      this.options.app.controller.fetchList();
+    },
+
+    selectNext: function () {
+      this.options.app.controller.selectNext();
+    },
+
+    selectPrev: function () {
+      this.options.app.controller.selectPrev();
+    },
+
+    serializeData: function () {
+      return _.extend(Marionette.ItemView.prototype.serializeData.apply(this, arguments), {
+        state: this.options.app.state.toJSON()
+      });
+    }
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/workspace-list-item-view.js b/server/sonar-web/src/main/js/components/navigator/workspace-list-item-view.js
new file mode 100644
index 00000000000..b4bb669303a
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/workspace-list-item-view.js
@@ -0,0 +1,26 @@
+define([
+    'backbone.marionette'
+], function (Marionette) {
+
+  return Marionette.ItemView.extend({
+
+    initialize: function (options) {
+      this.listenTo(options.app.state, 'change:selectedIndex', this.select);
+    },
+
+    onRender: function () {
+      this.select();
+    },
+
+    select: function () {
+      var selected = this.model.get('index') === this.options.app.state.get('selectedIndex');
+      this.$el.toggleClass('selected', selected);
+    },
+
+    selectCurrent: function () {
+      this.options.app.state.set({ selectedIndex: this.model.get('index') });
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/components/navigator/workspace-list-view.js b/server/sonar-web/src/main/js/components/navigator/workspace-list-view.js
new file mode 100644
index 00000000000..2c9ef0def7d
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/navigator/workspace-list-view.js
@@ -0,0 +1,112 @@
+define([
+  'backbone.marionette'
+], function (Marionette) {
+
+  var $ = jQuery;
+
+  return Marionette.CompositeView.extend({
+
+    ui: {
+      loadMore: '.js-more'
+    },
+
+    itemViewOptions: function () {
+      return {
+        app: this.options.app
+      };
+    },
+
+    collectionEvents: {
+      'reset': 'scrollToTop'
+    },
+
+    initialize: function (options) {
+      this.loadMoreThrottled = _.throttle(this.loadMore, 1000, {trailing: false});
+      this.listenTo(options.app.state, 'change:maxResultsReached', this.toggleLoadMore);
+      this.listenTo(options.app.state, 'change:selectedIndex', this.scrollTo);
+      this.bindShortcuts();
+    },
+
+    onClose: function () {
+      this.unbindScrollEvents();
+      this.unbindShortcuts();
+    },
+
+    toggleLoadMore: function () {
+      this.ui.loadMore.toggle(!this.options.app.state.get('maxResultsReached'));
+    },
+
+    bindScrollEvents: function () {
+      var that = this;
+      $(window).on('scroll.workspace-list-view', function () {
+        that.onScroll();
+      });
+    },
+
+    unbindScrollEvents: function () {
+      $(window).off('scroll.workspace-list-view');
+    },
+
+    bindShortcuts: function () {
+      var that = this;
+      key('up', 'list', function () {
+        that.options.app.controller.selectPrev();
+        return false;
+      });
+
+      key('down', 'list', function () {
+        that.options.app.controller.selectNext();
+        return false;
+      });
+    },
+
+    loadMore: function () {
+      if (!this.options.app.state.get('maxResultsReached')) {
+        var that = this;
+        this.unbindScrollEvents();
+        this.options.app.controller.fetchNextPage().done(function () {
+          that.bindScrollEvents();
+        });
+      }
+    },
+
+    disablePointerEvents: function () {
+      clearTimeout(this.scrollTimer);
+      $('body').addClass('disabled-pointer-events');
+      this.scrollTimer = setTimeout(function () {
+        $('body').removeClass('disabled-pointer-events');
+      }, 250);
+    },
+
+    onScroll: function () {
+      this.disablePointerEvents();
+      if ($(window).scrollTop() + $(window).height() >= this.ui.loadMore.offset().top) {
+        this.loadMoreThrottled();
+      }
+    },
+
+    scrollToTop: function () {
+      this.$el.scrollParent().scrollTop(0);
+    },
+
+    scrollTo: function () {
+      var selected = this.collection.at(this.options.app.state.get('selectedIndex'));
+      if (selected == null) {
+        return;
+      }
+      var selectedView = this.children.findByModel(selected),
+          viewTop = selectedView.$el.offset().top,
+          viewBottom = selectedView.$el.offset().top + selectedView.$el.outerHeight(),
+          windowTop = $(window).scrollTop(),
+          windowBottom = windowTop + $(window).height();
+      if (viewTop < windowTop) {
+        $(window).scrollTop(viewTop);
+      }
+      if (viewBottom > windowBottom) {
+        $(window).scrollTop($(window).scrollTop() - windowBottom + viewBottom);
+      }
+    }
+
+  });
+
+});
diff --git a/server/sonar-web/src/main/js/tests/e2e/tests/issues-page-spec.js b/server/sonar-web/src/main/js/tests/e2e/tests/issues-page-spec.js
index 9e764d9e66d..56be033ca94 100644
--- a/server/sonar-web/src/main/js/tests/e2e/tests/issues-page-spec.js
+++ b/server/sonar-web/src/main/js/tests/e2e/tests/issues-page-spec.js
@@ -44,16 +44,16 @@ casper.test.begin(testName('Base'), function (test) {
           test.assertSelectorContains('.issue', '1 more branches need to be covered by unit tests to reach');
 
           // Filters
-          test.assertExists('.js-issues-toggle-filters');
-          test.assertExists('#issues-new-search');
-          test.assertExists('#issues-filter-save-as');
+          test.assertExists('.js-toggle-filters');
+          test.assertExists('.js-new-search');
+          test.assertExists('.js-filter-save-as');
 
           // Workspace header
           test.assertSelectorContains('#issues-total', '4623');
-          test.assertExists('.js-issues-prev');
-          test.assertExists('.js-issues-next');
-          test.assertExists('#issues-reload');
-          test.assertExists('#issues-bulk-change');
+          test.assertExists('.js-prev');
+          test.assertExists('.js-next');
+          test.assertExists('.js-reload');
+          test.assertExists('.js-bulk-change');
         });
       })
 
diff --git a/server/sonar-web/src/main/js/tests/e2e/views/coding-rules.jade b/server/sonar-web/src/main/js/tests/e2e/views/coding-rules.jade
index 32cfa03214d..cfdb7c9c011 100644
--- a/server/sonar-web/src/main/js/tests/e2e/views/coding-rules.jade
+++ b/server/sonar-web/src/main/js/tests/e2e/views/coding-rules.jade
@@ -3,7 +3,7 @@ extends ./layouts/main
 block header
   script(src='../js/require.js')
   script.
-    window.waitForMocks('/js/coding-rules/app.js');
+    window.waitForMocks('/js/coding-rules-old/app.js');
 
 block body
   #content
diff --git a/server/sonar-web/src/main/less/components.less b/server/sonar-web/src/main/less/components.less
index 28333bca7a8..622c74d61df 100644
--- a/server/sonar-web/src/main/less/components.less
+++ b/server/sonar-web/src/main/less/components.less
@@ -4,3 +4,5 @@
 @import "components/modals";
 @import "components/issues";
 @import "components/measures";
+@import "components/rules";
+@import "components/search-navigator";
diff --git a/server/sonar-web/src/main/less/components/rules.less b/server/sonar-web/src/main/less/components/rules.less
new file mode 100644
index 00000000000..affe5c40766
--- /dev/null
+++ b/server/sonar-web/src/main/less/components/rules.less
@@ -0,0 +1,59 @@
+@import (reference) "../variables";
+@import (reference) "../mixins";
+@import (reference) "../ui";
+
+@leftPadding: 10px;
+@rightPadding: 10px;
+@topPadding: 8px;
+@bottomPadding: 8px;
+@lineHeight: @baseFontSize * 1.5;
+
+.coding-rule {
+  padding: @topPadding @rightPadding @bottomPadding @topPadding;
+  border: 1px solid transparent;
+  background-color: #fff;
+
+  &.selected {
+    border-color: @blue !important;
+  }
+}
+
+.coding-rule + .coding-rule {
+  border-top-color: @barBorderColor;
+}
+
+.coding-rule.selected + .coding-rule {
+  border-top-color: transparent;
+}
+
+.coding-rule-inner {
+  .justify;
+  margin-bottom: -16px;
+}
+
+.coding-rule-title {
+  display: inline-block;
+  vertical-align: baseline;
+  line-height: @lineHeight;
+  font-size: @baseFontSize;
+}
+
+.coding-rule-meta {
+  display: inline-block;
+  vertical-align: baseline;
+  line-height: @lineHeight;
+  font-size: @smallFontSize;
+
+  .icon-tags:before {
+    color: @secondFontColor;
+    font-size: @smallFontSize;
+  }
+
+  .js-tag:after {
+    content: ",";
+  }
+
+  .js-tag:last-child:after {
+    content: "";
+  }
+}
diff --git a/server/sonar-web/src/main/less/components/search-navigator.less b/server/sonar-web/src/main/less/components/search-navigator.less
new file mode 100644
index 00000000000..e3ea4d51e1b
--- /dev/null
+++ b/server/sonar-web/src/main/less/components/search-navigator.less
@@ -0,0 +1,324 @@
+@import (reference) "../variables";
+@import (reference) "../mixins";
+@import (reference) "../ui";
+
+@sideWidth: 300px;
+
+.search-navigator {
+
+  &.sticky {
+
+    .search-navigator-workspace-header {
+      position: fixed;
+      z-index: 4;
+      top: 0;
+      left: @sideWidth;
+      right: 0px;
+    }
+
+    .search-navigator-workspace-list {
+      padding-top: 22px + 5px + 5px + 1px + 10px;
+    }
+
+    .search-navigator-side {
+      position: fixed;
+      z-index: 4;
+      top: 0;
+      bottom: 0;
+      overflow-y: auto;
+    }
+
+  }
+}
+
+.search-navigator-side {
+  position: fixed;
+  z-index: 100;
+  width: @sideWidth;
+  top: 30px; left: 0; bottom: 0;
+  .box-sizing(border-box);
+  background-color: @barBorderColor;
+  overflow-x: hidden;
+}
+
+.search-navigator-facet-box {
+  border-top: 1px solid @barBorderColor;
+  background-color: @barBackgroundColor;
+  font-size: @baseFontSize;
+}
+
+.search-navigator-facet-box-collapsed {
+  background-color: transparent;
+
+  .search-navigator-facet-list,
+  .search-navigator-facet-container {
+    display: none;
+  }
+
+  .search-navigator-facet-header {
+    color: @secondFontColor;
+    font-weight: 400;
+
+    &:hover { color: @blue; }
+  }
+}
+
+.search-navigator-facet {
+  position: relative;
+  width: 100%;
+  margin: 0 0 1px 0;
+  border-color: transparent;
+  .box-sizing(border-box);
+  background-color: @barBackgroundColor;
+  white-space: normal;
+  overflow-x: hidden;
+
+  .facet-name {
+    white-space: nowrap;
+    background-color: @barBackgroundColor;
+    color: @baseFontColor;
+  }
+
+  .facet-stat {
+    position: absolute;
+    top: 0; right: 0;
+    padding: 4px 5px;
+    border: none;
+    background-color: @barBackgroundColor;
+
+    &:before {
+      content: " ";
+      position: absolute;
+      top: 0; bottom: 0; right: 100%;
+      width: 10px;
+      background-image: linear-gradient(to right, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
+    }
+  }
+
+  &.active .facet-stat:before {
+    background-image: linear-gradient(to right, fade(@lightBlue, 0%), @lightBlue 75%);
+  }
+}
+
+.search-navigator-facet-half {
+  width: 45%;
+
+  &:nth-child(odd) {
+    margin-right: 10%;
+  }
+}
+
+.search-navigator-facet-header {
+  display: block;
+  padding: 6px 10px;
+  border-bottom: none;
+  color: @baseFontColor;
+  font-weight: 500;
+}
+
+.search-navigator-facet-list {
+  margin: 0 0 0 0;
+  padding: 0 10px 10px;
+  font-size: 0;
+}
+
+.search-navigator-facet-list-align-right {
+
+  .facet-name {
+    float: right;
+
+    &:before {
+      content: " ";
+      position: absolute;
+      top: 0; bottom: 0; left: 0;
+      width: 10px;
+      background-image: linear-gradient(to left, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
+    }
+  }
+
+  .facet-stat:before {
+    display: none;
+  }
+
+  .facet.active .facet-name:before {
+    background-image: linear-gradient(to left, fade(@lightBlue, 0%), @lightBlue 75%);
+  }
+
+}
+
+.search-navigator-facet-container {
+  margin-top: 6px;
+  padding: 0 10px 16px;
+}
+
+.search-navigator-facet-custom-value {
+  padding: 0 0 5px;
+  font-size: @baseFontSize;
+}
+
+.search-navigator-facet-input {
+  width: @sideWidth * 0.4;
+}
+
+.search-navigator-filters {
+  position: relative;
+  .clearfix;
+  padding: 5px 10px;
+  background-color: @barBackgroundColor;
+}
+
+.search-navigator-filters-selected {
+  margin-bottom: 5px;
+
+  .search-navigator-filters-header {
+    float: none;
+  }
+
+  .search-navigator-filters-actions {
+    float: none;
+    margin-top: 5px;
+  }
+}
+
+.search-navigator-filters-list {
+  display: none;
+  position: absolute;
+  z-index: 6;
+  top: 31px;
+  left: 0;
+  right: 10px;
+  margin-bottom: 8px;
+  padding: 5px 10px;
+  border: 1px solid #e8e8e8;
+  .box-sizing(border-box);
+  line-height: 1.5;
+  background-color: #fff;
+  box-shadow: @defaultShadow;
+}
+
+.search-navigator-filters-filter {
+
+}
+
+.search-navigator-filters-header {
+  float: left;
+  line-height: 22px;
+}
+
+.search-navigator-filters-name {
+  vertical-align: top;
+  font-size: @bigFontSize;
+}
+
+.search-navigator-filters-description {
+  margin: 4px 0;
+  font-size: @smallFontSize;
+  font-style: italic;
+}
+
+.search-navigator-filters-show-list {
+  margin-right: 4px;
+  border-bottom: none;
+  color: @baseFontColor;
+  font-size: @iconSmallFontSize;
+}
+
+.search-navigator-filters-actions {
+  float: right;
+}
+
+.search-navigator-filters-manage {
+  display: inline-block;
+  margin-top: 4px;
+  border-bottom: none;
+}
+
+.search-navigator-workspace {
+  padding-left: @sideWidth;
+}
+
+.search-navigator-workspace-header {
+  position: relative;
+  margin-bottom: 10px;
+  padding: 5px 0;
+  line-height: 22px;
+  border-bottom: 1px solid @barBorderColor;
+  background-color: @barBackgroundColor;
+  font-size: @smallFontSize;
+
+  .button-group,
+  .button-group > button,
+  .button-group > .button {
+    vertical-align: top;
+  }
+}
+
+.search-navigator-header-component {
+  margin-left: 10px;
+  white-space: nowrap;
+}
+
+.search-navigator-header-actions {
+  position: absolute;
+  top: 0;
+  right: 0;
+  padding: 5px 10px;
+  background-color: @barBackgroundColor;
+  font-size: 0;
+  white-space: nowrap;
+
+  &:before {
+    content: " ";
+    position: absolute;
+    top: 0; bottom: 0; right: 100%;
+    width: 10px;
+    background-image: linear-gradient(to right, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
+  }
+}
+
+.search-navigator-header-pagination {
+  display: inline-block;
+  vertical-align: top;
+  margin-right: 20px;
+  font-size: @smallFontSize;
+}
+
+.search-navigator-header-buttons {
+  vertical-align: top;
+}
+
+.search-navigator-workspace-list {
+  padding: 0 5px;
+
+  .issue {
+    max-width: none;
+  }
+}
+
+.search-navigator-workspace-details {
+  display: none;
+  padding: 0 10px;
+}
+
+.search-navigator-workspace-list-more {
+  margin-top: 10px;
+  padding: 5px 10px;
+  text-align: center;
+}
+
+.search-navigator-no-results {
+  padding-top: 10%;
+  color: @secondFontColor;
+  text-align: center;
+}
+
+.search-navigator-extended-view {
+
+  .search-navigator-workspace-list {
+    display: none;
+  }
+
+  .search-navigator-workspace-details {
+    display: block;
+  }
+}
diff --git a/server/sonar-web/src/main/less/issues.less b/server/sonar-web/src/main/less/issues.less
index 2948a304938..1bb3b601012 100644
--- a/server/sonar-web/src/main/less/issues.less
+++ b/server/sonar-web/src/main/less/issues.less
@@ -9,301 +9,14 @@
 
   &.sticky {
 
-    .issues-workspace-header {
-      position: fixed;
-      z-index: 4;
-      top: 0;
-      left: @sideWidth;
-      right: 0px;
-    }
-
     .issues-workspace-list,
     .issues-workspace-component-viewer {
       padding-top: 22px + 5px + 5px + 1px + 10px;
     }
 
-    .issues-side {
-      position: fixed;
-      z-index: 4;
-      top: 0;
-      bottom: 0;
-      overflow-y: auto;
-    }
-
-  }
-}
-
-.issues-side {
-  position: fixed;
-  z-index: 100;
-  width: @sideWidth;
-  top: 30px; left: 0; bottom: 0;
-  .box-sizing(border-box);
-  background-color: @barBorderColor;
-  overflow-x: hidden;
-}
-
-.issues-facet-box {
-  border-top: 1px solid @barBorderColor;
-  background-color: @barBackgroundColor;
-  font-size: @baseFontSize;
-}
-
-.issues-facet-box-collapsed {
-  background-color: transparent;
-
-  .issues-facet-list,
-  .issues-facet-container {
-    display: none;
-  }
-
-  .issues-facet-header {
-    color: @secondFontColor;
-    font-weight: 400;
-
-    &:hover { color: @blue; }
-  }
-}
-
-.issues-facet {
-  position: relative;
-  width: 100%;
-  margin: 0 0 1px 0;
-  border-color: transparent;
-  .box-sizing(border-box);
-  background-color: @barBackgroundColor;
-  white-space: normal;
-  overflow-x: hidden;
-
-  .facet-name {
-    white-space: nowrap;
-    background-color: @barBackgroundColor;
-    color: @baseFontColor;
-  }
-
-  .facet-stat {
-    position: absolute;
-    top: 0; right: 0;
-    padding: 4px 5px;
-    border: none;
-    background-color: @barBackgroundColor;
-
-    &:before {
-      content: " ";
-      position: absolute;
-      top: 0; bottom: 0; right: 100%;
-      width: 10px;
-      background-image: linear-gradient(to right, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
-    }
-  }
-
-  &.active .facet-stat:before {
-    background-image: linear-gradient(to right, fade(@lightBlue, 0%), @lightBlue 75%);
   }
 }
 
-.issues-facet-half {
-  width: 45%;
-
-  &:nth-child(odd) {
-    margin-right: 10%;
-  }
-}
-
-.issues-facet-header {
-  display: block;
-  padding: 6px 10px;
-  border-bottom: none;
-  color: @baseFontColor;
-  font-weight: 500;
-}
-
-.issues-facet-list {
-  margin: 0 0 0 0;
-  padding: 0 10px 10px;
-  font-size: 0;
-}
-
-.issues-facet-list-align-right {
-
-  .facet-name {
-    float: right;
-
-    &:before {
-      content: " ";
-      position: absolute;
-      top: 0; bottom: 0; left: 0;
-      width: 10px;
-      background-image: linear-gradient(to left, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
-    }
-  }
-
-  .facet-stat:before {
-    display: none;
-  }
-
-  .facet.active .facet-name:before {
-    background-image: linear-gradient(to left, fade(@lightBlue, 0%), @lightBlue 75%);
-  }
-
-}
-
-.issues-facet-container {
-  margin-top: 6px;
-  padding: 0 10px 16px;
-}
-
-.issues-facet-custom-value {
-  padding: 0 0 5px;
-  font-size: @baseFontSize;
-}
-
-.issues-facet-input {
-  width: @sideWidth * 0.4;
-//  .box-sizing(border-box);
-}
-
-.issues-filters {
-  position: relative;
-  .clearfix;
-  padding: 5px 10px;
-  background-color: @barBackgroundColor;
-}
-
-.issues-filters-selected {
-  margin-bottom: 5px;
-
-  .issues-filters-header {
-    float: none;
-  }
-
-  .issues-filters-actions {
-    float: none;
-    margin-top: 5px;
-  }
-}
-
-.issues-filters-list {
-  display: none;
-  position: absolute;
-  z-index: 6;
-  top: 31px;
-  left: 0;
-  right: 10px;
-  margin-bottom: 8px;
-  padding: 5px 10px;
-  border: 1px solid #e8e8e8;
-  .box-sizing(border-box);
-  line-height: 1.5;
-  background-color: #fff;
-  box-shadow: @defaultShadow;
-}
-
-.issues-filters-filter {
-
-}
-
-.issues-filters-header {
-  float: left;
-  line-height: 22px;
-}
-
-.issues-filters-name {
-  vertical-align: top;
-  font-size: @bigFontSize;
-}
-
-.issues-filters-description {
-  margin: 4px 0;
-  font-size: @smallFontSize;
-  font-style: italic;
-}
-
-.issues-filters-show-list {
-  margin-right: 4px;
-  border-bottom: none;
-  color: @baseFontColor;
-  font-size: @iconSmallFontSize;
-}
-
-.issues-filters-actions {
-  float: right;
-}
-
-.issues-filters-manage {
-  display: inline-block;
-  margin-top: 4px;
-  border-bottom: none;
-}
-
-.issues-workspace {
-  padding-left: @sideWidth;
-}
-
-.issues-header {
-  position: relative;
-  margin-bottom: 10px;
-  padding: 5px 0;
-  line-height: 22px;
-  border-bottom: 1px solid @barBorderColor;
-  background-color: @barBackgroundColor;
-  font-size: @smallFontSize;
-
-  .button-group,
-  .button-group > button,
-  .button-group > .button {
-    vertical-align: top;
-  }
-}
-
-.issues-header-component {
-  margin-left: 10px;
-  white-space: nowrap;
-}
-
-.issues-header-actions {
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: 5px 10px;
-  background-color: @barBackgroundColor;
-  font-size: 0;
-  white-space: nowrap;
-
-  &:before {
-    content: " ";
-    position: absolute;
-    top: 0; bottom: 0; right: 100%;
-    width: 10px;
-    background-image: linear-gradient(to right, fade(@barBackgroundColor, 0%), @barBackgroundColor 75%);
-  }
-}
-
-.issues-header-pagination {
-  display: inline-block;
-  vertical-align: top;
-  margin-right: 20px;
-  font-size: @smallFontSize;
-}
-
-.issues-header-buttons {
-  vertical-align: top;
-}
-
-.issues-workspace-list {
-  padding: 0 5px;
-
-  .issue {
-    max-width: none;
-  }
-}
-
-.issues-workspace-list-more {
-  margin-top: 10px;
-  padding: 5px 10px;
-  text-align: center;
-}
-
 .issues-workspace-list-component {
   line-height: 1.5;
 }
@@ -344,7 +57,7 @@
 
 .issues-extended-view {
 
-  .issues-workspace-list {
+  .search-navigator-workspace-list {
     display: none;
   }
 
@@ -378,12 +91,6 @@
 
 }
 
-.issues-no-results {
-  padding-top: 10%;
-  color: @secondFontColor;
-  text-align: center;
-}
-
 .code-issue-modern {
   outline: 1px solid @barBorderColor;
   border-left: 2px solid transparent;
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/coding_rules_old_controller.rb b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/coding_rules_old_controller.rb
new file mode 100644
index 00000000000..3011a79b876
--- /dev/null
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/coding_rules_old_controller.rb
@@ -0,0 +1,30 @@
+#
+# SonarQube, open source software quality management tool.
+# Copyright (C) 2008-2014 SonarSource
+# mailto:contact AT sonarsource DOT com
+#
+# SonarQube is free software; you can redistribute it and/or
+# modify it under the terms of the GNU Lesser General Public
+# License as published by the Free Software Foundation; either
+# version 3 of the License, or (at your option) any later version.
+#
+# SonarQube is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+# Lesser General Public License for more details.
+#
+# You should have received a copy of the GNU Lesser General Public License
+# along with this program; if not, write to the Free Software Foundation,
+# Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+#
+
+class CodingRulesOldController < ApplicationController
+
+  SECTION=Navigation::SECTION_CODING_RULES_OLD
+
+  # GET /coding_rules_old/index
+  def index
+
+  end
+
+end
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/models/navigation.rb b/server/sonar-web/src/main/webapp/WEB-INF/app/models/navigation.rb
index 4b690d90178..fbe166a9cbb 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/models/navigation.rb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/models/navigation.rb
@@ -36,4 +36,5 @@ class Navigation
   SECTION_QUALITY_PROFILES = Navigation.new('quality_profiles', false)
   SECTION_QUALITY_GATES = Navigation.new('quality_gates', false)
   SECTION_CODING_RULES = Navigation.new('coding_rules', false)
+  SECTION_CODING_RULES_OLD = Navigation.new('coding_rules_old', false)
 end
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules/index.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules/index.html.erb
index 0d190ef7d3c..3d13e30672a 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules/index.html.erb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules/index.html.erb
@@ -3,6 +3,4 @@
 <% end %>
 
 
-<div id="coding-rules-page-loader" class="navigator-page-loader">
-  <i class="spinner"></i>
-</div>
+<div class="coding-rules search-navigator"></div>
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules_old/index.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules_old/index.html.erb
new file mode 100644
index 00000000000..116f5fa0125
--- /dev/null
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/coding_rules_old/index.html.erb
@@ -0,0 +1,8 @@
+<% content_for :script do %>
+  <script data-main="<%= ApplicationController.root_context -%>/js/coding-rules-old/app" src="<%= ApplicationController.root_context -%>/js/require.js"></script>
+<% end %>
+
+
+<div id="coding-rules-page-loader" class="navigator-page-loader">
+  <i class="spinner"></i>
+</div>
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/issues/search.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
index 3643c208073..5d8052da4dd 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/issues/search.html.erb
@@ -2,4 +2,4 @@
   <script data-main="<%= ApplicationController.root_context -%>/js/issues/app" src="<%= ApplicationController.root_context -%>/js/require.js"></script>
 <% end %>
 
-<div class="issues"></div>
+<div class="issues search-navigator"></div>
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/layouts/_layout.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/layouts/_layout.html.erb
index fd4844050c6..e52d7018a19 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/views/layouts/_layout.html.erb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/layouts/_layout.html.erb
@@ -22,7 +22,10 @@
           <a href="<%= ApplicationController.root_context -%>/issues/index" class="<%= 'selected' if selected_section==Navigation::SECTION_ISSUES -%>"><%= message('issues.page') -%></a>
         </li>
         <li>
-          <a href="<%= ApplicationController.root_context -%>/coding_rules" class="<%= 'selected' if selected_section==Navigation::SECTION_CODING_RULES -%>"><%= message('coding_rules.page') -%></a>
+          <a href="<%= ApplicationController.root_context -%>/coding_rules" class="<%= 'selected' if selected_section==Navigation::SECTION_CODING_RULES -%>">NEW <%= message('coding_rules.page') -%></a>
+        </li>
+        <li>
+            <a href="<%= ApplicationController.root_context -%>/coding_rules_old" class="<%= 'selected' if selected_section==Navigation::SECTION_CODING_RULES_OLD -%>"><%= message('coding_rules.page') -%></a>
         </li>
         <li>
           <a href="<%= ApplicationController.root_context -%>/profiles" class="<%= 'selected' if selected_section==Navigation::SECTION_QUALITY_PROFILES -%>"><%= message('quality_profiles.page') -%></a>