Merge pull request #193 from cmgustavo/feature/01tx-page
Feature/01tx page
This commit is contained in:
commit
6ecc784969
|
@ -196,25 +196,24 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|||
.block-id {
|
||||
background-color: #373D42;
|
||||
border: 3px solid #FFFFFF;
|
||||
height: 165px;
|
||||
margin: 10px auto;
|
||||
margin: 0 auto;
|
||||
width: 165px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 80px;
|
||||
}
|
||||
|
||||
.block-id h1 {
|
||||
.block-id span {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.block-id h2 {
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.block-id h3 {
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.icon-block {
|
||||
|
@ -278,9 +277,11 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|||
height: 51px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#footer .currency a.active {
|
||||
color: #fff;
|
||||
|
||||
.currency a.active {
|
||||
color: #000;
|
||||
text-decoration: underline;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#footer a.insight {
|
||||
|
@ -432,12 +433,18 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|||
line-height: 26px;
|
||||
}
|
||||
|
||||
.tx-id {
|
||||
background-color: #373D42;
|
||||
border: 3px solid #FFFFFF;
|
||||
margin: 0 auto;
|
||||
width: 165px;
|
||||
color: #FFFFFF;
|
||||
font-size: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.transaction-vin-vout .ellipsis { margin-bottom: 10px; }
|
||||
.transaction-vin-vout .btc-value { margin-left: 15px; }
|
||||
|
||||
.page-header { margin-top: 0; }
|
||||
|
||||
.block_hash {
|
||||
margin-left: 46px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
@ -4,9 +4,7 @@ angular.module('insight.system').controller('FooterController',
|
|||
function($rootScope, $scope, Version, Currency) {
|
||||
|
||||
var _roundFloat = function(x, n) {
|
||||
if(!parseInt(n, 10)) n = 0;
|
||||
|
||||
if(!parseFloat(x)) return false;
|
||||
if(!parseInt(n, 10) || !parseFloat(x)) n = 0;
|
||||
|
||||
return Math.round(x * Math.pow(10, n)) / Math.pow(10, n);
|
||||
};
|
||||
|
|
|
@ -5,10 +5,10 @@
|
|||
<h1 class="text-center">Address</h1>
|
||||
<div class="text-center">
|
||||
<qrcode size="160" data="{{address.addrStr}}"></qrcode>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="address.addrStr"></button>
|
||||
<a class="ellipsis" href="/address/{{address.addrStr}}">{{address.addrStr}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="address.addrStr"></button>
|
||||
<a class="ellipsis" href="/address/{{address.addrStr}}">{{address.addrStr}}</a>
|
||||
</div>
|
||||
<div class="m20v">
|
||||
<h4>Summary</h4>
|
||||
|
@ -16,15 +16,15 @@
|
|||
<tbody>
|
||||
<tr>
|
||||
<td class="small">Total Received</td>
|
||||
<td class="address ellipsis text-right">{{address.totalReceived}} BTC</td>
|
||||
<td class="address ellipsis text-right">{{$root.currency.getConversion(address.totalReceived)}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">Total Sent</td>
|
||||
<td class="address ellipsis text-right">{{address.totalSent}} BTC</td>
|
||||
<td class="address ellipsis text-right">{{$root.currency.getConversion(address.totalSent)}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">Final Balance</td>
|
||||
<td class="address ellipsis text-right">{{address.balance}} BTC</td>
|
||||
<td class="address ellipsis text-right">{{$root.currency.getConversion(address.balance)}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">No. Transactions</td>
|
||||
|
@ -33,6 +33,7 @@
|
|||
</tbody>
|
||||
</table>
|
||||
</div> <!-- END OF TRANSACTIONS TABLE -->
|
||||
<div data-ng-include src="'/views/includes/currency.html'"></div>
|
||||
</div> <!-- END OF COL-MD-3 -->
|
||||
<div class="col-xs-12 col-md-9 col-md-offset-3">
|
||||
<div data-ng-controller="transactionsController" data-ng-init="load('address')">
|
||||
|
|
|
@ -2,15 +2,14 @@
|
|||
<section data-ng-controller="BlocksController" data-ng-init="findOne()">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-gray col-gray-fixed">
|
||||
<h1 class="text-center">Block</h1>
|
||||
<div class="block-id">
|
||||
<div class="icon-block text-center">
|
||||
<span class="glyphicon glyphicon-list-alt"></span>
|
||||
</div>
|
||||
<h1 data-ng-if="block">Block #{{ block.height }}</h1>
|
||||
<span class="glyphicon glyphicon-list-alt"></span>
|
||||
<h2 data-ng-if="block">#{{ block.height }}</h2>
|
||||
</div>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="block.hash"></button>
|
||||
<a class="ellipsis block_hash" href="/address/{{block.hash}}">{{block.hash}}</a>
|
||||
<a class="ellipsis" href="/address/{{block.hash}}">{{block.hash}}</a>
|
||||
</div>
|
||||
<div class="m20v" data-ng-show="!tx.isCoinBase">
|
||||
<h4>Hashes</h4>
|
||||
|
@ -31,6 +30,7 @@
|
|||
</tbody>
|
||||
</table>
|
||||
</div> <!-- END OF TRANSACTIONS TABLE -->
|
||||
<div data-ng-include src="'/views/includes/currency.html'"></div>
|
||||
</div> <!-- END OF COL-GRAY -->
|
||||
|
||||
<div class="col-xs-12 col-md-9 col-md-offset-3">
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
<div class="currency text-center m10t" data-ng-controller="FooterController">
|
||||
<small>
|
||||
Currency:
|
||||
<a href="#" data-ng-click="setCurrency('USD')" data-ng-class="{active: $root.currency.symbol == 'USD'}" tooltip="Change to USD: Bitstamp ${{$root.currency.bitstamp}}">USD</a> ·
|
||||
<a href="#" data-ng-click="setCurrency('BTC')" data-ng-class="{active: $root.currency.symbol == 'BTC'}" tooltip="Change to BTC">BTC</a> ·
|
||||
<a href="#" data-ng-click="setCurrency('mBTC')" data-ng-class="{active: $root.currency.symbol == 'mBTC'}" tooltip="Change to mBTC">mBTC</a>
|
||||
</small>
|
||||
</div>
|
|
@ -1,11 +1,3 @@
|
|||
<div class="container" data-ng-controller="FooterController">
|
||||
<div class="pull-left m10v currency">
|
||||
<small>
|
||||
Currency:
|
||||
<a href="#" data-ng-click="setCurrency('USD')" data-ng-class="{active: $root.currency.symbol == 'USD'}" tooltip="Change to USD: Bitstamp ${{$root.currency.bitstamp}}">USD</a> ·
|
||||
<a href="#" data-ng-click="setCurrency('BTC')" data-ng-class="{active: $root.currency.symbol == 'BTC'}" tooltip="Change to BTC">BTC</a> ·
|
||||
<a href="#" data-ng-click="setCurrency('mBTC')" data-ng-class="{active: $root.currency.symbol == 'mBTC'}" tooltip="Change to mBTC">mBTC</a>
|
||||
</small>
|
||||
</div>
|
||||
<a class="insight m10v pull-right" href="/">Insight <small>API v{{version}}</small></a>
|
||||
</div>
|
||||
|
|
|
@ -1,55 +1,62 @@
|
|||
<div data-ng-include src="'/views/includes/connection.html'"></div>
|
||||
<section data-ng-controller="transactionsController" data-ng-init="findThis()">
|
||||
<h1>
|
||||
Transaction
|
||||
<small>View information about a bitcoin transaction</small>
|
||||
</h1>
|
||||
|
||||
<div class="block-tx">
|
||||
<div data-ng-include src="'/views/transaction/tx.html'"></div>
|
||||
</div><!-- END OF BLOCK-TX -->
|
||||
|
||||
<div class="row">
|
||||
<div data-ng-class="{'col-md-6':!tx.isCoinBase}">
|
||||
<h2>Summary</h2>
|
||||
<table class="table" style="table-layout: fixed">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong> Size </strong></td>
|
||||
<td class="text-muted text-right">{{tx.size}} (bytes)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Received Time </strong></td>
|
||||
<td class="text-muted text-right">{{tx.time * 1000|date:'medium'}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Block </strong>
|
||||
<td class="text-right">
|
||||
<button class="btn-copy pull-right" clip-copy="tx.blockhash"></button>
|
||||
<a href="/block/{{tx.blockhash}}" class=" ellipsis">{{tx.blockhash}}</a>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-gray col-gray-fixed">
|
||||
<h1 class="text-center">Transaction</h1>
|
||||
<div class="tx-id">
|
||||
<span class="glyphicon glyphicon-retweet"></span>
|
||||
</div>
|
||||
<div class="col-md-6" data-ng-show="!tx.isCoinBase">
|
||||
<div class="m10v">
|
||||
<button class="btn-copy pull-right" clip-copy="tx.txid"></button>
|
||||
<div class="ellipsis">
|
||||
<a class="txid" href="/tx/{{tx.txid}}">{{tx.txid}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<h4>Summary</h4>
|
||||
<table class="table" style="table-layout: fixed">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong> Size </strong></td>
|
||||
<td class="text-muted text-right">{{tx.size}} (bytes)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Received Time </strong></td>
|
||||
<td class="text-muted text-right">{{tx.time * 1000|date:'medium'}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div data-ng-include src="'/views/includes/currency.html'"></div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-9 col-md-offset-3">
|
||||
<h2>
|
||||
Details
|
||||
<small>View information about a bitcoin transaction</small>
|
||||
</h2>
|
||||
|
||||
<div class="block-tx">
|
||||
<div data-ng-include src="'/views/transaction/tx.html'"></div>
|
||||
</div>
|
||||
|
||||
<div data-ng-show="!tx.isCoinBase">
|
||||
<h2>Inputs and Outputs</h2>
|
||||
<table class="table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Total Input</strong></td>
|
||||
<td class="text-muted text-right">{{tx.valueIn}} BTC</td>
|
||||
<td class="text-muted text-right">{{$root.currency.getConversion(tx.valueIn)}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Total Output</strong></td>
|
||||
<td class="text-muted text-right">{{tx.valueOut}} BTC</td>
|
||||
<td class="text-muted text-right">{{$root.currency.getConversion(tx.valueOut)}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Fees</strong></td>
|
||||
<td class="text-muted text-right">{{tx.fees}} BTC</td>
|
||||
<td class="text-muted text-right">{{$root.currency.getConversion(tx.fees)}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
|
@ -109,7 +109,7 @@
|
|||
</div>
|
||||
<div class="line-top row">
|
||||
<div class="col-xs-4 col-md-6">
|
||||
<button data-ng-show="!tx.isCoinBase" class="btn btn-default">Fees: {{tx.fees}}</button>
|
||||
<button data-ng-show="!tx.isCoinBase" class="btn btn-default">Fees: {{$root.currency.getConversion(tx.fees)}}</button>
|
||||
</div>
|
||||
<div class="col-xs-8 col-md-6 text-right">
|
||||
<button data-ng-show="tx.confirmations" class="btn btn-success">{{tx.confirmations}} Confirmations</button>
|
||||
|
|
Loading…
Reference in New Issue