CipherLabs
/
ethstats-server
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

design improvements

Browse Source
pull/5/head
cubedro 10 years ago
parent 1959e77407
commit ddd31a5354
12 changed files with 186 additions and 25 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 20
      public/css/minimal-icons-codes.css
  2. 73
      public/css/minimal-icons-embedded.css
  3. 20
      public/css/minimal-icons-ie7-codes.css
  4. 4
      public/css/minimal-icons-ie7.css
  5. 16
      public/css/minimal-icons.css
  6. BIN
      public/fonts/minimal-icons.eot
  7. 4
      public/fonts/minimal-icons.svg
  8. BIN
      public/fonts/minimal-icons.ttf
  9. BIN
      public/fonts/minimal-icons.woff
  10. 10
      public/js/controllers.js
  11. 19
      public/js/filters.js
  12. 45
      views/index.jade

20
public/css/minimal-icons-codes.css
Unescape View File

@ -0,0 +1,20 @@
.icon-truck:before { content: '\e800'; } /* '' */
.icon-database:before { content: '\e801'; } /* '' */
.icon-mining:before { content: '\e802'; } /* '' */
.icon-check:before { content: '\e803'; } /* '' */
.icon-cancel:before { content: '\e804'; } /* '' */
.icon-loader:before { content: '\e805'; } /* '' */
.icon-check-o:before { content: '\e806'; } /* '' */
.icon-cancel-o:before { content: '\e807'; } /* '' */
.icon-warning-o:before { content: '\e808'; } /* '' */
.icon-network:before { content: '\e809'; } /* '' */
.icon-block:before { content: '\e80a'; } /* '' */
.icon-bulb:before { content: '\e80b'; } /* '' */
.icon-node:before { content: '\e80c'; } /* '' */
.icon-laptop:before { content: '\e80d'; } /* '' */
.icon-time:before { content: '\e80e'; } /* '' */
.icon-clock:before { content: '\e80f'; } /* '' */
.icon-group:before { content: '\e810'; } /* '' */
.icon-gas:before { content: '\e811'; } /* '' */
.icon-difficulty:before { content: '\e812'; } /* '' */

73
public/css/minimal-icons-embedded.css
View File

File diff suppressed because one or more lines are too long

20
public/css/minimal-icons-ie7-codes.css
Unescape View File

@ -0,0 +1,20 @@
.icon-truck { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-database { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-mining { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-check { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-cancel { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-loader { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-check-o { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-cancel-o { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-warning-o { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-network { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-block { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-bulb { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-node { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-laptop { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-time { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-clock { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-group { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-gas { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-difficulty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

4
public/css/minimal-icons-ie7.css
Unescape View File

@ -26,4 +26,6 @@
.icon-laptop { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-time { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-clock { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-group { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-group { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-gas { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
.icon-difficulty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

16
public/css/minimal-icons.css
Unescape View File

@ -1,10 +1,10 @@
@font-face {
font-family: 'minimal-icons';
src: url('../fonts/minimal-icons.eot?18158983');
src: url('../fonts/minimal-icons.eot?18158983#iefix') format('embedded-opentype'),
url('../fonts/minimal-icons.woff?18158983') format('woff'),
url('../fonts/minimal-icons.ttf?18158983') format('truetype'),
url('../fonts/minimal-icons.svg?18158983#minimal-icons') format('svg');
src: url('../fonts/minimal-icons.eot?55431205');
src: url('../fonts/minimal-icons.eot?55431205#iefix') format('embedded-opentype'),
url('../fonts/minimal-icons.woff?55431205') format('woff'),
url('../fonts/minimal-icons.ttf?55431205') format('truetype'),
url('../fonts/minimal-icons.svg?55431205#minimal-icons') format('svg');
font-weight: normal;
font-style: normal;
}
@ -14,7 +14,7 @@
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'minimal-icons';
src: url('../fonts/minimal-icons.svg?18158983#minimal-icons') format('svg');
src: url('../fonts/minimal-icons.svg?55431205#minimal-icons') format('svg');
}
}
*/
@ -66,4 +66,6 @@
.icon-laptop:before { content: '\e80d'; } /* '' */
.icon-time:before { content: '\e80e'; } /* '' */
.icon-clock:before { content: '\e80f'; } /* '' */
.icon-group:before { content: '\e810'; } /* '' */
.icon-group:before { content: '\e810'; } /* '' */
.icon-gas:before { content: '\e811'; } /* '' */
.icon-difficulty:before { content: '\e812'; } /* '' */

BIN
public/fonts/minimal-icons.eot
View File

Binary file not shown.

4
public/fonts/minimal-icons.svg
Unescape View File

@ -1,7 +1,7 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Copyright (C) 2014 by original authors @ fontello.com</metadata>
<metadata>Copyright (C) 2015 by original authors @ fontello.com</metadata>
<defs>
<font id="minimal-icons" horiz-adv-x="1000" >
<font-face font-family="minimal-icons" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="1000" descent="0" />
@ -23,6 +23,8 @@
<glyph glyph-name="time" unicode="&#xe80e;" d="m823 968h-646v-30h52c-14-76-42-354 266-452 300-96 257-367 244-425h-479c-6 33-23 137 19 236l-28 12c-43-103-30-206-22-248h-52v-30h646v30h-54c14 75 45 355-265 454-297 94-257 363-244 423h479c12-57 50-305-206-409l12-28c264 108 238 364 225 437h53v30z" horiz-adv-x="1000" />
<glyph glyph-name="clock" unicode="&#xe80f;" d="m501 484h-307v31h291v161h32v-180l-6-12-10 0z m483 16c0 267-217 484-484 484-39 0-78-4-116-14l8-30c35 9 71 13 108 13 250 0 453-203 453-453s-203-453-453-453-453 203-453 453c0 53 9 106 27 155l-29 11c-20-53-29-109-29-166 0-267 217-484 484-484 267 0 484 217 484 484z m-53 401c-2 21-12 40-28 54-17 14-37 21-58 19-21-1-40-11-54-27l24-20c8 10 19 15 32 16 13 1 25-3 36-12 10-8 16-20 17-33 1-12-2-24-10-34l23-20c14 16 20 36 18 57z m-415 31h-31v-61h31v61z m0-806h-31v-61h31v61z m418 388h-61v-31h61v31z m-806 0h-61v-31h61v31z" horiz-adv-x="1000" />
<glyph glyph-name="group" unicode="&#xe810;" d="m500 429c-58 0-105 48-105 106 0 59 47 107 105 107 58 0 106-48 106-107 0-58-48-106-106-106z m0 181c-40 0-74-33-74-75s34-75 74-75c41 0 74 34 74 75s-33 75-74 75z m243-356h-31c0 63-97 115-211 115-115 0-212-52-212-115h-31c0 82 107 147 243 147 136 0 242-65 242-147z m-544 327c-50 0-91 41-91 90 0 50 41 91 91 91 50 0 91-41 91-91 0-49-41-90-91-90z m0 149c-33 0-60-26-60-59 0-32 27-59 60-59 33 0 60 27 60 59 0 33-27 59-60 59z m181-309h-32c0 57-63 99-150 99-88 0-151-42-151-99h-31c0 75 76 130 182 130 105 0 182-55 182-130z m422 158c-50 0-90 41-90 91 0 50 40 91 90 91s91-41 91-91c0-50-41-91-91-91z m0 151c-32 0-59-27-59-60 0-33 27-59 59-59s60 26 60 59c0 33-27 60-60 60z m182-309h-31c0 58-63 100-150 100-88 0-151-42-151-100h-31c0 76 76 131 182 131 105 0 181-55 181-131z" horiz-adv-x="1000" />
<glyph glyph-name="gas" unicode="&#xe811;" d="m500 16c-267 0-484 217-484 484 0 103 32 202 93 285l25-19c-57-77-86-169-86-266 0-250 203-453 452-453 250 0 452 203 452 453 0 250-202 453-452 453-79 0-156-20-224-59l-15 27c72 41 155 63 239 63 267 0 484-217 484-484 0-267-217-484-484-484z m280 453l-13 28 66 28c-6 179-153 322-333 322-183 0-333-149-333-332h-31c0 201 163 364 364 364 201 0 364-163 364-364v-10l-84-36z m-280-270v31c25 0 45 20 45 44 0 44-24 259-45 309-21-50-45-265-45-309h-31c0 18 7 102 18 181 21 154 40 167 58 167 19 0 37-13 58-167 11-79 18-163 18-181 0-41-34-75-76-75z" horiz-adv-x="1000" />
<glyph glyph-name="difficulty" unicode="&#xe812;" d="m498 21c-9 0-17 3-23 9l-450 450c-12 13-12 33 0 45l140 140c-23 6-43 17-60 34-24 24-38 57-38 92s14 67 38 92c25 25 57 38 92 38s68-13 92-38c25-25 39-58 38-93l-31 0c0 27-10 52-29 71-19 19-43 29-70 29-26 0-51-11-70-29-18-19-29-44-29-70 0-26 11-51 29-70 19-19 45-30 71-29l39 0-190-189 450-451 452 450-140 141c-6-23-17-43-34-60-25-24-57-38-92-38s-67 14-92 38c-25 25-38 57-38 92 0 35 13 68 38 92 17 17 37 29 60 34l-153 152-30-29-22 22 29 29c13 13 33 13 46 0l201-201-38 0c-27 1-52-10-71-29-19-19-29-43-29-70s10-51 29-70c19-18 44-29 70-29s51 11 70 29c19 19 29 44 29 71l-1 39 190-190c6-6 9-14 9-22s-3-17-9-23l-450-450c-6-6-15-9-23-9z" horiz-adv-x="1000" />
</font>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 12 KiB

BIN
public/fonts/minimal-icons.ttf
View File

Binary file not shown.

BIN
public/fonts/minimal-icons.woff
View File

Binary file not shown.

10
public/js/controllers.js
Unescape View File

@ -11,7 +11,9 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
$scope.nodesActive = 0;
$scope.bestBlock = 0;
$scope.lastBlock = 0;
$scope.lastDifficulty = 0;
$scope.upTimeTotal = 0;
$scope.avgBlockTime = 0;
$scope.nodes = [];
$scope.map = [];
@ -117,6 +119,14 @@ function StatsCtrl($scope, $filter, socket, _, toastr) {
return parseInt(node.stats.block.timestamp);
}).stats.block.timestamp;
$scope.lastDifficulty = _.max($scope.nodes, function(node) {
return parseInt(node.stats.block.timestamp);
}).stats.block.difficulty;
$scope.avgBlockTime = _.max($scope.nodes, function(node) {
return parseInt(node.stats.block.timestamp);
}).stats.blocktimeAvg;
$scope.upTimeTotal = _.reduce($scope.nodes, function(total, node) {
return total + node.stats.uptime;
}, 0) / $scope.nodes.length;

19
public/js/filters.js
Unescape View File

@ -44,7 +44,7 @@ angular.module('netStatsApp.filters', [])
version = version.replace('eth version ', 'v')
.replace("\n" + 'Network protocol version: ', ' (')
.replace("\n" + 'Client database version: ', ',')
.replace("\n" + 'Build: ', ')<br>');
.replace("\n" + 'Build: ', ') - ');
return $sce.trustAsHtml(version);
};
})
@ -63,6 +63,16 @@ angular.module('netStatsApp.filters', [])
return timeClass(timestamp);
};
})
.filter('avgTimeFilter', function() {
return function(time) {
return Math.round(time) + 's';
};
})
.filter('avgTimeClass', function() {
return function(time) {
return blockTimeClass(time);
}
})
.filter('upTimeFilter', function() {
return function(uptime) {
return Math.round(uptime) + '%';
@ -115,6 +125,11 @@ function timeClass(timestamp)
var time = Math.floor((new Date()).getTime() / 1000);
var diff = time - timestamp;
return blockTimeClass(diff);
}
function blockTimeClass(diff)
{
if(diff <= 12)
return 'text-success';
@ -124,5 +139,5 @@ function timeClass(timestamp)
if(diff <= 30)
return 'text-warning';
return 'text-danger';
return 'text-danger'
}

45
views/index.jade
Unescape View File

@ -3,14 +3,14 @@ extends layout
block content
div.container-fluid(ng-controller='StatsCtrl')
div.row
div.col-lg-6(ng-cloak)
div.col-lg-8(ng-cloak)
div.col-sm-12
h1= title
//- p Welcome to #{title}
div.clearfix
div.col-xs-6.stat-holder
div.col-xs-4.stat-holder
div.row.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}")
div.pull-left.icon-full-width
i.icon-bulb
@ -18,7 +18,23 @@ block content
span.small-title active nodes
span.big-details {{nodesActive}}/{{nodesTotal}}
div.clearfix
div.col-xs-6.stat-holder
div.col-xs-4.stat-holder
div.row.big-info.difficulty.text-info
div.pull-left.icon-full-width
i.icon-difficulty
div.pull-left
span.small-title difficulty
span.big-details {{ lastDifficulty }}
div.clearfix
div.col-xs-4.stat-holder
div.row.big-info.uptime(class="{{ upTimeTotal | upTimeClass }}")
div.pull-left.icon-full-width
i.icon-clock
div.pull-left
span.small-title up-time
span.big-details {{ upTimeTotal | upTimeFilter }}
div.clearfix
div.col-xs-4.stat-holder
div.row.big-info.bestblock.text-info
div.pull-left.icon-full-width
i.icon-block
@ -26,7 +42,7 @@ block content
span.small-title best block
span.big-details {{"#" + bestBlock}}
div.clearfix
div.col-xs-6.stat-holder
div.col-xs-4.stat-holder
div.row.big-info.blocktime(class="{{ lastBlock | timeClass }}")
div.pull-left.icon-full-width
i.icon-time
@ -34,18 +50,18 @@ block content
span.small-title last block
span.big-details(am-time-ago="lastBlock", am-preprocess="unix") ∞
div.clearfix
div.col-xs-6.stat-holder
div.row.big-info.uptime(class="{{ upTimeTotal | upTimeClass }}")
div.col-xs-4.stat-holder
div.row.big-info.avgblocktime(class="{{ avgBlockTime | timeClass }}")
div.pull-left.icon-full-width
i.icon-clock
i.icon-gas
div.pull-left
span.small-title up-time
span.big-details {{ upTimeTotal | upTimeFilter }}
span.small-title avg block time
span.big-details {{ avgBlockTime | avgTimeFilter }}
div.clearfix
div.clearfix
div.col-lg-6
div.col-lg-4
div.col-xs-12
nodemap#mapHolder(data="map")
@ -75,9 +91,10 @@ block content
tbody
tr(ng-repeat='node in nodes', class="{{ node.stats | mainClass : bestBlock }}")
td(rel="{{node.id}}")
span(data-toggle="tooltip", data-placement="top", data-original-title="{{node.geo | geoTooltip}}") {{node.info.name}}
div.small {{node.info.ip}}
td.small
span.small(data-toggle="tooltip", data-placement="top", data-original-title="{{node.geo | geoTooltip}}") {{node.info.name}}
&nbsp; - &nbsp;
span.small {{node.info.ip}}
td
div.small(ng-bind-html="node.info.node | nodeVersion")
//- div.small {{node.info.os}}, {{node.info.os_v}}
td(class="{{ node.stats.peers | peerClass }}") {{node.stats.peers}}
@ -86,6 +103,6 @@ block content
td(class="{{ node.stats.block.number | blockClass : bestBlock }}") {{'#' + node.stats.block.number}}
td(class="{{ node.stats.block.number | blockClass : bestBlock }}").hidden-sm.hidden-xs
span.small {{node.stats.block.hash}}
div.small Difficulty: {{node.stats.block.difficulty | gasFilter}} | Gas used: {{node.stats.block.gasUsed | gasFilter}} | Min gas price: {{node.stats.block.minGasPrice | gasFilter}} | Gas limit: {{node.stats.block.gasLimit | gasFilter}}
//- div.small Difficulty: {{node.stats.block.difficulty | gasFilter}} | Gas used: {{node.stats.block.gasUsed | gasFilter}} | Min gas price: {{node.stats.block.minGasPrice | gasFilter}} | Gas limit: {{node.stats.block.gasLimit | gasFilter}}
td(am-time-ago="node.stats.block.timestamp", am-preprocess="unix", class="{{ node.stats.block.timestamp | timeClass }}") ∞
td(class="{{ node.stats.uptime | upTimeClass }}") {{ node.stats.uptime | upTimeFilter }}

Write Preview
Loading…
Cancel
Save