[Branch,~linaro-validation/lava-dashboard/trunk] Rev 257: Speed up image status detail page

=== modified file 'dashboard_app/models.py'
--- dashboard_app/models.py	2011-08-19 02:19:06 +0000
+++ dashboard_app/models.py	2011-08-19 04:06:47 +0000
@@ -1250,8 +1250,9 @@ 
         ).order_by('-analyzer_assigned_date')
 
     def get_chart_data(self):
-        return TestResult.objects.filter(
-            test_run__in=self.get_recent_test_runs().order_by(),
+        return TestResult.objects.select_related(
+        ).filter(
+            test_run__in=[run.pk for run in self.get_recent_test_runs().only('id').order_by()]
         ).values(
             'test_run__analyzer_assigned_date'
         ).extra(
@@ -1263,14 +1264,18 @@ 
         ).order_by('result')
 
     def get_test_runs(self):
-        return TestRun.objects.filter(
+        return TestRun.objects.select_related(
+        ).filter(
             bundle__bundle_stream__pathname="/anonymous/lava-daily/"
         ).filter(
-            attributes__name='rootfs.type',
+            attributes__name='rootfs.type'
+        ).filter(
             attributes__value=self.rootfs_type
         ).filter(
-            attributes__name='hwpack.type',
-            attributes__value=self.hwpack_type)
+            attributes__name='hwpack.type'
+        ).filter(
+            attributes__value=self.hwpack_type
+        )
 
     def get_current_test_run(self, test):
         return self.get_all_test_runs_for_test(test).order_by('-analyzer_assigned_date')[0]

=== modified file 'dashboard_app/templates/dashboard_app/image_status_detail.html'
--- dashboard_app/templates/dashboard_app/image_status_detail.html	2011-08-19 02:19:06 +0000
+++ dashboard_app/templates/dashboard_app/image_status_detail.html	2011-08-19 04:06:47 +0000
@@ -17,7 +17,7 @@ 
 {% with image_health.get_recent_test_runs as recent_test_run_list %}
 {% if recent_test_run_list %}
 <div id="legend" style="margin: auto;"></div>
-<div id="placeholder" style="width: 80%; height: 250px; margin: auto;"></div>
+<div id="placeholder" style="height: 250px; margin: auto;"></div>
 <script type="text/javascript">
   $(function () {
     var css_id = "#placeholder";
@@ -64,6 +64,7 @@ 
     var options = {
       legend: {
         container: "#legend",
+        noColumns: 4,
       },
       grid: {
         show: true,
@@ -82,13 +83,25 @@ 
         bars: {
           show: true,
           fill: true,
-          barWidth: 0.5
+          barWidth: 0.5,
+          align: "center",
+          lineWidth: 0,
+          fillColor: {
+            colors: [
+              { opacity: 1 },
+              { opacity: 1 },
+              { opacity: 1 },
+              { opacity: 1 }
+            ]
+          }
         },
       },
       xaxis: {
+        label: "Day of testing",
         ticks: tick_label_list,
       },
       yaxis: {
+        labelPos: "low",
         label: "Number of test cases",
       },
     };
@@ -96,76 +109,57 @@ 
     $.plot($(css_id), data, options);
   }); 
 </script>
-<table style="margin: auto">
-  <caption>
-    History of testing {{ image_health.rootfs_type }}+{{ image_health.hwpack_type }} on a weekly basis.
-  </caption>
-  <tr>
-    <th>Date</th>
-    <th>Test</th>
-    <th colspan='2'>Results</th>
-  </tr>
-  {% regroup recent_test_run_list by analyzer_assigned_date|date:"Y W" as test_run_cluster_list %}
+<style type="text/css">
+  .result_0 {
+    background-color: #3aad3a;
+  }
+  
+  .result_1 {
+    background-color: #ff3800;
+  }
+  
+  .result_2 {
+    background-color: yellow;
+  }
+  
+  .result_3 {
+    background-color: #aaad9c;
+  }
+
+  .helper {
+    float: left;
+    height: 1em;
+    margin-left: 1px;
+  }
+</style>
+<table style="width: 100%">
+  {% regroup recent_test_run_list by analyzer_assigned_date|date:"Y-m-d" as test_run_cluster_list %}
   {% for test_run_cluster in test_run_cluster_list %}
   <tr>
-    <th colspan="4" style="text-align: left; border-bottom: 1px solid #333;"
-      >{{ test_run_cluster.grouper }}</th>
+    <th colspan="3" style="text-align: left; border-bottom: 1px solid #333;"
+      >Tests ran on {{ test_run_cluster.grouper }}</th>
   </tr>
   {% for test_run in test_run_cluster.list %}
   <tr>
-    <td style="width: 10ex"><a href="{{ test_run.get_absolute_url }}">{{ test_run.analyzer_assigned_date|date:"m.d" }}</a></td>
-    <td><a href="{{ test_run.test.get_absolute_urL}}">{{ test_run.test }}</a></td>
-    <td>{{ test_run.test_results.count }}</td>
+    {% with test_run.test_results.all.order_by as all_results %}
+    <td><a href="{{ test_run.get_absolute_url }}">{{ test_run.test }}</a></td>
+    <td>{{ all_results.count }}</td>
     <td>
-      {% with test_run.get_summary_results as summary %}
-      {% with 500 as max_width %}
-      {% if summary.total_multiplied > max_width %}
-        {% if summary.pass %}
-        <div
-          title="passed: {{ summary.pass }}" 
-          style="float:left; background-color: #3aad3a; height: 1em; width: {% widthratio summary.pass summary.total max_width %}px;"></div>
-        {% endif %}
-        {% if summary.fail %}
-        <div
-          title="failed: {{ summary.fail }}" 
-          style="margin-left: 1px; float:left; background-color: #ff3800; height: 1em; width: {% widthratio summary.fail summary.total max_width %}px;"></div>
-        {% endif %}
-        {% if summary.skip %}
-        <div
-          title="skipped: {{ summary.skip }}" 
-          style="margin-left: 1px; float:left; background-color: #ff3800; height: 1em; width: {% widthratio summary.skip summary.total max_width %}px;"></div>
-        {% endif %}
-        {% if summary.unknown %}
-        <div
-          title="unknown: {{ summary.unknown }}"
-          style="margin-left: 1px; float:left; background-color: #aaad9c; height: 1em; width: {% widthratio summary.unknown summary.total max_width %}px;"></div>
-        {% endif %}
-        <div
-          style="margin-left: 1em; float: left; font-size: 80%"
-          >{% trans "graph not to scale" %}</div>
+      {% spaceless %}
+      {% regroup all_results|dictsort:"result" by result as result_group_list %}
+      {% for result_group in result_group_list %}
+      {% if result_group.list|length > 300 %}
+      <div class="result_{{ result_group.grouper }} helper"
+        style="width: {% widthratio result_group.list|length all_results.count 190 %}px;"></div>
+      <div style="float: left; width: 2:0px; text-align: center">...</div>
+      <div class="result_{{ result_group.grouper }} helper"
+        style="width: {% widthratio result_group.list|length all_results.count 190 %}px;"></div>
       {% else %}
-        {% if summary.pass %}
-        <div
-          title="passed: {{ summary.pass }}" 
-          style="float:left; background-color: #3aad3a; height: 1em; width: {% widthratio summary.pass summary.total summary.total_multiplied %}px;"></div>
-        {% endif %}
-        {% if summary.fail %}
-        <div
-          title="failed: {{ summary.fail }}" 
-          style="margin-left: 1px; iloat:left; background-color: #ff3800; height: 1em; width: {% widthratio summary.fail summary.total summary.total_multiplied %}px;"></div>
-        {% endif %} 
-        {% if summary.skip %}
-        <div
-          title="skipped: {{ summary.skip }}" 
-          style="margin-left: 1px; float:left; background-color: #ff3800; height: 1em; width: {% widthratio summary.skip summary.total summary.total_multiplied %}px;"></div>
-        {% endif %}
-        {% if summary.unknown %}
-        <div
-          title="unknown: {{ summary.unknown }}"
-          style="margin-left: 1px; float:left; background-color: #aaad9c; height: 1em; width: {% widthratio summary.unknown summary.total summary.total_multiplied %}px;"></div>
-        {% endif %}
+      <div class="result_{{ result_group.grouper }} helper"
+        style="width: {% widthratio result_group.list|length all_results.count all_results.count %}px;"></div>
       {% endif %}
-      {% endwith %}
+      {% endfor %}
+      {% endspaceless %}
       {% endwith %}
     </td>
   </tr>