Refactoring javascript and html for ajax-results

Carlos Morais + Paulo Meirelles · Paulo Meireles
1 parent 26c36652
Showing 3 changed files with 41 additions and 39 deletions Show diff stats
plugins/mezuro/public/javascripts/results.js
plugins/mezuro/views/content_viewer/_source_tree.rhtml
plugins/mezuro/views/content_viewer/show_project.rhtml
 function results($) {
-  $('.mezuro-display-metrics').click(function() {
-    var profile = $('#module-result').attr('data-profile');
-    var project = $('#module-result').attr('data-project-id');
-    var module_name = $(this).attr('data-module-name');
-    var endpoint = '/profile/' + profile + '/plugins/mezuro/metrics/' + project;
-    show_loading_message();
-    $.get(endpoint, {module_name: module_name}, function(content) {
-      $('#module-result').html(content);
-      show_result_table();
-    });
-    return false;
-  });
+  $('.module-result-link').click(show_module_result);
 }
-function show_loading_message() {
-  jQuery('#loading-message').attr("style", "display: inline");
-  jQuery('#module-result').attr("style", "display: none");
+
+function show_module_result(){
+  var profile = jQuery('#module-result').attr('data-profile');
+  var project = jQuery('#module-result').attr('data-project-id');
+  var module_name = jQuery(this).attr('data-module-name');
+  var endpoint = '/profile/' + profile + '/plugins/mezuro/metrics/' + project;
+  show_loading_message(module_name);
+  jQuery.get(endpoint, {module_name: module_name}, show_result_table);
+  return false;
 }
-function show_result_table(){
-  jQuery('#loading-message').attr("style", "display: none");
-  jQuery('#module-result').attr("style", "display: inline");
+
+function show_loading_message(module_name) {
+  jQuery('#module-result').html("Loading results for " + module_name + "...");
+}
+
+function show_result_table(content){
+  jQuery('#module-result').html(content);
 }
 \ No newline at end of file
-<% if source_tree.children && !source_tree.children.empty? %>
+<% module_name = source_tree.module_name %>
+<% module_label = "#{module_name} (#{source_tree.granularity})" %>
+<% if source_tree.children %>
   <table>
-    <tr> 
-      <td width='10%'> 
-        <img id='<%= source_tree.module_name %>_plus' onclick="toogle('<%= source_tree.module_name %>')" 
-        alt='+' src='/plugins/mezuro/images/plus.png' class='link' 
-        style='display: none'/> 
-        <img id='<%= source_tree.module_name %>_minus' onclick="toogle('<%= source_tree.module_name %>')"
-        alt='-' src='/plugins/mezuro/images/minus.png' class='link' 
-        /> 
-      </td> 
+    <tr>
+      <td width="10%">
+        <img alt="+" src="/plugins/mezuro/images/plus.png" class="link"
+          id="<%= module_name %>_plus" onclick="toogle('<%= module_name %>')"/>
+        <img alt="-" src="/plugins/mezuro/images/minus.png" class="link"
+          id="<%= module_name %>_minus" onclick="toogle('<%= module_name %>')" style="display: none"/>
+      </td>
       <td>
-        <a href="#" class='mezuro-display-metrics' data-module-name='<%= source_tree.module_name %>'><%= source_tree.module_name %> (<%= source_tree.granularity %>)</a>
+        <a href="#" class="module-result-link" data-module-name="<%= module_name %>">
+          <%= module_label %>
+        </a>
       </td>
     </tr> 
-    <tr id='<%= source_tree.module_name %>_hidden'> 
+    <tr id="<%= module_name %>_hidden" style="display: none">
       <td></td> 
-      <td style='text-align: left'> 
+      <td style="text-align: left">
         <% source_tree.children.each do |child| %>
           <%= render :partial => 'source_tree', :locals => { :source_tree => child } %>
         <% end %>
@@ -25,9 +27,11 @@
 <% else %>
   <table>
     <tr>
-      <td width='1'></td>
+      <td width="1"></td>
       <td>
-        <a href="#" class='mezuro-display-metrics' data-module-name='<%= source_tree.module_name %>'><%= source_tree.module_name %> (<%= source_tree.granularity %>)</a>
+        <a href="#" class="module-result-link" data-module-name="<%= module_name %>">
+          <%= module_label %>
+        </a>
       </td>
     </tr>
   </table>
@@ -29,8 +29,6 @@
 <br />
-
-
 <% if ! @project.error.nil? %>
   <h3><%= _('ERROR') %></h3>
   <p>
@@ -66,15 +64,16 @@
       <td><%= @project_result.formatted_analysis_time %></td>
     </tr>
   </table>
+
   <h5><%= _('Source tree') %></h5>
+
   <%= render :partial => 'source_tree', :locals => { :source_tree => @project_result.source_tree } %>
+
   <div id='module-result' data-profile="<%= @page.profile.identifier %>" data-project-id='<%= @page.id %>'>
     <%= render :partial => 'module_result', :locals => { :module_result => @page.module_result(@project.name) } %>
   </div>
-  <div id="loading-message">
-    loading results...
-  </div>
-  <script>
+
+  <script type="text/javascript">
     jQuery(results);
   </script>
 <% end %>
 \ No newline at end of file