SONAR-4095 Refactoring of the resource viewer in order to use accordion navigation

26 files changed, 508 insertions, 430 deletions

diff --git a/plugins/sonar-core-plugin/src/main/resources/org/sonar/plugins/core/web/tests_viewer.html.erb b/plugins/sonar-core-plugin/src/main/resources/org/sonar/plugins/core/web/tests_viewer.html.erb
index db5484695cc..122fd22b7cc 100644
--- a/plugins/sonar-core-plugin/src/main/resources/org/sonar/plugins/core/web/tests_viewer.html.erb
+++ b/plugins/sonar-core-plugin/src/main/resources/org/sonar/plugins/core/web/tests_viewer.html.erb
@@ -1,8 +1,8 @@
-<div class="tab_header tests_viewer" id="tests_header">
+<div class="tab_header tests_viewer tests_header">
   <table>
     <tr>
       <% test_success_density = measure('test_success_density') %>
-      <td id="test_success_density" class="big"><%= test_success_density ? number_with_precision(test_success_density.value(), :precision => 1) : "100.0" -%>%</td>
+      <td class="test_success_density big"><%= test_success_density ? number_with_precision(test_success_density.value(), :precision => 1) : "100.0" -%>%</td>
       <td class="sep"></td>
       <td class="name"><%= message('test_viewer.tests') -%>:</td>
       <%
@@ -13,18 +13,18 @@
            tests_display = tests_display + " (+" + format_measure(skipped_tests) + " " + message('test_viewer.skipped') + ")"
          end
       %>
-      <td id="tests" class="value"><%= tests_display -%></td>
+      <td class="tests value"><%= tests_display -%></td>
       <td class="sep"></td>
       <td class="name"><%= message('test_viewer.failures') -%>/<%= message('test_viewer.errors') -%>:</td>
       <%
          test_failures = measure('test_failures') ? format_measure(measure('test_failures')) : "0"
          test_errors = measure('test_errors') ? format_measure(measure('test_errors')) : "0"
       %>
-      <td id="test_failures_errors" class="value"><%= test_failures -%>/<%= test_errors -%></td>
+      <td class="test_failures_errors value"><%= test_failures -%>/<%= test_errors -%></td>
       <td class="sep"></td>
       <td class="name"><%= message('test_viewer.duration') -%>:</td>
       <% test_execution_time = measure('test_execution_time') %>
-      <td id="test_execution_time" class="value"><%= test_execution_time ? format_measure(test_execution_time) : "-" -%></td>
+      <td class="test_execution_time value"><%= test_execution_time ? format_measure(test_execution_time) : "-" -%></td>
     </tr>
   </table>
 </div>
@@ -73,7 +73,7 @@
    test_cases = test_cases.sort_by { |test_case| test_case[:name] }
 %>
 <% if !test_cases.empty? %>
-  <table class="data width100 tests_viewer" id="test_data">
+  <table class="data width100 tests_viewer test_data">
     <thead>
     <tr>
       <th class="thin">&nbsp;</th>
@@ -112,24 +112,24 @@
         <td id="test_time_<%= index -%>" class="thin right" nowrap><%= test_case[:time] -%> ms</td>
         <% if has_covered_lines %>
           <td id="test_covered_lines_<%= index -%>" class="thin right" nowrap>
-            <a id="test_covered_lines_link_<%= index -%>" href="#"
-               onclick="openTestWorkingView('<%= @snapshot.id -%>', '<%= test_case[:name] -%>', 'testcase');"><%= number_with_precision(test_case[:covered_lines], :precision => 0) -%>
+            <a class="test_covered_lines_link_<%= index -%>" href="<%= ApplicationController.root_context -%>/test/testcase/?sid=<%= @snapshot.id -%>&test=<%= test_case[:name] -%>"
+               onclick="openAccordionItem(this.href, this); return false;"><%= number_with_precision(test_case[:covered_lines], :precision => 0) -%>
             </a>
           </td>
         <% end %>
         <td>
-        <span id="test_name_<%= index -%>">
+        <span class="test_name_<%= index -%>">
           <% name = test_case[:name] %>
           <% if test_case[:message] %>
-            <a id="test_expandLink_<%= index -%>" href="#" onclick="expandTests(<%= index -%>);"><%= name -%></a>
-            <a id="test_collapseLink_<%= index -%>" class="collapse" href="#" onclick="collapseTests(<%= index -%>);" style="display: none;"><%= name -%></a>
+            <a class="test_expandLink_<%= index -%>" href="#" onclick="expandTests(<%= index -%>);"><%= name -%></a>
+            <a class="test_collapseLink_<%= index -%>" class="collapse" href="#" onclick="collapseTests(<%= index -%>);" style="display: none;"><%= name -%></a>
           <% else %>
             <%= name -%>
           <% end %>
         </span>
 
           <% if test_case[:message] %>
-            <div id="test_message_<%= index -%>" class="message" style="display:none; margin-top:5px;">
+            <div class="test_message_<%= index -%>" class="message" style="display:none; margin-top:5px;">
               <% message = test_case[:message] %>
               <% if !message.nil? %>
                 <span><%= h message -%></span>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/controllers/resource_controller.rb b/sonar-server/src/main/webapp/WEB-INF/app/controllers/resource_controller.rb
index cd0fed3d6b7..cd18218585d 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/controllers/resource_controller.rb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/controllers/resource_controller.rb
@@ -30,34 +30,42 @@ class ResourceController < ApplicationController
   verify :method => :post, :only => [:create_violation]
 
   def index
-    @resource = Project.by_key(params[:id])
-    not_found("Resource not found") unless @resource
-    @resource=@resource.permanent_resource
-    access_denied unless has_role?(:user, @resource)
-
-    params[:layout]='false'
-    @snapshot=@resource.last_snapshot
-
-    if @snapshot
-      load_extensions()
-
-      if @extension
-        if @extension.getId()=='violations'
-          render_violations()
-        elsif (@extension.getId()=='coverage')
-          render_coverage()
-        elsif (@extension.getId()=='source')
-          render_source()
-        elsif (@extension.getId()=='duplications')
-          render_duplications()
+    if request.xhr?
+      @resource = Project.by_key(params[:id])
+      not_found("Resource not found") unless @resource
+      @resource=@resource.permanent_resource
+      access_denied unless has_role?(:user, @resource)
+
+      @snapshot=@resource.last_snapshot
+
+      if @snapshot
+        load_extensions()
+
+        if @extension
+          if @extension.getId()=='violations'
+            render_violations()
+            render_partial_index()
+          elsif (@extension.getId()=='coverage')
+            render_coverage()
+            render_partial_index()
+          elsif (@extension.getId()=='source')
+            render_source()
+            render_partial_index()
+          elsif (@extension.getId()=='duplications')
+            render_duplications()
+            render_partial_index()
+          else
+            render_extension()
+          end
         else
-          render_extension()
+          render_nothing()
         end
       else
-        render_nothing()
+        render_resource_deleted()
       end
     else
-      render_resource_deleted()
+      params[:layout] = 'false'
+      render :action => 'index'
     end
   end
 
@@ -114,6 +122,10 @@ class ResourceController < ApplicationController
 
   private
 
+  def render_partial_index
+    render :partial => 'index'
+  end
+
   def load_extensions
     @extensions=[]
     java_facade.getResourceTabs(@resource.scope, @resource.qualifier, @resource.language, @snapshot.metric_keys.to_java(:string)).each do |tab|
@@ -268,8 +280,6 @@ class ResourceController < ApplicationController
         end
       end
     end
-
-    render :action => 'index', :layout => !request.xhr?
   end
 
   def render_duplications
@@ -313,8 +323,6 @@ class ResourceController < ApplicationController
       end
     end
     @duplication_groups.sort! { |group1, group2| group1[0][:from_line].to_i <=> group2[0][:from_line].to_i }
-
-    render :action => 'index', :layout => !request.xhr?
   end
 
   def parse_duplications(dups, duplication_groups)
@@ -415,14 +423,12 @@ class ResourceController < ApplicationController
     if current_user && has_role?(:user, @resource)
       @review_screens_by_vid = RuleFailure.available_java_screens_for_violations(violations, @resource, current_user)
     end
-    render :action => 'index', :layout => !request.xhr?
   end
 
 
   def render_source
     load_sources()
     filter_lines_by_date()
-    render :action => 'index', :layout => !request.xhr?
   end
 
 
@@ -533,15 +539,15 @@ class ResourceController < ApplicationController
   end
 
   def render_extension()
-    render :action => 'extension', :layout => !request.xhr?
+    render :partial => 'extension'
   end
 
   def render_nothing()
-    render :action => 'nothing', :layout => !request.xhr?
+    render :partial => 'nothing'
   end
 
   def render_resource_deleted()
-    render :action => 'resource_deleted', :layout => !request.xhr?
+    render :partial => 'resource_deleted'
   end
 
 end
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/controllers/test_controller.rb b/sonar-server/src/main/webapp/WEB-INF/app/controllers/test_controller.rb
index 16a109bbdfa..dfb93c79808 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/controllers/test_controller.rb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/controllers/test_controller.rb
@@ -19,31 +19,33 @@
 #
 class TestController < ApplicationController
 
-  def working_view
+  def testcase
     verify_ajax_request
-    require_parameters :sid, :value, :type
-    type = params[:type].to_s
+    require_parameters :sid, :test
     snapshot_id = params[:sid].to_i
-    if type == 'testcase'
-      @test = params[:value].to_s
-      @test_plan = java_facade.getTestPlan(snapshot_id)
-      @test_case = @test_plan.testCaseByKey(@test)
-      render :partial => 'test/testcase_working_view'
-    elsif type == 'testable'
-      @line = params[:value].to_i
-      @testable = java_facade.getTestable(snapshot_id)
-      @test_case_by_test_plan = {}
-      @testable.testCasesOfLine(@line).each do |test_case|
-        test_plan = test_case.testPlan
-        test_cases = @test_case_by_test_plan[test_plan]
-        test_cases = [] unless test_cases
-        test_cases << test_case
-        @test_case_by_test_plan[test_plan] = test_cases
-      end
-      render :partial => 'test/testable_working_view'
-    else
-      render_not_found('This type is not yet supported : ' + type)
+
+    @test = params[:test].to_s
+    @test_plan = java_facade.getTestPlan(snapshot_id)
+    @test_case = @test_plan.testCaseByKey(@test)
+    render :partial => 'test/testcase_working_view'
+  end
+
+  def testable
+    verify_ajax_request
+    require_parameters :sid, :line
+    snapshot_id = params[:sid].to_i
+
+    @line = params[:line].to_i
+    @testable = java_facade.getTestable(snapshot_id)
+    @test_case_by_test_plan = {}
+    @testable.testCasesOfLine(@line).each do |test_case|
+      test_plan = test_case.testPlan
+      test_cases = @test_case_by_test_plan[test_plan]
+      test_cases = [] unless test_cases
+      test_cases << test_case
+      @test_case_by_test_plan[test_plan] = test_cases
     end
+    render :partial => 'test/testable_working_view'
   end
 
 end
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/_header.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/_header.html.erb
index 3ceb11fb1ce..41ce9d5d988 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/_header.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/_header.html.erb
@@ -4,13 +4,11 @@
 <script type="text/javascript">
   /* display resource */
   function d(resourceId, display_title) {
-    var loading = new Image();
-    loading.src = baseUrl + "/images/loading.gif";
-    $('resource_container').update(loading);
     if (display_title == undefined) {
       display_title = true;
     }
-    new Ajax.Updater('resource_container', baseUrl + '/resource/index/' + resourceId + '?metric=<%= @metric.id if @metric -%>&rule=<%= @rule ? @rule.id : @severity -%>&period=<%= @period -%>&project=<%= @resource.id -%>&display_title=' + display_title, {asynchronous:true, evalScripts:true});
+    var url = '<%= ApplicationController.root_context -%>/resource/index/' + resourceId + '?metric=<%= @metric.id if @metric -%>&rule=<%= @rule ? @rule.id : @severity -%>&period=<%= @period -%>&project=<%= @resource.id -%>&display_title=' + display_title;
+    openAccordionItem(url, this);
     return false;
   }
 </script>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/measures.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/measures.html.erb
index aba26c4e3a3..7fb8dce4f36 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/measures.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/measures.html.erb
@@ -70,7 +70,7 @@
                 <% end %>
                 <%= qualifier_icon(resource) -%>&nbsp;
                 <% if resource.source_code? %>
-                  <a href="#" onclick="$j('#col_<%= index -%> tr').removeClass('selected'); $j('#row_<%= index -%>_<%= row_index -%>').addClass('selected'); d(<%= resource.id -%>)" 
+                  <a href="#" onclick="$j('#col_<%= index -%> tr').removeClass('selected'); $j('#row_<%= index -%>_<%= row_index -%>').addClass('selected'); d(<%= resource.id -%>)"
                      alt="<%= resource.name(true) -%>" title="<%= resource.name(true) -%>"><%= resource.name(false) -%></a>
                 <% else %>
                   <%= link_to(resource.name, {:only_path => true, :overwrite_params => {:rids => (selected ? rids-[resource.id] : rids+[resource.id])}}) -%>
@@ -102,4 +102,6 @@
   <% end %>
 </script>
 
+<div id="accordion-panel"/>
+
 <%= render :partial => 'footer' -%>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/violations.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/violations.html.erb
index 67dcf40d698..26e616f7a5f 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/violations.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/drilldown/violations.html.erb
@@ -182,4 +182,7 @@
   });
   <% end %>
 </script>
+
+<div id="accordion-panel"/>
+
 <%= render :partial => 'footer' -%>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_create_violation_form.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_create_violation_form.html.erb
index 1e6da007a2c..2a8d2f5af83 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_create_violation_form.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_create_violation_form.html.erb
@@ -29,7 +29,8 @@
               &nbsp;
               <%= image_tag 'sep12.png' -%>
               &nbsp;
-              <select id="select-rule-<%= @html_id -%>" name="rule" onkeyup="this.blur();this.focus();" onchange="if ($F(this)=='') {$('new_rule_<%= @html_id -%>').show()} else {$('new_rule_<%= @html_id -%>').hide()}">
+              <select class="select-rule-<%= @html_id -%>" name="rule" onkeyup="this.blur();this.focus();"
+                      onchange="if ($j(this).val()=='') {$j(this).next('input.new_rule_<%= @html_id -%>').show()} else {$j(this).next('input.new_rule_<%= @html_id -%>').hide()}">
                 <% is_admin = current_user && has_role?(:admin)
                    if is_admin
                 %>
@@ -45,7 +46,7 @@
               </select>
 
               <% if is_admin %>
-                <input type="text" name="new_rule" size="50" id="new_rule_<%= @html_id -%>">
+                <input type="text" name="new_rule" size="50" class="new_rule_<%= @html_id -%>">
               <% end %>
 
               &nbsp;
@@ -60,7 +61,7 @@
               <div class="error" id="errorViolationForm<%= @line -%>" style="display: none"></div>
               <input type="submit" value="<%= message('code_viewer.create_violation.submit') -%>">
 
-              <a href="#" onclick="return hVF(<%= @line -%>)"><%= message('cancel') -%></a>
+              <a href="#" onclick="return hVF(this, <%= @line -%>)"><%= message('cancel') -%></a>
             </div>
           </div>
         <% end %>
@@ -70,4 +71,26 @@
 </tr>
 <script type="text/javascript">
   Form.Element.activate('select-rule-<%= @html_id -%>');
+
+  function createViolation(elt){
+    elt.submit(function (event) {
+      $j.ajax({
+        type: 'POST',
+        url: elt.attr('action'),
+        data: elt.serialize(),
+        success: function (data) {
+          var test = $j(elt).closest('.createViolationCell<%= @line.to_s %>');
+          alert(test.attr('class'));
+//          window.location.reload();
+        },
+        error: function (xhr, textStatus, errorThrown) {
+//          $j("#"+ errorId).removeClass("hidden");
+//          $j("#"+ errorId).html(xhr.responseText);
+        }
+      });
+      return false;
+    });
+
+    return false;
+  }
 </script>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_extension.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_extension.html.erb
new file mode 100644
index 00000000000..a51fe0c16fd
--- /dev/null
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_extension.html.erb
@@ -0,0 +1,15 @@
+<div class="accordion-item">
+  <div class="accordion-header">
+    <%= render :partial => 'tabs' -%>
+  </div>
+  <div class="accordion-body">
+    <% if @extension.isGwt() %>
+      <div id="gwtpage"> </div>
+      <script>
+        loadGWT('<%= @extension.getId() -%>', <%= @resource.id -%>,'<%= @resource.key -%>', '<%= @resource.name -%>', '<%= @resource.scope -%>', '<%= @resource.qualifier -%>', '<%= @resource.language -%>');
+      </script>
+    <% elsif @extension.getTarget() # ruby on rails page %>
+      <%= render :inline => @extension.getTarget().getTemplate() -%>
+    <% end %>
+  </div>
+</div>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_duplications.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_duplications.html.erb
index 99282485557..ada925e6695 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_duplications.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_duplications.html.erb
@@ -1,4 +1,4 @@
-<div id="source_header" class="tab_header">
+<div class="source_header tab_header">
   <table class="metrics">
     <tr>
         <% m=measure('duplicated_lines_density') %>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_violations.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_violations.html.erb
index 58ed8b42cc9..47e1a9982fd 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_violations.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_header_violations.html.erb
@@ -1,4 +1,4 @@
-<div id="violations_header" class="tab_header">
+<div class="violations_header tab_header">
   <% if @period && measure('new_violations') %>
     <table>
       <tr>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_index.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_index.html.erb
new file mode 100644
index 00000000000..453a910ecbe
--- /dev/null
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_index.html.erb
@@ -0,0 +1,163 @@
+<div class="accordion-item">
+  <div class="accordion-header">
+    <%= render :partial => 'tabs' -%>
+  </div>
+  <div class="accordion-body">
+    <%= render :partial => "resource/header_#{@extension.getId()}" -%>
+
+    <% if @display_violations && @global_violations && @global_violations.size>0 -%>
+      <table class="global_violations" cellpadding="0" cellspacing="0" border="0">
+        <% @global_violations.each do |violation| %>
+          <tr>
+            <td><%= render :partial => 'violation', :locals => {:violation => violation, :review_screens => @review_screens_by_vid ? @review_screens_by_vid.get(violation.id) : []} -%></td>
+          </tr>
+        <% end %>
+      </table>
+    <% end %>
+
+    <% if @lines && @lines.size>0 %>
+
+      <table class="sources2 code" cellpadding="0" cellspacing="0" border="0">
+        <%
+           colspan=2
+           gray_colspan=1
+           white_colspan=0
+           if @display_manual_violation_form
+             colspan+=1
+             gray_colspan+=1
+           end
+           if @scm_available
+             colspan+=1
+             gray_colspan+=1
+           end
+           if @display_coverage
+             colspan+=2
+             white_colspan+=2
+           end
+
+           current_revision=nil
+           previous_hidden=false
+           first_section=true
+           has_displayed_lines=false
+           @lines.each_with_index do |line, index|
+             if line.hidden? && !@expanded
+               previous_hidden=true
+               next
+             end
+
+             if previous_hidden && !first_section
+               current_revision=nil
+        %>
+            <tr>
+              <td colspan="<%= colspan -%>" class="new_section"></td>
+            </tr>
+          <%
+             end
+             previous_hidden=false
+             first_section=false
+
+             status=hits_status=conditions_status=''
+             if line.highlighted?
+               has_displayed_lines=true
+               if @display_coverage && line.hits
+                 hits_status=(line.hits>0 ? 'ok' : 'ko')
+                 if line.conditions && line.conditions>0 && line.covered_conditions
+                   if line.covered_conditions==0
+                     status='ko'
+                     conditions_status='ko'
+                   elsif line.covered_conditions==line.conditions
+                     status=''
+                     conditions_status='ok'
+                   else
+                     conditions_status='warn'
+                     status='warn'
+                   end
+                 elsif line.hits
+                   status=(line.hits>0 ? '' : 'ko')
+                 end
+               elsif @display_violations && line.violations?
+                 status="ko"
+               end
+             end
+          %>
+          <tr class="row pos<%= index+1 -%>">
+            <% if @display_manual_violation_form %>
+              <td class="plus"><a onclick="return sVF(this, <%= @resource.id -%>,<%= index + 1 -%>,<%= gray_colspan -%>,<%= white_colspan -%>)"></a></td>
+            <%
+               end
+               if @scm_available
+                 if current_revision!=line.revision
+                   current_revision=line.revision
+                   title = "Revision #{h(line.revision)}"
+            %>
+                <td class="scm revision">
+                  <span class="date"><a href="#" title="<%= title -%>" alt="<%= title -%>"><%= Java::OrgSonarApiUtils::DateUtils.formatDate(line.datetime) if line.datetime -%></a></span>
+                  <span class="author"><%= h(line.author) -%></span></td>
+              <% else %>
+                <td class="scm"></td>
+              <% end
+                 end
+              %>
+            <td class="lid L<%= index+1 -%>"><a name="L<%= index+1 -%>" href="#L<%= index+1 -%>"><%= index + 1 -%></a>
+            </td>
+
+            <% if @display_coverage %>
+              <% if line.highlighted? %>
+                <td class="ind <%= hits_status -%>" title="<%= message("number_of_tests_covering_line", {:params => line.covered_lines.to_s}) if line.covered_lines > 0 -%>">
+                  <% if line.covered_lines > 0 %>
+                    <a href="<%= ApplicationController.root_context -%>/test/testable/?sid=<%= @snapshot.id -%>&line=<%= index+1 -%>"
+                       onclick="openAccordionItem(this.href, this); return false;"><%= line.covered_lines -%></a>
+                  <% end %>
+                </td>
+                <td class="ind <%= conditions_status -%>">
+                  <% if line.deprecated_conditions_label -%>
+                    <%= line.deprecated_conditions_label -%>
+                  <% elsif line.conditions && line.conditions>0 -%>
+                    <%= line.covered_conditions -%>/<%= line.conditions -%>
+                  <% end %>
+                </td>
+              <% else %>
+                <td class="ind"></td>
+                <td class="ind"></td>
+              <% end %>
+            <% end %>
+            <td class="line <%= status -%>">
+              <pre><%= line.source -%></pre>
+            </td>
+          </tr>
+          <% if @display_violations && line.violations? %>
+            <tr>
+              <% if @display_manual_violation_form %>
+                <td class="gray"></td>
+              <% end
+                 if @scm_available %>
+                <td class="scm"></td>
+              <% end %>
+              <td class="lid"></td>
+              <td class="violations">
+                <% line.violations.each_with_index do |violation, index| %>
+                  <%= render :partial => 'violation', :locals => {:violation => violation, :review_screens => @review_screens_by_vid ? @review_screens_by_vid.get(violation.id) : []} -%>
+                  <% if index < line.violations.size-1 %>
+                    &nbsp;
+                  <% end %>
+                <% end %>
+              </td>
+            </tr>
+          <% end %>
+        <% end %>
+      </table>
+
+      <% if @filtered && !has_displayed_lines %>
+        <p><%= message('no_lines_match_your_filter_criteria') -%></p>
+      <% end %>
+
+    <% end %>
+
+    <% if @duplication_groups %>
+      <%= render :partial => 'duplications' -%>
+    <% end %>
+
+  </div>
+</div>
+
+
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_nothing.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_nothing.html.erb
new file mode 100644
index 00000000000..8238e6f9bd4
--- /dev/null
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_nothing.html.erb
@@ -0,0 +1,3 @@
+<div class="accordion-item">
+  <%= render :partial => 'tabs' -%>
+</div>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_options.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_options.html.erb
index db6bc1934c8..c434f409d96 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_options.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_options.html.erb
@@ -2,21 +2,17 @@
    if display_options
 %>
 
-  <div id="source_options">
+  <div class="source_options">
     <script>
-      applyOptions = function () {
-        $('resource_loading').show();
-        <% if request.xhr? %>
-        var params = Form.serialize($('options-form'));
-        new Ajax.Updater('resource_container', '<%= url_for :controller => 'resource', :action => 'index', :id => @resource.key -%>', {asynchronous:true, parameters:params});
+      applyOptions = function (elt) {
+        var currentForm = $j(elt).closest('.options-form');
+        var params = currentForm.serialize();
+        var url = '<%= ApplicationController.root_context -%>/resource/index/<%= @resource.key %>?display_title=<%= params[:display_title].to_s -%>&'+ params;
+        openAccordionItem(url, elt, true);
         return true;
-        <% else %>
-        $('options-form').submit();
-        return false;
-        <% end %>
       };
     </script>
-    <form method="GET" action="<%= url_for :controller => 'resource', :action => 'index', :id => @resource.key -%>" id="options-form">
+    <form method="GET" action="<%= url_for :controller => 'resource', :action => 'index', :id => @resource.key -%>" class="options-form">
       <input type="hidden" name="tab" value="<%= params[:tab] -%>"/>
       <input type="hidden" name="metric" value="<%= params[:metric] -%>"/>
       <input type="hidden" name="period" value="<%= params[:period] -%>"/>
@@ -27,7 +23,7 @@
              first=true
              if @expandable %>
             <td class="<%= 'first' if first -%>">
-              <input type="checkbox" value="true" name="expand" id="expand" <%= 'checked' if @expanded -%> onclick="applyOptions()"/>
+              <input type="checkbox" value="true" name="expand" <%= 'checked' if @expanded -%> onclick="applyOptions(this)"/>
               <label for="expand"><%= message('full_source') -%></label>
             </td>
           <% first=false
@@ -35,7 +31,7 @@
 
           <% if @scm_available && !@display_violations && @snapshot.project_snapshot.periods? %>
             <td class="<%= 'first' if first -%>">
-              <select id="period" name="period" onchange="applyOptions()">
+              <select name="period" onchange="applyOptions(this)">
                 <option value=""><%= message('time_changes') -%>...</option>
                 <%= period_select_options(@snapshot, 1) -%>
                 <%= period_select_options(@snapshot, 2) -%>
@@ -50,7 +46,7 @@
 
           <% if @display_violations %>
             <td class="<%= 'first' if first -%>">
-              <select id="period" name="period" onchange="applyOptions()">
+              <select name="period" onchange="applyOptions(this)">
                 <option value=""><%= message('time_changes') -%>...</option>
                 <%= violation_period_select_options(@snapshot, 1) -%>
                 <%= violation_period_select_options(@snapshot, 2) -%>
@@ -66,7 +62,7 @@
 
           <% if @display_coverage %>
             <td class="<%= 'first' if first -%>">
-              <select id="coverage_filter" name="coverage_filter" onchange="applyOptions()">
+              <select class="coverage_filter" name="coverage_filter" onchange="applyOptions(this)">
                 <optgroup label="<%= h message('coverage_viewer.unit_tests') -%>">
                   <option value="lines_to_cover" <%= 'selected' if @coverage_filter=='lines_to_cover' -%>><%= Metric.name_for('lines_to_cover') -%></option>
                   <option value="uncovered_lines" <%= 'selected' if @coverage_filter=='uncovered_lines' -%>><%= Metric.name_for('uncovered_lines') -%></option>
@@ -99,7 +95,7 @@
 
             <% if @coverage_filter=='lines_covered_per_test' %>
               <td class="<%= 'first' if first -%>">
-                <select id="test_case_filter" name="test_case_filter" onchange="applyOptions()">
+                <select class="test_case_filter" name="test_case_filter" onchange="applyOptions(this)">
                   <option value=""><%= message('coverage_viewer.select_test') -%></option>
                   <% @test_case_by_test_plan.sort_by{|test_plan, test_cases| test_plan.component.longName}.each do |test_plan, test_cases| %>
                     <optgroup label="<%= test_plan.component.longName %>">
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_resource_deleted.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_resource_deleted.html.erb
new file mode 100644
index 00000000000..cad00e3f454
--- /dev/null
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_resource_deleted.html.erb
@@ -0,0 +1,3 @@
+<div class="accordion-item">
+  <%= message('resource_viewer.resource_deleted') -%>
+</div>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_rules_filter.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_rules_filter.html.erb
index 1210af3824b..ddbab58f363 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_rules_filter.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_rules_filter.html.erb
@@ -42,11 +42,10 @@
    end
 %>
 
-<select id="rule" name="rule" onchange="applyOptions()">
+<select name="rule" onchange="applyOptions(this)">
 
   <option value="all"><%= message('all_violations') -%></option>
-  
-  
+
   <optgroup label="<%= message('reviews') -%>">
     <option value="false_positive_reviews" <%= 'selected' if params[:rule]=="false_positive_reviews" -%>>
       <%= message('violations_viewer.review_filter.false_positives') -%>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_tabs.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_tabs.html.erb
index 460bea07a4c..1312c866b77 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_tabs.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_tabs.html.erb
@@ -6,59 +6,45 @@
    else
      display_title=(params[:display_title]=='true')
 %>
-     
-<% if display_title %>
-  <div id="source_title">
-    <% if @resource.project %>
-      <div class="subtitle">
-        <%= @resource.ancestor_projects.reverse.map{|p| p.name(true)}.join(' / ') -%>
-      </div>
-    <% end %>
-    <% if logged_in? %><%= link_to_favourite(@resource) -%><% end %>
-    <span class="h3"><%= qualifier_icon(@resource) -%> <%= @resource.name(true) -%></span>
-  </div>
-<% end %>
 
-<div id="source_tabs">
-  <ul class="tablinks">
-    <%
-       first=true
-       if @snapshot.source && has_role?(:codeviewer, @snapshot)
-    %>
-      <li class="<%= 'first' if first -%>">
-        <a href="<%= ApplicationController.root_context -%>/api/sources?resource=<%= @resource.key -%>&amp;format=txt"><%= message('raw') -%></a>
-      </li>
-    <% first=false
-       end
-       if request.xhr? %>
+  <% if display_title %>
+    <div class="source_title">
+      <% if @resource.project %>
+        <div class="subtitle">
+          <%= @resource.ancestor_projects.reverse.map{|p| p.name(true)}.join(' / ') -%>
+        </div>
+      <% end %>
+      <% if logged_in? %><%= link_to_favourite(@resource) -%><% end %>
+      <span class="h3"><%= qualifier_icon(@resource) -%> <%= @resource.name(true) -%></span>
+    </div>
+  <% end %>
+
+  <div class="source_tabs">
+    <ul class="tablinks">
+      <%
+         first=true
+         if @snapshot.source && has_role?(:codeviewer, @snapshot)
+      %>
+        <li class="<%= 'first' if first -%>">
+          <a href="<%= ApplicationController.root_context -%>/api/sources?resource=<%= @resource.key -%>&amp;format=txt"><%= message('raw') -%></a>
+        </li>
+      <% first=false
+         end %>
       <li class="<%= 'first' if first -%>">
         <a href="<%= ApplicationController.root_context -%>/resource/index/<%= @resource.key -%>?display_title=true" onclick="window.open(this.href,'resource','height=800,width=900,scrollbars=1,resizable=1');return false;"><%= message('new_window') -%></a>
       </li>
-    <% end %>
-  </ul>
-  <ul class="tabs">
-    <% if request.xhr? %>
+    </ul>
+    <ul class="tabs">
       <% @extensions.each do |extension| %>
         <li>
-          <a href="#" onclick="return loadResourceViewer('<%= @resource.id -%>','<%= extension.getId() -%>',<%= display_title -%>)" class="<%= 'selected' if @extension && @extension.getId()==extension.getId() -%>"><%= message(extension.getId() + '.page', :default => extension.getTitle()) %></a>
+          <a href="#" onclick="return loadResourceViewer('<%= @resource.id -%>','<%= extension.getId() -%>',<%= display_title -%>, this)" class="<%= 'selected' if @extension && @extension.getId()==extension.getId() -%>"><%= message(extension.getId() + '.page', :default => extension.getTitle()) %></a>
         </li>
       <% end %>
-    <% else %>
-      <script>function loadTab(url) {
-        $('resource_loading').show();
-        document.location.href = url;
-        return false;
-      }</script>
-      <% @extensions.each do |extension| %>
-        <li>
-          <a href="#" onClick="return loadTab('<%= url_for(:overwrite_params => {:tab => extension.getId(), :metric => nil}) -%>')" class="<%= 'selected' if @extension && @extension.getId()==extension.getId() -%>"><%= message(extension.getId() + '.page', :default => extension.getTitle()) %></a>
-        </li>
-      <% end %>
-    <% end %>
-    <li>
-      <img src="<%= ApplicationController.root_context -%>/images/loading.gif" id="resource_loading" style="display:none"/>
-    </li>
-  </ul>
-</div>
+      <li>
+        <img src="<%= ApplicationController.root_context -%>/images/loading.gif" id="resource_loading" style="display:none"/>
+      </li>
+    </ul>
+  </div>
+
 
 <%  end %>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
index 9d1c0345a92..c74f105e5dc 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/_violation.html.erb
@@ -126,7 +126,7 @@
         <% unless violation.switched_off? && violation.review && violation.review.resolved? %>
         <div class="dropdown">
           <a href="#" class="link-action link-more" onclick="showDropdownMenu('more<%= violation.id -%>');return false;"><%= message('more_actions') -%></a>
-          <ul style="display: none" class="dropdown-menu" id="more<%= violation.id -%>">
+          <ul style="display: none" class="dropdown-menu" class="more<%= violation.id -%>">
             <% if !violation.switched_off? %>
               <li><%= link_to_function (violation.review && violation.review.resolved? ? message('reviews.reopen') : message('reviews.resolved')),
                                        "sCStF(#{violation.id})", :name => (violation.review && violation.review.resolved? ? 'bReopen' : 'bResolved') -%></li>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/extension.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/extension.html.erb
deleted file mode 100644
index c5873493d32..00000000000
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/extension.html.erb
+++ /dev/null
@@ -1,23 +0,0 @@
-<%= render :partial => 'tabs' -%>
-
-<% if @extension.isGwt() %>
-
-  <% if request.xhr? %>
-    <div id="gwtpage"> </div>
-    <script>loadGWT('<%= @extension.getId() -%>', <%= @resource.id -%>,'<%= @resource.key -%>', '<%= @resource.name -%>', '<%= @resource.scope -%>', '<%= @resource.qualifier -%>', '<%= @resource.language -%>');</script>
-
-  <% else %>
-
-
-    <div id="gwtpage"> </div>
-    <!-- for SmartGWT -->
-    <script>var isomorphicDir = "<%= "#{ApplicationController.root_context}/deploy/gwt/#{@extension.getId()}" -%>/sc/";</script>
-
-    <%= render :partial => 'gwt/base', :locals => {:resource => @resource, :popup => false, :metric => params[:metric]} -%>
-    <script src="<%= ApplicationController.root_context -%>/deploy/gwt/<%= @extension.getId() -%>/<%= @extension.getId() -%>.nocache.js?<%= sonar_version -%>"></script>
-    
-  <% end %>
-  
-<% elsif @extension.getTarget() # ruby on rails page %>
-  <%= render :inline => @extension.getTarget().getTemplate() -%>
-<% end %>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/index.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/index.html.erb
index 75cac7efe5b..4991755d32b 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/index.html.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/index.html.erb
@@ -1,153 +1,5 @@
-<%= render :partial => 'tabs' -%>
-<%= render :partial => "resource/header_#{@extension.getId()}" -%>
+<div id="accordion-panel"/>
 
-<% if @display_violations && @global_violations && @global_violations.size>0 -%>
-  <table id="global_violations" cellpadding="0" cellspacing="0" border="0">
-    <% @global_violations.each do |violation| %>
-      <tr>
-        <td><%= render :partial => 'violation', :locals => {:violation => violation, :review_screens => @review_screens_by_vid ? @review_screens_by_vid.get(violation.id) : []} -%></td>
-      </tr>
-    <% end %>
-  </table>
-<% end %>
-
-<% if @lines && @lines.size>0 %>
-
-  <table id="sources" class="sources2 code" cellpadding="0" cellspacing="0" border="0">
-    <%
-       colspan=2
-       gray_colspan=1
-       white_colspan=0
-       if @display_manual_violation_form
-         colspan+=1
-         gray_colspan+=1
-       end
-       if @scm_available
-         colspan+=1
-         gray_colspan+=1
-       end
-       if @display_coverage
-         colspan+=2
-         white_colspan+=2
-       end
-
-       current_revision=nil
-       previous_hidden=false
-       first_section=true
-       has_displayed_lines=false
-       @lines.each_with_index do |line, index|
-         if line.hidden? && !@expanded
-           previous_hidden=true
-           next
-         end
-
-         if previous_hidden && !first_section
-           current_revision=nil
-    %>
-        <tr>
-          <td colspan="<%= colspan -%>" class="new_section"></td>
-        </tr>
-      <%
-         end
-         previous_hidden=false
-         first_section=false
-
-         status=hits_status=conditions_status=''
-         if line.highlighted?
-           has_displayed_lines=true
-           if @display_coverage && line.hits
-             hits_status=(line.hits>0 ? 'ok' : 'ko')
-             if line.conditions && line.conditions>0 && line.covered_conditions
-               if line.covered_conditions==0
-                 status='ko'
-                 conditions_status='ko'
-               elsif line.covered_conditions==line.conditions
-                 status=''
-                 conditions_status='ok'
-               else
-                 conditions_status='warn'
-                 status='warn'
-               end
-             elsif line.hits
-               status=(line.hits>0 ? '' : 'ko')
-             end
-           elsif @display_violations && line.violations?
-             status="ko"
-           end
-         end
-      %>
-      <tr class="row" id="pos<%= index+1 -%>">
-        <% if @display_manual_violation_form %>
-          <td class="plus"><a onclick="return sVF(<%= @resource.id -%>,<%= index + 1 -%>,<%= gray_colspan -%>,<%= white_colspan -%>)"></a></td>
-        <%
-           end
-           if @scm_available
-             if current_revision!=line.revision
-               current_revision=line.revision
-               title = "Revision #{h(line.revision)}"
-        %>
-            <td class="scm revision">
-              <span class="date"><a href="#" title="<%= title -%>" alt="<%= title -%>"><%= Java::OrgSonarApiUtils::DateUtils.formatDate(line.datetime) if line.datetime -%></a></span>
-              <span class="author"><%= h(line.author) -%></span></td>
-          <% else %>
-            <td class="scm"></td>
-          <% end
-             end
-          %>
-        <td class="lid" id="L<%= index+1 -%>"><a name="L<%= index+1 -%>" href="#L<%= index+1 -%>"><%= index + 1 -%></a>
-        </td>
-
-        <% if @display_coverage %>
-          <% if line.highlighted? %>
-            <td class="ind <%= hits_status -%>" title="<%= message("number_of_tests_covering_line", {:params => line.covered_lines.to_s}) if line.covered_lines > 0 -%>">
-              <% if line.covered_lines > 0 %>
-                <a href="#" onclick="openTestWorkingView('<%= @snapshot.id -%>', <%= index+1 -%>, 'testable');"><%= line.covered_lines -%></a>
-              <% end %>
-            </td>
-            <td class="ind <%= conditions_status -%>">
-              <% if line.deprecated_conditions_label -%>
-                <%= line.deprecated_conditions_label -%>
-              <% elsif line.conditions && line.conditions>0 -%>
-                <%= line.covered_conditions -%>/<%= line.conditions -%>
-              <% end %>
-            </td>
-          <% else %>
-            <td class="ind"></td>
-            <td class="ind"></td>
-          <% end %>
-        <% end %>
-        <td class="line <%= status -%>">
-          <pre><%= line.source -%></pre>
-        </td>
-      </tr>
-      <% if @display_violations && line.violations? %>
-        <tr>
-          <% if @display_manual_violation_form %>
-            <td class="gray"></td>
-          <% end
-             if @scm_available %>
-            <td class="scm"></td>
-          <% end %>
-          <td class="lid"></td>
-          <td class="violations">
-            <% line.violations.each_with_index do |violation, index| %>
-              <%= render :partial => 'violation', :locals => {:violation => violation, :review_screens => @review_screens_by_vid ? @review_screens_by_vid.get(violation.id) : []} -%>
-              <% if index < line.violations.size-1 %>
-                &nbsp;
-              <% end %>
-            <% end %>
-          </td>
-        </tr>
-      <% end %>
-    <% end %>
-  </table>
-
-  <% if @filtered && !has_displayed_lines %>
-    <p><%= message('no_lines_match_your_filter_criteria') -%></p>
-  <% end %>
-
-<% end %>
-
-<% if @duplication_groups %>
-  <%= render :partial => 'duplications' -%>
-<% end %>
\ No newline at end of file
+<script type="text/javascript">
+  openAccordionItem('<%= request.request_uri -%>', this);
+</script>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/nothing.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/nothing.html.erb
deleted file mode 100644
index d22506de4cf..00000000000
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/nothing.html.erb
+++ /dev/null
@@ -1 +0,0 @@
-<%= render :partial => 'tabs' -%>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/resource_deleted.html.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/resource/resource_deleted.html.erb
deleted file mode 100644
index f137fec47b5..00000000000
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/resource/resource_deleted.html.erb
+++ /dev/null
@@ -1 +0,0 @@
-<%= message('resource_viewer.resource_deleted') -%>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testable_working_view.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testable_working_view.erb
index 64fd10139b2..6ddf7d2bda4 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testable_working_view.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testable_working_view.erb
@@ -1,26 +1,32 @@
-<div><h1>Working Views</h1></div>
-<br/>
-<div><h3>Tests covering <%= @testable.component.longName %> on line <%= @line %></h3></div>
-<br/>
-<% @test_case_by_test_plan.sort_by{|test_plan, test_cases| test_plan.component.longName}.each do |test_plan, test_cases| %>
-<table class="data">
-  <thead>
-  <tr>
-    <th><%= test_plan.component.longName %></th>
-  </tr>
-  </thead>
-  <tbody>
-  <% test_cases.sort_by{|test_case| test_case.name}.each do |test_case| %>
-  <tr class="<%= cycle("even", "odd") -%>">
-    <td>
-      <% resource_key = test_case.testPlan.component.key %>
-      <a href="<%= ApplicationController.root_context -%>/resource/index/<%= resource_key -%>?display_title=true&tab=tests_viewer"
-         onclick="window.open(this.href,'resource','height=800,width=900,scrollbars=1,resizable=1');return false;"><%= test_case.name -%>
-      </a>
-    </td>
-  </tr>
-  <% end %>
-  </tbody>
-</table>
+<div class="accordion-item">
+  <div class="accordion-header">
+    <h3>Tests covering <%= @testable.component.longName %> on line <%= @line %></h3>
+  </div>
   <br/>
-<% end %>
+  <div class="accordion-body">
+    <% @test_case_by_test_plan.sort_by{|test_plan, test_cases| test_plan.component.longName}.each do |test_plan, test_cases| %>
+    <table class="data">
+      <thead>
+      <tr>
+        <th>
+        <% resource_key = test_plan.component.key %>
+        <a href="<%= ApplicationController.root_context -%>/resource/index/<%= resource_key -%>?display_title=true&tab=source"
+           onclick="openAccordionItem(this.href, this); return false;"><%= test_plan.component.longName %>
+        </a>
+        </th>
+      </tr>
+      </thead>
+      <tbody>
+      <% test_cases.sort_by{|test_case| test_case.name}.each do |test_case| %>
+      <tr class="<%= cycle("even", "odd") -%>">
+        <td>
+          <%= test_case.name -%>
+        </td>
+      </tr>
+      <% end %>
+      </tbody>
+    </table>
+      <br/>
+    <% end %>
+  </div>
+</div>
diff --git a/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testcase_working_view.erb b/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testcase_working_view.erb
index 6f6b5a89c06..030a5e3ecc5 100644
--- a/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testcase_working_view.erb
+++ b/sonar-server/src/main/webapp/WEB-INF/app/views/test/_testcase_working_view.erb
@@ -1,24 +1,28 @@
-<div><h1>Working Views</h1></div>
-<br/>
-<div><h3>Files covered by <%= @test %> (<%= @test_plan.component.longName %>)</h3></div>
-<br/>
-<table class="data">
-  <thead>
-  <tr>
-    <th>File</th>
-    <th>Covered Lines</th>
-  </tr>
-  </thead>
-  <tbody>
-  <% @test_case.covers.sort_by{|cover| cover.testable.component.name}.each do |cover| %>
-  <tr class="<%= cycle("even", "odd") -%>">
-    <td>
-      <a href="<%= ApplicationController.root_context -%>/resource/index/<%= cover.testable.component.key -%>?display_title=true&tab=coverage&coverage_filter=lines_covered_per_test&test_case_filter=<%= @test -%>"
-         onclick="window.open(this.href,'resource','height=800,width=900,scrollbars=1,resizable=1');return false;"><%= cover.testable.component.longName -%>
-      </a>
-    </td>
-    <td><%= cover.lines.size -%></td>
-  </tr>
-  <% end %>
-  </tbody>
-</table>
\ No newline at end of file
+<div class="accordion-item">
+  <div class="accordion-header">
+    <h3>Files covered by <%= @test %> (<%= @test_plan.component.longName %>)</h3>
+  </div>
+  <br/>
+  <div class="accordion-body">
+    <table class="data">
+      <thead>
+      <tr>
+        <th>File</th>
+        <th>Covered Lines</th>
+      </tr>
+      </thead>
+      <tbody>
+      <% @test_case.covers.sort_by{|cover| cover.testable.component.name}.each do |cover| %>
+      <tr class="<%= cycle("even", "odd") -%>">
+        <td>
+          <a href="<%= ApplicationController.root_context -%>/resource/index/<%= cover.testable.component.key -%>?display_title=true&tab=coverage&coverage_filter=lines_covered_per_test&test_case_filter=<%= @test -%>"
+             onclick="openAccordionItem(this.href, this); return false;"><%= cover.testable.component.longName -%>
+          </a>
+        </td>
+        <td><%= cover.lines.size -%></td>
+      </tr>
+      <% end %>
+      </tbody>
+    </table>
+  </div>
+</div>
\ No newline at end of file
diff --git a/sonar-server/src/main/webapp/javascripts/application.js b/sonar-server/src/main/webapp/javascripts/application.js
index 0919d847f24..d8bb4111e0b 100644
--- a/sonar-server/src/main/webapp/javascripts/application.js
+++ b/sonar-server/src/main/webapp/javascripts/application.js
@@ -307,59 +307,85 @@ Treemap.prototype.initNodes = function () {
   });
 })(jQuery);
 
-/**
- *
- * @param snapshot_id
- * @param value whether the test name or the line index
- * @param type whether testable or testcase
- * @return {boolean}
- */
-function openTestWorkingView(snapshot_id, value, type) {
+function closeModalWindow() {
+  $j('#modal').dialog('close');
+  return false;
+}
 
-  if ($j('#working_view').length) {
-    $j('#working_view').remove();
+function supports_html5_storage() {
+  try {
+    return 'localStorage' in window && window['localStorage'] !== null;
+  } catch (e) {
+    return false;
   }
+}
 
-  var url = baseUrl + "/test/working_view?sid=" + snapshot_id + "&value=" + value + "&type="+ type;
-  var $dialog = $j('<div id="working_view" class="ui-widget-overlay"></div>').appendTo('body');
+//******************* HANDLING OF WORKING VIEWS [BEGIN] ******************* //
+
+function openAccordionItem(url, elt, updateCurrentElement) {
+
+  var htmlClass = 'accordion-item';
+  var currentElement = $j(elt).closest('.'+ htmlClass);
+  var previousHeight = 0;
+
+  // Display loading image
+  var loading = new Image();
+  loading.src = baseUrl + "/images/loading.gif";
+
+  if (currentElement.length) {
+    previousHeight = $j("#accordion-panel").height();
+    // Remove all accordion items after current element
+    currentElement.nextAll('.'+ htmlClass).remove();
+
+    var newHeight = $j("#accordion-panel").height() + currentElement.height();
+    $j("#accordion-panel").height(previousHeight > newHeight ? previousHeight : newHeight);
+  }
+
+  if (currentElement.length) {
+    $j(loading).insertAfter(currentElement);
+  } else {
+    $j(loading).insertAfter($j("#accordion-panel"));
+  }
+
+  // Get content from url
   $j.get(url,function (html) {
-    $dialog.removeClass('ui-widget-overlay');
-    $dialog.html(html);
-    $dialog
-        .dialog({
-          width: 600,
-          position: { my: "right top", at: "right top", of: "#content" },
-          draggable: false,
-          autoOpen: false,
-          modal: false,
-          minHeight: 600,
-          resizable: false,
-          close: function () {
-            $j('#working_view').remove();
-          }
-        });
-    $dialog.dialog("open");
+    if (currentElement.length) {
+
+      var body = currentElement.find('.accordion-body');
+      if (!updateCurrentElement && !body.hasClass('accordion-item-medium')) {
+        body.addClass("accordion-item-medium");
+        elt.scrollIntoView(false);
+      }
+    } else {
+      $j("#accordion-panel").height('auto');
+
+      // Current element is not in a working view, remove all working views
+      $j('.'+ htmlClass).remove();
+    }
+
+    if (updateCurrentElement) {
+      currentElement.replaceWith(html);
+    } else {
+      $j("#accordion-panel").append(html);
+    }
+
   }).error(function () {
         alert("Server error. Please contact your administrator.");
       }).complete(function () {
-        $dialog.removeClass('ui-widget-overlay');
+        $j(loading).remove();
       });
-  return false;
-}
 
-function closeModalWindow() {
-  $j('#modal').dialog('close');
   return false;
 }
 
-function supports_html5_storage() {
-  try {
-    return 'localStorage' in window && window['localStorage'] !== null;
-  } catch (e) {
-    return false;
-  }
+function expandAccordionItem(elt) {
+  var currentElement = $j(elt).closest('.accordion-item');
+  currentElement.find('.accordion-body').removeClass("accordion-item-medium");
 }
 
+//******************* HANDLING OF WORKING VIEWS [END] ******************* //
+
+
 //******************* HANDLING OF DROPDOWN MENUS [BEGIN] ******************* //
 
 var currentlyDisplayedDropdownMenu;
diff --git a/sonar-server/src/main/webapp/javascripts/resource.js b/sonar-server/src/main/webapp/javascripts/resource.js
index 18d32d2f519..1972e35db58 100644
--- a/sonar-server/src/main/webapp/javascripts/resource.js
+++ b/sonar-server/src/main/webapp/javascripts/resource.js
@@ -2,12 +2,14 @@
  Functions used in resource viewers
  */
 
-function loadResourceViewer(resourceId, tab, display_title) {
-  $('resource_loading').show();
+function loadResourceViewer(resourceId, tab, display_title, elt) {
   if (display_title == undefined) {
     display_title = true;
   }
-  new Ajax.Updater('resource_container', baseUrl + '/resource/index/' + resourceId + '?tab=' + tab + '&display_title=' + display_title, {asynchronous:true, evalScripts:true});
+
+  var url = baseUrl + '/resource/index/' + resourceId + '?tab=' + tab + '&display_title=' + display_title;
+  openAccordionItem(url, elt, true);
+
   return false;
 }
 
@@ -158,26 +160,24 @@ function sAPF(violation_id) {
 }
 
 // show the form to create violation
-function sVF(resource, line, gray_colspan, white_colspan) {
-  row = $('createViolationForm' + line);
-  if (row == null) {
-    new Ajax.Updater(
-        'pos' + line,
-        baseUrl + '/resource/show_create_violation_form',
-        {
-          parameters:{resource:resource, line:line, gray_colspan:gray_colspan, white_colspan:white_colspan},
-          asynchronous:true,
-          evalScripts:true,
-          insertion:'after'
+function sVF(elt, resource, line, gray_colspan, white_colspan) {
+  row = $j('#createViolationForm' + line);
+  if (!row.length) {
+    expandAccordionItem(elt);
+    var element = $j(elt).closest('.pos' + line);
+    $j.get(baseUrl + '/resource/show_create_violation_form?resource='+ resource + '&line='+ line + '&gray_colspan='+ gray_colspan + '&white_colspan='+ white_colspan, function (html) {
+      element.after(html);
+    }).error(function () {
+          alert("Server error. Please contact your administrator.");
         });
   }
   return false;
 }
 
 // hide review form
-function hVF(line) {
-  row = $('createViolationRow' + line);
-  if (row != null) {
+function hVF(elt, line) {
+  var row = $j(elt).closest('.createViolationRow'+ line);
+  if (row.length) {
     row.remove();
   }
   return false;
diff --git a/sonar-server/src/main/webapp/stylesheets/style.css b/sonar-server/src/main/webapp/stylesheets/style.css
index 2394d8c6dd6..43b13c91790 100644
--- a/sonar-server/src/main/webapp/stylesheets/style.css
+++ b/sonar-server/src/main/webapp/stylesheets/style.css
@@ -810,11 +810,11 @@ span.rulename a:hover {
   border-right: 1px solid #DDD;
 }
 
-#source_title {
+.source_title {
   padding: 10px 0;
 }
 
-#source_title span.h1 {
+.source_title span.h1 {
   font-size: 16px;
   margin-right: 10px;
 }
@@ -864,19 +864,19 @@ span.rulename a:hover {
   font-weight: bold;
 }
 
-#source_options {
+.source_options {
   margin-top: 5px;
   padding-top: 5px;
   border-top: 1px solid #ddd;
   font-size: 85%;
 }
 
-#source_options td {
+.source_options td {
   background: url("../images/sep12.png") no-repeat scroll 0 50% transparent;
   padding: 0 10px;
 }
 
-#source_options td.first {
+.source_options td.first {
   background: none;
   padding: 0 10px 0 0;
 }
@@ -2409,4 +2409,20 @@ textarea.width100 {
 
 .property table.data > thead > tr > th {
   vertical-align: top;
-}
\ No newline at end of file
+}
+
+.accordion-item {
+  margin-top: 10px;
+  border: 1px solid #DDDDDD;
+}
+
+.accordion-item-small {
+  height: 50px;
+  overflow: hidden;
+}
+
+.accordion-item-medium {
+  height: 200px;
+  overflow: scroll;
+}
+