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

Enable navigation from standalone block page

Browse Source
This commit is contained in:
Mononaut 2023-09-23 22:25:22 +01:00
parent f3fc774c2d
commit 72750267d0
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
2 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/app/components/block-view/block-view.component.html
View File

@ -8,6 +8,7 @@
[orientation]="'top'" [orientation]="'top'"
[flip]="false" [flip]="false"
[disableSpinner]="true" [disableSpinner]="true"
(txClickEvent)="onTxClick($event)"
></app-block-overview-graph> ></app-block-overview-graph>
</div> </div>
</div> </div>

30
frontend/src/app/components/block-view/block-view.component.ts
View File

@ -1,17 +1,17 @@
import { Component, OnInit, OnDestroy, ViewChild, HostListener } from '@angular/core'; import { Component, OnInit, OnDestroy, ViewChild, HostListener } from '@angular/core';
import { ActivatedRoute, ParamMap } from '@angular/router'; import { ActivatedRoute, ParamMap, Router } from '@angular/router';
import { ElectrsApiService } from '../../services/electrs-api.service'; import { ElectrsApiService } from '../../services/electrs-api.service';
import { switchMap, tap, throttleTime, catchError, shareReplay, startWith, pairwise, filter } from 'rxjs/operators'; import { switchMap, tap, catchError, shareReplay, filter } from 'rxjs/operators';
import { of, Subscription, asyncScheduler } from 'rxjs'; import { of, Subscription } from 'rxjs';
import { StateService } from '../../services/state.service'; import { StateService } from '../../services/state.service';
import { SeoService } from '../../services/seo.service'; import { SeoService } from '../../services/seo.service';
import { OpenGraphService } from '../../services/opengraph.service';
import { BlockExtended, TransactionStripped } from '../../interfaces/node-api.interface'; import { BlockExtended, TransactionStripped } from '../../interfaces/node-api.interface';
import { ApiService } from '../../services/api.service'; import { ApiService } from '../../services/api.service';
import { seoDescriptionNetwork } from '../../shared/common.utils'; import { seoDescriptionNetwork } from '../../shared/common.utils';
import { BlockOverviewGraphComponent } from '../block-overview-graph/block-overview-graph.component'; import { BlockOverviewGraphComponent } from '../block-overview-graph/block-overview-graph.component';
import { RelativeUrlPipe } from '../../shared/pipes/relative-url/relative-url.pipe';
function bestFitResolution(min, max, n) { function bestFitResolution(min, max, n): number {
const target = (min + max) / 2; const target = (min + max) / 2;
let bestScore = Infinity; let bestScore = Infinity;
let best = null; let best = null;
@ -50,14 +50,14 @@ export class BlockViewComponent implements OnInit, OnDestroy {
constructor( constructor(
private route: ActivatedRoute, private route: ActivatedRoute,
private router: Router,
private electrsApiService: ElectrsApiService, private electrsApiService: ElectrsApiService,
public stateService: StateService, public stateService: StateService,
private seoService: SeoService, private seoService: SeoService,
private openGraphService: OpenGraphService,
private apiService: ApiService private apiService: ApiService
) { } ) { }
ngOnInit() { ngOnInit(): void {
this.network = this.stateService.network; this.network = this.stateService.network;
this.queryParamsSubscription = this.route.queryParams.subscribe((params) => { this.queryParamsSubscription = this.route.queryParams.subscribe((params) => {
@ -150,19 +150,23 @@ export class BlockViewComponent implements OnInit, OnDestroy {
.subscribe((network) => this.network = network); .subscribe((network) => this.network = network);
} }
onTxClick(event: { tx: TransactionStripped, keyModifier: boolean }): void {
const url = new RelativeUrlPipe(this.stateService).transform(`/tx/${event.tx.txid}`);
if (!event.keyModifier) {
this.router.navigate([url]);
} else {
window.open(url, '_blank');
}
}
@HostListener('window:resize', ['$event']) @HostListener('window:resize', ['$event'])
onResize(): void { onResize(): void {
if (this.autofit) { if (this.autofit) {
this.resolution = bestFitResolution(64, 96, Math.min(window.innerWidth, window.innerHeight)); this.resolution = bestFitResolution(64, 96, Math.min(window.innerWidth, window.innerHeight));
console.log('resized, new resolution ', this.resolution, window.innerWidth, window.innerHeight);
// if (this.blockGraph && this.strippedTransactions) {
// this.blockGraph.destroy();
// this.blockGraph.setup(this.strippedTransactions);
// }
} }
} }
ngOnDestroy() { ngOnDestroy(): void {
if (this.overviewSubscription) { if (this.overviewSubscription) {
this.overviewSubscription.unsubscribe(); this.overviewSubscription.unsubscribe();
} }