[GOM] Warn when the roll is running behind

Tools/GardeningServer/scripts/ui.js

Index: Tools/GardeningServer/scripts/ui.js
diff --git a/Tools/GardeningServer/scripts/ui.js b/Tools/GardeningServer/scripts/ui.js
index a10e422f1fea9b5bc5923511417954bd57459819..70b056349f68f20046b30b193af0aecc5e6ffbb6 100644
--- a/Tools/GardeningServer/scripts/ui.js
+++ b/Tools/GardeningServer/scripts/ui.js
@@ -351,13 +351,32 @@ ui.StatusArea = base.extends('div',  {
 });
 
 ui.revisionDetails = base.extends('span', {
-    updateUIIfDone: function() {
+    // We only support 2 levels of visual escalation levels: warning and critical.
+    warnRollRevisionSpanThreshold: 45,
+    criticalRollRevisionSpanThreshold: 70,
+    styleForUrgencyLevel: function(rollRevisionSpan) {
+        if (rollRevisionSpan < this.criticalRollRevisionSpanThreshold)
+            return { backgroundColor: "orange", fontSize: "2em" };
+        return { backgroundColor: "red", fontSize: "3em" };

[ojan, 2014/06/04 19:58:40]

Nit: can we use the buildbot colors for consistency?

#ffc343 for orange
#e98080 for red

Can we make it blink too? Just for fun. :)

Also, can we use classNames and rules in style-sheets for this instead?

[Julien - ping for review, 2014/06/05 23:20:53]

Good idea!
I was going to agree as it's fun but then I thought about it: we are trying to
_improve_ the usability of the tool. There is a reason why <blink> died and
that's because it introduces a lot of visual distraction. What we want is just
visual contrast and that's what we have with the existing change.
Good idea!

+    },
+    updateUIIfDone: function(totRevision) {
         if (this.roll === undefined || this.lastRolledRevision === undefined)
             return;
 
         this.appendChild(document.createElement("br"));
         this.appendChild(document.createTextNode('Last roll is to '));
         this.appendChild(ui.createLinkNode(trac.changesetURL(this.lastRolledRevision), this.lastRolledRevision));
+        var rollRevisionSpan = totRevision - this.lastRolledRevision;
+        // Don't clutter the UI if we haven't run behind.
+        if (rollRevisionSpan > this.warnRollRevisionSpanThreshold) {
+            var wrapper = document.createElement("b");
+            wrapper.style.color = "white";
+            var wrapperStyle = this.styleForUrgencyLevel(rollRevisionSpan);
+            wrapper.style.backgroundColor = wrapperStyle.backgroundColor;
+            wrapper.style.fontSize = wrapperStyle.fontSize;

[ojan, 2014/06/04 19:58:40]

Ditto on the using stylesheets thing.

[Julien - ping for review, 2014/06/05 23:20:53]

Done.

+            wrapper.appendChild(document.createTextNode("(" + rollRevisionSpan + " revisions behind)"));
+            this.appendChild(wrapper);
+        }
         this.appendChild(document.createTextNode(', current autoroll '));
         if (this.roll) {
             var linkText = "" + this.roll.fromRevision + ":" + this.roll.toRevision;
@@ -426,12 +445,12 @@ ui.revisionDetails = base.extends('span', {
 
         checkout.lastBlinkRollRevision().then(function(revision) {
             theSpan.lastRolledRevision = revision;
-            theSpan.updateUIIfDone();
+            theSpan.updateUIIfDone(totRevision);
         }, function() {});
 
         rollbot.fetchCurrentRoll().then(function(roll) {
             theSpan.roll = roll;
-            theSpan.updateUIIfDone();
+            theSpan.updateUIIfDone(totRevision);
         });
     }
 });