Przeglądaj źródła

HUE-1166 [jb] Ajax refresh log page

Added ajax refresh and fixed size window
Fixed bug on task attempt counter page
Enrico Berti 12 lat temu
rodzic
commit
f9a62458ab

+ 84 - 34
apps/jobbrowser/src/jobbrowser/templates/attempt_logs.mako

@@ -116,42 +116,92 @@ ${ line | unicode,trim }
     </div>
 </div>
 
+<script src="/jobbrowser/static/js/utils.js" type="text/javascript" charset="utf-8"></script>
+
 <script type="text/javascript" charset="utf-8">
-    $(document).ready(function(){
-        $("#metadataTable").dataTable({
-            "bPaginate": false,
-            "bLengthChange": false,
-            "bInfo": false,
-            "bAutoWidth": false,
-            "bFilter": false,
-            "aoColumns": [
-                { "sWidth": "30%" },
-                { "sWidth": "70%" }
-            ],
-            "oLanguage": {
-                "sEmptyTable": "${_('No data available')}",
-                "sZeroRecords": "${_('No matching records')}",
-            }
-        });
-
-        $(".taskCountersTable").dataTable({
-            "bPaginate": false,
-            "bLengthChange": false,
-            "bInfo": false,
-            "bFilter": false,
-            "bAutoWidth": false,
-            "aoColumns": [
-                { "sWidth": "30%" },
-                { "sWidth": "70%" }
-            ],
-            "oLanguage": {
-                "sEmptyTable": "${_('No data available')}",
-                "sZeroRecords": "${_('No matching records')}",
-            }
-        });
-
-        $.jHueScrollUp();
+  $(document).ready(function () {
+    $("#metadataTable").dataTable({
+      "bPaginate": false,
+      "bLengthChange": false,
+      "bInfo": false,
+      "bAutoWidth": false,
+      "bFilter": false,
+      "aoColumns": [
+        { "sWidth": "30%" },
+        { "sWidth": "70%" }
+      ],
+      "oLanguage": {
+        "sEmptyTable": "${_('No data available')}",
+        "sZeroRecords": "${_('No matching records')}",
+      }
+    });
+
+    $(".taskCountersTable").dataTable({
+      "bPaginate": false,
+      "bLengthChange": false,
+      "bInfo": false,
+      "bFilter": false,
+      "bAutoWidth": false,
+      "aoColumns": [
+        { "sWidth": "30%" },
+        { "sWidth": "70%" }
+      ],
+      "oLanguage": {
+        "sEmptyTable": "${_('No data available')}",
+        "sZeroRecords": "${_('No matching records')}",
+      }
+    });
+
+    refreshLogs();
+    var logsRefreshInterval = window.setInterval(function () {
+      refreshLogs();
+    }, 1000);
+
+    $(document).on("stopLogsRefresh", function () {
+      window.clearInterval(logsRefreshInterval);
     });
+
+    initLogsElement($("#logsDiagnostic pre"));
+    initLogsElement($("#logsStdOut pre"));
+    initLogsElement($("#logsStdErr pre"));
+    initLogsElement($("#logsSysLog pre"));
+
+    function refreshLogs() {
+      $.getJSON("?format=json", function (data) {
+        if (data && data.logs && data.logs.length > 3) {
+          var log_diagnostic = data.logs[0];
+          var log_stdout = data.logs[1];
+          var log_stderr = data.logs[2];
+          var log_syslog = data.logs[3];
+
+          appendAndScroll($("#logsDiagnostic pre"), log_diagnostic);
+          appendAndScroll($("#logsStdOut pre"), log_stdout);
+          appendAndScroll($("#logsStdErr pre"), log_stderr);
+          appendAndScroll($("#logsSysLog pre"), log_syslog);
+
+          if (!data.isRunning) {
+            $(document).trigger("stopLogsRefresh");
+          }
+        }
+        else {
+          $(document).trigger("stopLogsRefresh");
+        }
+      });
+    }
+
+    $(document).on("resized", function () {
+      resizeLogs($("#logsDiagnostic pre"));
+      resizeLogs($("#logsStdOut pre"));
+      resizeLogs($("#logsStdErr pre"));
+      resizeLogs($("#logsSysLog pre"));
+    });
+
+    $("a[data-toggle='tab']").on("shown", function (e) {
+      resizeLogs($($(e.target).attr("href")).find("pre"));
+    });
+
+    $.jHueScrollUp();
+  });
 </script>
 
 ${ commonfooter(messages) | n,unicode }

+ 80 - 37
apps/jobbrowser/src/jobbrowser/templates/job_attempt_logs.mako

@@ -69,45 +69,88 @@ ${ commonheader(_('Job Browser - Job Attempt: %(attempt_index)s') % {'attempt_in
     </div>
 </div>
 
+<script src="/jobbrowser/static/js/utils.js" type="text/javascript" charset="utf-8"></script>
+
 <script type="text/javascript" charset="utf-8">
-    $(document).ready(function(){
-        $("#metadataTable").dataTable({
-            "bPaginate": false,
-            "bLengthChange": false,
-            "bInfo": false,
-            "bAutoWidth": false,
-            "bFilter": false,
-            "aoColumns": [
-                { "sWidth": "30%" },
-                { "sWidth": "70%" }
-            ]
-        });
-
-        $(".taskCountersTable").dataTable({
-            "bPaginate": false,
-            "bLengthChange": false,
-            "bInfo": false,
-            "bFilter": false,
-            "bAutoWidth": false,
-            "aoColumns": [
-                { "sWidth": "30%" },
-                { "sWidth": "70%" }
-            ]
-        });
-
-        // From 15s to less than 5s display time with async
-        $.get('${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='syslog', offset=0) }', function(data) {
-            $('#syslog-container').html(data['log']);
-        });
-        $.get('${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='stdout', offset=0) }', function(data) {
-            $('#stdout-container').html(data['log']);
-        });
-		$.get('${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='stderr', offset=0) }', function(data) {
-		    $('#stderr-container').html(data['log']);
-		});
-
-		$.jHueScrollUp();
+  $(document).ready(function () {
+    $("#metadataTable").dataTable({
+      "bPaginate": false,
+      "bLengthChange": false,
+      "bInfo": false,
+      "bAutoWidth": false,
+      "bFilter": false,
+      "aoColumns": [
+        { "sWidth": "30%" },
+        { "sWidth": "70%" }
+      ]
+    });
+
+    $(".taskCountersTable").dataTable({
+      "bPaginate": false,
+      "bLengthChange": false,
+      "bInfo": false,
+      "bFilter": false,
+      "bAutoWidth": false,
+      "aoColumns": [
+        { "sWidth": "30%" },
+        { "sWidth": "70%" }
+      ]
+    });
+
+    // From 15s to less than 5s display time with async
+
+    refreshLogs();
+    var logsRefreshInterval = window.setInterval(function () {
+      refreshLogs();
+    }, 5000);
+
+    $(document).on("stopLogsRefresh", function () {
+      window.clearInterval(logsRefreshInterval);
     });
+
+    initLogsElement($("#syslog-container"));
+    initLogsElement($("#stdout-container"));
+    initLogsElement($("#stderr-container"));
+
+    function refreshLogs() {
+      $.getJSON("${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='syslog', offset=0) }", function (data) {
+        if (data && data.log) {
+          appendAndScroll($("#syslog-container"), data.log);
+        }
+        else {
+          $(document).trigger("stopLogsRefresh");
+        }
+      });
+      $.getJSON("${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='stdout', offset=0) }", function (data) {
+        if (data && data.log) {
+          appendAndScroll($("#stdout-container"), data.log);
+        }
+        else {
+          $(document).trigger("stopLogsRefresh");
+        }
+      });
+      $.getJSON("${ url("jobbrowser.views.job_attempt_logs_json", job=job.jobId, attempt_index=attempt_index, name='stderr', offset=0) }", function (data) {
+        if (data && data.log) {
+          appendAndScroll($("#stderr-container"), data.log);
+        }
+        else {
+          $(document).trigger("stopLogsRefresh");
+        }
+      });
+    }
+
+    $(document).on("resized", function () {
+      resizeLogs($("#syslog-container"));
+      resizeLogs($("#stdout-container"));
+      resizeLogs($("#stderr-container"));
+    });
+
+    $("a[data-toggle='tab']").on("shown", function (e) {
+      resizeLogs($($(e.target).attr("href")).find("pre"));
+    });
+
+    $.jHueScrollUp();
+  });
 </script>
 
 ${ commonfooter(messages) | n,unicode }

+ 6 - 0
apps/jobbrowser/src/jobbrowser/views.py

@@ -308,6 +308,12 @@ def single_task_attempt_logs(request, job, taskid, attemptid):
 
   if request.GET.get('format') == 'python':
     return context
+  elif request.GET.get('format') == 'json':
+    response = {
+      "logs": logs,
+      "isRunning": job.status.lower() in ('running', 'pending', 'prep')
+    }
+    return HttpResponse(json.dumps(response), mimetype="application/json")
   else:
     return render("attempt_logs.mako", request, context)
 

+ 51 - 0
apps/jobbrowser/static/js/utils.js

@@ -0,0 +1,51 @@
+// Licensed to Cloudera, Inc. under one
+// or more contributor license agreements.  See the NOTICE file
+// distributed with this work for additional information
+// regarding copyright ownership.  Cloudera, Inc. licenses this file
+// to you under the Apache License, Version 2.0 (the
+// "License"); you may not use this file except in compliance
+// with the License.  You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+function initLogsElement(element) {
+  element.data("logsAtEnd", true);
+  element.scroll(function () {
+    element("logsAtEnd", ($(this).scrollTop() + $(this).height() + 20 >= $(this)[0].scrollHeight));
+  });
+  element.css("overflow", "auto").height($(window).height() - element.offset().top - 50);
+}
+
+function appendAndScroll(element, logs) {
+  var newLines = logs.split("\n").slice(element.text().split("\n").length);
+  element.text(element.text() + newLines.join("\n"));
+  if (element.data("logsAtEnd")) {
+    element.scrollTop(element[0].scrollHeight - element.height());
+  }
+}
+
+function resizeLogs(element) {
+  element.css("overflow", "auto").height($(window).height() - element.offset().top - 50);
+}
+
+var resizeTimeout = -1;
+var winWidth = $(window).width();
+var winHeight = $(window).height();
+
+$(window).on("resize", function () {
+  window.clearTimeout(resizeTimeout);
+  resizeTimeout = window.setTimeout(function () {
+    // prevents endless loop in IE8
+    if (winWidth != $(window).width() || winHeight != $(window).height()) {
+      $(document).trigger("resized");
+      winWidth = $(window).width();
+      winHeight = $(window).height();
+    }
+  }, 200);
+});