Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 | 92x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 57x 1x 3x 3x 61x 61x 60x 60x 60x 48x 60x 60x 60x 60x 1x 1x 1x 1x 1456x 1456x 4x 3x 3x 3x 1x | import { NgIf } from '@angular/common';
import { Component, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
import { interval, Subscription } from 'rxjs';
@Component({
selector: 'app-countdown',
imports: [NgIf],
templateUrl: './countdown.component.html',
styleUrl: './countdown.component.scss'
})
export class CountdownComponent implements OnInit, OnChanges, OnDestroy{
@Input() targetTimestamp: number|null = null;
days: number | null = null;
hours: number | null = null;
minutes: number | null = null;
seconds: number | null = null;
private subscription: Subscription | null = null;
isPositiveTime = false;
targetDate: Date | null = null;
localTimeZone: string;
localMonth: string;
UTCMonth: string;
ngOnInit() {
this.targetTimestamp = null;
this.updateTarget();
this.updateTime();
this.subscription = interval(100).subscribe(() => this.updateTime());
this.localTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
}
ngOnChanges(){
this.updateTarget();
this.updateTime();
}
ngOnDestroy() {
this.subscription?.unsubscribe();
}
private updateTime() {
const now = Math.floor(Date.now() / 1000);
if (this.targetTimestamp !== null){
let diff = this.targetTimestamp - now;
this.isPositiveTime = diff < 0;
if (this.isPositiveTime) {
diff = -diff;
}
this.days = Math.floor(diff / 86400);
this.hours = Math.floor((diff % 86400) / 3600);
this.minutes = Math.floor((diff % 3600) / 60);
this.seconds = Math.floor(diff % 60);
}
else{
this.days = null;
this.hours = null;
this.minutes = null;
this.seconds = null;
}
}
formatNumber(value: number | null): string {
Iif (value === null){
return '--';
}
return value < 10 ? '0' + value : value.toString();
}
updateTarget(){
if (this.targetTimestamp !== null){
this.targetDate = new Date(this.targetTimestamp*1000);
this.localMonth = this.targetDate.toLocaleString('en-US', { month: 'long' });
this.UTCMonth = this.targetDate.toLocaleString('en-US', { month: 'long', timeZone: 'UTC' });
}
else{
this.targetDate = null;
}
}
}
|