52 lines
2.3 KiB
HTML
52 lines
2.3 KiB
HTML
|
<div class="full-container h-100">
|
||
|
|
|
||
|
|
<div class="card-header">
|
||
|
|
<div class="d-flex d-md-block align-items-baseline" style="margin-bottom: -5px">
|
||
|
|
<span i18n="lightning.nodes-per-country">Lightning nodes per country</span>
|
||
|
|
<button class="btn p-0 pl-2" style="margin: 0 0 4px 0px" (click)="onSaveChart()">
|
||
|
|
<fa-icon [icon]="['fas', 'download']" [fixedWidth]="true"></fa-icon>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<small style="color: #ffffff66" i18n="lightning.tor-nodes-excluded">(Tor nodes excluded)</small>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="container pb-lg-0 bottom-padding">
|
||
|
|
<div class="pb-lg-5">
|
||
|
|
<div class="chart w-100" echarts [initOpts]="chartInitOptions" [options]="chartOptions"
|
||
|
|
(chartInit)="onChartInit($event)">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="text-center loadingGraphs" *ngIf="isLoading">
|
||
|
|
<div class="spinner-border text-light"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<table class="table table-borderless text-center m-auto" style="max-width: 900px">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th class="text-left rank" *ngIf="!isMobile()" i18n="mining.rank">Rank</th>
|
||
|
|
<th class="text-left name" i18n="lightning.as-name">Name</th>
|
||
|
|
<th class="text-right share" *ngIf="!isMobile()" i18n="lightning.share">Share</th>
|
||
|
|
<th class="text-right nodes" i18n="lightning.nodes-count">Nodes</th>
|
||
|
|
<th class="text-right capacity" i18n="lightning.capacity">Capacity</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody [attr.data-cy]="'pools-table'" *ngIf="(nodesPerCountryObservable$ | async) as countries">
|
||
|
|
<tr *ngFor="let country of countries">
|
||
|
|
<td class="text-left rank" *ngIf="!isMobile()">{{ country.rank }}</td>
|
||
|
|
<td class="text-left text-truncate name">{{ country.name.en }}</td>
|
||
|
|
<td class="text-right share" *ngIf="!isMobile()">{{ country.share }}%</td>
|
||
|
|
<td class="text-right nodes">{{ country.count }}</td>
|
||
|
|
<td class="text-right capacity">
|
||
|
|
<app-amount *ngIf="country.capacity > 100000000; else smallchannel" [satoshis]="country.capacity" [digitsInfo]="'1.2-2'" [noFiat]="true"></app-amount>
|
||
|
|
<ng-template #smallchannel>
|
||
|
|
{{ country.capacity | amountShortener: 1 }}
|
||
|
|
<span class="sats" i18n="shared.sats">sats</span>
|
||
|
|
</ng-template>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|