Prepared BlockPage (look&feel) for getting info by API

This commit is contained in:
Gustavo Cortez 2014-01-10 10:03:48 -03:00
parent e10e5fa2c0
commit 9db404c7f2
2 changed files with 107 additions and 61 deletions

View File

@ -40,6 +40,11 @@ body {
padding-right: 15px; padding-right: 15px;
} }
code { .code {
font-size: 80%; font-size: 80%;
} }
.address {
font-size: 10px;
}

View File

@ -3,61 +3,102 @@
<h1 data-ng-if="block">Block #{{ block.height }}</h1> <h1 data-ng-if="block">Block #{{ block.height }}</h1>
</div> </div>
<h2>Summary</h2> <div class="row">
<dl class="dl-horizontal"> <div class="col-md-6">
<dt>Number Of Transactions</dt> <div class="panel panel-default">
<dd>--</dd> <div class="panel-heading">
<dt>Output Total</dt> <h3 class="panel-title">Summary</h3>
<dd>--</dd> </div>
<dt>Estimated Transaction Volume</dt> <div class="panel-body">
<dd>--</dd>
<dt>Transaction Fees</dt>
<dd>--</dd>
<dt>Height</dt>
<dd>{{block.height}}</dd>
<dt>Timestamp</dt>
<dd>{{block.time}}</dd>
<dt>Received Time</dt>
<dd>{{block.time}}</dd>
<dt>Relayed By</dt>
<dd>--</dd>
<dt>Difficulty</dt>
<dd>{{block.difficulty}}</dd>
<dt>Bits</dt>
<dd>{{block.bits}}</dd>
<dt>Size</dt>
<dd>{{block.size}}</dd>
<dt>Version</dt>
<dd>{{block.version}}</dd>
<dt>Nonce</dt>
<dd>{{block.nonce}}</dd>
</dl>
<h2>Hashes</h2>
<table class="table table-striped"> <table class="table table-striped">
<thead>
<th>Hashes</th>
<th>&nbsp;</th>
</thead>
<tbody> <tbody>
<tr> <tr>
<td>Hash</td> <td>Number Of Transactions</td>
<td><a href="/#!/block/{{block.hash}}">{{block.hash}}</a></td> <td>--</td>
</tr> </tr>
<tr> <tr>
<td>Previous Block</td> <td>Output Total</td>
<td><a href="/#!/block/{{block.previousblockhash}}">{{block.previousblockhash}}</a></td> <td>--</td>
</tr> </tr>
<tr> <tr>
<td>Next Block(s)</td> <td>Estimated Transaction Volume</td>
<td><a href="/#!/block/{{block.nextblockhash}}">{{block.nextblockhash}}</a></td> <td>--</td>
</tr> </tr>
<tr> <tr>
<td>Merkle Root</td> <td>Transaction Fees</td>
<td>{{block.merkleroot}}</td> <td>--</td>
</tr>
<tr>
<td>Height</td>
<td>{{block.height}}</td>
</tr>
<tr>
<td>Timestamp</td>
<td>{{block.time * 1000 | date:'medium'}}</td>
</tr>
<tr>
<td>Received Time</td>
<td>--<td>
</tr>
<tr>
<td>Relayed By</td>
<td>--</td>
</tr>
<tr>
<td>Difficulty</td>
<td>{{block.difficulty}}</td>
</tr>
<tr>
<td>Bits</td>
<td>{{block.bits}}</td>
</tr>
<tr>
<td>Size</td>
<td>{{block.size}}</td>
</tr>
<tr>
<td>Version</td>
<td>{{block.version}}</td>
</tr>
<tr>
<td>Nonce</td>
<td>{{block.nonce}}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-default" data-ng-show="!tx.isCoinBase">
<div class="panel-heading">
<h3 class="panel-title">Hashes</h3>
</div>
<div class="panel-body">
<table class="table table-striped">
<tbody>
<tr>
<td>Hash</td>
<td><a class="address" href="/#!/block/{{block.hash}}">{{block.hash}}</a></td>
</tr>
<tr>
<td>Previous Block</td>
<td><a class="address" href="/#!/block/{{block.previousblockhash}}">{{block.previousblockhash}}</a></td>
</tr>
<tr>
<td>Next Block</td>
<td><a class="address" href="/#!/block/{{block.nextblockhash}}">{{block.nextblockhash}}</a></td>
</tr>
<tr>
<td>Merkle Root</td>
<td class="address">{{block.merkleroot}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<h2>Transactions</h2> <h2>Transactions</h2>
<table class="table table-striped"> <table class="table table-striped">