Bug 1193216 - Improve log not found notifications in logviewer

ui/css/logviewer.css

@@ -62,6 +62,11 @@ body {
     vertical-align: middle;
 }
 
+/* Override the position of the shared notification partial */
+#notification-box {
+    top: 285px;
+}
+
 .lv-line-no {
     width: 3em;
 }
@@ -164,6 +169,15 @@ body {
     padding-right: 5px;
 }
 
+.actionbtn-warning {
+    margin-right: 1px;
+    padding: 2px;
+    background-color: #fcf8e3;
+    border: 1px solid #fbd890;
+    border-radius: 2px;
+    color: #8a6d3b;
+}
+
 .lv-line-no.label {
     border-radius: 0px;
     margin: 0em 0.6em 0em 0em;

ui/js/controllers/logviewer.js

@@ -6,11 +6,11 @@
 
 logViewerApp.controller('LogviewerCtrl', [
     '$anchorScroll', '$http', '$location', '$q', '$rootScope', '$scope',
-    '$timeout', 'ThJobArtifactModel', 'ThLog', 'ThLogSliceModel', 'ThJobModel',
+    '$timeout', 'ThJobArtifactModel', 'ThLog', 'ThLogSliceModel', 'ThJobModel', 'thNotify',
     'dateFilter', 'thJobSearchStr', 'ThResultSetModel', 'thDateFormat', 'thReftestStatus',
     function Logviewer(
         $anchorScroll, $http, $location, $q, $rootScope, $scope,
-        $timeout, ThJobArtifactModel, ThLog, ThLogSliceModel, ThJobModel,
+        $timeout, ThJobArtifactModel, ThLog, ThLogSliceModel, ThJobModel, thNotify,
         dateFilter, thJobSearchStr, ThResultSetModel, thDateFormat, thReftestStatus) {
 
         var $log = new ThLog('LogviewerCtrl');
@@ -148,6 +148,7 @@ logViewerApp.controller('LogviewerCtrl', [
                 }, function (error) {
                     $scope.loading = false;
                     $scope.logError = true;
+                    thNotify.send("The log no longer exists or has expired", 'warning', 'true');
                     deferred.reject();
                 });
             } else {

ui/logviewer.html

@@ -41,10 +41,12 @@
 
           <!-- Raw log button -->
           <li>
-            <a title="Open the raw log in a new window"
+            <a title="{{logError ? 'Raw log link no longer exists or has expired (click for path)' :
+                      'Open the raw log in a new window'}}"
                target="_blank"
                href="{{::artifact.logurl}}">
-              <span class="fa fa-file-text-o actionbtn-icon"></span>
+              <span ng-class="logError ? 'fa-warning actionbtn-warning' : 'fa-file-text-o actionbtn-icon'"
+                    class="fa"></span>
               <span>open raw log</span>
             </a>
           </li>
@@ -109,6 +111,8 @@
          lv-log-lines="displayedLogLines">
     </div>
 
+    <th-notification-box></th-notification-box>
+
     <!-- build:js js/logviewer.min.js -->
     <script src="vendor/jquery-2.1.3.js"></script>
     <script src="vendor/angular/angular.js"></script>
@@ -131,6 +135,7 @@
     <script src="js/directives/treeherder/log_viewer_infinite_scroll.js"></script>
     <script src="js/directives/treeherder/log_viewer_lines.js"></script>
     <script src="js/directives/treeherder/log_viewer_steps.js"></script>
+    <script src="js/directives/treeherder/main.js"></script>
 
     <!-- Main services -->
     <script src="js/services/main.js"></script>

ui/partials/logviewer/lvLogLines.html

@@ -1,9 +1,6 @@
 <div class="lv-log-msg lv-log-overlay"
      ng-if="loading"> Loading... </div>
 
-<div class="lv-log-msg lv-log-overlay lv-log-error"
-     ng-if="logError"> Log could not be found </div>
-
 <div ng-repeat="lv_line in displayedLogLines"
      ng-class="{'text-danger': (lv_line.hasError == true),
                 'lv-selected-lines': (displayedStep.order === lv_line.index)}"