SONAR-4407 Refactor the libraries page in order to drop GWT

List the component's libraries

9 files changed, 237 insertions, 2 deletions

diff --git a/server/sonar-web/Gruntfile.coffee b/server/sonar-web/Gruntfile.coffee
index 6221292a235..88e35c0930a 100644
--- a/server/sonar-web/Gruntfile.coffee
+++ b/server/sonar-web/Gruntfile.coffee
@@ -202,6 +202,10 @@ module.exports = (grunt) ->
         name: 'design/app'
         out: '<%= pkg.assets %>build/js/design/app.js'
 
+      libraries: options:
+        name: 'libraries/app'
+        out: '<%= pkg.assets %>build/js/libraries/app.js'
+
 
     handlebars:
       options:
@@ -244,6 +248,9 @@ module.exports = (grunt) ->
           '<%= pkg.assets %>js/templates/design.js': [
             '<%= pkg.sources %>hbs/design/**/*.hbs'
           ]
+          '<%= pkg.assets %>js/templates/libraries.js': [
+            '<%= pkg.sources %>hbs/libraries/**/*.hbs'
+          ]
 
 
     clean:
diff --git a/server/sonar-web/src/main/coffee/libraries/app.coffee b/server/sonar-web/src/main/coffee/libraries/app.coffee
new file mode 100644
index 00000000000..ee5e8c5d39a
--- /dev/null
+++ b/server/sonar-web/src/main/coffee/libraries/app.coffee
@@ -0,0 +1,51 @@
+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'
+  'libraries/view'
+  'common/handlebars-extensions'
+], (
+  Backbone, Marionette
+  LibrariesView
+) ->
+
+  $ = jQuery
+  RESOURCES_URL = "#{baseUrl}/api/resources"
+  DEPENDENCY_TREE_URL = "#{baseUrl}/api/dependency_tree"
+  App = new Marionette.Application
+
+
+  App.addInitializer ->
+    $.get RESOURCES_URL, resource: window.resourceKey, scopes: 'PRJ', depth: -1, (rawData) ->
+      components = new Backbone.Collection rawData
+      requests = components.map (component) ->
+        id = component.get 'id'
+        $.get DEPENDENCY_TREE_URL, resource: id, scopes: 'PRJ', (data) ->
+          component.set 'libraries', data
+
+      $.when.apply($, requests).done =>
+        @view = new LibrariesView app: @, collection: components
+        $('#project-libraries').empty().append @view.render().el
+
+
+  # Message bundles
+  l10nXHR = window.requestMessages()
+
+
+  jQuery.when(l10nXHR).done -> App.start()
diff --git a/server/sonar-web/src/main/coffee/libraries/view.coffee b/server/sonar-web/src/main/coffee/libraries/view.coffee
new file mode 100644
index 00000000000..f135af43f5d
--- /dev/null
+++ b/server/sonar-web/src/main/coffee/libraries/view.coffee
@@ -0,0 +1,14 @@
+define [
+  'backbone.marionette'
+  'templates/libraries'
+], (
+  Marionette,
+  Templates
+) ->
+
+  $ = jQuery
+
+
+
+  class extends Marionette.ItemView
+    template: Templates['libraries']
diff --git a/server/sonar-web/src/main/hbs/libraries/libraries.hbs b/server/sonar-web/src/main/hbs/libraries/libraries.hbs
new file mode 100644
index 00000000000..e97a22cf7f9
--- /dev/null
+++ b/server/sonar-web/src/main/hbs/libraries/libraries.hbs
@@ -0,0 +1,43 @@
+<div class="libraries-header">
+  <div class="libraries-header-filter">
+    <input type="text">
+    <button>Filter</button>
+  </div>
+
+  <div class="libraries-header-test">
+    <input type="checkbox" id="display-test-libraries">
+    <label for="display-test-libraries">Display test libraries</label>
+  </div>
+
+  <div class="libraries-header-actions">
+    <a>Collapse All</a>
+    <a>Expand All</a>
+    <a href="#">Usages</a>
+  </div>
+</div>
+
+<div class="libraries-tree">
+  <ul>
+    {{#each items}}
+      <li>
+        {{qualifierIcon qualifier}}
+        <span class="libraries-tree-name">{{lname}}</span>
+        <ul>
+          {{#recursive libraries}}
+            <li>
+              <i class="icon-dropdown" style="{{#unless to}}visibility: hidden;{{/unless}}"></i>&nbsp;
+              {{qualifierIcon q}}
+              <span class="libraries-tree-name">{{n}}</span>
+              {{#if u}}
+                <span class="subtitle">({{u}})</span>
+              {{/if}}
+              {{#if to}}
+                <ul>{{{recursive to}}}</ul>
+              {{/if}}
+            </li>
+          {{/recursive}}
+        </ul>
+      </li>
+    {{/each}}
+  </ul>
+</div>
diff --git a/server/sonar-web/src/main/js/common/handlebars-extensions.js b/server/sonar-web/src/main/js/common/handlebars-extensions.js
index 36efca0ffd3..1d3d78bec50 100644
--- a/server/sonar-web/src/main/js/common/handlebars-extensions.js
+++ b/server/sonar-web/src/main/js/common/handlebars-extensions.js
@@ -21,8 +21,9 @@ define(['handlebars'], function (Handlebars) {
 
   var defaultActions = ['comment', 'assign', 'assign_to_me', 'plan', 'set_severity'];
 
-  Handlebars.registerHelper('log', function(variable) {
-    console.log(variable);
+  Handlebars.registerHelper('log', function() {
+    var args = Array.prototype.slice.call(arguments, 0, -1);
+    console.log.apply(console, args);
   });
 
   Handlebars.registerHelper('capitalize', function(string) {
@@ -265,6 +266,21 @@ define(['handlebars'], function (Handlebars) {
     }
   });
 
+  var audaciousFn;
+  Handlebars.registerHelper('recursive', function(children, options) {
+    var out = '';
+
+    if (options.fn !== undefined) {
+      audaciousFn = options.fn;
+    }
+
+    children.forEach(function(child){
+      out = out + audaciousFn(child);
+    });
+
+    return out;
+  });
+
   Handlebars.registerHelper('sources', function(source, scm, options) {
     if (options == null) {
       options = scm;
diff --git a/server/sonar-web/src/main/less/libraries.less b/server/sonar-web/src/main/less/libraries.less
new file mode 100644
index 00000000000..1ed8917f6d3
--- /dev/null
+++ b/server/sonar-web/src/main/less/libraries.less
@@ -0,0 +1,52 @@
+@import (reference) "variables";
+@import (reference) "mixins";
+
+
+.libraries-header {
+  margin-bottom: 20px;
+  font-size: 0;
+}
+
+.libraries-header-filter,
+.libraries-header-test,
+.libraries-header-actions {
+  display: inline-block;
+  vertical-align: middle;
+  font-size: @baseFontSize;
+}
+
+.libraries-header-test,
+.libraries-header-actions {
+  margin-left: 30px;
+}
+
+
+.libraries-tree {
+
+  & > ul ul {
+    padding-left: 24px;
+  }
+
+  & > ul ul ul {
+    margin-left: 3px;
+    padding-left: 20px;
+    border-left: 1px dashed #ddd;
+  }
+
+  & > ul > li + li {
+    margin-top: 15px;
+  }
+
+  & > ul > li > .libraries-tree-name {
+    font-weight: 500;
+  }
+
+  li {
+    padding: 3px 0;
+  }
+
+  li:last-child {
+    padding-bottom: 0;
+  }
+
+}
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/libraries_controller.rb b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/libraries_controller.rb
new file mode 100644
index 00000000000..68f2fd9a066
--- /dev/null
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/libraries_controller.rb
@@ -0,0 +1,38 @@
+#
+# 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 LibrariesController < ApplicationController
+
+  SECTION=Navigation::SECTION_RESOURCE
+  before_filter :load_resource
+
+  def index
+
+  end
+
+
+  private
+
+  def load_resource
+    @resource=Project.by_key(params[:id])
+    return redirect_to(home_path) unless @resource
+    @snapshot=@resource.last_snapshot
+  end
+
+end
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 f200186bcb2..0bb0f9e1ae3 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
@@ -108,6 +108,9 @@
               <li class="<%= 'active' if request.request_uri.include?('/design/index') -%>">
                 <a href="<%= ApplicationController.root_context -%>/design/index/<%= @project.key -%>">Design (NEW)</a>
               </li>
+              <li class="<%= 'active' if request.request_uri.include?('/libraries/index') -%>">
+                <a href="<%= ApplicationController.root_context -%>/libraries/index/<%= @project.key -%>">Libraries (NEW)</a>
+              </li>
               <% if controller.java_facade.getResourceTypeBooleanProperty(@project.qualifier, 'comparable') %>
               <li class="<%= 'active' if request.request_uri.include?('/comparison/index') -%>">
                 <a href="<%= ApplicationController.root_context -%>/comparison/index?resource=<%= @project.key -%>"><%= message('comparison.page') -%></a>
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/libraries/index.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/libraries/index.html.erb
new file mode 100644
index 00000000000..6c1608bc39a
--- /dev/null
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/libraries/index.html.erb
@@ -0,0 +1,11 @@
+<% content_for :script do %>
+  <script data-main="<%= ApplicationController.root_context -%>/js/libraries/app" src="<%= ApplicationController.root_context -%>/js/require.js"></script>
+  <script>
+    window.resourceKey = '<%= @resource.key -%>';
+  </script>
+<% end %>
+
+
+<div id="project-libraries">
+  <i class="spinner"></i>
+</div>