UNPKG

@rahlfantasy/block-explorer

Version:
454 lines (420 loc) 16.9 kB
<template name="address"> <h3 class="ui pageHeader header"> <i class="tiny icon"></i> <div class="content wordBreak f-h"> {{address.state.address}} </div> </h3> <div class="ui segment pageSegment"> <div class="description"> <div class="ui hidden divider"></div> <div class="ui stackable grid"> <div class="twelve wide column"> <div class="ui basic center aligned segment"> <div class="ui statistic"> <div class="label"> <div class="ui label"> {{#if isMultiSig}} MultiSig Balance {{else}} Balance {{/if}} </div> </div> <div class="value" data-html="<div class='content'>USD ${{qrl}}</div>"> {{address.state.balance}} </div> <div class="label"> Quanta<br><small>USD ${{qrl}}</small> </div> </div> </div> </div> <div class="four wide column center aligned" style="display: none;"> <div class="row"> <canvas id="identicon" width="100" height="100"></canvas> <div class="qr-code-container"></div> </div> <!-- <div class="row"> --> <!-- <button class="ui button blue" id="clickHelp" data-html="<p>This is an identicon and a QR code. The identicon is a visual representation of the address: you will be able to recognise this address from the identicon across the QRL network.</p><p>The QR code contains the QRL address for scanning with our mobile wallet app.</p><p>Click the help icon to visit our documentation site to learn more.</p>" data-position="bottom center"><i class="help icon" style="margin-right: 0px"></i> </button> --> <!-- </div> --> <div class="row"></div> </div> </div> <div class="ui grid"> <div class="ui celled horizontal list"> <div class="item"><strong>Transactions</strong> {{address.state.transaction_hash_count}}</div> {{#if isMultiSig}}{{else}}<div class="item"><strong>Nonce</strong> {{address.state.nonce}}</div>{{/if}} <div class="item"><strong>Signature Scheme</strong> {{addressValidation.signatureScheme}}</div> {{#if isMultiSig}}{{else}}<div class="item"><strong>Tree Height</strong> {{addressValidation.height}}</div>{{/if}} {{#if isMultiSig}}{{else}}<div class="item"><strong>Total Signatures</strong> {{addressValidation.totalSignatures}}</div>{{/if}} {{#if isMultiSig}}{{else}}<div class="item"><strong>Signatures Remaining</strong> {{addressValidation.keysRemaining}}</div>{{/if}} <div class="item"><strong>Hash Function</strong> {{addressValidation.hashFunction}}</div> <!-- <div class="item" id="OTStracker"><button class="ui small button secondary"><i class="expand arrows alternate icon"></i>OTS tracker</button></div> --> </div> </div> </div> {{#if isMultiSig}} <h3 class="value">Signatories</h3> <table class="ui table"> <thead><th>Address</th><th>Weight</th></thead> <tbody> {{#each signatories 'MULTISIG'}} <tr> <td class="hack"> <!-- {{# if bech32}}{{ this.address_b32 }}{{else}} --> <a href="/a/{{ this.address_hex}}">{{ this.address_hex}}</a> <!-- {{/if}} --> </td> <td>{{ this.weight }}</td> </tr> {{/each}} </tbody> <tfoot> <th>Threshold for spend</th> <th>{{ threshold }}</th> </tfoot> </table> {{else}} <!-- Send/Receive Section --> <div id="addressTabs" class="ui top attached tabular menu"> <a class="item active" data-tab="transactions">Quanta</a> <a class="item" data-tab="tokenBalances">Tokens</a> <a class="item" data-tab="otsTrackerTab">OTS Tracker</a> <a class="item" data-tab="slavesTab">Slaves</a> </div> <div class="ui bottom attached tab segment active" data-tab="transactions"> <h2 class="ui header"> <div class="content"> Transactions </div> </h2> <div id="loadingTransactions" class="ui icon message"> <br /><br /> <i class="notched circle loading icon"></i> <div class="content"> <div class="header"> Just a moment </div> <p id="relayingMsg">Transaction history loading ...</p> </div> </div> {{#if addressHasTransactions}} {{#each addressTransactions}} {{#if isTransfer this.transactionType}} <div class="ui icon message transactionRecord"> {{#if isThisAddress this.addr_from}} <img class="transactionTypeImage" src="/img/icons/send.png" /> {{else}} <img class="transactionTypeImage" src="/img/icons/receive.png" /> {{/if}} <div class="content"> <div class="header"> {{#if isThisAddress this.addr_from}} Sent {{else}} Received {{/if}} | {{this.timestamp}} </div> <p class="transactionAddress value"> {{#if isThisAddress this.addr_from}} {{#each sendingOutputs this}} {{this.amount}} &raquo; {{this.to}}<br /> {{/each}} {{else}} {{# if bech32}}{{this.addr_from}}{{else}}{{this.addr_from}}{{/if}} {{/if}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{#if isThisAddress this.addr_from}} {{totalTransferred this}} {{else}} {{receivedAmount this}} {{/if}} Quanta &gt;</a> </div> </div> {{/if}} {{#if isTokenCreation this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Token Creation - {{this.token.name}} ({{this.token.symbol}}) | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{this.token.symbol}} &gt;</a> </div> </div> {{/if}} {{#if isTokenTransfer this.transactionType}} <div class="ui icon message transactionRecord"> {{#if isThisAddress this.addr_from}} <img class="transactionTypeImage" src="/img/icons/send.png" /> {{else}} <img class="transactionTypeImage" src="/img/icons/receive.png" /> {{/if}} <div class="content"> <div class="header"> {{#if isThisAddress this.addr_from}} Tokens Sent {{else}} Tokens Received {{/if}} | {{this.timestamp}} </div> <p class="transactionAddress value"> {{#if isThisAddress this.addr_from}} {{#each this.outputs}} {{this.amount}} &raquo; {{this.address_hex}}<br /> {{/each}} {{else}} {{this.from}} {{/if}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{this.totalTransferred}} &gt;</a> </div> </div> {{/if}} {{#if isCoinbaseTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/receive.png" /> <div class="content"> <div class="header"> Coinbase Received | {{this.timestamp}} </div> <p class="transactionAddress value"> {{# if bech32}}{{this.from_b32}}{{else}}{{this.from_hex}}{{/if}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{coinbaseValue}} Quanta &gt;</a> </div> </div> {{/if}} {{#if isSlaveTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Slave Transaction | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{this.amount}} Quanta &gt;</a> </div> </div> {{/if}} {{#if isMultiSigCreateTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> MultiSig CREATE | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{signatories this}} &gt;</a> </div> </div> {{/if}} {{#if isMultiSigSpendTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> MultiSig SPEND | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{msSpendAmount this}} Quanta &gt;</a> </div> </div> {{/if}} {{#if isMultiSigVoteTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> MultiSig VOTE | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">{{msVoteStatus this}} &gt;</a> </div> </div> {{/if}} {{#if isLatticePKTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Lattice Public Key | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">View Transaction &gt;</a> </div> </div> {{/if}} {{#if isMessageTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Message | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">View Transaction &gt;</a> </div> </div> {{/if}} {{#if isKeybaseTxn this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Keybase | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">View Transaction &gt;</a> </div> </div> {{/if}} {{#if isDocumentNotarisation this.transactionType}} <div class="ui icon message transactionRecord"> <img class="transactionTypeImage" src="/img/icons/send.png" /> <div class="content"> <div class="header"> Document Notarisation | {{this.timestamp}} </div> <p class="transactionAddress value"> {{this.transaction_hash}} </p> </div> <div class="floatright ta-c"> <a href="/tx/{{this.transaction_hash}}">View Transaction &gt;</a> </div> </div> {{/if}} {{/each}} {{else}} <div id="noTransactionsFound" style="display: none;" class="ui icon message"> <br /><br /> <div class="content"> <div class="header"> No transactions found </div> </div> </div> {{/if}} <table class="ui striped table"> {{#if pagination}} <tfoot> <tr><th colspan="7"> <div class="ui left floated menu"> <div class="ui right labeled fluid input"> <label for="paginator" class="ui label">Page </label> <input type="text" placeholder="{{currentPage}}" id="paginator"> <div class="ui label"> of {{totalPages}}</div> </div> </div> <div class="ui right floated pagination menu"> {{#if pback}} <a qrl-data="back" class="icon item"> <i qrl-data="back" class="left chevron icon"></i> </a> {{/if}} {{#each pages}} <a class="item {{isActive}}">{{this.number}}</a> {{/each}} {{#if pforward}} <a qrl-data="forward" class="icon item"> <i qrl-data="forward" class="right chevron icon"></i> </a> {{/if}} </div> </th> </tr> </tfoot> {{/if}} </table> </div> <!-- Token Balances --> <div class="ui bottom attached tab segment" data-tab="tokenBalances"> <h2 class="ui header"> <div class="content"> Token Balances </div> </h2> <div id="tokenBalancesLoading" class="ui icon message"> <br /><br /> <i class="notched circle loading icon"></i> <div class="content"> <div class="header"> Just a moment </div> <p>Token balances are loading...</p> </div> </div> <div class="ui middle aligned divided list"> {{#each tokensHeld}} <div class="item"> <i class="large tags middle aligned icon"></i> <div class="content"> <p class="header"><a href="/tx/{{this.hash}}">{{this.name}} ({{this.symbol}})</a></p> <div class="description tc-w">{{this.balance}}</div> </div> </div> {{/each}} </div> </div> <div class="ui bottom attached tab segment" data-tab="otsTrackerTab"> <h4>Warning</h4> <p>The OTS tracker uses the blockchain to determine OTS key usage. It will not account for transactions which have not yet been confirmed into the blockchain.</p> <p>More about OTS key use is contained in the <a href="https://docs.theqrl.org">documentation</a></p> <div class="ui ten column celled grid"> {{{OTStracker}}} </div> </div> <div class="ui bottom attached tab segment" data-tab="slavesTab"> <h4>Slave addresses</h4> {{#if hasSlaves}} <div class="ui bulleted list"> {{#each slaves}}<div class="ui item"><a href="/a/{{this.slave_address}}">{{this.slave_address}}</a></div>{{/each}} </div> {{else}} <p>None found for this address</p> {{/if}} </div> {{/if}} <button class="ui mini button jsonclick">Meta <i class="down angle icon"></i></button> <div class="ui raised segment jsonbox json" style="display: none">{{json}}</div> </div> </template>