corrade-nucleus-nucleons

Subversion Repositories:
Compare Path: Rev
With Path: Rev
?path1? @ 30  →  ?path2? @ 31
/base/000_base/index.html/index.html
@@ -19,9 +19,6 @@
<link href="/css/nucleus/nucleus.css" rel="stylesheet" type="text/css">
<!-- Manager for Windows. -->
<link href="/css/wm/wm.css" rel="stylesheet" type="text/css">
<!-- HighCharts.js CSS -->
<link href="/node_modules/highcharts/css/highcharts.css" rel="stylesheet" type="text/css">
</head>
 
<body>
@@ -58,9 +55,6 @@
<script src="/node_modules/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
<!-- Wizardry and Steamworks JavaScript Includes -->
<script src="/node_modules/was/dist/was.min.js" type="text/javascript"></script>
<!-- HighCharts -->
<script src="/node_modules/highcharts/js/highcharts.js" type="text/javascript"></script>
<script src="/node_modules/highcharts/js/modules/exporting.js" type="text/javascript"></script>
<!-- Interact JS -->
<script src="/node_modules/interactjs/dist/interact.min.js" type="text/javascript"></script>
<!-- Manager for Windows. -->
@@ -67,241 +61,5 @@
<script src="/js/wm/wm.js" type="text/javascript"></script>
<!-- Nucleons Loader -->
<script src="/js/nucleus/load-nucleons.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
// Display Corrade Heartbeat using HighCharts.
var updateInterval = 1000;
var plotPoints = 20;
 
function retrieveStats(series_1, series_2) {
$.ajax({
type: 'POST',
url: '/',
data: {
command: 'getheartbeatdata',
data: wasArrayToCSV(
[
'AverageCPUUsage',
'AverageRAMUsage',
]
)
},
dataType: 'json'
}).done(function(response) {
var data = wasCSVToArray(response.data);
var time = (new Date()).getTime();
var ram, cpu;
$.each(data, function(i, value) {
switch (value) {
case 'AverageCPUUsage':
cpu = parseInt(data[i + 1]);
break;
case 'AverageRAMUsage':
// Convert bytes to MiB
ram = Math.floor(parseInt(data[i + 1]) / 1048576);
break;
}
});
series_1.addPoint(
[
time,
cpu
],
false, // false for all but last
true
);
series_2.addPoint(
[
time,
ram
],
true, // false for all but last
true
);
/*setTimeout(
retrieveStats,
updateInterval,
series_1,
series_2
);*/
});
}
 
Highcharts.setOptions({
global: {
useUTC: true
}
});
 
$('#heartbeat').highcharts({
chart: {
type: 'spline',
zoomType: 'xy',
//animation: Highcharts.svg, // don't animate in old IE
//marginRight: 10,
//shadow: true,
events: {
load: function() {
// set up the updating of the chart each second
//retrieveStats(this.series[0], this.series[1]);
setInterval(
retrieveStats,
updateInterval,
this.series[0],
this.series[1]
);
}
}
},
title: {
text: null,
enabled: false
},
credits: {
enabled: false
},
xAxis: [{
type: 'datetime' //,
//tickPixelInterval: 150,
}],
yAxis: [{
//type: 'linear',
//allowDecimals: false,
//min: 0,
labels: {
enabled: false
},
title: {
text: null
}
}, {
//type: 'linear',
//allowDecimals: false,
//min: 0,
labels: {
enabled: false
},
title: {
text: null
}
}],
/*tooltip: {
formatter: function() {
switch(this.series.name) {
case 'CPU':
return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
this.y + '%';
break;
case 'RAM':
return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
Highcharts.numberFormat(this.y/1048576, 0) + 'MiB';
break;
}
}
},*/
tooltip: {
shared: true
},
legend: {
enabled: true
},
exporting: {
enabled: true
},
series: [{
name: 'CPU',
color: '#FF0000',
tooltip: {
valueSuffix: ' %'
},
yAxis: 0,
data: (function() {
var data = [],
time = (new Date()).getTime(),
j = -(plotPoints - 1);
$.ajax({
type: 'POST',
url: '/',
data: {
command: 'getheartbeatdata',
data: wasArrayToCSV(
[
'CPUAverageUsageHistory'
]
)
},
dataType: 'json',
async: false,
success: function(response) {
var responseData = wasCSVToArray(response.data).slice(1);
$.each($.stride(responseData.slice(1), 2).slice(-20), function(i, e) {
data.push({
x: time + ++j * updateInterval,
y: parseInt(e)
});
});
}
});
 
var result = [];
while (result.length < plotPoints - data.length)
result.push({
x: time + ++j * updateInterval,
y: 0
});
 
return result.concat(data);
}())
}, {
name: 'RAM',
color: '#0000FF',
tooltip: {
valueSuffix: ' MiB'
},
yAxis: 1,
data: (function() {
var data = [],
time = (new Date()).getTime(),
j = -(plotPoints - 1);
$.ajax({
type: 'POST',
url: '/',
data: {
command: 'getheartbeatdata',
data: wasArrayToCSV(
[
'RAMAverageUsageHistory'
]
)
},
dataType: 'json',
async: false,
success: function(response) {
var responseData = wasCSVToArray(response.data).slice(1);
$.each($.stride(responseData.slice(1), 2).slice(-20), function(i, e) {
data.push({
x: time + ++j * updateInterval,
// Convert bytes to MiB.
y: Math.floor(parseInt(e) / 1048576)
});
});
}
});
 
var result = [];
while (result.length < plotPoints - data.length)
result.push({
x: time + ++j * updateInterval,
y: 0
});
 
return result.concat(data);
}())
}]
});
});
</script>
</body>
</html>