mirror of
https://github.com/EDCD/EDDN.git
synced 2025-06-20 08:43:55 +03:00
Lot of works on gateway/relay status
This commit is contained in:
AnthorNet
parent
3a92ffe1ad
commit
1fea0b638c
@ -4,8 +4,19 @@ body {
|
||||
|
||||
section.container {
|
||||
margin-bottom: 20px;
|
||||
|
||||
/* FIX ANCHORS */
|
||||
padding-top:70px;
|
||||
margin-top:-70px;
|
||||
}
|
||||
|
||||
.container h2 {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.container .chart {
|
||||
height: 200px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.highcharts-container{width:100% !important; height:100% !important;}
|
||||
@ -20,7 +20,7 @@
|
||||
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
|
||||
<script src="./js/date.js"></script>
|
||||
</head>
|
||||
<body data-spy="scroll" data-target="#header-nav">
|
||||
<body data-spy="scroll" data-target="#header-nav" data-offset="70">
|
||||
<header>
|
||||
<nav class="navbar navbar-default navbar-fixed-top">
|
||||
<div class="container">
|
||||
@ -110,6 +110,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12 charts">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<p class="text-muted small">
|
||||
@ -179,6 +185,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12 charts">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<p class="text-muted small">
|
||||
@ -208,6 +220,16 @@
|
||||
<h2>Software</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="uploader" class="container">
|
||||
@ -216,10 +238,20 @@
|
||||
<h2>Uploader</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<nav class="navbar navbar-default navbar-fixed-bottom">
|
||||
<nav class="navbar navbar-default">
|
||||
<div class="container">
|
||||
<p>
|
||||
The <em>Elite: Dangerous Data Network</em> is volunteer-run and not affiliated with Frontier Developments.
|
||||
@ -231,7 +263,7 @@
|
||||
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script>
|
||||
<script src="http://code.highcharts.com/4.1.5/highcharts.js"></script>
|
||||
<script src="./js/eddn.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -8,7 +8,12 @@ var updateInterval = 60000,
|
||||
relays = [
|
||||
'eddn-gateway.elite-markets.net',
|
||||
'eddn-gateway.ed-td.space'
|
||||
];
|
||||
]; // Must find a way to bind them to monitor
|
||||
|
||||
var stats = {
|
||||
'gateway' : {},
|
||||
'relay' : {}
|
||||
}; // Stats placeholder
|
||||
|
||||
|
||||
secondsToDurationString = function(seconds) {
|
||||
@ -19,7 +24,7 @@ secondsToDurationString = function(seconds) {
|
||||
|
||||
if (hours > 24) {
|
||||
days = Math.floor(hours / 24)
|
||||
hours = Math.floor((seconds - days * 24) / 3600);
|
||||
hours = Math.floor((hours - days * 24) / 3600);
|
||||
}
|
||||
|
||||
if (hours < 10) {hours = "0" + hours;}
|
||||
@ -34,63 +39,78 @@ secondsToDurationString = function(seconds) {
|
||||
}
|
||||
}
|
||||
|
||||
displayStats = function(el, stats){
|
||||
el.find(".inbound_1min").html((stats["inbound"] || {})["1min"] || 0);
|
||||
el.find(".inbound_5min").html((stats["inbound"] || {})["5min"] || 0);
|
||||
el.find(".inbound_60min").html((stats["inbound"] || {})["60min"] || 0);
|
||||
|
||||
el.find(".invalid_1min").html((stats["invalid"] || {})["1min"] || 0);
|
||||
el.find(".invalid_5min").html((stats["invalid"] || {})["5min"] || 0);
|
||||
el.find(".invalid_60min").html((stats["invalid"] || {})["60min"] || 0);
|
||||
var doUpdates = function(type){
|
||||
$("select[name=" + type + "] option").each(function(){
|
||||
var currentItem = $(this).html(),
|
||||
isSelected = $(this).is(':selected');
|
||||
|
||||
el.find(".outbound_1min").html((stats["outbound"] || {})["1min"] || 0);
|
||||
el.find(".outbound_5min").html((stats["outbound"] || {})["5min"] || 0);
|
||||
el.find(".outbound_60min").html((stats["outbound"] || {})["60min"] || 0);
|
||||
|
||||
d = new Date();
|
||||
el.find(".update_timestamp").html(d.toString("yyyy-MM-dd HH:mm:ss"));
|
||||
el.find(".version").html(stats['version'] || "N/A");
|
||||
|
||||
if (stats['uptime'])
|
||||
el.find(".uptime").html(secondsToDurationString(stats['uptime']));
|
||||
|
||||
formatStats();
|
||||
}
|
||||
|
||||
displayGatewayStats = function(stats) {
|
||||
return displayStats($('#gateway'), stats)
|
||||
}
|
||||
|
||||
displayRelayStats = function(stats) {
|
||||
return displayStats($('#relay'), stats)
|
||||
}
|
||||
|
||||
formatStats = function() {
|
||||
$(".stat").each(function() {
|
||||
if ($(this).html() == "0") {
|
||||
$(this).addClass("warning");
|
||||
}
|
||||
else {
|
||||
$(this).removeClass("warning");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
doUpdate = function(url, success) {
|
||||
$.ajax({
|
||||
dataType: "json",
|
||||
url: url,
|
||||
success: success
|
||||
url: $(this).val(),
|
||||
success: function(data){
|
||||
d = new Date();
|
||||
|
||||
stats[type][currentItem]['lastUpdate'] = d.toString("yyyy-MM-dd HH:mm:ss");
|
||||
stats[type][currentItem]['last'] = data;
|
||||
|
||||
if(isSelected)
|
||||
showStats(type, currentItem);
|
||||
|
||||
var chart = $("#" + type + " .chart[data-name='" + currentItem + "']").highcharts();
|
||||
|
||||
shift = chart.get('inbound').data.length > 60;
|
||||
chart.get('inbound').addPoint([d.getTime(), (data['inbound'] || {})['1min'] || 0], true, shift);
|
||||
|
||||
shift = chart.get('outbound').data.length > 60;
|
||||
chart.get('outbound').addPoint([d.getTime(), (data['outbound'] || {})['1min'] || 0], true, shift);
|
||||
|
||||
if(type == 'gateway')
|
||||
{
|
||||
shift = chart.get('invalid').data.length > 60;
|
||||
chart.get('invalid').addPoint([d.getTime(), (data['invalid'] || {})['1min'] || 0], true, shift);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
var showStats = function(type, currentItem){
|
||||
var el = $('#' + type),
|
||||
currentItemStats = stats[type][currentItem]['last'];
|
||||
|
||||
el.find(".inbound_1min").html((currentItemStats['inbound'] || {})['1min'] || 0);
|
||||
el.find(".inbound_5min").html((currentItemStats["inbound"] || {})['5min'] || 0);
|
||||
el.find(".inbound_60min").html((currentItemStats["inbound"] || {})['60min'] || 0);
|
||||
|
||||
if(type == 'gateway')
|
||||
{
|
||||
el.find(".invalid_1min").html((currentItemStats["invalid"] || {})['1min'] || 0);
|
||||
el.find(".invalid_5min").html((currentItemStats["invalid"] || {})['5min'] || 0);
|
||||
el.find(".invalid_60min").html((currentItemStats["invalid"] || {})['60min'] || 0);
|
||||
}
|
||||
|
||||
getGatewayUrl = function() {
|
||||
return $("select[name=gateway]").val();
|
||||
}
|
||||
el.find(".outbound_1min").html((currentItemStats["outbound"] || {})['1min'] || 0);
|
||||
el.find(".outbound_5min").html((currentItemStats["outbound"] || {})['5min'] || 0);
|
||||
el.find(".outbound_60min").html((currentItemStats["outbound"] || {})['60min'] || 0);
|
||||
|
||||
getRelayUrl = function() {
|
||||
return $("select[name=relay]").val();
|
||||
}
|
||||
el.find(".update_timestamp").html(stats[type][currentItem]['lastUpdate']);
|
||||
el.find(".version").html(currentItemStats['version'] || 'N/A');
|
||||
|
||||
if (currentItemStats['uptime'])
|
||||
el.find(".uptime").html(secondsToDurationString(currentItemStats['uptime']));
|
||||
else
|
||||
el.find(".uptime").html('N/A');
|
||||
|
||||
el.find(".stat").removeClass("warning").each(function() {
|
||||
if ($(this).html() == "0")
|
||||
$(this).addClass("warning");
|
||||
});
|
||||
|
||||
el.find(".chart").hide();
|
||||
el.find(".chart[data-name='" + currentItem + "']").show();
|
||||
$(window).trigger('resize'); // Fix wrong size in chart
|
||||
};
|
||||
|
||||
|
||||
|
||||
@ -98,6 +118,8 @@ getRelayUrl = function() {
|
||||
* Launch monitoring
|
||||
*/
|
||||
var start = function(){
|
||||
Highcharts.setOptions({global: {useUTC: false}});
|
||||
|
||||
// Grab gateways from monitor
|
||||
$.ajax({
|
||||
dataType: "json",
|
||||
@ -112,8 +134,45 @@ var start = function(){
|
||||
value: 'http://' + gateway + ':' + gatewayBottlePort + '/stats/',
|
||||
text : gateway
|
||||
}));
|
||||
|
||||
$('#gateway .charts').append(
|
||||
$('<div>').addClass('chart')
|
||||
.css('width', '100%')
|
||||
.attr('data-name', gateway)
|
||||
);
|
||||
|
||||
$("#gateway .chart[data-name='" + gateway + "']").highcharts({
|
||||
chart: {
|
||||
type: 'spline', animation: Highcharts.svg,
|
||||
height: 200
|
||||
},
|
||||
title: { text: '', style: {display: 'none'} },
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
tickPixelInterval: 150
|
||||
},
|
||||
yAxis: {
|
||||
title: {text: ''},
|
||||
plotLines: [{value: 0, width: 1, color: '#808080'}],
|
||||
min: 0
|
||||
},
|
||||
tooltip: { enabled: false },
|
||||
credits: { enabled: false },
|
||||
exporting: { enabled: false },
|
||||
series: [
|
||||
{id: 'inbound', data: [], name: 'Messages received'},
|
||||
{id: 'outbound', data: [], name: 'Messages passed to relay'},
|
||||
{id: 'invalid', data: [], name: 'Invalid messages'}
|
||||
]
|
||||
}).hide();
|
||||
|
||||
stats['gateway'][gateway] = {};
|
||||
});
|
||||
doUpdate(getGatewayUrl(), displayGatewayStats);
|
||||
|
||||
doUpdates('gateway');
|
||||
setInterval(function(){
|
||||
doUpdates('gateway');
|
||||
}, updateInterval);
|
||||
}
|
||||
});
|
||||
|
||||
@ -124,20 +183,58 @@ var start = function(){
|
||||
value: 'http://' + relay + ':' + relayBottlePort + '/stats/',
|
||||
text : relay
|
||||
}));
|
||||
|
||||
$('#relay .charts').append(
|
||||
$('<div>').addClass('chart')
|
||||
.css('width', '100%')
|
||||
.attr('data-name', relay)
|
||||
);
|
||||
|
||||
$("#relay .chart[data-name='" + relay + "']").highcharts({
|
||||
chart: {
|
||||
type: 'spline', animation: Highcharts.svg,
|
||||
height: 200,
|
||||
events: {
|
||||
load: function(){ setTimeout(function(){$(window).trigger('resize');}, 250); }
|
||||
},
|
||||
marginRight: 10
|
||||
},
|
||||
title: { text: '', style: {display: 'none'} },
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
tickPixelInterval: 150
|
||||
},
|
||||
yAxis: {
|
||||
title: {text: ''},
|
||||
plotLines: [{value: 0, width: 1, color: '#808080'}],
|
||||
min: 0
|
||||
},
|
||||
tooltip: { enabled: false },
|
||||
credits: { enabled: false },
|
||||
exporting: { enabled: false },
|
||||
series: [
|
||||
{id: 'inbound', data: [], name: 'Messages received'},
|
||||
{id: 'outbound', data: [], name: 'Messages passed to subscribers'}
|
||||
]
|
||||
}).hide();
|
||||
|
||||
stats['relay'][relay] = {};
|
||||
});
|
||||
|
||||
// Attach events
|
||||
$("select[name=gateway]").change(function() {doUpdate(getGatewayUrl(), displayGatewayStats);})
|
||||
$("select[name=relay]").change(function() {doUpdate(getRelayUrl(), displayRelayStats);})
|
||||
doUpdates('relay');
|
||||
setInterval(function(){
|
||||
doUpdates('relay');
|
||||
}, updateInterval);
|
||||
|
||||
// Start updates interval
|
||||
setInterval(doUpdates, updateInterval);
|
||||
doUpdates();
|
||||
}
|
||||
var doUpdates = function(){
|
||||
doUpdate(getGatewayUrl(), displayGatewayStats);
|
||||
doUpdate(getRelayUrl(), displayRelayStats);
|
||||
// Attach events
|
||||
$("select[name=gateway]").change(function(){
|
||||
showStats('gateway', $(this).find('option:selected').html());
|
||||
});
|
||||
$("select[name=relay]").change(function(){
|
||||
showStats('relay', $(this).find('option:selected').html());
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
start();
|
||||
});
|
||||
Loading…
x
Reference in New Issue
Block a user