mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2024-12-29 09:44:26 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1259 from nymkappa/feature/show-miner-blocks

Browse Source 
Show miner tag under blocks in the mining dashboard
This commit is contained in:
wiz 2022-02-18 15:37:50 +00:00 committed by GitHub
commit a6abfd3ca6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 36 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
View File

@ -21,10 +21,10 @@
</div>
<div class="time-difference"><app-time-since [time]="block.timestamp" [fastRender]="true"></app-time-since></div>
</div>
<div class="" *ngIf="showMiningInfo === true">
<a class="badge badge-primary" [routerLink]="[('/mining/pool/' + block.extras.pool.id) | relativeUrl]">
{{ block.extras.pool.name}}</a>
</div>
<div class="animated" [class]="showMiningInfo ? 'show' : 'hide'" *ngIf="block.extras?.pool != undefined">
<a class="badge badge-primary" [routerLink]="[('/mining/pool/' + block.extras.pool.id) | relativeUrl]">
{{ block.extras.pool.name}}</a>
</div>
</div>
</div>
<div [hidden]="!arrowVisible" id="arrow-up" [style.transition]="transition" [ngStyle]="{'left': arrowLeftPx + 'px' }"></div>

13
frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss
View File

@ -129,4 +129,15 @@
position: relative;
top: 15px;
z-index: 101;
}
}
.animated {
transition: all 0.15s ease-in-out;
}
.show {
opacity: 1;
}
.hide {
opacity: 0;
pointer-events : none;
}

22
frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
View File

@ -1,9 +1,10 @@
import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef, Input } from '@angular/core';
import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { Observable, Subscription } from 'rxjs';
import { StateService } from 'src/app/services/state.service';
import { Router } from '@angular/router';
import { specialBlocks } from 'src/app/app.constants';
import { BlockExtended } from 'src/app/interfaces/node-api.interface';
import { Location } from '@angular/common';
import { config } from 'process';
@Component({
selector: 'app-blockchain-blocks',
@ -12,7 +13,6 @@ import { BlockExtended } from 'src/app/interfaces/node-api.interface';
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BlockchainBlocksComponent implements OnInit, OnDestroy {
@Input() showMiningInfo: boolean = false;
specialBlocks = specialBlocks;
network = '';
blocks: BlockExtended[] = [];
@ -32,6 +32,7 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
arrowLeftPx = 30;
blocksFilled = false;
transition = '1s';
showMiningInfo = false;
gradientColors = {
'': ['#9339f4', '#105fb0'],
@ -44,11 +45,22 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
constructor(
public stateService: StateService,
private router: Router,
private cd: ChangeDetectorRef,
) { }
private location: Location,
) {
}
enabledMiningInfoIfNeeded(url) {
this.showMiningInfo = url === '/mining';
this.cd.markForCheck(); // Need to update the view asap
}
ngOnInit() {
if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
this.enabledMiningInfoIfNeeded(this.location.path());
this.location.onUrlChange((url) => this.enabledMiningInfoIfNeeded(url));
}
if (this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet') {
this.feeRounding = '1.0-1';
}

4
frontend/src/app/components/blockchain/blockchain.component.html
View File

@ -1,8 +1,8 @@
<div class="text-center" class="blockchain-wrapper animate" #container>
<div class="text-center" class="blockchain-wrapper" #container>
<div class="position-container {{ network }}">
<span>
<app-mempool-blocks></app-mempool-blocks>
<app-blockchain-blocks [showMiningInfo]="showMiningInfo"></app-blockchain-blocks>
<app-blockchain-blocks></app-blockchain-blocks>
<div id="divider"></div>
</span>
</div>

12
frontend/src/app/components/blockchain/blockchain.component.scss
View File

@ -59,14 +59,4 @@
width: 300px;
left: -150px;
top: 0px;
}
.animate {
transition: all 1s ease-in-out;
}
.move-left {
transform: translate(-40%, 0);
@media (max-width: 767.98px) {
transform: translate(-85%, 0);
}
}
}

1
frontend/src/app/components/blockchain/blockchain.component.ts
View File

@ -8,7 +8,6 @@ import { StateService } from 'src/app/services/state.service';
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BlockchainComponent implements OnInit {
showMiningInfo: boolean = false;
network: string;
constructor(