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

Reversible mempool block visualization

Browse Source
This commit is contained in:
Mononaut
2022-09-29 22:40:46 +00:00
parent 03c6a7c54f
commit 135fbfc4f3
4 changed files with 51 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/app/components/block-overview-graph/block-overview-graph.component.ts
View File

@@ -1,4 +1,4 @@
import { Component, ElementRef, ViewChild, HostListener, Input, Output, EventEmitter, NgZone, AfterViewInit, OnDestroy } from '@angular/core';
import { Component, ElementRef, ViewChild, HostListener, Input, Output, EventEmitter, NgZone, AfterViewInit, OnDestroy, OnChanges } from '@angular/core';
import { TransactionStripped } from '../../interfaces/websocket.interface';
import { FastVertexArray } from './fast-vertex-array';
import BlockScene from './block-scene';
@@ -11,7 +11,7 @@ import { Position } from './sprite-types';
templateUrl: './block-overview-graph.component.html',
styleUrls: ['./block-overview-graph.component.scss'],
})
export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy {
export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy, OnChanges {
@Input() isLoading: boolean;
@Input() resolution: number;
@Input() blockLimit: number;
@@ -57,6 +57,14 @@ export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy {
this.resizeCanvas();
}
ngOnChanges(changes): void {
if (changes.orientation || changes.flip) {
if (this.scene) {
this.scene.setOrientation(this.orientation, this.flip);
}
}
}
ngOnDestroy(): void {
if (this.animationFrameRequest) {
cancelAnimationFrame(this.animationFrameRequest);

18
frontend/src/app/components/block-overview-graph/block-scene.ts
View File

@@ -42,6 +42,24 @@ export default class BlockScene {
}
}
setOrientation(orientation: string, flip: boolean): void {
this.orientation = orientation;
this.flip = flip;
this.dirty = true;
const startTime = performance.now();
Object.values(this.txs).forEach(txView => {
this.saveGridToScreenPosition(txView);
this.applyTxUpdate(txView, {
display: {
position: txView.screenPosition,
color: txView.getColor()
},
duration: 0
});
this.setTxOnScreen(txView, startTime, 0);
});
}
// Destroy the current layout and clean up graphics sprites without any exit animation
destroy(): void {
Object.values(this.txs).forEach(tx => tx.destroy());