mirror of
https://github.com/mempool/mempool.git
synced 2024-12-28 17:24:25 +01:00
Fix for weird block animation when navigating back to main page.
This commit is contained in:
parent
a1b931851a
commit
942e1a7d68
@ -4,6 +4,7 @@ import { Block } from 'src/app/interfaces/electrs.interface';
|
|||||||
import { StateService } from 'src/app/services/state.service';
|
import { StateService } from 'src/app/services/state.service';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { AudioService } from 'src/app/services/audio.service';
|
import { AudioService } from 'src/app/services/audio.service';
|
||||||
|
import { env } from 'src/app/app.constants';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-blockchain-blocks',
|
selector: 'app-blockchain-blocks',
|
||||||
@ -21,7 +22,7 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
|||||||
|
|
||||||
arrowVisible = false;
|
arrowVisible = false;
|
||||||
arrowLeftPx = 30;
|
arrowLeftPx = 30;
|
||||||
|
blocksFilled = false;
|
||||||
transition = '1s';
|
transition = '1s';
|
||||||
|
|
||||||
gradientColors = {
|
gradientColors = {
|
||||||
@ -34,7 +35,6 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
|||||||
constructor(
|
constructor(
|
||||||
private stateService: StateService,
|
private stateService: StateService,
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private audioService: AudioService,
|
|
||||||
) { }
|
) { }
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
@ -42,15 +42,14 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
|||||||
this.stateService.isTabHidden$.subscribe((tabHidden) => this.tabHidden = tabHidden);
|
this.stateService.isTabHidden$.subscribe((tabHidden) => this.tabHidden = tabHidden);
|
||||||
|
|
||||||
this.blocksSubscription = this.stateService.blocks$
|
this.blocksSubscription = this.stateService.blocks$
|
||||||
.subscribe(([block, txConfirmed, refilling]) => {
|
.subscribe(([block, txConfirmed]) => {
|
||||||
if (this.blocks.some((b) => b.height === block.height)) {
|
if (this.blocks.some((b) => b.height === block.height)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.blocks.unshift(block);
|
this.blocks.unshift(block);
|
||||||
this.blocks = this.blocks.slice(0, 8);
|
this.blocks = this.blocks.slice(0, 8);
|
||||||
|
|
||||||
if (!refilling && !this.tabHidden) {
|
if (this.blocksFilled && !this.tabHidden) {
|
||||||
// setTimeout(() => this.audioService.playSound('bright-harmony'));
|
|
||||||
block.stage = block.matchRate >= 66 ? 1 : 2;
|
block.stage = block.matchRate >= 66 ? 1 : 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -68,6 +67,9 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
|||||||
this.blocks.forEach((b) => this.blockStyles.push(this.getStyleForBlock(b)));
|
this.blocks.forEach((b) => this.blockStyles.push(this.getStyleForBlock(b)));
|
||||||
}, 50);
|
}, 50);
|
||||||
|
|
||||||
|
if (this.blocks.length === env.KEEP_BLOCKS_AMOUNT) {
|
||||||
|
this.blocksFilled = true;
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
this.stateService.markBlock$
|
this.stateService.markBlock$
|
||||||
|
@ -21,7 +21,7 @@ export class StateService {
|
|||||||
latestBlockHeight = 0;
|
latestBlockHeight = 0;
|
||||||
|
|
||||||
networkChanged$ = new ReplaySubject<string>(1);
|
networkChanged$ = new ReplaySubject<string>(1);
|
||||||
blocks$ = new ReplaySubject<[Block, boolean, boolean]>(env.KEEP_BLOCKS_AMOUNT);
|
blocks$ = new ReplaySubject<[Block, boolean]>(env.KEEP_BLOCKS_AMOUNT);
|
||||||
conversions$ = new ReplaySubject<any>(1);
|
conversions$ = new ReplaySubject<any>(1);
|
||||||
bsqPrice$ = new ReplaySubject<number>(1);
|
bsqPrice$ = new ReplaySubject<number>(1);
|
||||||
mempoolStats$ = new ReplaySubject<MemPoolState>(1);
|
mempoolStats$ = new ReplaySubject<MemPoolState>(1);
|
||||||
|
@ -67,7 +67,7 @@ export class WebsocketService {
|
|||||||
blocks.forEach((block: Block) => {
|
blocks.forEach((block: Block) => {
|
||||||
if (block.height > this.stateService.latestBlockHeight) {
|
if (block.height > this.stateService.latestBlockHeight) {
|
||||||
this.stateService.latestBlockHeight = block.height;
|
this.stateService.latestBlockHeight = block.height;
|
||||||
this.stateService.blocks$.next([block, false, true]);
|
this.stateService.blocks$.next([block, false]);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -79,7 +79,7 @@ export class WebsocketService {
|
|||||||
if (response.block) {
|
if (response.block) {
|
||||||
if (response.block.height > this.stateService.latestBlockHeight) {
|
if (response.block.height > this.stateService.latestBlockHeight) {
|
||||||
this.stateService.latestBlockHeight = response.block.height;
|
this.stateService.latestBlockHeight = response.block.height;
|
||||||
this.stateService.blocks$.next([response.block, !!response.txConfirmed, false]);
|
this.stateService.blocks$.next([response.block, !!response.txConfirmed]);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (response.txConfirmed) {
|
if (response.txConfirmed) {
|
||||||
|
Loading…
Reference in New Issue
Block a user