Add optional statistics to API and web UI.

A new option (--web.statistics) enables the collection of some basic
information about requests and responses. This currently consists of
the most recent 10 requests that resulted in HTTP 4xx or 5xx errors.

webui/src/app/sections/health/health.controller.js

@@ -1,5 +1,6 @@
 'use strict';
-var d3 = require('d3');
+var d3 = require('d3'),
+    moment = require('moment');
 
 /** @ngInject */
 function HealthController($scope, $interval, $log, Health) {
@@ -160,6 +161,15 @@ function HealthController($scope, $interval, $log, Health) {
     }
   }
 
+  /**
+   * Format the timestamp as "x seconds ago", etc.
+   *
+   * @param {String} t Timestamp returned from the API
+   */
+  function formatTimestamp(t) {
+    return moment(t, "YYYY-MM-DDTHH:mm:ssZ").fromNow();
+  }
+
   /**
    * Load all graph's datas
    *
@@ -172,6 +182,13 @@ function HealthController($scope, $interval, $log, Health) {
     // Load datas and update Total Status Code Count graph render
     updateTotalStatusCodeCount(health.total_status_code_count);
 
+    // Format the timestamps
+    if (health.recent_errors) {
+      angular.forEach(health.recent_errors, function(i) {
+        i.time_formatted = formatTimestamp(i.time);
+      });
+    }
+
     // set data's view
     vm.health = health;
   }

webui/src/app/sections/health/health.html

@@ -40,4 +40,34 @@
 
   </div>
 
+  <div ng-if="healthCtrl.health.recent_errors">
+    <h3>Recent HTTP Errors</h3>
+    <table class="table table-striped table-bordered">
+      <tr>
+        <td>Status</td>
+        <td>Request</td>
+        <td>Time</td>
+      </tr>
+      <tr ng-repeat="entry in healthCtrl.health.recent_errors"
+          ng-class="{'text-danger': entry.status_code >= 500}">
+        <td>{{ entry.status_code }} &mdash; {{ entry.status }}</td>
+        <td>
+          <span class="badge">{{ entry.method }}</span>
+          &nbsp;
+          {{ entry.host }}{{ entry.path }}
+        </td>
+        <td>
+          <span title="{{ entry.time }}">
+            {{ entry.time_formatted }}
+          </span>
+        </td>
+      </tr>
+      <tr ng-if="healthCtrl.health.recent_errors.length == 0">
+        <td colspan="3">
+          <p class="text-muted text-center">No entries</p>
+        </td>
+      </tr>
+    </table>
+  </div>
+
 </div>