Load Stat added

@@ -63,27 +63,13 @@
     </div>
     <div class="container">
         <div class="stats-column">
-            <h5>Requests per second</h5>
-            <h1 id="rpsStat">-</h1>
+            <h5>One Minute Load Avg</h5>
+            <h1 id="loadStat">-</h1>
         </div>
-        <canvas id="rpsChart" width="400" height="100"></canvas>
-    </div>
-    <div class="container">
-        <div class="stats-column">
-            <h5>Response Time Mean</h5>
-            <h1 id="responseTimeStat">- ms</h1>
-        </div>
-        <canvas id="responseTimeChart" width="400" height="100"></canvas>
-    </div>
-    <div class="container">
-        <div class="stats-column">
-            <h5>Response status codes</h5>
-            <h1 id="statusCodeStat">-</h1>
-        </div>
-        <canvas id="statusCodeChart" width="400" height="100"></canvas>
+        <canvas id="loadChart" width="400" height="100"></canvas>
     </div>
     <div class="footer">
-        <p>Powered by Socket.io & Chart.js</p>
+        <p>Made with &#9829; with Socket.io & Chart.js</p>
     </div>
 </div>
 <script>
@@ -106,28 +92,14 @@
     var memDataset = [{
         label: 'Memory Usage in MB',
         data: [],
-        lineTension: 0.6,
+        lineTension: 0.2,
         pointRadius: 0,
     }];
 
-    var responseTimeDataset = [{
-        label: 'Mean Response time',
-        data: [],
-        lineTension: 0.6,
-        pointRadius: 0,
-    }];
-
-    var rpsDataset = [{
-        label: 'Requests per second',
-        data: [],
-        lineTension: 0.6,
-        pointRadius: 0,
-    }];
-
-    var statusCodesDataset = [{
-        label: 'Memory Usage in MB',
+    var loadDataset = [{
+        label: '1 Minute Load',
         data: [],
-        lineTension: 0.6,
+        lineTension: 0.2,
         pointRadius: 0,
     }];
 
@@ -155,13 +127,12 @@
 
     var cpuStat = document.getElementById('cpuStat');
     var memStat = document.getElementById('memStat');
-    var responseTimeStat = document.getElementById('responseTimeStat');
-    var rpsStat = document.getElementById('rpsStat');
+    var loadStat = document.getElementById('loadStat');
+
     var cpuChartCtx = document.getElementById("cpuChart");
     var memChartCtx = document.getElementById("memChart");
-    var rpsChartCtx = document.getElementById("rpsChart");
-    var responseTimeChartCtx = document.getElementById("responseTimeChart");
-    var statusCodeChartCtx = document.getElementById("statusCodeChart");
+    var loadChartCtx = document.getElementById("loadChart");
+
     var cpuChart = new Chart(cpuChartCtx, {
         type: 'line',
         data: {
@@ -180,55 +151,32 @@
         options: defaultOptions
     });
 
-    var rpsChart = new Chart(rpsChartCtx, {
-        type: 'line',
-        data: {
-            labels: labels,
-            datasets: responseTimeDataset,
-        },
-        options: defaultOptions
-    });
-
-    var responseTimeChart = new Chart(responseTimeChartCtx, {
+    var loadChart = new Chart(loadChartCtx, {
         type: 'line',
         data: {
             labels: labels,
-            datasets: responseTimeDataset,
+            datasets: loadDataset,
         },
         options: defaultOptions
     });
 
-    var statusCodeChart = new Chart(statusCodeChartCtx, {
-        type: 'line',
-        data: {
-            labels: labels,
-            datasets: statusCodesDataset,
-        },
-        options: defaultOptions
-    });
 
     socket.on('stats', function (data) {
         console.log(data);
-        cpuStat.textContent = data.osStats[data.osStats.length - 1].cpu.toFixed(1) + '%';
-        cpuChart.data.datasets[0].data = data.osStats.map(function(point) { return point.cpu; });
-        cpuChart.data.labels = data.osStats.map(function(point) { return point.timestamp; });
+        cpuStat.textContent = data.os[data.os.length - 1].cpu.toFixed(1) + '%';
+        cpuChart.data.datasets[0].data = data.os.map(function(point) { return point.cpu; });
+        cpuChart.data.labels = data.os.map(function(point) { return point.timestamp; });
         cpuChart.update();
 
-        memStat.textContent = data.osStats[data.osStats.length - 1].memory.toFixed(1) + 'MB';
-        memChart.data.datasets[0].data = data.osStats.map(function(point) { return point.memory; });
-        memChart.data.labels = data.osStats.map(function(point) { return point.timestamp; });
+        memStat.textContent = data.os[data.os.length - 1].memory.toFixed(1) + 'MB';
+        memChart.data.datasets[0].data = data.os.map(function(point) { return point.memory; });
+        memChart.data.labels = data.os.map(function(point) { return point.timestamp; });
         memChart.update();
 
-        if (data.responses.length > 0) {
-            responseTimeStat.textContent = data.responses[data.responses.length - 1].mean.toFixed(1) + 'ms';
-            responseTimeChart.data.datasets[0].data = data.responses.map(function (point) {
-                return point.mean;
-            });
-            responseTimeChart.data.labels = data.responses.map(function (point) {
-                return point.timestamp;
-            });
-            responseTimeChart.update();
-        }
+        loadStat.textContent = data.os[data.os.length - 1].load[0].toFixed(2);
+        loadChart.data.datasets[0].data = data.os.map(function(point) { return point.load[0]; });
+        loadChart.data.labels = data.os.map(function(point) { return point.timestamp; });
+        loadChart.update();
     });
 </script>
 </body>

@@ -2,6 +2,7 @@
   'use strict';
 
   const path = require('path');
+  const os = require('os');
   const onHeaders = require('on-headers');
   const pidusage = require('pidusage');
 
@@ -20,10 +21,11 @@
 
       // Convert from B to MB
       stat.memory = stat.memory / 1024 / 1024;
+      stat.load = os.loadavg();
 
-      span.osStats.push(stat);
-      if (span.osStats.length >= span.retention) span.osStats.shift();
-      if (span.responses[0] && span.responses[0].timestamp + (span.interval * span.retention * 1000) < Date.now()) span.responses.shift();
+      span.os.push(stat);
+
+      if (span.os.length >= span.retention) span.os.shift();
 
       sendMetrics(io, span);
     });
@@ -31,7 +33,7 @@
 
   const sendMetrics = (io, span) => {
     io.emit('stats', {
-      osStats: span.osStats,
+      os: span.os,
       responses: span.responses,
     });
   };
@@ -60,7 +62,7 @@
     });
 
     config.spans.forEach((span) => {
-      span.osStats = [];
+      span.os = [];
       span.responses = [];
       setInterval(() => gatherOsMetrics(io, span), span.interval * 1000);
     });
@@ -76,9 +78,11 @@
           const category = Math.floor(res.statusCode / 100);
 
           config.spans.forEach((span) => {
-            if (span.responses[span.responses.length - 1] !== undefined &&
+            const last = span.responses[span.responses.length - 1];
+            if (last !== undefined &&
               span.responses[span.responses.length - 1].timestamp / 1000 + span.interval > Date.now() / 1000) {
               span.responses[span.responses.length - 1][category]++;
+              span.responses[span.responses.length - 1].mean = responseTime;
               span.responses[span.responses.length - 1].count++;
             } else {
               span.responses.push({