report running state, only show spinner when actually running

src/laminar.cpp

@@ -156,6 +156,7 @@ void Laminar::sendStatus(LaminarClient* client) {
             j.set("queued", run->startedAt - run->queuedAt);
             j.set("started", run->startedAt);
             j.set("reason", run->reason());
+            j.set("result", to_string(RunState::RUNNING));
             db->stmt("SELECT completedAt - startedAt FROM builds WHERE name = ? ORDER BY completedAt DESC LIMIT 1")
              .bind(run->name)
              .fetch<int>([&](int etc){
@@ -188,6 +189,7 @@ void Laminar::sendStatus(LaminarClient* client) {
             j.set("number", run->build);
             j.set("node", run->node->name);
             j.set("started", run->startedAt);
+            j.set("result", to_string(RunState::RUNNING));
             j.set("reason", run->reason());
             j.EndObject();
         }

src/resources/js/app.js

@@ -306,7 +306,10 @@ angular.module('laminar',['ngRoute','ngSanitize'])
 .run(function($rootScope) {
 	angular.extend($rootScope, {
 		runIcon: function(result) {
-			return result === "success" ? '<span style="color:forestgreen;font-family:\'Zapf Dingbats\';">✔</span>' : result === "failed" ? '<span style="color:crimson;">✘</span>' : '';
+			return result === "success" ? '<span style="color:forestgreen;font-family:\'Zapf Dingbats\';">✔</span>' : result === "failed" || result === "aborted" ? '<span style="color:crimson;">✘</span>' : '';
+		},
+		runComplete: function(run) {
+			return !!run && (run.result === 'aborted' || run.result === 'failed' || run.result === 'success');
 		},
 		formatDate: function(unix) {
 			// TODO reimplement when toLocaleDateString() accepts formatting

src/resources/tpl/run.html

@@ -1,7 +1,7 @@
 <div class="container-fluid">
 <div class="row">
 <div class="col-sm-5 col-md-6 col-lg-7">
- <h3 style="float:left"><img class="spin" src="/progress.png" ng-hide="job.result"><span ng-bind-html="runIcon(job.result)"></span> {{name}} #{{num}}</h3>
+ <h3 style="float:left"><img class="spin" src="/progress.png" ng-show="job.result === 'running'"><span ng-bind-html="runIcon(job.result)"></span> {{name}} #{{num}}</h3>
  <nav class="pull-left">
   <ul class="pagination" style="margin:15px 20px">
    <li ng-show="num > 1"><a href="jobs/{{name}}/{{num-1}}">&laquo;</a></li>
@@ -13,12 +13,12 @@
   <dt>Reason</dt><dd>{{job.reason}}</dd>
   <dt>Queued for</dt><dd>{{job.queued}}s</dd>
   <dt>Started</dt><dd>{{formatDate(job.started)}}</dd>
-  <dt ng-show="job.result">Completed</dt><dd ng-show="job.result">{{formatDate(job.completed)}}</dd>
-  <dt ng-show="job.result">Duration</dt><dd ng-show="job.result">{{job.duration}}s</dd>
+  <dt ng-show="runComplete(job)">Completed</dt><dd ng-show="runComplete(job)">{{formatDate(job.completed)}}</dd>
+  <dt ng-show="runComplete(job)">Duration</dt><dd ng-show="runComplete(job)">{{job.duration}}s</dd>
  </dl>
 </div>
 <div class="col-sm-7 col-md-6 col-lg-5">
- <div class="progress" ng-hide="job.result">
+ <div class="progress" ng-show="job.result == 'running'">
   <div class="progress-bar progress-bar-{{job.overtime?'warning':'info'}} progress-bar-striped {{job.etc?'':'active'}}" style="width:{{!job.etc?'100':job.progress}}%;"></div>
  </div>
  <div class="panel panel-default" ng-show="job.artifacts.length">

src/run.cpp

@@ -30,6 +30,7 @@ namespace fs = boost::filesystem;
 std::string to_string(const RunState& rs) {
     switch(rs) {
     case RunState::PENDING: return "pending";
+    case RunState::RUNNING: return "running";
     case RunState::ABORTED: return "aborted";
     case RunState::FAILED: return "failed";
     case RunState::SUCCESS: return "success";

src/run.h

@@ -29,6 +29,7 @@
 enum class RunState {
     UNKNOWN,
     PENDING,
+    RUNNING,
     ABORTED,
     FAILED,
     SUCCESS