added page latency

This commit is contained in:
cubedro 2015-04-06 08:33:01 +03:00
parent 62e2f73a7a
commit a2bc799fd7
4 changed files with 44 additions and 2 deletions

12
app.js
View File

@ -30,6 +30,8 @@ var client = new Primus(server, {
parser: 'JSON' parser: 'JSON'
}); });
var clientLatency = 0;
client.use('emit', require('primus-emit')); client.use('emit', require('primus-emit'));
api.on('connection', function(spark) { api.on('connection', function(spark) {
@ -115,7 +117,17 @@ client.on('connection', function(spark) {
spark.emit('init', {nodes: Nodes.all()}); spark.emit('init', {nodes: Nodes.all()});
}); });
spark.on('client-pong', function(data) {
var latency = Math.ceil(((new Date()).getTime() - clientLatency)/2);
spark.emit('client-latency', { latency: latency });
}); });
});
var latencyTimeout = setInterval(function(){
clientLatency = (new Date()).getTime();
client.write({action: 'client-ping'});
}, 5000);
// view engine setup // view engine setup
app.set('views', path.join(__dirname, 'views')); app.set('views', path.join(__dirname, 'views'));

View File

@ -58,6 +58,10 @@ body {
.big-info span.small-title, .big-info span.small-title,
.big-info div.small-title-miner { .big-info div.small-title-miner {
display: block; display: block;
}
span.small-title,
div.small-title-miner {
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 14px;
line-height: 20px; line-height: 20px;
@ -116,6 +120,18 @@ body {
float: left; float: left;
-webkit-border-radius: 1px; -webkit-border-radius: 1px;
border-radius: 1px; border-radius: 1px;
opacity: .8;
}
.page-latency {
position: absolute;
top: 400px;
left: 15px;
}
.page-latency .small-title {
letter-spacing: 0px;
opacity: .8;
} }
.jqstooltip { .jqstooltip {

View File

@ -25,6 +25,8 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
$scope.nodes = []; $scope.nodes = [];
$scope.map = []; $scope.map = [];
$scope.latency = 0;
$scope.predicate = 'info.name'; $scope.predicate = 'info.name';
$scope.reverse = false; $scope.reverse = false;
@ -76,6 +78,11 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
socketAction("init", data.nodes); socketAction("init", data.nodes);
}); });
socket.on('client-latency', function(data)
{
$scope.latency = data.latency;
})
function socketAction(action, data) function socketAction(action, data)
{ {
console.log('Action: ', action); console.log('Action: ', action);
@ -111,6 +118,10 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
case "latency": case "latency":
$scope.nodes[findIndex({id: data.id})].stats.latency = data.latency; $scope.nodes[findIndex({id: data.id})].stats.latency = data.latency;
break; break;
case "client-ping":
socket.emit('client-pong');
break;
} }
updateStats(); updateStats();

View File

@ -2,6 +2,9 @@ extends layout
block content block content
div.container-fluid(ng-controller='StatsCtrl') div.container-fluid(ng-controller='StatsCtrl')
div.page-latency
span.small-title page latency:#[ ]
span(class="{{ {active: true, latency: latency} | latencyClass }}") {{latency}} ms
div.row(ng-cloak) div.row(ng-cloak)
div.col-xs-2.stat-holder div.col-xs-2.stat-holder
div.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}") div.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}")
@ -119,7 +122,7 @@ block content
i.icon-network(data-toggle="tooltip", data-placement="top", title="Pending transactions", ng-click="orderTable('-stats.pending', false)") i.icon-network(data-toggle="tooltip", data-placement="top", title="Pending transactions", ng-click="orderTable('-stats.pending', false)")
th th
i.icon-block(data-toggle="tooltip", data-placement="top", title="Last block", ng-click="orderTable(['-stats.block.number', 'stats.block.propagation'], false)") i.icon-block(data-toggle="tooltip", data-placement="top", title="Last block", ng-click="orderTable(['-stats.block.number', 'stats.block.propagation'], false)")
th.th-blockhash   th.th-blockhash #[ ]
th th
i.icon-check-o(data-toggle="tooltip", data-placement="top", title="Block transactions", ng-click="orderTable('-stats.block.transactions.length', false)") i.icon-check-o(data-toggle="tooltip", data-placement="top", title="Block transactions", ng-click="orderTable('-stats.block.transactions.length', false)")
th.th-blocktime th.th-blocktime
@ -132,7 +135,7 @@ block content
tr(ng-repeat='node in nodes | orderBy:predicate:reverse', class="{{ node.stats | mainClass : bestBlock }}") tr(ng-repeat='node in nodes | orderBy:predicate:reverse', class="{{ node.stats | mainClass : bestBlock }}")
td(rel="{{node.id}}") td(rel="{{node.id}}")
span.small(data-toggle="tooltip", data-placement="top", data-original-title="{{node.geo | geoTooltip}}") {{node.info.name}} span.small(data-toggle="tooltip", data-placement="top", data-original-title="{{node.geo | geoTooltip}}") {{node.info.name}}
span.small &nbsp({{node.info.ip}}) span.small #[ ]({{node.info.ip}})
td td
div.small(ng-bind-html="node.info.node | nodeVersion") div.small(ng-bind-html="node.info.node | nodeVersion")
//- div.small {{node.info.os}}, {{node.info.os_v}} //- div.small {{node.info.os}}, {{node.info.os_v}}