import { ChangeDetectionStrategy, Component, OnDestroy, signal } from '@angular/core';
import { AsyncPipe } from '@angular/common';
import { inject } from '@angular/core';
import { QueryClient } from '@tanstack/angular-query-experimental';
import { map, startWith, switchMap, tap } from 'rxjs';
import { injectAuthService } from '@/core/services/auth.service';
import { injectCatalogsService } from '@/core/services/catalogs.service';
import { injectWebsocketService, WSEvents } from '@/core/services/websocket.service';
import { CountdownComponent } from '@/features/countdown/countdown.component';
import { injectLiveService, LiveService } from '@/features/live/live.service';
import { VimeoStreamComponent } from '@/features/live/vimeo-stream/vimeo-stream.component';
import { FooterComponent } from '@/shared/layout/footer/footer.component';
import { MainLayoutComponent } from '@/shared/layout/main-layout/main-layout.component';
import { SessionTimesComponent } from '@/shared/layout/session-times/session-times.component';
import { ButtonDirective } from '@/shared/ui/button.directive';

@Component({
	selector: 'app-streaming',
	templateUrl: './streaming.component.html',
	styleUrls: ['./streaming.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	standalone: true,
	providers: [LiveService],
	imports: [
		AsyncPipe,
		CountdownComponent,
		ButtonDirective,
		MainLayoutComponent,
		SessionTimesComponent,
		FooterComponent,
		VimeoStreamComponent,
	],
})
export default class StreamingComponent implements OnDestroy {
	private queryClient = inject(QueryClient);
	private wsServ = injectWebsocketService();
	private catalogServ = injectCatalogsService();
	private liveServ = injectLiveService();
	private authServ = injectAuthService();
	interval: ReturnType<typeof setInterval> | undefined;
	hasTimes = signal(true);
	copy$ = this.catalogServ.getWelcomeCopy();
	countdown$ = this.wsServ.listen(WSEvents.COUNTDOWN).pipe(
		startWith(true),
		switchMap(() => this.catalogServ.getCountdown()),
		tap(({ open }) => (open ? this.startRecordingTime() : this.stopRecordingTime()))
	);
	activity$ = this.wsServ.listen(WSEvents.LIVE).pipe(
		startWith(true),
		switchMap(() => this.liveServ.getAllLiveEvents()),
		map((events) => events[0])
	);
	ngOnDestroy(): void {
		this.stopRecordingTime();
	}
	logout() {
		return this.authServ.logout();
	}
	refresh() {
		this.queryClient.invalidateQueries({ queryKey: ['countdown'] });
		this.queryClient.invalidateQueries({ queryKey: ['live'] });
	}
	private startRecordingTime() {
		if (this.interval) return;
		this.interval = setInterval(() => {
			this.liveServ.saveSessionTime();
		}, 60_000);
	}
	private stopRecordingTime() {
		this.interval && clearInterval(this.interval);
		this.interval = undefined;
	}
}