sirius-explorer/public/views/transaction/tx.html

An open-source front-end for the Insight API.

<div class="transactions__head">
	<div class="transactions__headLeft">
		<a href="" 
		   class="transactions__moreBtn js-block-more" 		
		   ng-click="tx.showAdditInfo = !tx.showAdditInfo">
			<span class="icon-plus"></span>
			<span class="icon-minus"></span>
		</a>
		<div class=" copyParent copyParent-right">
			<a href="" 
			   class="copyBtn icon-copy"
			   ngclipboard 
			   data-clipboard-text="{{ tx.txid }}">
			</a>
			
			<a href="tx/{{ tx.txid }}" 
			   ng-if="!TC.tx" 
			   class="copyText mark">
				{{ tx.txid }}
			</a>
			<span ng-if="TC.tx" 
				  class="copyText">
				{{ tx.txid }}
			</span>
		</div>
	</div>
	<div class="transactions__headRight">
		<div class="date" ng-if="tx.blocktime">
			<span translate>mined</span> 
			{{ tx.blocktime * 1000 | amDateFormat: 'MMMM D, YYYY h:mm:ss A' }}
		</div>
	</div>
</div>
<div class="transactions__body">
	<div class="transactions__bodySection limiter">
		<div class="col">
			<div ng-repeat="vin in tx.vinSimple" ng-if="vin.addr">
				<div ng-repeat="item in vin.items | limitTo : !tx.showAdditInfo ? 1 : vin.items.length">
					<div class="transactions__row">
						<a href="address/{{ vin.addr }}" 
						class="name mark"
						ng-if="$root.currentAddr != vin.addr || tx.showAdditInfo">
							<span class="name__text">
								{{ vin.addr }}
							</span>
						</a>
						<span class="name__text" ng-if="$root.currentAddr == vin.addr && !tx.showAdditInfo">
							{{ vin.addr }}
						</span>

						<!-- errors -->

						<div ng-if="vin.unconfirmedInput" class="text-danger"> 
							<span class="glyphicon glyphicon-warning-sign"></span> 
							({{ 'Input unconfirmed' | translate }})
						</div>

						<div ng-if="vin.dbError" class="text-danger">
							<span class="glyphicon glyphicon-warning-sign"></span> 
							<span translate>Incoherence in levelDB detected:</span> 
							{{ vin.dbError }}
						</div>

						<div ng-if="vin.doubleSpentTxID" class="text-danger"> 
							<span class="glyphicon glyphicon-warning-sign"></span> 
							<span translate>Double spent attempt detected. From tx:</span> 
							<a href="tx/{{ vin.doubleSpentTxID }}">
								{{ vin.doubleSpentTxID }},
								{{ vin.doubleSpentIndex }}
							</a>
						</div>

						<!-- === -->

						<div class="data" 
							ng-class="{ 'attn' : $root.currentAddr === vin.addr }" 
							ng-if="vin.addr">
							{{ $root.currency.getConvertion(tx.showAdditInfo ? item.value : vin.value) }}
						</div>
					</div>
					<div class="transactions__addInfo">
						<div class="transactions__row">
							<div class="label">
								<b translate>Confirmations</b>:
							</div>
							<div class="labeled">
								{{ tx.confirmations }}
							</div>
						</div>
						<div class="transactions__row" ng-if="vin.scriptSig">
							<div class="label">
								<b translate>scriptSig</b>
							</div>
							<div class="labeled" ng-repeat="scriptSigAsm in vin.scriptSig.asm | split:' '">
								<div class="copyParent copyParent-right">
									<a href="" 
									class="copyBtn icon-copy"
									ngclipboard 
									data-clipboard-text="{{ scriptSigAsm }}">
									</a>
									<span class="copyText">
										{{ scriptSigAsm }}
									</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<span class="arrow">
				<span class="arrowIcon icon-arrows-right"></span>
			</span>
		</div>
		<div class="col" ng-repeat="vin in tx.vin" ng-if="!vin.addr">
			<div>
				<div class="transactions__row">
					<span class="name__text" translate>
						No Inputs (Newly Generated Coins)
					</span>
				</div>
			</div>
		</div>
		<div class="col">
			<div ng-repeat="vout in tx.voutSimple" >
				<div ng-repeat="item in vout.items | limitTo : !tx.showAdditInfo ? 1 : vout.items.length">
					<div class="transactions__row">

						<a href="address/{{ vout.addr }}" 
						class="name mark" 
						ng-if="!vout.notAddr && ($root.currentAddr !== vout.addr || tx.showAdditInfo)">
							<span class="name__text">
								{{ vout.addr }}
							</span>
						</a>
						<a href="address/{{ vout.contractAddress }}?contract=1"
						class="name mark" 
						ng-if="vout.notAddr && vout.contractAddress && ($root.currentAddr !== vout.addr || tx.showAdditInfo)">
							<span class="name__text">
								{{ vout.contractAddress }}
							</span>
						</a>
						<span class="name__text" ng-if="($root.currentAddr === vout.addr && !tx.showAdditInfo) || vout.notAddr && !vout.contractAddress">
							{{ vout.addr }}
						</span>

						<div class="data" ng-class="{ 'special' : vout.value && !tx.showAdditInfo }">
							{{ !tx.showAdditInfo ? $root.currency.getConvertion(vout.value) : $root.currency.getConvertion(item.value) }} 
							<span class="special" ng-if="vout.isSpent">(S)</span>
							<span class="special" ng-if="!vout.isSpent">(U)</span>
						</div>
					</div>
					<div class="transactions__addInfo">
						<div class="transactions__row">
							<div class="label">
								<b translate>Type</b>
							</div>
							<div class="labeled op-60">
								{{ item.scriptPubKey.type }}
							</div>
						</div>
						<div class="transactions__row">
							<div class="label">
								<b>scriptPubKey</b>
							</div>
							<div class="labeled" ng-if="item.scriptPubKey.asm">
								<div class=" copyParent copyParent-right">
									<a href="" 
									class="copyBtn icon-copy"
									ngclipboard 
									data-clipboard-text="{{ item.scriptPubKey.asm }}">
									</a>
									<span class="copyText">
										{{ item.scriptPubKey.asm }}
									</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="transactions__bodySection" ng-repeat="ev in tx.tokenEvents">
		<div class="transactions__bodySection-title">
			<div class="text">
				<span>
					<a href="token/{{ ev.contractInfo.contract_address }}">
						{{ ev.contractInfo.name ? ev.contractInfo.name : 'Standard token' }}
					</a>
					<span class="special2">(ERC20)</span>
				</span>
			</div>
		</div>
		<div class="ov">
			<div class="col">
				<a href="" class="arrow">
					<span class="arrowIcon icon-arrows-right"></span>
				</a>
				<div class="transactions__row">
				<a href="address/{{ ev.addressFrom }}" class="name mark">
					<span class="name__text">
						{{ ev.addressFrom }}
					</span>
				</a>
					<div class="data">
						{{ $root.token.convertDecimals(ev.amount, ev.contractInfo.decimals) }}
						{{ ev.contractInfo.symbol }}
					</div>
				</div>
			</div>
			<div class="col">
				<div class="transactions__row">
				<a href="address/{{ ev.addressTo }}" class="name mark">
					<span class="name__text">
						{{ ev.addressTo }}
					</span>
				</a>
					<div class="data">
						{{ $root.token.convertDecimals(ev.amount, ev.contractInfo.decimals) }}
						{{ ev.contractInfo.symbol }}
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="transactions__bodySection margin"></div>
</div>
<div class="transactions__contract" ng-if="tx.contractBytecode">
	<div class="transactions__contractTitle" translate>Contract {{ tx.contractBytecodeType }}</div>
	<div class="transactions__contractBody">
		<div class="transactions__contractItem">
			<div class="transactions__contractItemTitle" translate>Contract Code</div>
			<div class="transactions__contractItemBody " 
				 ng-scrollbars 
				 ng-scrollbars-config="TC.scrollConfig">
				<div class="list">
					{{ tx.contractBytecode }}
				</div>
			</div>
		</div>
		<div class="transactions__contractItem">
			<div class="transactions__contractItemTitle" translate>Asm</div>
			<div class="transactions__contractItemBody" 
				 ng-scrollbars 
				 ng-scrollbars-config="TC.scrollConfig">
				<div class="list">
					{{ tx.contractAsm }}
				</div>
			</div>
		</div>
	</div>
</div>
<div class="transactions__row">
	<div class="pull-left" ng-if="!tx.isCoinBase && tx.fees >= 0">
		<div class="transactions__info transp">
			<span translate>Fee</span>: 
			{{ $root.currency.getConvertion(tx.fees) }} 
			{{ CC.currency.symbol }}
		</div>
	</div>
	<div class="pull-right text_r" 
		 ng-class="{ 
			'pull-right' : !tx.isCoinBase && Number(tx.fees) >= 0 && tx.contractBytecode, 
			'transactions__row' : tx.isCoinBase && Number(tx.fees) < 0 && !tx.contractBytecode
		}">
		<div ng-if="!tx.confirmations" 
			  class="transactions__info error" translate>
			  Unconfirmed Transaction!
		</div>
		<div class="transactions__info" ng-if="tx.confirmations">
			{{ tx.confirmations }} 
			{{ 'confirmations' | translate }}
		</div>
		<div class="transactions__info">
			{{ $root.currency.getConvertion(tx.valueOut) }}
		</div>
	</div>
</div>