Merge pull request #624 from kquick/job_headers

Add job status headers (web useability for red/green colorblindness).

src/root/common.tt

@@ -433,13 +433,27 @@ BLOCK renderEvals %]
   <table class="table table-condensed table-striped clickable-rows">
     <thead>
       <tr>
-        <th>#</th>
+        <th rowspan="2">#</th>
         [% IF !jobset && !build %]
-          <th>Jobset</th>
+          <th rowspan="2">Jobset</th>
         [% END %]
-        <th style="width: 10em">Date</th>
-        <th>Input changes</th>
-        <th colspan='2' style="width: 25em">Success</th>
+        <th rowspan="2" style="width: 10em">Date</th>
+        <th rowspan="2">Input changes</th>
+        <th colspan="3">Jobs</th>
+        <th rowspan="2">
+            <img src="[% c.uri_for("/static/images/delta.svg") %]" height="12" width="12" title="Delta" alt="Delta" class="build-status" />
+        </th>
+      </tr>
+      <tr>
+        <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-check-2714.svg") %]" height="12" width="12" title="Succeeded" alt="Succeeded" class="build-status" />
+        </th>
+        <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-red-x-274c.svg") %]" height="12" width="12" title="Failed" alt="Failed" class="build-status" />
+        </th>
+        <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-question-2754.svg") %]" height="12" width="12" title="Queued" alt="Queued" class="build-status" />
+        </th>
       </tr>
     </thead>
     <tbody>
@@ -465,9 +479,13 @@ BLOCK renderEvals %]
           </td>
           <td align='right' class="nowrap">
             <span class="label label-success">[% e.nrSucceeded %]</span>
+          </td>
+          <td align="right" class="nowrap">
             [% IF e.nrFailed > 0 %]
             <span class="label label-important">[% e.nrFailed %]</span>
             [% END %]
+          </td>
+          <td align="right" class="nowrap">
             [% IF e.nrScheduled > 0 %]
             <span class="label">[% e.nrScheduled %]</span>
             [% END %]
@@ -534,7 +552,18 @@ BLOCK renderJobsetOverview %]
       <th>Name</th>
       <th>Description</th>
       <th>Last evaluated</th>
-      <th colspan="2">Success</th>
+      <th style="width: 2em">
+            Jobs
+      </th>
+      <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-check-2714.svg") %]" height="12" width="12" title="Succeeded" alt="Succeeded" class="build-status" />
+      </th>
+      <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-red-x-274c.svg") %]" height="12" width="12" title="Failed" alt="Failed" class="build-status" />
+      </th>
+      <th style="width: 2em">
+            <img src="[% c.uri_for("/static/images/emojione-question-2754.svg") %]" height="12" width="12" title="Queued" alt="Queued" class="build-status" />
+      </th>
     </tr>
   </thead>
   <tbody>
@@ -572,9 +601,13 @@ BLOCK renderJobsetOverview %]
           [% IF j.get_column('nrsucceeded') > 0 %]
             <span class="label label-success">[% j.get_column('nrsucceeded') %]</span>
           [% END %]
+        </td>
+        <td>
           [% IF j.get_column('nrfailed') > 0 %]
             <span class="label label-important">[% j.get_column('nrfailed') %]</span>
           [% END %]
+        </td>
+        <td>
           [% IF j.get_column('nrscheduled') > 0 %]
             <span class="label label">[% j.get_column('nrscheduled') %]</span>
           [% END %]

src/root/static/css/hydra.css

@@ -143,6 +143,11 @@ td.step-status span.warn {
     font-weight: bold;
 }
 
+/* Assumes borders are never desired in multi-row table heads */
+.table thead th {
+    border-top: 0;
+}
+
 .date {
 	cursor: help;
 	border-bottom: 1px dotted #999;

src/root/static/images/delta.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" enable-background="new 0 0 64 64"><path stroke="#8d8397" stroke-width="12" fill="none" d="m32 2l-20 60h40z"/></svg>