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 { Subscription, tap, timer } from 'rxjs';
import { WebsocketService } from '../../services/websocket.service';
import { StateService } from '../../services/state.service';
@Component({
@ -33,8 +32,10 @@ export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
}
ngOnInit(): void {
if (this.stateService.isBrowser) {
this.timeSubscription = timer(0, 250).pipe(
tap(() => {
console.log('face tick');
this.updateTime();
})
).subscribe();
@ -45,6 +46,7 @@ export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
this.updateSegments();
});
}
}
ngOnChanges(): void {
this.faceStyle = {
@ -54,8 +56,10 @@ export class ClockFaceComponent implements OnInit, OnChanges, OnDestroy {
}
ngOnDestroy(): void {
if (this.timeSubscription) {
this.timeSubscription.unsubscribe();
}
}
updateTime(): void {
const now = new Date();

View File

@ -110,8 +110,8 @@ export class ClockComponent implements OnInit {
@HostListener('window:resize', ['$event'])
resizeCanvas(): void {
const windowWidth = this.limitWidth || window.innerWidth;
const windowHeight = this.limitHeight || window.innerHeight;
const windowWidth = this.limitWidth || window.innerWidth || 800;
const windowHeight = this.limitHeight || window.innerHeight || 800;
this.chainWidth = windowWidth;
this.chainHeight = Math.max(60, windowHeight / 8);
this.clockSize = Math.min(800, windowWidth, windowHeight - (1.4 * this.chainHeight));