Files
wgenerator/src/app/modules/presentation/remote/remote.component.ts
2021-06-13 00:00:26 +02:00

113 lines
3.9 KiB
TypeScript

import {Component} from '@angular/core';
import {combineLatest, Observable} from 'rxjs';
import {Show} from '../../shows/services/show';
import {ShowSongService} from '../../shows/services/show-song.service';
import {SongService} from '../../songs/services/song.service';
import {Song} from '../../songs/services/song';
import {faDesktop} from '@fortawesome/free-solid-svg-icons/faDesktop';
import {ShowService} from '../../shows/services/show.service';
import {ShowSong} from '../../shows/services/show-song';
import {GlobalSettingsService} from '../../../services/global-settings.service';
import {FormControl} from '@angular/forms';
import {distinctUntilChanged, filter, map} from 'rxjs/operators';
import {fade} from '../../../animations';
import {delay} from '../../../services/delay';
import {TextRenderingService} from '../../songs/services/text-rendering.service';
import {Section} from '../../songs/services/section';
import {GlobalSettings} from '../../../services/global-settings';
export interface PresentationSong {
id: string;
title: string;
sections: Section[];
}
@Component({
selector: 'app-remote',
templateUrl: './remote.component.html',
styleUrls: ['./remote.component.less'],
animations: [fade],
})
export class RemoteComponent {
public shows$: Observable<Show[]>;
public show: Show | null = null;
public showSongs: ShowSong[] = [];
public songs: Song[] = [];
public presentationSongs: PresentationSong[] = [];
public currentShowId: string | null = null;
public progress = false;
public faDesktop = faDesktop;
public showControl = new FormControl();
public trackBy(index: number, item: PresentationSong): string {
return item.id;
}
public constructor(
private showService: ShowService,
private showSongService: ShowSongService,
private songService: SongService,
private textRenderingService: TextRenderingService,
private globalSettingsService: GlobalSettingsService
) {
this.shows$ = showService.list$(true);
songService.list$().subscribe(_ => (this.songs = _));
globalSettingsService.get$
.pipe(
filter(_ => !!_),
map(_ => _ as GlobalSettings),
map(_ => _.currentShow),
distinctUntilChanged()
)
.subscribe(_ => {
this.showControl.setValue(_, {emitEvent: false});
void this.onShowChanged(_, false);
});
this.showControl.valueChanges.subscribe((value: string) => void this.onShowChanged(value));
}
public async onShowChanged(change: string, updateShow = true): Promise<void> {
this.progress = true;
if (updateShow) {
await this.showService.update$(change, {presentationSongId: 'empty'});
await delay(1200);
await this.globalSettingsService.set({currentShow: change});
await this.showService.update$(change, {presentationSongId: 'title'});
}
this.currentShowId = change;
this.showService.read$(change).subscribe(show => {
this.show = show;
});
combineLatest([this.showService.read$(change), this.showSongService.list$(change)]).subscribe(([show, list]) => {
this.showSongs = list;
const presentationSongs = list.map(song => ({
id: song.id,
title: song.title,
sections: this.textRenderingService.parse(song.text, null),
}));
this.presentationSongs = show?.order.map(_ => presentationSongs.filter(f => f.id === _)[0]) ?? [];
});
await delay(500);
this.progress = false;
}
public getFirstLine(section: Section): string {
return section.lines.filter(_ => _.type === 1)[0].text;
}
public async onSectionClick(id: string, index: number): Promise<void> {
if (this.currentShowId != null)
await this.showService.update$(this.currentShowId, {
presentationSongId: id,
presentationSection: index,
});
}
public async onZoom(zoom: number): Promise<void> {
if (this.currentShowId != null) await this.showService.update$(this.currentShowId, {presentationZoom: zoom});
}
}