From 976e8b27deea19cf863f33d579f5a361817493ba Mon Sep 17 00:00:00 2001
From: Peter Amstutz <peter.amstutz@curoverse.com>
Date: Tue, 17 Jun 2014 13:11:20 +0000
Subject: [PATCH] 2883: Improved pagination control a bit, added search.

---
 .../app/assets/javascripts/log_viewer.js      | 23 +++++++++++++---
 .../app/assets/stylesheets/log_viewer.scss    | 10 +++++++
 .../app/views/jobs/_show_log.html.erb         | 27 ++++++++++---------
 3 files changed, 44 insertions(+), 16 deletions(-)

diff --git a/apps/workbench/app/assets/javascripts/log_viewer.js b/apps/workbench/app/assets/javascripts/log_viewer.js
index e89ac83c11..405c8ef637 100644
--- a/apps/workbench/app/assets/javascripts/log_viewer.js
+++ b/apps/workbench/app/assets/javascripts/log_viewer.js
@@ -231,6 +231,8 @@ function generateJobOverview(id, logViewer, taskState) {
 }
 
 function gotoPage(n, logViewer, page, id) {
+    if (n < 0) { return; }
+    if (n*page > logViewer.matchingItems.length) { return; }
     logViewer.page_offset = n;
     logViewer.show(n*page, page);
 }
@@ -238,15 +240,16 @@ function gotoPage(n, logViewer, page, id) {
 function updatePaging(id, logViewer, page) {
     var p = "";
     var i = logViewer.matchingItems.length;
-    for (var n = 0; (n*page) < i; n += 1) {
+    var n;
+    for (n = 0; (n*page) < i; n += 1) {
         if (n == logViewer.page_offset) {
-            p += " " + (n+1) + " ";
+            p += "<span class='log-viewer-page-num'>" + (n+1) + "</span> ";
         } else {
-            p += "<a href=\"#\" class='log-viewer-page-" + n + "'>" + (n+1) + "</a> ";
+            p += "<a href=\"#\" class='log-viewer-page-num log-viewer-page-" + n + "'>" + (n+1) + "</a> ";
         }
     }
     $(id).html(p);
-    for (var n = 0; (n*page) < i; n += 1) {
+    for (n = 0; (n*page) < i; n += 1) {
         (function(n) {
             $(".log-viewer-page-" + n).on("click", function() {
                 gotoPage(n, logViewer, page, id);
@@ -254,6 +257,18 @@ function updatePaging(id, logViewer, page) {
             });
         })(n);
     }
+
+    if (logViewer.page_offset == 0) {
+        $(".log-viewer-page-up").addClass("text-muted");
+    } else {
+        $(".log-viewer-page-up").removeClass("text-muted");
+    }
+
+    if (logViewer.page_offset == (n-1)) {
+        $(".log-viewer-page-down").addClass("text-muted");
+    } else {
+        $(".log-viewer-page-down").removeClass("text-muted");
+    }
 }
 
 function nextPage(logViewer, page, id) {
diff --git a/apps/workbench/app/assets/stylesheets/log_viewer.scss b/apps/workbench/app/assets/stylesheets/log_viewer.scss
index 4a3b2e10c2..318f6e7792 100644
--- a/apps/workbench/app/assets/stylesheets/log_viewer.scss
+++ b/apps/workbench/app/assets/stylesheets/log_viewer.scss
@@ -51,4 +51,14 @@
 
 .log-viewer-button {
   width: 12em;
+}
+
+.log-viewer-paging-div {
+  font-size: 18px;
+  text-align: center;
+}
+
+.log-viewer-page-num {
+  padding-left: .3em;
+  padding-right: .3em;
 }
\ No newline at end of file
diff --git a/apps/workbench/app/views/jobs/_show_log.html.erb b/apps/workbench/app/views/jobs/_show_log.html.erb
index c79f154aa5..2c060cde35 100644
--- a/apps/workbench/app/views/jobs/_show_log.html.erb
+++ b/apps/workbench/app/views/jobs/_show_log.html.erb
@@ -1,6 +1,6 @@
 <script>
 (function() {
-var pagesize = 100;
+var pagesize = 1000;
 var logViewer = new List('log-viewer', {
   valueNames: [ 'id', 'timestamp', 'taskid', 'message', 'type'],
   page: pagesize
@@ -65,6 +65,7 @@ $("#filter-all").on("click", function() {
 
 $("#filter-none").on("click", function() {
   $(".toggle-filter").each(function(i, f) { f.checked = false; console.log(f); });
+  $("#show-all-tasks").prop("checked", true);
   logViewer.filter(makeFilter());
 });
 
@@ -104,19 +105,21 @@ $("#set-show-failed-only").on("click", function() {
     <button id="set-show-failed-only" class="btn btn-danger" style="margin-top: 1em">
       Show failed task output only
     </button>
- <% end %>
+  <% end %>
 
   <div class="h3">Log
 
-<span class="pull-right">
-    <button id="filter-all" class="btn">
-      Select all
-    </button>
-    <button id="filter-none" class="btn">
-      Select none
-    </button>
-</span>
-</div>
+    <span class="pull-right">
+      <button id="filter-all" class="btn">
+        Select all
+      </button>
+      <button id="filter-none" class="btn">
+        Select none
+      </button>
+    </span>
+  </div>
+
+  <input class="search pull-right" style="margin-top: 1em" placeholder="Search" />
 
   <div>
     <div class="radio-inline log-viewer-button" style="margin-left: 10px">
@@ -159,7 +162,7 @@ $("#set-show-failed-only").on("click", function() {
 
   </div>
 
-  <div style="font-size: 18px">
+  <div class="log-viewer-paging-div">
     <a href="#" class="log-viewer-page-up"><span class='glyphicon glyphicon-arrow-up'></span></a>
     <span class="log-viewer-paging"></span>
     <a href="#" class="log-viewer-page-down"><span class='glyphicon glyphicon-arrow-down'></span></a>
-- 
2.30.2