From c9752f3e6605bd7c4bd58f81195f84a10ce21e7d Mon Sep 17 00:00:00 2001
From: Allison Randal <allison@lohutok.net>
Date: Sat, 1 Mar 2014 16:56:13 -0800
Subject: [PATCH] Adds time-view filter to uncategorized page

At jog0's request, this bit of javascript for the list of
Uncategorized failed jobs adds a feature to limit the time period of
failures displayed (without reloading the page) to 24 hours, 2 days,
or 1 week, in addition to the usual 2 week limit.

Change-Id: I0b6e9b0ea8d0a8eb1ba6d2e1c47beb0803e3ec33
---
 web/share/templates/uncategorized.html | 44 ++++++++++++++++++++++++--
 1 file changed, 42 insertions(+), 2 deletions(-)

diff --git a/web/share/templates/uncategorized.html b/web/share/templates/uncategorized.html
index f02e6a55..a4b57bf8 100644
--- a/web/share/templates/uncategorized.html
+++ b/web/share/templates/uncategorized.html
@@ -11,6 +11,42 @@
      padding-top: 1em;
   }
 </style>
+<script type="text/javascript">
+    function filter_log_age(ev, days) {
+        ev.preventDefault();
+        var generated = $('#generated-date').text();
+        var gen_date = Date.parse(generated);
+        $( "li.log-link" ).each(function() {
+            if (! $( this ).hasClass("dated") ) {
+                var timestamp = $( this ).text().substr(0,16);
+                var item_date = Date.parse(timestamp);
+                var date_delta = (gen_date - item_date) / 86400000;
+                $( this ).addClass("dated");
+                $( this ).attr("age", date_delta);
+            }
+            if ($( this ).attr("age") > days ) {
+                $( this ).hide();
+            } else {
+                $( this ).show();
+            }
+        });
+    }
+
+    $(function() {
+        $("#24hours").click(function(e) {
+          filter_log_age(e, 1);
+        });
+        $("#2days").click(function(e) {
+          filter_log_age(e, 2);
+        });
+        $("#1week").click(function(e) {
+          filter_log_age(e, 7);
+        });
+        $("#2weeks").click(function(e) {
+          filter_log_age(e, 14);
+        });
+    });
+</script>
 <div class="container">
   <ul class="nav nav-tabs">
     <li><a href="../index.html">All Pipelines</a></li>
@@ -33,7 +69,11 @@ Overall Categorization Rate: {{ rate['overall'] }}%
   Total: {{ total }} - Found: {{ count }} = Unclassifed: {{ uncounted }}
 </p>
 <p>
-  Generated at: {{ generated_at }}
+  Generated at: <span id="generated-date">{{ generated_at }}</span>
+  (View: <a id="24hours" href="#">24 hours</a>,
+         <a id="2days" href="#">2 days</a>,
+         <a id="1week" href="#">1 week</a>,
+         <a id="2weeks" href="#">2 weeks</a>)
 </p>
 {% for job in jobs %}
 <a name="{{job[0]}}"></a>
@@ -42,7 +82,7 @@ Overall Categorization Rate: {{ rate['overall'] }}%
 <ul>
   {% for url in urls[job[0]] %}
 
-  <li>{{url['timestamp']}}: <a href="{{ url['log'] }}">{{ url['log'] }}</a></li>
+  <li class="log-link">{{url['timestamp']}}: <a href="{{ url['log'] }}">{{ url['log'] }}</a></li>
   {% endfor %}
 </ul>
 {% endfor %}