trooper-o-matic: Add patch attempt timeline view to CQ graphs

appengine/trooper_o_matic/ui/tom-patch-summary.html

Index: appengine/trooper_o_matic/ui/tom-patch-summary.html
diff --git a/appengine/trooper_o_matic/ui/tom-patch-summary.html b/appengine/trooper_o_matic/ui/tom-patch-summary.html
index 5d2a9b2310c59190e2e77fa303552fd1c9593562..a1eb326ec006ce61419d0d27222d717afe5716a0 100644
--- a/appengine/trooper_o_matic/ui/tom-patch-summary.html
+++ b/appengine/trooper_o_matic/ui/tom-patch-summary.html
@@ -17,8 +17,8 @@ found in the LICENSE file.
         <div class="patch-cell">
           <a href="{{ model._patchURL }}" title="{{ title }}">{{ title }}</a><br>
           <a href="{{ model._patchURL }}">#{{ model.patchset }}</a>
-          <a href="//chromium-cq-status.appspot.com/patch-status/{{ model.issue }}/{{ model.patchset }}">[CQ Status]</a>
-          <a href="//chromium-cq-status.appspot.com/recent#issue={{ model.issue }},patchset={{ model.patchset }}">[CQ Logs]</a>
+          <a href="{{ model._statusURL }}">[CQ Status]</a>
+          <a href="{{ model._recentURL }}">[CQ Logs]</a>
         </div>
       </template>
 
@@ -29,14 +29,6 @@ found in the LICENSE file.
       </template>
 
       <template if="{{ model._summary }}">
-        <template if="{{ viewMenu.value == 'summary' }}">
-          <div class="column-container">
-            <template repeat="{{ value in model._columnValues }}">
-              <div class="column">{{ value }}</div>
-            </template>
-          </div>
-        </template>
-
         <template if="{{ viewMenu.value == 'jobs' }}">
           <div class="column grow builder-bubbles">
             <template repeat="{{ builder in model._jobViewBuilderBuilds[viewMenu.subMenu.value] }}">
@@ -54,6 +46,33 @@ found in the LICENSE file.
             </template>
           </div>
         </template>
+
+        <template if="{{ viewMenu.value == 'timeline' }}">
+          <template bind="{{ model.list[viewMenu.subMenu.value] as interval }}">
+            <div style="position: relative; width: 100%; overflow: hidden;">
+              <template repeat="{{ attempt in model._summary.attempts }}">
+                <a
+                  href="{{ model._statusURL }}#{{ attempt.number }}"
+                  class="attempt success-{{ attempt.success }}"
+                  style="
+                    left: {{ 100 * (attempt.begin - interval.begin) / (interval.end - interval.begin) }}%;
+                    width: {{ 100 * attempt.durations.total / (interval.end - interval.begin) }}%;"
+                  title="{{ attempt | attemptText }}">

[ojan, 2015/01/15 02:48:33]

This won't bind correctly if you change a member of attempt (e.g.
attempt.success or attempt.durations.total), but don't actually replace the
whole attempt object since the binding is based off object identity.

[alancutter (OOO until 2018), 2015/01/19 23:19:01]

Done.

+                  {{ attempt | attemptText }}
+                </a>
+              </template>
+            </div>
+          </template>
+        </template>
+
+        <template if="{{ viewMenu.value == 'summary' }}">
+          <div class="column-container">
+            <template repeat="{{ value in model._columnValues }}">
+              <div class="column">{{ value }}</div>
+            </template>
+          </div>
+        </template>
+
       </template>
     </div class="row">
   </template>
@@ -62,6 +81,32 @@ found in the LICENSE file.
       toFixed: function(number) {
         return number.toFixed();
       },
+      attemptText: function(attempt) {
+        return '{1} ({2}min)'.assign(
+            this.attemptSuccessText(attempt),
+            (attempt.durations.total / 60).toFixed());
+      },
+      attemptSuccessText: function(attempt) {
+        switch (attempt.success) {
+          case true:
+            return 'Success';
+          case null:
+            return 'Running';
+          default:
+            var text = 'Fail';
+            var reason = attempt.fail_reason;
+            if (reason && reason.fail_type) {
+              text += ': ';
+              if (reason.fail_type === 'failed_jobs') {
+                var getBuilder = function(detail) { return detail.builder };
+                text += reason.fail_details.map(getBuilder).join(' ');
+              } else {
+                text += reason.fail_type;
+              }
+            }
+            return text;
+        }
+      }
     });
   </script>
 </polymer-element>