update angular

This commit is contained in:
2025-01-02 15:01:59 +01:00
parent 73d3ecfd42
commit 802c309679
199 changed files with 13745 additions and 11691 deletions

View File

@@ -11,7 +11,7 @@ describe('LegalComponent', () => {
void TestBed.configureTestingModule({
declarations: [LegalComponent],
}).compileComponents();
})
}),
);
beforeEach(() => {

View File

@@ -6,6 +6,7 @@ import {Config} from '../../../../services/config';
selector: 'app-legal',
templateUrl: './legal.component.html',
styleUrls: ['./legal.component.less'],
standalone: false,
})
export class LegalComponent {
@Input() public song: Song | null = null;

View File

@@ -11,7 +11,7 @@ describe('LogoComponent', () => {
void TestBed.configureTestingModule({
declarations: [LogoComponent],
}).compileComponents();
})
}),
);
beforeEach(() => {

View File

@@ -4,5 +4,7 @@ import {Component} from '@angular/core';
selector: 'app-logo',
templateUrl: './logo.component.html',
styleUrls: ['./logo.component.less'],
standalone: false,
})
export class LogoComponent {}
export class LogoComponent {
}

View File

@@ -1,18 +1,18 @@
<div class="fullscreen background"></div>
<div *ngIf="song && showType" [style.font-size.px]="zoom" class="fullscreen background">
<div class="bg-blue fullscreen bg-image" [class.visible]="presentationBackground==='blue'"></div>
<div class="bg-green fullscreen bg-image" [class.visible]="presentationBackground==='green'"></div>
<div class="bg-leder fullscreen bg-image" [class.visible]="presentationBackground==='leder'"></div>
<div class="bg-praise fullscreen bg-image" [class.visible]="presentationBackground==='praise'"></div>
<div class="bg-bible fullscreen bg-image" [class.visible]="presentationBackground==='bible'"></div>
<div [class.visible]="presentationBackground==='blue'" class="bg-blue fullscreen bg-image"></div>
<div [class.visible]="presentationBackground==='green'" class="bg-green fullscreen bg-image"></div>
<div [class.visible]="presentationBackground==='leder'" class="bg-leder fullscreen bg-image"></div>
<div [class.visible]="presentationBackground==='praise'" class="bg-praise fullscreen bg-image"></div>
<div [class.visible]="presentationBackground==='bible'" class="bg-bible fullscreen bg-image"></div>
<div
[@songSwitch]="songId"
[class.blur]="songId === 'title' || songId === 'dynamicText'"
[class.no-logo]="presentationBackground!=='none'"
[class.hide]="songId !== 'title' && songId !== 'empty' && songId !== 'dynamicText'"
[class.no-logo]="presentationBackground!=='none'"
class="start fullscreen logo"
>
<app-logo></app-logo>
@@ -29,10 +29,10 @@
</div>
<app-song-text
[header]="song.title"
*ngIf="songId !== 'title' && songId !== 'empty'"
[@songSwitch]="songId"
[fullscreen]="true"
[header]="song.title"
[index]="index??0"
[showSwitch]="false"
[text]="song.text"

View File

@@ -34,6 +34,7 @@
.bg-blue {
background-image: url("/assets/bg-dark-blue.jpg");
filter: blur(10px);
&.visible {
opacity: 0.5;
}
@@ -42,6 +43,7 @@
.bg-green {
background-image: url("/assets/bg-dark-green.jpg");
filter: blur(5px);
&.visible {
opacity: 0.9;
}
@@ -50,6 +52,7 @@
.bg-leder {
background-image: url("/assets/bg-leder.jpg");
filter: blur(5px);
&.visible {
opacity: 0.4;
}
@@ -58,6 +61,7 @@
.bg-praise {
background-image: url("/assets/bg-praise.jpg");
filter: blur(8px);
&.visible {
opacity: 0.2;
}
@@ -66,6 +70,7 @@
.bg-bible {
background-image: url("/assets/bg-bible.jpg");
filter: blur(8px);
&.visible {
opacity: 0.2;
}

View File

@@ -11,7 +11,7 @@ describe('MonitorComponent', () => {
void TestBed.configureTestingModule({
declarations: [MonitorComponent],
}).compileComponents();
})
}),
);
beforeEach(() => {

View File

@@ -19,6 +19,7 @@ import {openFullscreen} from '../../../services/fullscreen';
templateUrl: './monitor.component.html',
styleUrls: ['./monitor.component.less'],
animations: [songSwitch],
standalone: false,
})
export class MonitorComponent implements OnInit {
public song: Song | null = null;
@@ -40,7 +41,7 @@ export class MonitorComponent implements OnInit {
private textRenderingService: TextRenderingService,
private globalSettingsService: GlobalSettingsService,
private configService: ConfigService,
private cRef: ChangeDetectorRef
private cRef: ChangeDetectorRef,
) {
this.config$ = configService.get$();
}
@@ -54,7 +55,7 @@ export class MonitorComponent implements OnInit {
map(_ => _ as GlobalSettings),
map(_ => _.currentShow),
distinctUntilChanged(),
tap(_ => (this.currentShowId = _))
tap(_ => (this.currentShowId = _)),
)
.pipe(
switchMap(_ => this.showService.read$(_)),
@@ -76,7 +77,7 @@ export class MonitorComponent implements OnInit {
}),
switchMap((_: Show) => this.showSongService.read$(_.id, _.presentationSongId)),
filter(_ => !!_),
map(_ => _ as Song)
map(_ => _ as Song),
)
.subscribe(_ => {
this.song = _;

View File

@@ -28,4 +28,5 @@ const routes: Routes = [
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class PresentationRoutingModule {}
export class PresentationRoutingModule {
}

View File

@@ -8,7 +8,9 @@ import {CardModule} from '../../widget-modules/components/card/card.module';
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatSelectModule} from '@angular/material/select';
import {ShowTypeTranslaterModule} from '../../widget-modules/pipes/show-type-translater/show-type-translater.module';
import {SectionTypeTranslatorModule} from '../../widget-modules/pipes/section-type-translator/section-type-translator.module';
import {
SectionTypeTranslatorModule,
} from '../../widget-modules/pipes/section-type-translator/section-type-translator.module';
import {SongTextModule} from '../../widget-modules/components/song-text/song-text.module';
import {LegalComponent} from './monitor/legal/legal.component';
import {MatButtonModule} from '@angular/material/button';
@@ -43,4 +45,5 @@ import {UserNameModule} from '../../services/user/user-name/user-name.module';
UserNameModule,
],
})
export class PresentationModule {}
export class PresentationModule {
}

View File

@@ -1,6 +1,6 @@
<div *ngIf="show" @fade>
<app-card [heading]="show.showType | showType" [subheading]="show.date.toDate() | date:'dd.MM.yyyy'"
closeLink="/presentation/select" [closeIcon]="faIcon">
<app-card [closeIcon]="faIcon" [heading]="show.showType | showType"
[subheading]="show.date.toDate() | date:'dd.MM.yyyy'" closeLink="/presentation/select">
<ng-container *ngIf="!progress">
<div class="song">
@@ -61,7 +61,8 @@
<mat-form-field appearance="outline">
<mat-label>Überschrift</mat-label>
<input (ngModelChange)="onDynamicCaption($event, show.id)" [ngModel]="show.presentationDynamicCaption" autocomplete="off" id="dynamic-caption"
<input (ngModelChange)="onDynamicCaption($event, show.id)" [ngModel]="show.presentationDynamicCaption"
autocomplete="off" id="dynamic-caption"
matInput
type="text">
</mat-form-field>
@@ -86,8 +87,8 @@
<mat-form-field appearance="outline">
<mat-label>Hintergrund</mat-label>
<mat-select
[ngModel]="show.presentationBackground"
(ngModelChange)="onBackground($event, show.id)">
(ngModelChange)="onBackground($event, show.id)"
[ngModel]="show.presentationBackground">
<mat-option value="none">kein Hintergrund</mat-option>
<mat-option value="blue">Sternenhimmel</mat-option>
<mat-option value="green">Blätter</mat-option>
@@ -98,12 +99,12 @@
</mat-form-field>
<mat-slider
#slider
[max]="100"
[min]="10"
[step]="2"
color="primary"
class="zoom-slider"
#slider
color="primary"
ngDefaultControl
><input (ngModelChange)="onZoom($event, show.id)"
[ngModel]="show.presentationZoom"
@@ -117,8 +118,8 @@
*ngIf="show"
[addedLive]="true"
[showSongs]="showSongs"
[songs]="songs$|async"
[show]="show"
[songs]="songs$|async"
></app-add-song>
</ng-container>
</app-card>

View File

@@ -11,7 +11,7 @@ describe('RemoteComponent', () => {
void TestBed.configureTestingModule({
declarations: [RemoteComponent],
}).compileComponents();
})
}),
);
beforeEach(() => {

View File

@@ -25,6 +25,7 @@ export interface PresentationSong {
styleUrls: ['./remote.component.less'],
animations: [fade],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false,
})
export class RemoteComponent {
public show: Show | null = null;
@@ -35,13 +36,38 @@ export class RemoteComponent {
public faIcon = faFolderOpen;
public faDesktop = faDesktop;
public presentationDynamicCaptionChanged$ = new Subject<{presentationDynamicCaption: string; showId: string}>();
public presentationDynamicTextChanged$ = new Subject<{presentationDynamicText: string; showId: string}>();
public constructor(
private showService: ShowService,
private showSongService: ShowSongService,
private songService: SongService,
private textRenderingService: TextRenderingService,
private globalSettingsService: GlobalSettingsService,
private cRef: ChangeDetectorRef,
) {
globalSettingsService.get$
.pipe(
filter(_ => !!_),
map(_ => _ as GlobalSettings),
map(_ => _.currentShow),
)
.subscribe(_ => {
this.onShowChanged(_);
this.cRef.markForCheck();
});
this.presentationDynamicCaptionChanged$
.pipe(debounceTime(1000))
.subscribe(_ => void this.showService.update$(_.showId, {presentationDynamicCaption: _.presentationDynamicCaption}));
this.presentationDynamicTextChanged$.pipe(debounceTime(1000)).subscribe(_ => void this.showService.update$(_.showId, {presentationDynamicText: _.presentationDynamicText}));
}
public trackBy(index: number, item: PresentationSong): string {
return item.id;
}
public presentationDynamicCaptionChanged$ = new Subject<{presentationDynamicCaption: string; showId: string}>();
public onShowChanged(change: string): void {
combineLatest([this.showService.read$(change), this.showSongService.list$(change)]).subscribe(([show, list]) => {
this.showSongs = list;
@@ -74,32 +100,6 @@ export class RemoteComponent {
public async onBackground(presentationBackground: PresentationBackground, showId: string): Promise<void> {
await this.showService.update$(showId, {presentationBackground});
}
public presentationDynamicTextChanged$ = new Subject<{presentationDynamicText: string; showId: string}>();
public constructor(
private showService: ShowService,
private showSongService: ShowSongService,
private songService: SongService,
private textRenderingService: TextRenderingService,
private globalSettingsService: GlobalSettingsService,
private cRef: ChangeDetectorRef
) {
globalSettingsService.get$
.pipe(
filter(_ => !!_),
map(_ => _ as GlobalSettings),
map(_ => _.currentShow)
)
.subscribe(_ => {
this.onShowChanged(_);
this.cRef.markForCheck();
});
this.presentationDynamicCaptionChanged$
.pipe(debounceTime(1000))
.subscribe(_ => void this.showService.update$(_.showId, {presentationDynamicCaption: _.presentationDynamicCaption}));
this.presentationDynamicTextChanged$.pipe(debounceTime(1000)).subscribe(_ => void this.showService.update$(_.showId, {presentationDynamicText: _.presentationDynamicText}));
}
public onDynamicCaption(presentationDynamicCaption: string, showId: string): void {
this.presentationDynamicCaptionChanged$.next({presentationDynamicCaption, showId});

View File

@@ -1,11 +1,11 @@
<div *ngIf="shows$ | async as shows" @fade>
<app-card heading="Bitte eine Veranstaltung auswählen" *ngIf="visible">
<app-card *ngIf="visible" heading="Bitte eine Veranstaltung auswählen">
<p *ngIf="!shows.length">
Es ist derzeit keine Veranstaltung vorhanden
</p>
<div *ngIf="shows.length>0" class="list">
<button mat-stroked-button *ngFor="let show of shows" (click)="selectShow(show)">
<button (click)="selectShow(show)" *ngFor="let show of shows" mat-stroked-button>
<app-user-name [userId]="show.owner"></app-user-name>
,
{{ show.showType | showType }},

View File

@@ -11,15 +11,17 @@ import {fade} from '../../../animations';
templateUrl: './select.component.html',
styleUrls: ['./select.component.less'],
animations: [fade],
standalone: false,
})
export class SelectComponent implements OnInit {
public constructor(private showService: ShowService, private globalSettingsService: GlobalSettingsService, private router: Router) {}
public visible = false;
public shows$ = this.showService
.list$(true)
.pipe(map(_ => _.filter(_ => _.date.toDate() > new Date(new Date().setMonth(new Date().getMonth() - 1))).sort((a, b) => (b.date < a.date ? -1 : b.date > a.date ? 1 : 0))));
public constructor(private showService: ShowService, private globalSettingsService: GlobalSettingsService, private router: Router) {
}
public async selectShow(show: Show) {
this.visible = false;

View File

@@ -3,4 +3,5 @@ import {Injectable} from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class PresentationService {}
export class PresentationService {
}