added difficulty & transactions charts

This commit is contained in:
cubedro 2015-03-28 01:27:40 +02:00
parent 853f5e9a7e
commit 0d584e1562
4 changed files with 43 additions and 14 deletions

View File

@ -35,7 +35,10 @@ body {
} }
.big-info.chart { .big-info.chart {
padding-left: 15px; padding-left: 14px;
padding-right: 14px;
-webkit-box-sizing: border-box
box-sizing: border-box;
} }
.big-info span.big-details { .big-info span.big-details {
@ -57,8 +60,8 @@ body {
.jqsfield { .jqsfield {
position: relative; position: relative;
padding: 5px 0; padding: 5px 0;
width: 40px; width: 60px;
left: -20px; left: -30px;
word-wrap: wrap; word-wrap: wrap;
text-align: center; text-align: center;
} }

View File

@ -16,6 +16,8 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
$scope.avgBlockTime = 0; $scope.avgBlockTime = 0;
$scope.lastBlocksTime = []; $scope.lastBlocksTime = [];
$scope.difficultyChange = [];
$scope.transactionDensity = [];
$scope.nodes = []; $scope.nodes = [];
$scope.map = []; $scope.map = [];
@ -143,6 +145,18 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
jQuery('.spark-blocktimes').sparkline($scope.lastBlocksTime, {type: 'bar', tooltipSuffix: 's'}); jQuery('.spark-blocktimes').sparkline($scope.lastBlocksTime, {type: 'bar', tooltipSuffix: 's'});
$scope.difficultyChange = _.max($scope.nodes, function(node) {
return parseInt(node.stats.block.number);
}).stats.difficulty;
jQuery('.spark-difficulty').sparkline($scope.difficultyChange, {type: 'bar'});
$scope.transactionDensity = _.max($scope.nodes, function(node) {
return parseInt(node.stats.block.number);
}).stats.txDensity;
jQuery('.spark-transactions').sparkline($scope.transactionDensity, {type: 'bar'});
$scope.map = _.map($scope.nodes, function(node) { $scope.map = _.map($scope.nodes, function(node) {
if(node.geo != null) if(node.geo != null)
return { return {

View File

@ -10,7 +10,8 @@
$.fn.sparkline.defaults.bar.barSpacing = 2; $.fn.sparkline.defaults.bar.barSpacing = 2;
$.fn.sparkline.defaults.bar.tooltipClassname = 'jqstooltip'; $.fn.sparkline.defaults.bar.tooltipClassname = 'jqstooltip';
$.fn.sparkline.defaults.bar.tooltipOffsetX = 0; $.fn.sparkline.defaults.bar.tooltipOffsetX = 0;
$.fn.sparkline.defaults.bar.tooltipFormat = $.spformat('<div class="tooltip-arrow" style="left: 50%;"></div><div class="tooltip-inner"><span style="color: {{color}}">&#9679;</span><br>{{prefix}}{{value}}{{suffix}}</div>'); // $.fn.sparkline.defaults.bar.tooltipFormat = $.spformat('<div class="tooltip-arrow" style="left: 50%;"></div><div class="tooltip-inner"><span style="color: {{color}}">&#9679;</span><br>{{prefix}}{{value}}{{suffix}}</div>');
$.fn.sparkline.defaults.bar.tooltipFormat = $.spformat('<div class="tooltip-arrow" style="left: 50%;"></div><div class="tooltip-inner">{{prefix}}{{value}}{{suffix}}</div>');
$.fn.sparkline.defaults.bar.colorMap = $.range_map({ $.fn.sparkline.defaults.bar.colorMap = $.range_map({
'1:12': '#7bcc3a', '1:12': '#7bcc3a',
'12:19': '#10a0de', '12:19': '#10a0de',

View File

@ -61,14 +61,25 @@ block content
div.clearfix div.clearfix
div.col-xs.12 div.col-xs-12
div.row
div.col-lg-8(style="padding-top: 30px;") div.col-lg-8(style="padding-top: 30px;")
div.col-xs-3.stat-holder div.col-xs-3.stat-holder
div.row.big-info.chart.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}") div.row.big-info.chart
span.small-title block time span.small-title block time
span.big-details.spark-blocktimes {{ lastBlocksTime.join(',') }} span.big-details.spark-blocktimes {{ lastBlocksTime.join(',') }}
div.clearfix div.col-xs-3.stat-holder
div.row.big-info.chart
span.small-title difficulty
span.big-details.spark-difficulty {{ difficultyChange.join(',') }}
div.col-xs-3.stat-holder
div.row.big-info.chart
span.small-title transactions
span.big-details.spark-transactions {{ transactionDensity.join(',') }}
//- div.clearfix
div.col-lg-4 div.col-lg-4
div.col-xs-12 div.col-xs-12