RanchiMall/flosight-api
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #416 from bechi/feature/05-layout-details

Browse Source 
Feature/05 layout details
This commit is contained in:
Mario Colque 2014-02-28 17:53:32 -02:00
commit 45f8ff9ea0
4 changed files with 108 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
public/css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

18
public/js/angularjs-all.min.js vendored
View File

File diff suppressed because one or more lines are too long

19
public/src/css/common.css
View File

@ -88,8 +88,9 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
.m50v { margin: 50px 0; } .m50v { margin: 50px 0; }
.m10b { margin-bottom: 10px; } .m10b { margin-bottom: 10px; }
.m10l { margin-left: 10px; } .m10l { margin-left: 10px; }
.vm { vertical-align: middle; } .vm { vertical-align: middle; }
.pa {position: absolute;}
.pr {position: relative;}
.bgwhite { .bgwhite {
background-color: white; background-color: white;
@ -447,7 +448,7 @@ margin-left: 0;
border-bottom: 2px solid #EAEAEA; border-bottom: 2px solid #EAEAEA;
padding: 0 0 10px 0; padding: 0 0 10px 0;
} }
.line-mid { padding: 15px 0;} .line-mid { padding: 15px;}
.line-top { .line-top {
border-top: 1px solid #EAEAEA; border-top: 1px solid #EAEAEA;
padding: 15px 0 0 0; padding: 15px 0 0 0;
@ -601,6 +602,9 @@ margin-left: 0;
.page-header { margin-top: 0; } .page-header { margin-top: 0; }
.panel { margin-bottom: 1em;}
.panel-body {padding: 0.7em;}
/* Index */ /* Index */
#home .btn-more { #home .btn-more {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
@ -675,18 +679,19 @@ margin-left: 0;
} }
.transaction-vin-vout { .transaction-vin-vout {
line-height: 1.8em;
} }
.v_highlight { .v_highlight {
background-color: #8DC429; margin-bottom: 1em;
padding: 1em 0;
background-color: #e9e9e9;
overflow: hidden; overflow: hidden;
color: #fff; color: #333;
} }
a.v_highlight_more { a.v_highlight_more {
background-color: #8DC429; background-color: #F0F7E2;
color: #fff; color: #333;
} }
.secondary_navbar { .secondary_navbar {

157
public/views/transaction/tx.html
View File

@ -1,14 +1,14 @@
<div class="line-bot row ng-cloak" data-ng-hide="!tx" data-ng-cloak> <div class="line-bot row ng-cloak" data-ng-hide="!tx" data-ng-cloak>
<div class="col-xs-12 col-md-6"> <div class="col-xs-12 col-md-8">
<div class="ellipsis"> <div class="h5 ellipsis">
<a class="btn-expand" href="#" title="Show/Hide items details" data-ng-click="itemsExpanded = !itemsExpanded"> <a class="btn-expand m10h" href="#" title="Show/Hide items details" data-ng-click="itemsExpanded = !itemsExpanded">
<span class="glyphicon glyphicon-plus-sign" data-ng-class="{'glyphicon-minus-sign': itemsExpanded}"></span> <span class="glyphicon glyphicon-plus-sign" data-ng-class="{'glyphicon-minus-sign': itemsExpanded}"></span>
</a> </a>
<a class="txid" href="/tx/{{tx.txid}}">{{tx.txid}}</a> <a class="txid" href="/tx/{{tx.txid}}">{{tx.txid}}</a>
<span class="btn-copy" clip-copy="tx.txid"></span> <span class="btn-copy" clip-copy="tx.txid"></span>
</div> </div>
</div> </div>
<div class="col-xs-12 col-md-6 text-right"> <div class="col-xs-12 col-md-4 text-right">
<div data-ng-show="tx.firstSeenTs"> <div data-ng-show="tx.firstSeenTs">
first seen at first seen at
<time>{{tx.firstSeenTs * 1000 | date:'medium'}}</time> <time>{{tx.firstSeenTs * 1000 | date:'medium'}}</time>
@ -30,12 +30,12 @@
</div> </div>
<div class="row" data-ng-if="!tx.isCoinBase"> <div class="row" data-ng-if="!tx.isCoinBase">
<!-- Simple view --> <!-- <<< Simple view -->
<div data-ng-if="!itemsExpanded" data-ng-init="currentInNoExpanded=0; sizeInNoExpanded=5"> <div data-ng-if="!itemsExpanded" data-ng-init="currentInNoExpanded=0; sizeInNoExpanded=5">
<div data-ng-repeat="vin in tx.vinSimple| startFrom:currentInNoExpanded*sizeInNoExpanded | limitTo:sizeInNoExpanded"> <div class="panel panel-default" data-ng-repeat="vin in tx.vinSimple| startFrom:currentInNoExpanded*sizeInNoExpanded | limitTo:sizeInNoExpanded">
<div class="col-md-12 transaction-vin-vout"> <div class="panel-body transaction-vin-vout">
<div class="pull-right btc-value" data-ng-class="{'text-danger': $root.currentAddr == vin.addr}"> <div class="pull-right btc-value" data-ng-class="{'text-danger': $root.currentAddr == vin.addr}">
<p>{{$root.currency.getConvertion(vin.value) || vin.value + ' BTC'}}</p> {{$root.currency.getConvertion(vin.value) || vin.value + ' BTC'}}
</div> </div>
<div class="ellipsis"> <div class="ellipsis">
<span data-ng-show="vin.notAddr">{{vin.addr}}</span> <span data-ng-show="vin.notAddr">{{vin.addr}}</span>
@ -55,37 +55,45 @@
</div> </div>
</div> </div>
<!-- Full view --> <!-- <<< Full view -->
<div data-ng-if="itemsExpanded" data-ng-init="currentInExpanded=0; sizeInExpanded=(from_vin) ? tx.vin.length : 5; fromVinCollapsed=(from_vin)"> <div data-ng-if="itemsExpanded" data-ng-init="currentInExpanded=0; sizeInExpanded=(from_vin) ? tx.vin.length : 5; fromVinCollapsed=(from_vin)">
<a href="#" data-ng-show="(from_vin) && tx.vin.length > 1" data-ng-class="{'text-muted': fromVinCollapsed}" data-ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length;fromVinCollapsed=1"><small>show input {{ v_index }}</small></a>
<a href="#" data-ng-show="(from_vin) && tx.vin.length > 1" data-ng-class="{'text-muted': !fromVinCollapsed}" data-ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length;fromVinCollapsed=0"><small>show all</small></a>
<div data-ng-repeat="vin in tx.vin| startFrom:currentInExpanded*sizeInExpanded | limitTo:sizeInExpanded" data-ng-if="fromVinCollapsed ? v_index == vin.n : 1"> <div data-ng-repeat="vin in tx.vin| startFrom:currentInExpanded*sizeInExpanded | limitTo:sizeInExpanded" data-ng-if="fromVinCollapsed ? v_index == vin.n : 1">
<div class="col-md-12 transaction-vin-vout"> <div class="panel panel-default transaction-vin-vout">
<div class="pull-right btc-value"><p>{{$root.currency.getConvertion(vin.value) || vin.value + ' BTC'}}</p></div> <div class="panel-body">
<div class="ellipsis"> <div class="pull-right btc-value">
<a class="glyphicon glyphicon-chevron-right" href="/tx/{{vin.txid}}/>/{{vin.vout}}" title="Outpoint: {{vin.txid}},{{vin.vout}}"></a>&nbsp;&nbsp; {{$root.currency.getConvertion(vin.value) || vin.value + ' BTC'}}
<span data-ng-show="vin.notAddr">{{vin.addr}}</span> </div>
<a href="/address/{{vin.addr}}" data-ng-show="!vin.notAddr">{{vin.addr}}</a> <div class="ellipsis">
</div> <a class="glyphicon glyphicon-chevron-right" href="/tx/{{vin.txid}}/>/{{vin.vout}}" title="Outpoint: {{vin.txid}},{{vin.vout}}"></a>&nbsp;&nbsp;
<div data-ng-show="vin.unconfirmedInput" class="text-danger"> <span class="glyphicon glyphicon-warning-sign"></span> (Input unconfirmed)</div> <span data-ng-show="vin.notAddr">{{vin.addr}}</span>
<div data-ng-show="vin.dbError" class="text-danger"> <span class="glyphicon glyphicon-warning-sign"></span> Incoherence in levelDB detected, please resync</div> <a href="/address/{{vin.addr}}" data-ng-show="!vin.notAddr">{{vin.addr}}</a>
<div data-ng-show="vin.doubleSpentTxID" class="text-danger"> <span class="glyphicon glyphicon-warning-sign"></span> Double spent attempt detected. From tx: </div>
<a href="/tx/{{vin.doubleSpentTxID}}">{{vin.doubleSpentTxID}},{{vin.doubleSpentIndex}}</a> <div data-ng-show="vin.unconfirmedInput" class="text-danger">
</div> <span class="glyphicon glyphicon-warning-sign"></span> (Input unconfirmed)
</div> </div>
<div class="col-md-12"> <div data-ng-show="vin.dbError" class="text-danger">
<div class="panel panel-default"> <span class="glyphicon glyphicon-warning-sign"></span>
<div class="panel-body" style="word-wrap:break-word" data-ng-class="{true: 'v_highlight', false: ''}[from_vin == true && v_index == vin.n]"> Incoherence in levelDB detected, please resync
<small> </div>
<strong>scriptSig</strong> <div data-ng-show="vin.doubleSpentTxID" class="text-danger">
<span data-ng-repeat="item in vin.scriptSig.asm | split:' '"> <span class="glyphicon glyphicon-warning-sign"></span>
<span>{{item}}</span><br><br> Double spent attempt detected. From tx:
</span> <a href="/tx/{{<vin class=""></vin>doubleSpentTxID}}">{{vin.doubleSpentTxID}},{{vin.doubleSpentIndex}}</a>
</small> </div>
</div> <!-- END OF PANEL BODY -->
</div> <!-- END OF PANEL-DEFAULT -->
<div class="small" style="margin-left:0.7em; word-wrap:break-word;" data-ng-class="{true: 'v_highlight', false: ''}[from_vin == true && v_index == vin.n]" >
<p><strong>scriptSig</strong></p>
<div data-ng-repeat="item in vin.scriptSig.asm | split:' '" class="">
<p class="col-md-11 ellipsis text-muted">{{item}}</p>
<p class="btn-copy" clip-copy="item"></p>
</div> </div>
</div>
</div> </div>
</div> </div>
<div class="text-left">
<a href="#" data-ng-show="(from_vin) && tx.vin.length > 1" data-ng-class="{'text-muted': fromVinCollapsed}" data-ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length;fromVinCollapsed=1"><small>show input {{ v_index }}</small></a>
<a href="#" data-ng-show="(from_vin) && tx.vin.length > 1" data-ng-class="{'text-muted': !fromVinCollapsed}" data-ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length;fromVinCollapsed=0"><small>show all</small></a>
</div>
<div class="showmore_collapse text-right" data-ng-show="tx.vin.length > 5 && !fromVinCollapsed" data-ng-class="{ 'hidden': !itemsExpanded}"> <div class="showmore_collapse text-right" data-ng-show="tx.vin.length > 5 && !fromVinCollapsed" data-ng-class="{ 'hidden': !itemsExpanded}">
<a href="#" ng-hide="sizeInExpanded != tx.vin.length" ng-click="currentInExpanded=0; sizeInExpanded=5"><small>...less</small></a> <a href="#" ng-hide="sizeInExpanded != tx.vin.length" ng-click="currentInExpanded=0; sizeInExpanded=5"><small>...less</small></a>
<a href="#" data-ng-class="{true: 'v_highlight_more', false: ''}[from_vin == true && v_index > 5]" ng-hide="currentInExpanded >= tx.vin.length/sizeInExpanded - 1" ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length"><small>more...</small></a> <a href="#" data-ng-class="{true: 'v_highlight_more', false: ''}[from_vin == true && v_index > 5]" ng-hide="currentInExpanded >= tx.vin.length/sizeInExpanded - 1" ng-click="currentInExpanded=0; sizeInExpanded=tx.vin.length"><small>more...</small></a>
@ -95,29 +103,31 @@
</div> </div>
<div class="col-md-1 col-xs-12"> <div class="col-md-1 col-xs-12">
<div class="hidden-xs hidden-sm text-center"> <div class="hidden-xs hidden-sm text-center">
<span class="glyphicon glyphicon-chevron-right text-primary"></span> <span class="lead glyphicon glyphicon-chevron-right text-muted"></span>
</div> </div>
<div class="hidden-md hidden-lg text-center"> <div class="hidden-md hidden-lg text-center">
<span class="glyphicon glyphicon-chevron-down text-primary"></span> <span class="lead glyphicon glyphicon-chevron-down text-muted"></span>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="row"> <div class="row">
<!-- Simple view --> <!-- Simple view >>> -->
<div data-ng-if="!itemsExpanded" data-ng-init="currentOutNoExpanded=0; sizeOutNoExpanded=5"> <div data-ng-if="!itemsExpanded" data-ng-init="currentOutNoExpanded=0; sizeOutNoExpanded=5">
<div data-ng-repeat="vout in tx.voutSimple| startFrom:currentOutNoExpanded*sizeOutNoExpanded | limitTo:sizeOutNoExpanded"> <div data-ng-repeat="vout in tx.voutSimple| startFrom:currentOutNoExpanded*sizeOutNoExpanded | limitTo:sizeOutNoExpanded">
<div class="col-md-12 transaction-vin-vout"> <div class="transaction-vin-vout panel panel-default">
<div class="pull-right btc-value" data-ng-class="{'text-success': $root.currentAddr == vout.addr}"> <div class="panel-body">
{{$root.currency.getConvertion(vout.value) || vout.value + ' BTC' }} <div class="pull-right btc-value" data-ng-class="{'text-success': $root.currentAddr == vout.addr}">
<span class="text-danger" data-ng-show="vout.isSpent" tooltip="Output is spent" tooltip-placement="left">(S)</span> {{$root.currency.getConvertion(vout.value) || vout.value + ' BTC' }}
<span class="text-success" data-ng-show="!vout.isSpent" tooltip="Output is unspent" tooltip-placement="left">(U)</span> <span class="text-danger" data-ng-show="vout.isSpent" tooltip="Output is spent" tooltip-placement="left">(S)</span>
</div> <span class="text-success" data-ng-show="!vout.isSpent" tooltip="Output is unspent" tooltip-placement="left">(U)</span>
</div>
<div class="ellipsis"> <div class="ellipsis">
<span data-ng-show="vout.notAddr">{{vout.addr}}</span> <span data-ng-show="vout.notAddr">{{vout.addr}}</span>
<span class="text-muted" title="Current Bitcoin Address" data-ng-show="address == $root.currentAddr" data-ng-repeat="address in vout.addr.split(',')">{{vout.addr}}</span> <span class="text-muted" title="Current Bitcoin Address" data-ng-show="address == $root.currentAddr" data-ng-repeat="address in vout.addr.split(',')">{{vout.addr}}</span>
<a href="/address/{{address}}" data-ng-show="!vout.notAddr && address != $root.currentAddr" data-ng-repeat="address in vout.addr.split(',')">{{address}}</a> <a href="/address/{{address}}" data-ng-show="!vout.notAddr && address != $root.currentAddr" data-ng-repeat="address in vout.addr.split(',')">{{address}}</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -127,38 +137,37 @@
</div> </div>
</div> </div>
<!-- Full view --> <!-- Full view >>> -->
<div data-ng-if="itemsExpanded" data-ng-init="currentOutExpanded=0; sizeOutExpanded=(from_vout) ? tx.vout.length : 5; fromVoutCollapsed=(from_vout)"> <div data-ng-if="itemsExpanded" data-ng-init="currentOutExpanded=0; sizeOutExpanded=(from_vout) ? tx.vout.length : 5; fromVoutCollapsed=(from_vout)">
<a href="#" data-ng-show="(from_vout) && tx.vout.length > 1" data-ng-class="{'text-muted': fromVoutCollapsed}" data-ng-click="currentOutExpanded=0; sizeOutExpanded=tx.vout.length;fromVoutCollapsed=1"><small>show output {{ v_index }}</small></a>
<a href="#" data-ng-show="(from_vout) && tx.vout.length > 1" data-ng-class="{'text-muted': !fromVoutCollapsed}" data-ng-click="currentOutExpanded=0; sizeOutExpanded=tx.vout.length;fromVoutCollapsed=0"><small>show all</small></a>
<div data-ng-repeat="vout in tx.vout| startFrom:currentOutExpanded*sizeOutExpanded | limitTo:sizeOutExpanded" data-ng-if="fromVoutCollapsed ? v_index == vout.n : 1"> <div data-ng-repeat="vout in tx.vout| startFrom:currentOutExpanded*sizeOutExpanded | limitTo:sizeOutExpanded" data-ng-if="fromVoutCollapsed ? v_index == vout.n : 1">
<div class="col-md-12 transaction-vin-vout"> <div class="panel panel-default transaction-vin-vout">
<div class="pull-right btc-value"> <div class="panel-body">
<p>{{$root.currency.getConvertion(vout.value) || vout.value + ' BTC'}} <div class="pull-right btc-value">
<span class="text-success" data-ng-show="!vout.spentTxId" tooltip="Output is unspent" tooltip-placement="left">(U)</span> <spam>{{$root.currency.getConvertion(vout.value) || vout.value + ' BTC'}}
<a class="glyphicon glyphicon-chevron-right" data-ng-show="vout.spentTxId" href="/tx/{{vout.spentTxId}}/</{{vout.spentIndex}}" title="Spent at: {{vout.spentTxId}},{{vout.spentIndex}}"></a>&nbsp;&nbsp; <span class="text-success" data-ng-show="!vout.spentTxId" tooltip="Output is unspent" tooltip-placement="left">(U)</span>
</p> <a class="glyphicon glyphicon-chevron-right" data-ng-show="vout.spentTxId" href="/tx/{{vout.spentTxId}}/</{{vout.spentIndex}}" title="Spent at: {{vout.spentTxId}},{{vout.spentIndex}}"></a>&nbsp;&nbsp;
</div> </spam>
<div class="ellipsis"> </div>
<a href="/address/{{address}}" data-ng-repeat="address in vout.scriptPubKey.addresses">{{address}}</a> <div class="ellipsis">
</div> <a href="/address/{{address}}" data-ng-repeat="address in vout.scriptPubKey.addresses">{{address}}</a>
</div>
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body" style="word-wrap:break-word" data-ng-class="{true: 'v_highlight', false: ''}[from_vout == true && v_index == vout.n]">
<small>
<p>
<strong>Type</strong>
{{vout.scriptPubKey.type}}
</p>
<p>
<strong>scriptPubKey</strong>
{{vout.scriptPubKey.asm}}
</p>
</small>
</div> </div>
</div> </div>
</div> </div>
<div style="padding-left: 0.7em; padding-bottom: 2em; word-wrap:break-word" data-ng-class="{true: 'v_highlight', false: ''}[from_vout == true && v_index == vout.n]">
<p class="small">
<strong>Type</strong>
<span class="text-muted">{{vout.scriptPubKey.type}}</span>
</p>
<div class="small">
<p><strong>scriptPubKey</strong></p>
<span class="col-md-11 text-muted ellipsis">{{vout.scriptPubKey.asm}}</span>
<span class="btn-copy col-md-1" clip-copy="tx.txid"></span>
</div>
</div>
</div>
<div class="text-right">
<a href="#" class="text-right" data-ng-show="(from_vout) && tx.vout.length > 1" data-ng-class="{'text-muted': fromVoutCollapsed}" data-ng-click="currentOutExpanded=0; sizeOutExpanded=tx.vout.length;fromVoutCollapsed=1"><small>show output {{ v_index }}</small></a>
<a href="#" class="text-right" data-ng-show="(from_vout) && tx.vout.length > 1" data-ng-class="{'text-muted': !fromVoutCollapsed}" data-ng-click="currentOutExpanded=0; sizeOutExpanded=tx.vout.length;fromVoutCollapsed=0"><small>show all</small></a>
</div> </div>
<div class="showmore_collapse text-right" data-ng-show="tx.vout.length > 5 && !fromVoutCollapsed" data-ng-class="{ 'hidden': !itemsExpanded}"> <div class="showmore_collapse text-right" data-ng-show="tx.vout.length > 5 && !fromVoutCollapsed" data-ng-class="{ 'hidden': !itemsExpanded}">
<a href="#" ng-hide="sizeOutExpanded != tx.vout.length" ng-click="currentOutExpanded=0; sizeOutExpanded=5"><small>...less</small></a> <a href="#" ng-hide="sizeOutExpanded != tx.vout.length" ng-click="currentOutExpanded=0; sizeOutExpanded=5"><small>...less</small></a>