added second top row
This commit is contained in:
parent
dd1b642c23
commit
3adf1aa2d8
@ -7,14 +7,14 @@ body {
|
||||
min-width: 1900px;
|
||||
font-smooth: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
table td {
|
||||
font-size: 14px;
|
||||
white-space: nowrap !important;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
.propagationBox {
|
||||
@ -116,10 +116,12 @@ div.small-title-miner {
|
||||
|
||||
span.small-title span.small {
|
||||
font-size: 11px;
|
||||
letter-spacing: -.5px;
|
||||
font-weight: 600;
|
||||
line-height: 16px;
|
||||
letter-spacing: 0px;
|
||||
color: #666;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
.big-info .big-details {
|
||||
@ -156,7 +158,7 @@ span.small-title span.small {
|
||||
|
||||
.blocks-holder {
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
.blocks-holder div.small-title-miner {
|
||||
@ -194,15 +196,28 @@ span.small-title span.small {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.page-latency {
|
||||
position: absolute;
|
||||
top: 395px;
|
||||
left: 15px;
|
||||
.second-row .box {
|
||||
height: 40px;
|
||||
line-height: 24px !important;
|
||||
padding: 5px 15px;
|
||||
}
|
||||
|
||||
.page-latency .small-title {
|
||||
letter-spacing: 0px;
|
||||
opacity: .8;
|
||||
.second-row .box i {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
left: -3px;
|
||||
font-size: 24px;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
margin-right: 7px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.second-row .box .small-value {
|
||||
font-weight: 300;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.tableHolder {
|
||||
@ -211,7 +226,7 @@ span.small-title span.small {
|
||||
}
|
||||
table i {
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
table th,
|
||||
@ -402,7 +417,7 @@ svg .axis text {
|
||||
font-family: "Source Sans Pro";
|
||||
font-weight: 700;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-moz-font-smoothing: subpixel-antialiased;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
svg .y.axis .tick:first-child text {
|
||||
|
@ -9,12 +9,6 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
|
||||
|
||||
$scope.nodesTotal = 0;
|
||||
$scope.nodesActive = 0;
|
||||
$scope.bestBlockObject = {
|
||||
number: 0,
|
||||
hash: "0x?",
|
||||
transactions: [],
|
||||
uncles: []
|
||||
}
|
||||
$scope.bestBlock = 0;
|
||||
$scope.lastBlock = 0;
|
||||
$scope.lastDifficulty = 0;
|
||||
@ -219,12 +213,11 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
|
||||
|
||||
var bestBlock = _.max($scope.nodes, function(node) {
|
||||
return parseInt(node.stats.block.number);
|
||||
}).stats.block;
|
||||
}).stats.block.number;
|
||||
|
||||
if(bestBlock.number > $scope.bestBlock)
|
||||
if(bestBlock > $scope.bestBlock)
|
||||
{
|
||||
$scope.bestBlockObject = bestBlock;
|
||||
$scope.bestBlock = bestBlock.number;
|
||||
$scope.bestBlock = bestBlock;
|
||||
$scope.bestStats = _.max($scope.nodes, function(node) {
|
||||
return parseInt(node.stats.block.number);
|
||||
}).stats;
|
||||
@ -245,7 +238,7 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
|
||||
jQuery('.spark-gasspending').sparkline($scope.gasSpending.reverse(), {type: 'bar'});
|
||||
}
|
||||
|
||||
$scope.lastDifficulty = $scope.bestBlockObject.difficulty;
|
||||
$scope.lastDifficulty = $scope.bestStats.block.difficulty;
|
||||
|
||||
$scope.avgBlockTime = _.max($scope.nodes, function(node) {
|
||||
return parseInt(node.stats.block.number);
|
||||
|
@ -60,19 +60,9 @@ angular.module('netStatsApp.directives', []).
|
||||
|
||||
scope.init();
|
||||
|
||||
window.onresize = function() {
|
||||
scope.$apply();
|
||||
};
|
||||
|
||||
scope.$watch('data', function() {
|
||||
scope.map.bubbles(scope.data, bubbleConfig);
|
||||
}, true);
|
||||
|
||||
scope.$watch(function() {
|
||||
return angular.element(window)[0].innerWidth;
|
||||
}, function() {
|
||||
scope.init();
|
||||
});
|
||||
}
|
||||
};
|
||||
}]).
|
||||
|
@ -100,6 +100,32 @@ angular.module('netStatsApp.filters', [])
|
||||
return (best - current.block.number <= 1 ? 'text-success' : (best - current.block.number > 1 && best - current.block.number < 4 ? 'text-warning' : 'text-danger'));
|
||||
};
|
||||
})
|
||||
.filter('gasPriceFilter', ['$filter', function(filter) {
|
||||
var numberFilter = filter('number')
|
||||
return function(price) {
|
||||
console.log("--------------------");
|
||||
console.log(price.length);
|
||||
if(price.length < 4)
|
||||
return price + " wei";
|
||||
|
||||
if(price.length < 7)
|
||||
return (price/1000) + " kwei";
|
||||
|
||||
if(price.length < 10)
|
||||
return (price/1000000) + " mwei";
|
||||
|
||||
if(price.length < 13)
|
||||
return (price/1000000000) + " gwei";
|
||||
|
||||
if(price.length < 16)
|
||||
return (price/1000000000000) + " szabo";
|
||||
|
||||
if(price.length < 19)
|
||||
return (price.substr(0, price.length - 15)) + " finney";
|
||||
|
||||
return numberFilter(price.substr(0, price.length - 18)) + " ether";
|
||||
}
|
||||
}])
|
||||
.filter('gasFilter', function() {
|
||||
return function(gas) {
|
||||
return (typeof gas !== 'undefined' ? parseInt(gas) : '?');
|
||||
|
@ -2,9 +2,6 @@ extends layout
|
||||
|
||||
block content
|
||||
div.container-fluid(ng-controller='StatsCtrl')
|
||||
div.page-latency(ng-cloak)
|
||||
span.small-title page latency:#[ ]
|
||||
span(class="{{ {active: true, latency: latency} | latencyClass }}") {{latency}} ms
|
||||
div.row(ng-cloak)
|
||||
div.col-xs-2.stat-holder
|
||||
div.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}")
|
||||
@ -45,7 +42,7 @@ block content
|
||||
div.pull-left
|
||||
span.small-title uncles #[ ]
|
||||
span.small (current / last 50)
|
||||
span.big-details {{ bestBlockObject.uncles.length }}/{{ uncleCount }}
|
||||
span.big-details {{ bestStats.block.uncles.length }}/{{ uncleCount }}
|
||||
div.clearfix
|
||||
div.col-xs-2.stat-holder
|
||||
div.big-info.blocktime(class="{{ lastBlock | timeClass : true }}")
|
||||
@ -63,46 +60,55 @@ block content
|
||||
span.small-title avg block time
|
||||
span.big-details {{ avgBlockTime | avgTimeFilter }}
|
||||
div.clearfix
|
||||
|
||||
div.clearfix
|
||||
|
||||
|
||||
div.row(ng-cloak)
|
||||
div.col-xs-6.stats-boxes(style="padding-top: 30px;")
|
||||
div.col-xs-8.stats-boxes(style="padding-top: 0px;")
|
||||
div.row.second-row(ng-cloak)
|
||||
//- div.col-xs-3.stat-holder.box
|
||||
//- div.active-nodes(class="{{ nodesActive | nodesActiveClass : nodesTotal }}")
|
||||
//- i.icon-node
|
||||
//- span.small-title active nodes
|
||||
//- span.small-value {{nodesActive}}/{{nodesTotal}}
|
||||
div.col-xs-3.stat-holder.box
|
||||
div.difficulty.text-info
|
||||
i.icon-difficulty
|
||||
span.small-title difficulty
|
||||
span.small-value {{ lastDifficulty | number }}
|
||||
div.col-xs-3.stat-holder.box
|
||||
div.gasprice.text-info
|
||||
i.icon-difficulty
|
||||
span.small-title gas price
|
||||
span.small-value {{ bestStats.gasPrice.toString() | gasPriceFilter }}
|
||||
div.col-xs-3.stat-holder.box
|
||||
div.page-latency(class="{{ {active: true, latency: latency} | latencyClass }}")
|
||||
i.icon-gas
|
||||
span.small-title page latency
|
||||
span.small-value {{latency}} ms
|
||||
div.col-xs-3.stat-holder.box
|
||||
div.uptime(class="{{ upTimeTotal | upTimeClass : true }}")
|
||||
i.icon-bulb
|
||||
span.small-title uptime
|
||||
span.small-value {{ upTimeTotal | upTimeFilter }}
|
||||
|
||||
div.row
|
||||
div.col-xs-4.stat-holder
|
||||
div.col-xs-3.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title block time
|
||||
span.big-details.spark-blocktimes
|
||||
|
||||
div.col-xs-4.stat-holder
|
||||
div.col-xs-3.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title difficulty
|
||||
span.big-details.spark-difficulty
|
||||
|
||||
div.col-xs-4.stat-holder.pull-right
|
||||
div.col-xs-3.stat-holder.xpull-right
|
||||
div.big-info.chart.xdouble-chart
|
||||
span.small-title block propagation
|
||||
histogram.big-details.d3-blockpropagation(data="blockPropagationChart")
|
||||
|
||||
div.col-xs-4.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title uncle count #[ ]
|
||||
span.small (25 blocks per bar)
|
||||
span.big-details.spark-uncles
|
||||
|
||||
div.col-xs-4.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title transactions
|
||||
span.big-details.spark-transactions
|
||||
|
||||
div.col-xs-4.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title gas spending
|
||||
span.big-details.spark-gasspending
|
||||
|
||||
div.col-xs-2.stats-boxes(style="padding-top: 30px;")
|
||||
div.row
|
||||
div.col-xs-12.stat-holder
|
||||
div.col-xs-3.stat-holder.pull-right
|
||||
div.big-info.chart.double-chart
|
||||
span.small-title last blocks miners
|
||||
div.blocks-holder(ng-repeat='miner in miners', data-toggle="tooltip", data-placement="right", title="{{miner.blocks}}")
|
||||
@ -111,8 +117,26 @@ block content
|
||||
div.block(ng-repeat="i in getNumber(miner.blocks) track by $index", class="{{miner.blocks | minerBlocksClass}}")
|
||||
div.clearfix
|
||||
|
||||
div.col-xs-3.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title uncle count #[ ]
|
||||
span.small (25 blocks per bar)
|
||||
span.big-details.spark-uncles
|
||||
|
||||
div.col-xs-3.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title transactions
|
||||
span.big-details.spark-transactions
|
||||
|
||||
div.col-xs-3.stat-holder
|
||||
div.big-info.chart
|
||||
span.small-title gas spending
|
||||
span.big-details.spark-gasspending
|
||||
|
||||
|
||||
|
||||
div.col-xs-4
|
||||
div.col-xs-12
|
||||
//- div.col-xs-12
|
||||
nodemap#mapHolder(data="map")
|
||||
|
||||
div.clearfix
|
||||
|
Loading…
Reference in New Issue
Block a user