Bug 1087578 - Add a reftest link in logviewer

This adds a reftest analyzer button to logviewer, a provider for it
and for its equivalent reftest button in the job details panel.

ui/css/logviewer.css

@@ -81,6 +81,7 @@ body {
 }
 .run-data .steps-data {
     max-height: 210px;
+    min-width: 400px;
     overflow: auto;
     border-color: #dddddd;
     border-width: 1px;
@@ -112,27 +113,31 @@ body {
     border-color: #d58512;
 }
 
-.logviewer-stepbar {
+.logviewer-actionbar {
+    min-width: 410px;
+}
+
+.logviewer-actionbtn {
     display: inline-block;
     margin: 8px 8px 8px 0px;
     padding: 6px 8px;
     border: 1px solid #dddddd;
 }
 
-.logviewer-stepbar span {
+.logviewer-actionbtn span {
     color: #9fa3a5;
 }
 
-.logviewer-stepbar a:hover,
-.logviewer-stepbar a:focus {
+.logviewer-actionbtn a:hover,
+.logviewer-actionbtn a:focus {
     text-decoration: none;
 }
 
-.logviewer-stepbar .raw-log {
+.logviewer-actionbtn .actionbtn-icon {
     padding-right: 5px;
 }
 
-.logviewer-stepbar input[type="checkbox"] {
+.logviewer-actionbtn input[type="checkbox"] {
     margin: 0;
 }
 

ui/js/controllers/logviewer.js

@@ -7,11 +7,11 @@
 logViewerApp.controller('LogviewerCtrl', [
     '$anchorScroll', '$http', '$location', '$q', '$rootScope', '$scope',
     '$timeout', 'ThJobArtifactModel', 'ThLog', 'ThLogSliceModel', 'ThJobModel',
-    'dateFilter', 'thJobSearchStr', 'ThResultSetModel', 'thDateFormat',
+    'dateFilter', 'thJobSearchStr', 'ThResultSetModel', 'thDateFormat', 'thReftestStatus',
     function Logviewer(
         $anchorScroll, $http, $location, $q, $rootScope, $scope,
         $timeout, ThJobArtifactModel, ThLog, ThLogSliceModel, ThJobModel,
-        dateFilter, thJobSearchStr, ThResultSetModel, thDateFormat) {
+        dateFilter, thJobSearchStr, ThResultSetModel, thDateFormat, thReftestStatus) {
 
         var $log = new ThLog('LogviewerCtrl');
 
@@ -190,6 +190,13 @@ logViewerApp.controller('LogviewerCtrl', [
                     {label: "End", value: dateFilter(job.end_timestamp*1000, thDateFormat)}
                 ];
 
+                // Test to expose the reftest button in the logviewer actionbar
+                $scope.isReftest = function() {
+                    if (job.job_group_name) {
+                        return thReftestStatus(job);
+                    }
+                };
+
                 // get the revision and linkify it
                 ThResultSetModel.getResultSet($scope.repoName, job.result_set_id).then(function(data){
                     var revision = data.data.revision;

ui/js/providers.js

@@ -262,3 +262,13 @@ treeherder.provider('thAggregateIds', function() {
             };
     };
 });
+
+treeherder.provider('thReftestStatus', function() {
+    this.$get = function() {
+        return function(job) {
+            if (job.job_group_name) {
+                return (job.job_group_name.toLowerCase().indexOf('reftest') !== -1);
+            }
+        };
+    };
+});

ui/logviewer.html

@@ -5,6 +5,7 @@
         <title ng-bind="::logViewerTitle">Log viewer</title>
         <!-- build:css css/logviewer.min.css -->
         <link href="vendor/css/bootstrap.css" rel="stylesheet" media="screen">
+        <link href="vendor/css/font-awesome.css" rel="stylesheet" media="screen">
         <link href="css/treeherder.css" rel="stylesheet" type="text/css">
         <link href="css/logviewer.css" rel="stylesheet" type="text/css">
         <!-- endbuild -->

ui/partials/logviewer/lvLogSteps.html

@@ -35,18 +35,32 @@
     </div>
 </div>
 
-<div class="logviewer-stepbar">
-    <a href="{{::artifact.logurl}}">
-        <span class="glyphicon glyphicon-align-left raw-log"></span>
-        <span>open raw log</span>
-    </a>
-</div>
+<div class="logviewer-actionbar">
+    <!-- Raw log button -->
+    <div class="logviewer-actionbtn">
+        <a href="{{::artifact.logurl}}">
+            <span class="glyphicon glyphicon-align-left actionbtn-icon"></span>
+            <span>open raw log</span>
+        </a>
+    </div>
 
-<div ng-if="artifact && hasFailedSteps()"
-     class="logviewer-stepbar">
-    <input type="checkbox"
-           ng-model="showSuccessful"
-           ng-change="toggleSuccessfulSteps()" />
+    <!-- Ref test button -->
+    <div ng-if="isReftest()"
+         class="logviewer-actionbtn">
+        <a title="Launch the Reftest Analyser in a new window"
+           target="_blank"
+           href="http://hg.mozilla.org/mozilla-central/raw-file/tip/layout/tools/reftest/reftest-analyzer.xhtml#logurl={{::artifact.logurl}}&only_show_unexpected=1">
+            <span class="fa fa-bar-chart-o actionbtn-icon"></span>
+            <span>open analyser</span>
+        </a>
+    </div>
 
-    <span>show successful steps</span>
+    <!-- Show successful steps button -->
+    <div ng-if="artifact && hasFailedSteps()"
+         class="logviewer-actionbtn">
+        <input type="checkbox"
+               ng-model="showSuccessful"
+               ng-change="toggleSuccessfulSteps()" />
+        <span>show successful steps</span>
+    </div>
 </div>

ui/plugins/controller.js

@@ -10,14 +10,14 @@ treeherder.controller('PluginCtrl', [
     'numberFilter', 'ThBugJobMapModel', 'thResultStatus', 'thJobFilters',
     'ThResultSetModel', 'ThLog', '$q', 'thPinboard', 'ThJobArtifactModel',
     'thBuildApi', 'thNotify', 'ThJobLogUrlModel', 'ThModelErrors', 'thTabs',
-    '$timeout', 'thJobSearchStr',
+    '$timeout', 'thJobSearchStr', 'thReftestStatus',
     function PluginCtrl(
         $scope, $rootScope, $location, thUrl, ThJobClassificationModel,
         thClassificationTypes, ThJobModel, thEvents, dateFilter, thDateFormat,
         numberFilter, ThBugJobMapModel, thResultStatus, thJobFilters,
         ThResultSetModel, ThLog, $q, thPinboard, ThJobArtifactModel,
         thBuildApi, thNotify, ThJobLogUrlModel, ThModelErrors, thTabs,
-        $timeout, thJobSearchStr) {
+        $timeout, thJobSearchStr, thReftestStatus) {
 
         var $log = new ThLog("PluginCtrl");
 
@@ -329,14 +329,10 @@ treeherder.controller('PluginCtrl', [
             thBuildApi.cancelAllJobs($scope.repoName, rs.revision);
         };
 
-        /**
-         * Test whether or not the selected job is a reftest
-         */
+        // Test to expose the reftest button in the job details navbar
         $scope.isReftest = function() {
             if ($scope.selectedJob) {
-                return ($scope.selectedJob.job_group_name.indexOf("Reftest") !== -1);
-            } else {
-                return false;
+                return thReftestStatus($scope.selectedJob);
             }
         };
 

ui/plugins/pluginpanel.html

@@ -100,8 +100,8 @@
               <span class="fa fa-repeat"></span>
             </a>
           </li>
-          <li ng-show="isReftest()" ng-repeat="job_log_url in job_log_urls">
-            <a title="Launch the Reftest Analyser in a new page"
+          <li ng-if="isReftest()" ng-repeat="job_log_url in job_log_urls">
+            <a title="Launch the Reftest Analyser in a new window"
                target="_blank"
                href="http://hg.mozilla.org/mozilla-central/raw-file/tip/layout/tools/reftest/reftest-analyzer.xhtml#logurl={{::job_log_url.url}}&only_show_unexpected=1">
               <span class="fa fa-bar-chart-o"></span>