diff --git a/src/app/animations.ts b/src/app/animations.ts index 3b64ebd..2c35d09 100644 --- a/src/app/animations.ts +++ b/src/app/animations.ts @@ -32,7 +32,7 @@ export const fader = trigger('fader', [ ':enter', [ animate( - '200ms ease', + '300ms ease', style({ opacity: 1, transform: 'scale(1) translateY(0)', diff --git a/src/app/app.component.ts b/src/app/app.component.ts index b92e72b..bfa9df8 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit, ViewChild} from '@angular/core'; +import {ChangeDetectionStrategy, Component, OnInit, ViewChild} from '@angular/core'; import {fader} from './animations'; import {ScrollService} from './services/scroll.service'; import {PerfectScrollbarComponent} from 'ngx-perfect-scrollbar'; @@ -8,6 +8,7 @@ import {PerfectScrollbarComponent} from 'ngx-perfect-scrollbar'; templateUrl: './app.component.html', styleUrls: ['./app.component.less'], animations: [fader], + changeDetection: ChangeDetectionStrategy.OnPush, }) export class AppComponent implements OnInit { @ViewChild('scrollbar', {static: false}) public scrollbar: PerfectScrollbarComponent | null = null; diff --git a/src/app/modules/brand/brand.component.html b/src/app/modules/brand/brand.component.html index 3139da4..7f940f1 100644 --- a/src/app/modules/brand/brand.component.html +++ b/src/app/modules/brand/brand.component.html @@ -1,4 +1,4 @@
-
© 2022 - Benjamin Ifland
+
© 2019 - 2023 - Benjamin Ifland
diff --git a/src/app/modules/brand/brand.component.less b/src/app/modules/brand/brand.component.less index a5f0b19..ffcbb9d 100644 --- a/src/app/modules/brand/brand.component.less +++ b/src/app/modules/brand/brand.component.less @@ -2,7 +2,7 @@ color: #fff; opacity: 0.7; font-size: 20px; - transform: translate(173px, -40px); + transform: translate(116px, -40px); } .brand { diff --git a/src/app/modules/presentation/monitor/monitor.component.ts b/src/app/modules/presentation/monitor/monitor.component.ts index b8a2ffe..949f631 100644 --- a/src/app/modules/presentation/monitor/monitor.component.ts +++ b/src/app/modules/presentation/monitor/monitor.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit} from '@angular/core'; +import {ChangeDetectorRef, Component, OnInit} from '@angular/core'; import {debounceTime, distinctUntilChanged, filter, map, switchMap, tap} from 'rxjs/operators'; import {ShowService} from '../../shows/services/show.service'; import {SongService} from '../../songs/services/song.service'; @@ -38,7 +38,8 @@ export class MonitorComponent implements OnInit { private songService: SongService, private textRenderingService: TextRenderingService, private globalSettingsService: GlobalSettingsService, - private configService: ConfigService + private configService: ConfigService, + private cRef: ChangeDetectorRef ) { this.config$ = configService.get$(); } @@ -66,7 +67,10 @@ export class MonitorComponent implements OnInit { this.presentationDynamicText = _.presentationDynamicText; this.zoom = _.presentationZoom ?? 30; if (this.songId !== _.presentationSongId) this.songId = 'empty'; - setTimeout(() => (this.songId = _.presentationSongId), 600); + setTimeout(() => { + this.songId = _.presentationSongId; + this.cRef.markForCheck(); + }, 600); }), switchMap((_: Show) => this.showSongService.read$(_.id, _.presentationSongId)), filter(_ => !!_), @@ -74,6 +78,7 @@ export class MonitorComponent implements OnInit { ) .subscribe(_ => { this.song = _; + this.cRef.markForCheck(); }); } } diff --git a/src/app/modules/presentation/presentation.module.ts b/src/app/modules/presentation/presentation.module.ts index 3a66e55..b211d2e 100644 --- a/src/app/modules/presentation/presentation.module.ts +++ b/src/app/modules/presentation/presentation.module.ts @@ -19,6 +19,7 @@ import {AddSongModule} from '../../widget-modules/components/add-song/add-song.m import {LogoComponent} from './monitor/logo/logo.component'; import {SelectComponent} from './select/select.component'; import {MatInputModule} from '@angular/material/input'; +import {UserNameModule} from '../../services/user/user-name/user-name.module'; @NgModule({ declarations: [MonitorComponent, RemoteComponent, LegalComponent, LogoComponent, SelectComponent], @@ -39,6 +40,7 @@ import {MatInputModule} from '@angular/material/input'; AddSongModule, ReactiveFormsModule, MatInputModule, + UserNameModule, ], }) export class PresentationModule {} diff --git a/src/app/modules/presentation/select/select.component.html b/src/app/modules/presentation/select/select.component.html index 5de1d97..90d290f 100644 --- a/src/app/modules/presentation/select/select.component.html +++ b/src/app/modules/presentation/select/select.component.html @@ -6,6 +6,8 @@
diff --git a/src/app/modules/presentation/select/select.component.less b/src/app/modules/presentation/select/select.component.less index ffee5fe..630b7e3 100644 --- a/src/app/modules/presentation/select/select.component.less +++ b/src/app/modules/presentation/select/select.component.less @@ -1,5 +1,5 @@ .list { display: grid; - grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 10px; } diff --git a/src/app/modules/shows/show/show.component.ts b/src/app/modules/shows/show/show.component.ts index 90c6cfa..7c3a4c9 100644 --- a/src/app/modules/shows/show/show.component.ts +++ b/src/app/modules/shows/show/show.component.ts @@ -1,8 +1,8 @@ -import {Component, OnInit} from '@angular/core'; +import {ChangeDetectorRef, Component, OnDestroy, OnInit} from '@angular/core'; import {filter, map, switchMap, tap} from 'rxjs/operators'; import {ActivatedRoute, Router} from '@angular/router'; import {ShowService} from '../services/show.service'; -import {Observable} from 'rxjs'; +import {Observable, Subscription} from 'rxjs'; import {Show} from '../services/show'; import {SongService} from '../../songs/services/song.service'; import {Song} from '../../songs/services/song'; @@ -30,7 +30,7 @@ import {fade} from '../../../animations'; styleUrls: ['./show.component.less'], animations: [fade], }) -export class ShowComponent implements OnInit { +export class ShowComponent implements OnInit, OnDestroy { public show$: Observable | null = null; public songs: Song[] | null = null; public showSongs: ShowSong[] | null = null; @@ -47,6 +47,7 @@ export class ShowComponent implements OnInit { public faUsers = faUsers; public faZoomIn = faMagnifyingGlassPlus; public faZoomOut = faMagnifyingGlassMinus; + private subs: Subscription[] = []; public constructor( private activatedRoute: ActivatedRoute, @@ -54,7 +55,8 @@ export class ShowComponent implements OnInit { private songService: SongService, private showSongService: ShowSongService, private docxService: DocxService, - private router: Router + private router: Router, + private cRef: ChangeDetectorRef ) {} public ngOnInit(): void { @@ -64,19 +66,30 @@ export class ShowComponent implements OnInit { tap((_: string) => (this.showId = _)), switchMap((showId: string) => this.showService.read$(showId)) ); - this.activatedRoute.params - .pipe( - map(param => param as {showId: string}), - map(param => param.showId), - switchMap(showId => this.showSongService.list$(showId)), - tap(_ => console.log(_)), - filter(_ => !!_ && _.length > 0) - ) - .subscribe(_ => (this.showSongs = _)); - this.songService - .list$() - .pipe(filter(_ => !!_)) - .subscribe(_ => (this.songs = _)); + this.subs.push( + this.activatedRoute.params + .pipe( + map(param => param as {showId: string}), + map(param => param.showId), + switchMap(showId => this.showSongService.list$(showId)), + filter(_ => !!_ && _.length > 0) + ) + .subscribe(_ => { + this.showSongs = _; + this.cRef.markForCheck(); + }), + this.songService + .list$() + .pipe(filter(_ => !!_)) + .subscribe(_ => { + this.songs = _; + this.cRef.markForCheck(); + }) + ); + } + + public ngOnDestroy(): void { + this.subs.forEach(_ => _.unsubscribe()); } public textSize = 1; @@ -89,12 +102,6 @@ export class ShowComponent implements OnInit { this.textSize -= 0.1; } - public getSong(songId: string): Song | null { - if (!this.songs) return null; - const filtered = this.songs.filter(_ => _.id === songId); - return filtered.length > 0 ? filtered[0] : null; - } - public async onArchive(archived: boolean): Promise { if (this.showId != null) await this.showService.update$(this.showId, {archived}); } diff --git a/src/app/modules/shows/show/song/song.component.html b/src/app/modules/shows/show/song/song.component.html index 9caa499..785d6c5 100644 --- a/src/app/modules/shows/show/song/song.component.html +++ b/src/app/modules/shows/show/song/song.component.html @@ -1,9 +1,12 @@
-
{{ iSong.key }} - {{ iSong.title }}
+
+
{{ iSong.key }}
+
{{ iSong.title }}
+
-
+
{{ iSong.title }} - + {{ iSong.keyOriginal }} →  @@ -11,26 +14,27 @@ - - + +
- + Songtext -
Es wird nur der Liedtext für dieser Veranstaltung geändert.
- +
Es wird nur der Liedtext für dieser Veranstaltung geändert.
+ Speichern Verwerfen