machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add daily historical price - show USD in block fee reward charts

Browse Source
This commit is contained in:
nymkappa
2022-07-11 23:16:48 +02:00
parent 40634a0eb8
commit a97675c538
16 changed files with 74 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/app/components/block-fees-graph/block-fees-graph.component.html
View File

@@ -8,15 +8,6 @@
</button>
<form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(statsObservable$ | async) as stats">
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 144">
<input ngbButton type="radio" [value]="'24h'" fragment="24h" [routerLink]="['/graphs/mining/block-fees' | relativeUrl]"> 24h
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 432">
<input ngbButton type="radio" [value]="'3d'" fragment="3d" [routerLink]="['/graphs/mining/block-fees' | relativeUrl]"> 3D
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 1008">
<input ngbButton type="radio" [value]="'1w'" fragment="1w" [routerLink]="['/graphs/mining/block-fees' | relativeUrl]"> 1W
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
<input ngbButton type="radio" [value]="'1m'" fragment="1m" [routerLink]="['/graphs/mining/block-fees' | relativeUrl]"> 1M
</label>

26
frontend/src/app/components/block-fees-graph/block-fees-graph.component.ts
View File

@@ -60,14 +60,14 @@ export class BlockFeesGraphComponent implements OnInit {
ngOnInit(): void {
this.seoService.setTitle($localize`:@@6c453b11fd7bd159ae30bc381f367bc736d86909:Block Fees`);
this.miningWindowPreference = this.miningService.getDefaultTimespan('24h');
this.miningWindowPreference = this.miningService.getDefaultTimespan('1m');
this.radioGroupForm = this.formBuilder.group({ dateSpan: this.miningWindowPreference });
this.radioGroupForm.controls.dateSpan.setValue(this.miningWindowPreference);
this.route
.fragment
.subscribe((fragment) => {
if (['24h', '3d', '1w', '1m', '3m', '6m', '1y', '2y', '3y', 'all'].indexOf(fragment) > -1) {
if (['1m', '3m', '6m', '1y', '2y', '3y', 'all'].indexOf(fragment) > -1) {
this.radioGroupForm.controls.dateSpan.setValue(fragment, { emitEvent: false });
}
});
@@ -84,7 +84,7 @@ export class BlockFeesGraphComponent implements OnInit {
tap((response) => {
this.prepareChartOptions({
blockFees: response.body.map(val => [val.timestamp * 1000, val.avgFees / 100000000, val.avgHeight]),
blockFeesUSD: response.body.filter(val => val.usd > 0).map(val => [val.timestamp * 1000, val.avgFees / 100000000 * val.usd, val.avgHeight]),
blockFeesUSD: response.body.filter(val => val.USD > 0).map(val => [val.timestamp * 1000, val.avgFees / 100000000 * val.USD, val.avgHeight]),
});
this.isLoading = false;
}),
@@ -102,14 +102,14 @@ export class BlockFeesGraphComponent implements OnInit {
prepareChartOptions(data) {
this.chartOptions = {
color: [
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#00ACC1' },
{ offset: 1, color: '#0D47A1' },
]),
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#FDD835' },
{ offset: 1, color: '#FB8C00' },
]),
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#C0CA33' },
{ offset: 1, color: '#1B5E20' },
]),
],
animation: false,
grid: {
@@ -188,9 +188,6 @@ export class BlockFeesGraphComponent implements OnInit {
return `${val} BTC`;
}
},
max: (value) => {
return Math.floor(value.max * 2 * 10) / 10;
},
splitLine: {
lineStyle: {
type: 'dotted',
@@ -223,9 +220,10 @@ export class BlockFeesGraphComponent implements OnInit {
type: 'line',
smooth: 0.25,
symbol: 'none',
areaStyle: {
opacity: 0.25,
},
lineStyle: {
width: 1,
opacity: 1,
}
},
{
legendHoverLink: false,
@@ -238,7 +236,7 @@ export class BlockFeesGraphComponent implements OnInit {
symbol: 'none',
lineStyle: {
width: 2,
opacity: 0.75,
opacity: 1,
}
},
],

9
frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.html
View File

@@ -9,15 +9,6 @@
</button>
<form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(statsObservable$ | async) as stats">
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 144">
<input ngbButton type="radio" [value]="'24h'" fragment="24h" [routerLink]="['/graphs/mining/block-rewards' | relativeUrl]"> 24h
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 432">
<input ngbButton type="radio" [value]="'3d'" fragment="3d" [routerLink]="['/graphs/mining/block-rewards' | relativeUrl]"> 3D
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 1008">
<input ngbButton type="radio" [value]="'1w'" fragment="1w" [routerLink]="['/graphs/mining/block-rewards' | relativeUrl]"> 1W
</label>
<label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
<input ngbButton type="radio" [value]="'1m'" fragment="1m" [routerLink]="['/graphs/mining/block-rewards' | relativeUrl]"> 1M
</label>

20
frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.ts
View File

@@ -58,14 +58,14 @@ export class BlockRewardsGraphComponent implements OnInit {
ngOnInit(): void {
this.seoService.setTitle($localize`:@@8ba8fe810458280a83df7fdf4c614dfc1a826445:Block Rewards`);
this.miningWindowPreference = this.miningService.getDefaultTimespan('24h');
this.miningWindowPreference = this.miningService.getDefaultTimespan('3m');
this.radioGroupForm = this.formBuilder.group({ dateSpan: this.miningWindowPreference });
this.radioGroupForm.controls.dateSpan.setValue(this.miningWindowPreference);
this.route
.fragment
.subscribe((fragment) => {
if (['24h', '3d', '1w', '1m', '3m', '6m', '1y', '2y', '3y', 'all'].indexOf(fragment) > -1) {
if (['3m', '6m', '1y', '2y', '3y', 'all'].indexOf(fragment) > -1) {
this.radioGroupForm.controls.dateSpan.setValue(fragment, { emitEvent: false });
}
});
@@ -82,7 +82,7 @@ export class BlockRewardsGraphComponent implements OnInit {
tap((response) => {
this.prepareChartOptions({
blockRewards: response.body.map(val => [val.timestamp * 1000, val.avgRewards / 100000000, val.avgHeight]),
blockRewardsUSD: response.body.filter(val => val.usd > 0).map(val => [val.timestamp * 1000, val.avgRewards / 100000000 * val.usd, val.avgHeight]),
blockRewardsUSD: response.body.filter(val => val.USD > 0).map(val => [val.timestamp * 1000, val.avgRewards / 100000000 * val.USD, val.avgHeight]),
});
this.isLoading = false;
}),
@@ -103,14 +103,14 @@ export class BlockRewardsGraphComponent implements OnInit {
this.chartOptions = {
animation: false,
color: [
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#00ACC1' },
{ offset: 1, color: '#0D47A1' },
]),
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#FDD835' },
{ offset: 1, color: '#FB8C00' },
]),
new graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#C0CA33' },
{ offset: 1, color: '#1B5E20' },
]),
],
grid: {
top: 20,
@@ -232,9 +232,6 @@ export class BlockRewardsGraphComponent implements OnInit {
type: 'line',
smooth: 0.25,
symbol: 'none',
areaStyle: {
opacity: 0.25,
},
},
{
legendHoverLink: false,
@@ -248,6 +245,9 @@ export class BlockRewardsGraphComponent implements OnInit {
lineStyle: {
width: 2,
opacity: 0.75,
},
areaStyle: {
opacity: 0.05,
}
},
],