sirius-explorer/public/views/token/token.html

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

<div ng-include src="'views/includes/connection.html'"></div>

<div class="box" ng-controller="TokenController as TC" ng-init="TC.init()">
	<div class="heading margin1"></div>

	<div class="section section-tockenSummary">
		<div class="section__heading">
			<img src="images/{{ TC.tokenInfo.symbol.toLowerCase() }}.png" hight="100px" alt=""/>
			<span style="padding-left: 50px; vertical-align: 40px" class="section__title" translate>{{ TC.tokenInfo.name }}</span>
		</div>
		<div class="tockenSummary">
			<div class="col col-6">
				<ul class="list">
					<li class="list__item" ng-if="TC.filterByAddress">
						<div class="list__left" translate>Token holder:</div>
						<div class="list__right">
							<div class="additional">
								<a href="address/{{ TC.filterByAddress }}">
									{{ TC.filterByAddress }}
								</a>
							</div>
						</div>
					</li>
					<li class="list__item" ng-if="TC.filterByAddress && TC.addressBalance">
						<div class="list__left" translate>Token balance:</div>
						<div class="list__right">
							<div class="additional">
								{{ $root.token.convertDecimals(TC.addressBalance.amount, TC.tokenInfo.decimals) }}
								{{ TC.tokenInfo.symbol }}
							</div>
						</div>
					</li>
					<li class="list__item" ng-if="!TC.filterByAddress">
						<div class="list__left" translate>Total supply:</div>
						<div class="list__right">
							<div class="additional">
								{{ $root.token.convertDecimals(TC.tokenInfo.total_supply, TC.tokenInfo.decimals) }}
								{{ TC.tokenInfo.symbol }}
							</div>
						</div>
					</li>
					<li class="list__item" ng-if="!TC.filterByAddress">
						<div class="list__left" translate>Token Holders:</div>
						<div class="list__right">
							<div class="additional">
								{{ TC.tokenInfo.holders_count }}
							</div>
						</div>
					</li>
					<li class="list__item">
						<div class="list__left" translate>No.Of.Transfers:</div>
						<div class="list__right">
							<div class="additional">
								{{ TC.tokenInfo.transfers_count }}
							</div>
						</div>
					</li>
				</ul>
			</div>
			<div class="col col-6">
				<ul class="list">
					<li class="list__item" ng-if="TC.tokenInfo.name">
						<div class="list__left" translate>Name:</div>
						<div class="list__right">
							<div class="additional">
								{{ TC.tokenInfo.name }}
							</div>
						</div>
					</li>
					<li class="list__item">
						<div class="list__left" translate>Contract Address:</div>
						<div class="list__right">
							<div class="">
								<div class=" copyParent copyParent-right">
									<a
											href=""
											class="copyBtn icon-copy"
											ngclipboard
											data-clipboard-text="{{ TC.tokenInfo.contract_address }}"
									></a>
									<div class="copyText text additional">
										<a href="address/{{ TC.tokenInfo.contract_address }}">{{ TC.tokenInfo.contract_address }}</a>
									</div>
								</div>
							</div>
						</div>
					</li>
					<li class="list__item">
						<div class="list__left" translate>Token Decimals:</div>
						<div class="list__right">
							<div class="additional">
								{{ TC.tokenInfo.decimals }}
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>
	<div class="section section-tockenTabs">
		<div class="section__heading">
			<ul class="nav-tabs">
				<li class="nav-item tab-large" ng-class="{ 'active': TC.tab === 'transfers' }">
					<a href="" ng-click="TC.setTab('transfers')" class="nav-link" translate>Token Transfers</a>
				</li>
				<li ng-if="!TC.filterByAddress" class="nav-item tab-large" ng-class="{ 'active': TC.tab === 'holders' }">
					<a href="" ng-click="TC.setTab('holders')" class="nav-link" translate>Token Holders</a>
				</li>
				<li class="nav-item tab-large" ng-class="{ 'active': TC.tab === 'read-smart-contract' }">
					<a href="" ng-click="TC.setTab('read-smart-contract')" class="nav-link" translate>Read smart contract</a>
				</li>
			</ul>
		</div>
		<div class="tab-content">
			<div 
				class="tab-pane fadeEffect"
				ng-if="TC.transfers" 
				ng-include 
				src="'views/token/transfers.html'" 
				ng-class="{ 'active': TC.tab === 'transfers' }"
			>
			</div>
			<div 
				class="tab-pane fadeEffect" 
				ng-if="!TC.filterByAddress && TC.holders"
				ng-include 
				src="'views/token/holders.html'" 
				ng-class="{ 'active': TC.tab === 'holders' }"
			>
			</div>
			<div
				class="tab-pane fadeEffect" 
				ng-if="TC.tokenInfo"
				ng-include 
				src="'views/token/read_smart_contract.html'"
				ng-class="{ 'active': TC.tab === 'read-smart-contract' }"
			>
			</div>
		</div>
	</div>
</div>