SSR: fix clock page timeout

This commit is contained in:
Mononaut 2023-10-31 19:53:06 +00:00
parent ab5ee5370a
commit ed73c1e94c
No known key found for this signature in database
GPG key ID: A3F058E41374C04E
2 changed files with 19 additions and 15 deletions

View file

@ -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 {

View file

@ -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));