mirror of
https://github.com/mempool/mempool.git
synced 2025-02-24 22:58:30 +01:00
SSR: fix clock page timeout
This commit is contained in:
parent
ab5ee5370a
commit
ed73c1e94c
2 changed files with 19 additions and 15 deletions
|
@ -1,6 +1,5 @@
|
||||||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
|
||||||
import { Subscription, tap, timer } from 'rxjs';
|
import { Subscription, tap, timer } from 'rxjs';
|
||||||
import { WebsocketService } from '../../services/websocket.service';
|
|
||||||
import { StateService } from '../../services/state.service';
|
import { StateService } from '../../services/state.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -33,17 +32,20 @@ export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.timeSubscription = timer(0, 250).pipe(
|
if (this.stateService.isBrowser) {
|
||||||
tap(() => {
|
this.timeSubscription = timer(0, 250).pipe(
|
||||||
this.updateTime();
|
tap(() => {
|
||||||
})
|
console.log('face tick');
|
||||||
).subscribe();
|
this.updateTime();
|
||||||
this.blocksSubscription = this.stateService.blocks$
|
})
|
||||||
.subscribe((blocks) => {
|
).subscribe();
|
||||||
this.blockTimes = blocks.map(block => [block.height, new Date(block.timestamp * 1000)]);
|
this.blocksSubscription = this.stateService.blocks$
|
||||||
this.blockTimes = this.blockTimes.sort((a, b) => a[1].getTime() - b[1].getTime());
|
.subscribe((blocks) => {
|
||||||
this.updateSegments();
|
this.blockTimes = blocks.map(block => [block.height, new Date(block.timestamp * 1000)]);
|
||||||
});
|
this.blockTimes = this.blockTimes.sort((a, b) => a[1].getTime() - b[1].getTime());
|
||||||
|
this.updateSegments();
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnChanges(): void {
|
ngOnChanges(): void {
|
||||||
|
@ -54,7 +56,9 @@ export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnDestroy(): void {
|
ngOnDestroy(): void {
|
||||||
this.timeSubscription.unsubscribe();
|
if (this.timeSubscription) {
|
||||||
|
this.timeSubscription.unsubscribe();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
updateTime(): void {
|
updateTime(): void {
|
||||||
|
|
|
@ -110,8 +110,8 @@ export class ClockComponent implements OnInit {
|
||||||
|
|
||||||
@HostListener('window:resize', ['$event'])
|
@HostListener('window:resize', ['$event'])
|
||||||
resizeCanvas(): void {
|
resizeCanvas(): void {
|
||||||
const windowWidth = this.limitWidth || window.innerWidth;
|
const windowWidth = this.limitWidth || window.innerWidth || 800;
|
||||||
const windowHeight = this.limitHeight || window.innerHeight;
|
const windowHeight = this.limitHeight || window.innerHeight || 800;
|
||||||
this.chainWidth = windowWidth;
|
this.chainWidth = windowWidth;
|
||||||
this.chainHeight = Math.max(60, windowHeight / 8);
|
this.chainHeight = Math.max(60, windowHeight / 8);
|
||||||
this.clockSize = Math.min(800, windowWidth, windowHeight - (1.4 * this.chainHeight));
|
this.clockSize = Math.min(800, windowWidth, windowHeight - (1.4 * this.chainHeight));
|
||||||
|
|
Loading…
Add table
Reference in a new issue