Add difficulty percent change indicator.

This commit is contained in:
softsimon 2020-09-22 03:31:19 +07:00
parent 6c1d28a9ac
commit 21e985202d
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
2 changed files with 4 additions and 1 deletions

View File

@ -39,7 +39,7 @@
<div class="card-body"> <div class="card-body">
<h5 class="card-title txPerSecond">Difficulty Epoch</h5> <h5 class="card-title txPerSecond">Difficulty Epoch</h5>
<div class="progress" *ngIf="(difficultyEpoch$ | async) as epochData"> <div class="progress" *ngIf="(difficultyEpoch$ | async) as epochData">
<div class="progress-bar" role="progressbar" style="width: 15%; background-color: #105fb0" [ngStyle]="{'width': epochData.base}"></div> <div class="progress-bar" role="progressbar" style="width: 15%; background-color: #105fb0" [ngStyle]="{'width': epochData.base}"><ng-template [ngIf]="epochData.change > 0">+</ng-template>{{ epochData.change | number: '1.2-2' }}%</div>
<div class="progress-bar bg-success" role="progressbar" style="width: 0%" [ngStyle]="{'width': epochData.green}"></div> <div class="progress-bar bg-success" role="progressbar" style="width: 0%" [ngStyle]="{'width': epochData.green}"></div>
<div class="progress-bar bg-danger" role="progressbar" style="width: 1%; background-color: #f14d80;" [ngStyle]="{'width': epochData.red}"></div> <div class="progress-bar bg-danger" role="progressbar" style="width: 1%; background-color: #f14d80;" [ngStyle]="{'width': epochData.red}"></div>
</div> </div>

View File

@ -13,6 +13,7 @@ interface EpochProgress {
base: string; base: string;
green: string; green: string;
red: string; red: string;
change: number;
} }
interface MempoolInfoData { interface MempoolInfoData {
@ -77,6 +78,7 @@ export class DashboardComponent implements OnInit {
const diff = now - DATime; const diff = now - DATime;
const blocksInEpoch = block.height % 2016; const blocksInEpoch = block.height % 2016;
const estimatedBlocks = Math.round(diff / 60 / 10); const estimatedBlocks = Math.round(diff / 60 / 10);
const difficultyChange = blocksInEpoch / (diff / 60 / 10) - 1;
let base = 0; let base = 0;
let green = 0; let green = 0;
@ -94,6 +96,7 @@ export class DashboardComponent implements OnInit {
base: base + '%', base: base + '%',
green: green + '%', green: green + '%',
red: red + '%', red: red + '%',
change: difficultyChange,
}; };
}) })
); );