update angular
This commit is contained in:
21
angular.json
21
angular.json
@@ -15,12 +15,15 @@
|
||||
"prefix": "app",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular-devkit/build-angular:browser",
|
||||
"builder": "@angular-devkit/build-angular:application",
|
||||
"options": {
|
||||
"outputPath": "dist/wgenerator",
|
||||
"outputPath": {
|
||||
"base": "dist/wgenerator"
|
||||
},
|
||||
"index": "src/index.html",
|
||||
"main": "src/main.ts",
|
||||
"polyfills": "src/polyfills.ts",
|
||||
"polyfills": [
|
||||
"src/polyfills.ts"
|
||||
],
|
||||
"tsConfig": "tsconfig.app.json",
|
||||
"aot": false,
|
||||
"assets": [
|
||||
@@ -42,9 +45,7 @@
|
||||
"src/styles/shadow.less"
|
||||
],
|
||||
"scripts": [],
|
||||
"vendorChunk": true,
|
||||
"extractLicenses": false,
|
||||
"buildOptimizer": false,
|
||||
"sourceMap": true,
|
||||
"optimization": false,
|
||||
"namedChunks": true,
|
||||
@@ -52,7 +53,8 @@
|
||||
"lodash",
|
||||
"docx",
|
||||
"qrcode"
|
||||
]
|
||||
],
|
||||
"browser": "src/main.ts"
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
@@ -68,8 +70,6 @@
|
||||
"namedChunks": false,
|
||||
"aot": true,
|
||||
"extractLicenses": true,
|
||||
"vendorChunk": false,
|
||||
"buildOptimizer": true,
|
||||
"budgets": [
|
||||
{
|
||||
"type": "initial",
|
||||
@@ -82,8 +82,7 @@
|
||||
"maximumError": "10kb"
|
||||
}
|
||||
],
|
||||
"serviceWorker": true,
|
||||
"ngswConfigPath": "ngsw-config.json"
|
||||
"serviceWorker": "ngsw-config.json"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
24400
package-lock.json
generated
24400
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
52
package.json
52
package.json
@@ -11,18 +11,18 @@
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "^17.2.2",
|
||||
"@angular/cdk": "^17.2.1",
|
||||
"@angular/common": "^17.2.2",
|
||||
"@angular/compiler": "^17.2.2",
|
||||
"@angular/core": "^17.2.2",
|
||||
"@angular/fire": "^17.0.1",
|
||||
"@angular/forms": "^17.2.2",
|
||||
"@angular/material": "^17.2.1",
|
||||
"@angular/platform-browser": "^17.2.2",
|
||||
"@angular/platform-browser-dynamic": "^17.2.2",
|
||||
"@angular/router": "^17.2.2",
|
||||
"@angular/service-worker": "^17.2.2",
|
||||
"@angular/animations": "^19.0.5",
|
||||
"@angular/cdk": "^19.0.4",
|
||||
"@angular/common": "^19.0.5",
|
||||
"@angular/compiler": "^19.0.5",
|
||||
"@angular/core": "^19.0.5",
|
||||
"@angular/fire": "^18.0.1",
|
||||
"@angular/forms": "^19.0.5",
|
||||
"@angular/material": "^19.0.4",
|
||||
"@angular/platform-browser": "^19.0.5",
|
||||
"@angular/platform-browser-dynamic": "^19.0.5",
|
||||
"@angular/router": "^19.0.5",
|
||||
"@angular/service-worker": "^19.0.5",
|
||||
"@fortawesome/angular-fontawesome": "^0.14.1",
|
||||
"@fortawesome/fontawesome-svg-core": "^6.5.1",
|
||||
"@fortawesome/free-solid-svg-icons": "^6.5.1",
|
||||
@@ -35,24 +35,24 @@
|
||||
"rxjs": "~7.8.1",
|
||||
"swiper": "^11.0.6",
|
||||
"tslib": "^2.6.2",
|
||||
"zone.js": "~0.14.4"
|
||||
"zone.js": "~0.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/architect": "0.1702.1",
|
||||
"@angular-devkit/build-angular": "^17.2.1",
|
||||
"@angular-eslint/builder": "17.2.1",
|
||||
"@angular-eslint/eslint-plugin": "17.2.1",
|
||||
"@angular-eslint/eslint-plugin-template": "17.2.1",
|
||||
"@angular-eslint/schematics": "17.2.1",
|
||||
"@angular-eslint/template-parser": "17.2.1",
|
||||
"@angular/cli": "^17.2.1",
|
||||
"@angular/compiler-cli": "^17.2.2",
|
||||
"@angular/language-service": "^17.2.2",
|
||||
"@angular-devkit/architect": "0.1900.6",
|
||||
"@angular-devkit/build-angular": "^19.0.6",
|
||||
"@angular-eslint/builder": "19.0.2",
|
||||
"@angular-eslint/eslint-plugin": "19.0.2",
|
||||
"@angular-eslint/eslint-plugin-template": "19.0.2",
|
||||
"@angular-eslint/schematics": "19.0.2",
|
||||
"@angular-eslint/template-parser": "19.0.2",
|
||||
"@angular/cli": "^19.0.6",
|
||||
"@angular/compiler-cli": "^19.0.5",
|
||||
"@angular/language-service": "^19.0.5",
|
||||
"@types/jasmine": "~5.1.4",
|
||||
"@types/jasminewd2": "~2.0.13",
|
||||
"@types/lodash": "^4.14.202",
|
||||
"@typescript-eslint/eslint-plugin": "^7.0.2",
|
||||
"@typescript-eslint/parser": "^7.0.2",
|
||||
"@typescript-eslint/eslint-plugin": "^7.2.0",
|
||||
"@typescript-eslint/parser": "^7.2.0",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-plugin-prettier": "^5.1.3",
|
||||
@@ -65,6 +65,6 @@
|
||||
"karma-jasmine": "~5.1.0",
|
||||
"karma-jasmine-html-reporter": "^2.1.0",
|
||||
"prettier": "^3.2.5",
|
||||
"typescript": "~5.3.3"
|
||||
"typescript": "~5.5.4"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,7 +25,7 @@ export const fader = trigger('fader', [
|
||||
transform: 'scale(1) translateY(-10px)',
|
||||
}),
|
||||
],
|
||||
{optional: true}
|
||||
{optional: true},
|
||||
),
|
||||
// Animate the new page in
|
||||
query(
|
||||
@@ -36,10 +36,10 @@ export const fader = trigger('fader', [
|
||||
style({
|
||||
opacity: 1,
|
||||
transform: 'scale(1) translateY(0)',
|
||||
})
|
||||
}),
|
||||
),
|
||||
],
|
||||
{optional: true}
|
||||
{optional: true},
|
||||
),
|
||||
]),
|
||||
]);
|
||||
|
||||
@@ -60,4 +60,5 @@ const routes: Routes = [
|
||||
],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AppRoutingModule {}
|
||||
export class AppRoutingModule {
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<app-navigation></app-navigation>
|
||||
|
||||
<div [@fader]="o.isActivated ? o.activatedRoute : ''" class="content">
|
||||
<router-outlet #o="outlet"></router-outlet>
|
||||
</div>
|
||||
<router-outlet #o="outlet"></router-outlet>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ describe('AppComponent', () => {
|
||||
imports: [RouterTestingModule],
|
||||
declarations: [AppComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
it('should create the app', () => {
|
||||
|
||||
@@ -9,6 +9,7 @@ import {register} from 'swiper/element/bundle';
|
||||
styleUrls: ['./app.component.less'],
|
||||
animations: [fader],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
standalone: false,
|
||||
})
|
||||
export class AppComponent implements OnInit {
|
||||
public constructor(private scrollService: ScrollService) {
|
||||
|
||||
@@ -40,4 +40,5 @@ import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
|
||||
providers: [{provide: MAT_DATE_LOCALE, useValue: 'de-DE'}],
|
||||
bootstrap: [AppComponent],
|
||||
})
|
||||
export class AppModule {}
|
||||
export class AppModule {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('BrandComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [BrandComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -4,5 +4,7 @@ import {Component} from '@angular/core';
|
||||
selector: 'app-brand',
|
||||
templateUrl: './brand.component.html',
|
||||
styleUrls: ['./brand.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class BrandComponent {}
|
||||
export class BrandComponent {
|
||||
}
|
||||
|
||||
@@ -21,4 +21,5 @@ const routes: Routes = [
|
||||
declarations: [BrandComponent, NewUserComponent],
|
||||
imports: [CommonModule, RouterModule.forChild(routes), LogoModule],
|
||||
})
|
||||
export class BrandModule {}
|
||||
export class BrandModule {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('NewUserComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [NewUserComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -7,6 +7,7 @@ import {User} from '../../../services/user/user';
|
||||
selector: 'app-new-user',
|
||||
templateUrl: './new-user.component.html',
|
||||
styleUrls: ['./new-user.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class NewUserComponent {
|
||||
public user$: Observable<User | null> | null = null;
|
||||
|
||||
@@ -10,8 +10,9 @@ import {ShowService} from '../shows/services/show.service';
|
||||
export class GuestShowService {
|
||||
public constructor(
|
||||
private showService: ShowService,
|
||||
private guestShowDataService: GuestShowDataService
|
||||
) {}
|
||||
private guestShowDataService: GuestShowDataService,
|
||||
) {
|
||||
}
|
||||
|
||||
public async share(show: Show, songs: Song[]): Promise<string> {
|
||||
const data = {
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('GuestComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [GuestComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -9,19 +9,21 @@ import {ConfigService} from '../../services/config.service';
|
||||
selector: 'app-guest',
|
||||
templateUrl: './guest.component.html',
|
||||
styleUrls: ['./guest.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class GuestComponent {
|
||||
public show$ = this.currentRoute.params.pipe(
|
||||
map(param => param.id as string),
|
||||
switchMap(id => this.service.read$(id))
|
||||
switchMap(id => this.service.read$(id)),
|
||||
);
|
||||
public config$ = this.configService.get$();
|
||||
|
||||
public constructor(
|
||||
private currentRoute: ActivatedRoute,
|
||||
private service: GuestShowDataService,
|
||||
private configService: ConfigService
|
||||
) {}
|
||||
private configService: ConfigService,
|
||||
) {
|
||||
}
|
||||
|
||||
public trackBy = (index: number, show: Song) => show.id;
|
||||
}
|
||||
|
||||
@@ -20,4 +20,5 @@ import {ShowTypeTranslaterModule} from '../../widget-modules/pipes/show-type-tra
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
})
|
||||
export class GuestModule {}
|
||||
export class GuestModule {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('LegalComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [LegalComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('LogoComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [LogoComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -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 {
|
||||
}
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('MonitorComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [MonitorComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -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 = _;
|
||||
|
||||
@@ -28,4 +28,5 @@ const routes: Routes = [
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class PresentationRoutingModule {}
|
||||
export class PresentationRoutingModule {
|
||||
}
|
||||
|
||||
@@ -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 {
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('RemoteComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [RemoteComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -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});
|
||||
|
||||
@@ -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 }},
|
||||
|
||||
@@ -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;
|
||||
|
||||
|
||||
@@ -3,4 +3,5 @@ import {Injectable} from '@angular/core';
|
||||
@Injectable({
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class PresentationService {}
|
||||
export class PresentationService {
|
||||
}
|
||||
|
||||
@@ -4,5 +4,7 @@ import {Component} from '@angular/core';
|
||||
selector: 'app-archive-dialog',
|
||||
templateUrl: './archive-dialog.component.html',
|
||||
styleUrls: ['./archive-dialog.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class ArchiveDialogComponent {}
|
||||
export class ArchiveDialogComponent {
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@ import {Component, Inject} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogActions, MatDialogClose, MatDialogContent} from '@angular/material/dialog';
|
||||
import {MatButton} from '@angular/material/button';
|
||||
import QRCode from 'qrcode';
|
||||
import {AsyncPipe} from '@angular/common';
|
||||
import {ShowTypePipe} from '../../../../widget-modules/pipes/show-type-translater/show-type.pipe';
|
||||
import {Show} from '../../services/show';
|
||||
|
||||
@@ -13,8 +12,7 @@ export interface ShareDialogData {
|
||||
|
||||
@Component({
|
||||
selector: 'app-share-dialog',
|
||||
standalone: true,
|
||||
imports: [MatButton, MatDialogActions, MatDialogContent, MatDialogClose, AsyncPipe],
|
||||
imports: [MatButton, MatDialogActions, MatDialogContent, MatDialogClose],
|
||||
templateUrl: './share-dialog.component.html',
|
||||
styleUrl: './share-dialog.component.less',
|
||||
})
|
||||
|
||||
@@ -6,19 +6,21 @@
|
||||
<mat-select formControlName="showType">
|
||||
<mat-optgroup label="öffentlich">
|
||||
<mat-option *ngFor="let key of showTypePublic" [value]="key">{{
|
||||
key | showType
|
||||
}}</mat-option>
|
||||
key | showType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-optgroup>
|
||||
<mat-optgroup label="privat">
|
||||
<mat-option *ngFor="let key of showTypePrivate" [value]="key">{{
|
||||
key | showType
|
||||
}}</mat-option>
|
||||
key | showType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-optgroup>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Datum</mat-label>
|
||||
<input [matDatepicker]="picker" formControlName="date" matInput/>
|
||||
<input [matDatepicker]="picker" formControlName="date" matInput />
|
||||
<mat-datepicker-toggle [for]="picker" matSuffix></mat-datepicker-toggle>
|
||||
<mat-datepicker #picker touchUi></mat-datepicker>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -14,6 +14,7 @@ import Timestamp = firebase.firestore.Timestamp;
|
||||
selector: 'app-edit',
|
||||
templateUrl: './edit.component.html',
|
||||
styleUrls: ['./edit.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class EditComponent implements OnInit {
|
||||
public shows$: Observable<Show[]>;
|
||||
@@ -38,7 +39,7 @@ export class EditComponent implements OnInit {
|
||||
map(param => param as {showId: string}),
|
||||
map(param => param.showId),
|
||||
switchMap((showId: string) => this.showService.read$(showId)),
|
||||
take(1)
|
||||
take(1),
|
||||
)
|
||||
.subscribe(show => {
|
||||
this.form.setValue({
|
||||
@@ -60,7 +61,7 @@ export class EditComponent implements OnInit {
|
||||
{
|
||||
date: Timestamp.fromDate(this.form.value.date),
|
||||
showType: this.form.value.showType,
|
||||
} as Partial<Show>
|
||||
} as Partial<Show>,
|
||||
);
|
||||
await this.router.navigateByUrl(`/shows/${this.form.value.id ?? ''}`);
|
||||
}
|
||||
|
||||
@@ -5,8 +5,9 @@
|
||||
<mat-label>Zeitraum</mat-label>
|
||||
<mat-select formControlName="time">
|
||||
<mat-option *ngFor="let time of times" [value]="time.key">{{
|
||||
time.value
|
||||
}}</mat-option>
|
||||
time.value
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
@@ -15,6 +15,7 @@ import {isEqual} from 'lodash';
|
||||
selector: 'app-filter',
|
||||
templateUrl: './filter.component.html',
|
||||
styleUrls: ['./filter.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class FilterComponent {
|
||||
@Input() public route = '/shows/';
|
||||
@@ -38,7 +39,7 @@ export class FilterComponent {
|
||||
private showService: ShowService,
|
||||
private userService: UserService,
|
||||
activatedRoute: ActivatedRoute,
|
||||
fb: UntypedFormBuilder
|
||||
fb: UntypedFormBuilder,
|
||||
) {
|
||||
this.filterFormGroup = fb.group({
|
||||
time: 1,
|
||||
@@ -63,7 +64,7 @@ export class FilterComponent {
|
||||
this.showService.list$().pipe(
|
||||
map(shows => {
|
||||
return shows.map(show => show.owner).filter(onlyUnique);
|
||||
})
|
||||
}),
|
||||
),
|
||||
this.userService.users$,
|
||||
]).pipe(
|
||||
@@ -76,7 +77,7 @@ export class FilterComponent {
|
||||
.sort(dynamicSort('value'));
|
||||
}),
|
||||
distinctUntilChanged(isEqual),
|
||||
map(_ => _ as {key: string; value: string}[])
|
||||
map(_ => _ as {key: string; value: string}[]),
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
<div class="list-item" *ngIf="show">
|
||||
<div *ngIf="show" class="list-item">
|
||||
<div>{{ show.date.toDate() | date: "dd.MM.yyyy" }}</div>
|
||||
<div><app-user-name [userId]="show.owner"></app-user-name></div>
|
||||
<div>
|
||||
<app-user-name [userId]="show.owner"></app-user-name>
|
||||
</div>
|
||||
<div>{{ show.showType | showType }}</div>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('ListItemComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [ListItemComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -5,6 +5,7 @@ import {Show} from '../../services/show';
|
||||
selector: 'app-list-item',
|
||||
templateUrl: './list-item.component.html',
|
||||
styleUrls: ['./list-item.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class ListItemComponent {
|
||||
@Input() public show: Show | null = null;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div>
|
||||
<!-- <app-list-header *appRole="['leader']"></app-list-header>-->
|
||||
<!-- <app-list-header *appRole="['leader']"></app-list-header>-->
|
||||
<app-list-header *appRole="['leader']">
|
||||
<app-filter *ngIf="shows$ | async as shows" [shows]="publicShows$ | async"></app-filter>
|
||||
</app-list-header>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('ListComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [ListComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -12,6 +12,7 @@ import {map} from 'rxjs/operators';
|
||||
templateUrl: './list.component.html',
|
||||
styleUrls: ['./list.component.less'],
|
||||
animations: [fade],
|
||||
standalone: false,
|
||||
})
|
||||
export class ListComponent {
|
||||
public shows$ = this.showService.list$();
|
||||
@@ -21,13 +22,13 @@ export class ListComponent {
|
||||
const filterValues = params as FilterValues;
|
||||
if (!filterValues?.time) return 1;
|
||||
return +filterValues.time;
|
||||
})
|
||||
}),
|
||||
);
|
||||
public owner$ = this.activatedRoute.queryParams.pipe(
|
||||
map(params => {
|
||||
const filterValues = params as FilterValues;
|
||||
return filterValues?.owner;
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
public publicShows$ = combineLatest([this.shows$, this.lastMonths$, this.owner$]).pipe(
|
||||
@@ -38,14 +39,15 @@ export class ListComponent {
|
||||
d.setMonth(d.getMonth() - lastMonths);
|
||||
return f.published && f.date.toDate() >= d;
|
||||
})
|
||||
.filter(show => !owner || show.owner === owner)
|
||||
)
|
||||
.filter(show => !owner || show.owner === owner),
|
||||
),
|
||||
);
|
||||
|
||||
public constructor(
|
||||
private showService: ShowService,
|
||||
private activatedRoute: ActivatedRoute
|
||||
) {}
|
||||
private activatedRoute: ActivatedRoute,
|
||||
) {
|
||||
}
|
||||
|
||||
public trackBy = (index: number, show: unknown) => (show as Show).id;
|
||||
}
|
||||
|
||||
@@ -6,19 +6,21 @@
|
||||
<mat-select formControlName="showType">
|
||||
<mat-optgroup label="öffentlich">
|
||||
<mat-option *ngFor="let key of showTypePublic" [value]="key">{{
|
||||
key | showType
|
||||
}}</mat-option>
|
||||
key | showType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-optgroup>
|
||||
<mat-optgroup label="privat">
|
||||
<mat-option *ngFor="let key of showTypePrivate" [value]="key">{{
|
||||
key | showType
|
||||
}}</mat-option>
|
||||
key | showType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-optgroup>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Datum</mat-label>
|
||||
<input [matDatepicker]="picker" formControlName="date" matInput/>
|
||||
<input [matDatepicker]="picker" formControlName="date" matInput />
|
||||
<mat-datepicker-toggle [for]="picker" matSuffix></mat-datepicker-toggle>
|
||||
<mat-datepicker #picker touchUi></mat-datepicker>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('NewComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [NewComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -11,6 +11,7 @@ import {faSave} from '@fortawesome/free-solid-svg-icons';
|
||||
selector: 'app-new',
|
||||
templateUrl: './new.component.html',
|
||||
styleUrls: ['./new.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class NewComponent implements OnInit {
|
||||
public shows$: Observable<Show[]>;
|
||||
@@ -25,7 +26,7 @@ export class NewComponent implements OnInit {
|
||||
public constructor(
|
||||
private showService: ShowService,
|
||||
showDataService: ShowDataService,
|
||||
private router: Router
|
||||
private router: Router,
|
||||
) {
|
||||
this.shows$ = showDataService.list$;
|
||||
}
|
||||
|
||||
@@ -33,8 +33,9 @@ export class DocxService {
|
||||
private songService: SongService,
|
||||
private textRenderingService: TextRenderingService,
|
||||
private userService: UserService,
|
||||
private configService: ConfigService
|
||||
) {}
|
||||
private configService: ConfigService,
|
||||
) {
|
||||
}
|
||||
|
||||
public async create(showId: string, options: DownloadOptions = {}): Promise<void> {
|
||||
const data = await this.prepareData(showId);
|
||||
@@ -94,7 +95,10 @@ export class DocxService {
|
||||
});
|
||||
}
|
||||
|
||||
private renderSongs(songs: {showSong: ShowSong; sections: Section[]}[], options: DownloadOptions, config: Config): Paragraph[] {
|
||||
private renderSongs(songs: {
|
||||
showSong: ShowSong;
|
||||
sections: Section[]
|
||||
}[], options: DownloadOptions, config: Config): Paragraph[] {
|
||||
return songs.reduce((p: Paragraph[], song) => [...p, ...this.renderSong(song.showSong, song.showSong, song.sections, options, config)], []);
|
||||
}
|
||||
|
||||
@@ -199,7 +203,10 @@ export class DocxService {
|
||||
sections,
|
||||
};
|
||||
});
|
||||
const songsLoaded = (await Promise.all(songsAsync)).filter(_ => !!_).map(_ => _ as {showSong: ShowSong; sections: Section[]});
|
||||
const songsLoaded = (await Promise.all(songsAsync)).filter(_ => !!_).map(_ => _ as {
|
||||
showSong: ShowSong;
|
||||
sections: Section[]
|
||||
});
|
||||
const songs = show.order.map(_ => songsLoaded.filter(f => f.showSong.id === _)[0]);
|
||||
return {songs, show, user, config};
|
||||
}
|
||||
|
||||
@@ -8,6 +8,7 @@ import {map} from 'rxjs/operators';
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class ShowDataService {
|
||||
public list$ = new BehaviorSubject<Show[]>([]);
|
||||
private collection = 'shows';
|
||||
|
||||
public constructor(private dbService: DbService) {
|
||||
@@ -15,7 +16,7 @@ export class ShowDataService {
|
||||
}
|
||||
|
||||
public listRaw$ = () => this.dbService.col$<Show>(this.collection);
|
||||
public list$ = new BehaviorSubject<Show[]>([]);
|
||||
|
||||
public read$ = (showId: string): Observable<Show | null> => this.list$.pipe(map(_ => _.find(s => s.id === showId) || null));
|
||||
|
||||
// public list$ = (): Observable<Show[]> => this.dbService.col$(this.collection);
|
||||
|
||||
@@ -11,7 +11,8 @@ export class ShowSongDataService {
|
||||
private collection = 'shows';
|
||||
private subCollection = 'songs';
|
||||
|
||||
public constructor(private dbService: DbService) {}
|
||||
public constructor(private dbService: DbService) {
|
||||
}
|
||||
|
||||
public list$ = (showId: string, queryFn?: QueryFn): Observable<ShowSong[]> => this.dbService.col$(`${this.collection}/${showId}/${this.subCollection}`, queryFn);
|
||||
public read$ = (showId: string, songId: string): Observable<ShowSong | null> => this.dbService.doc$(`${this.collection}/${showId}/${this.subCollection}/${songId}`);
|
||||
|
||||
@@ -14,8 +14,9 @@ export class ShowSongService {
|
||||
private showSongDataService: ShowSongDataService,
|
||||
private songDataService: SongDataService,
|
||||
private userService: UserService,
|
||||
private showService: ShowService
|
||||
) {}
|
||||
private showService: ShowService,
|
||||
) {
|
||||
}
|
||||
|
||||
public async new$(showId: string, songId: string, addedLive = false): Promise<string | null> {
|
||||
const song = await firstValueFrom(this.songDataService.read$(songId));
|
||||
|
||||
@@ -9,7 +9,7 @@ describe('ShowService', () => {
|
||||
() =>
|
||||
void TestBed.configureTestingModule({
|
||||
providers: [{provide: ShowDataService, useValue: mockShowDataService}],
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
ShowService.SHOW_TYPE_PUBLIC.forEach(type => {
|
||||
|
||||
@@ -25,14 +25,14 @@ export class ShowService {
|
||||
return this.userService.user$.pipe(
|
||||
switchMap(
|
||||
() => this.showDataService.list$,
|
||||
(user: User | null, shows: Show[]) => ({user, shows})
|
||||
(user: User | null, shows: Show[]) => ({user, shows}),
|
||||
),
|
||||
map(s =>
|
||||
s.shows
|
||||
.sort((a, b) => a.date.toMillis() - b.date.toMillis())
|
||||
.filter(_ => !_.archived)
|
||||
.filter(show => show.published || (show.owner === s.user?.id && !publishedOnly))
|
||||
)
|
||||
.filter(show => show.published || (show.owner === s.user?.id && !publishedOnly)),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -14,28 +14,28 @@
|
||||
<mat-checkbox *ngIf="!useSwiper" [(ngModel)]="showText">Text anzeigen</mat-checkbox>
|
||||
</div>
|
||||
<div [class.floating]="useSwiper">
|
||||
<app-menu-button @fade (click)="onZoomOut()" [icon]="faZoomOut" class="btn-delete btn-icon"
|
||||
<app-menu-button (click)="onZoomOut()" @fade [icon]="faZoomOut" class="btn-delete btn-icon"
|
||||
matTooltip="Verkleinern"></app-menu-button>
|
||||
<app-menu-button @fade (click)="onZoomIn()" [icon]="faZoomIn" class="btn-delete btn-icon"
|
||||
<app-menu-button (click)="onZoomIn()" @fade [icon]="faZoomIn" class="btn-delete btn-icon"
|
||||
matTooltip="Vergrößern"></app-menu-button>
|
||||
<app-menu-button (click)="useSwiper=!useSwiper;fullscreen(useSwiper)" @fade
|
||||
[icon]="useSwiper ? faFileLines : faFile" class="btn-delete btn-icon"
|
||||
matTooltip="Swiper umschalten"></app-menu-button>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="showSongs && !useSwiper" [cdkDropListDisabled]="show.published || showText" cdkDropList
|
||||
class="song-list"
|
||||
<div (cdkDropListDropped)="drop($event, show)" *ngIf="showSongs && !useSwiper" [cdkDropListDisabled]="show.published || showText"
|
||||
[style.cursor]="!(show.published || showText) ? 'drag' : 'inherit'"
|
||||
[style.font-size]="textSize + 'em'"
|
||||
(cdkDropListDropped)="drop($event, show)">
|
||||
<div *ngFor="let song of orderedShowSongs(show); let i = index; trackBy: trackBy" class="song-row" cdkDrag>
|
||||
cdkDropList
|
||||
class="song-list">
|
||||
<div *ngFor="let song of orderedShowSongs(show); let i = index; trackBy: trackBy" cdkDrag class="song-row">
|
||||
<app-song
|
||||
[showSong]="song"
|
||||
[showId]="showId"
|
||||
[showText]="showText"
|
||||
[show]="show"
|
||||
[fullscreen]="useSwiper"
|
||||
[index]="i"
|
||||
[showId]="showId"
|
||||
[showSong]="song"
|
||||
[showText]="showText"
|
||||
[show]="show"
|
||||
></app-song>
|
||||
</div>
|
||||
</div>
|
||||
@@ -57,8 +57,8 @@
|
||||
|
||||
<app-add-song
|
||||
*ngIf="songs && !show.published && !useSwiper"
|
||||
[show]="show"
|
||||
[showSongs]="showSongs"
|
||||
[show]="show"
|
||||
[songs]="songs"
|
||||
></app-add-song>
|
||||
|
||||
@@ -80,7 +80,7 @@
|
||||
<app-button (click)="onShare(show)" *ngIf="show.published" [icon]="faShare">
|
||||
Teilen
|
||||
</app-button>
|
||||
<app-button (click)="onChange(show.id)" [icon]="faSliders" *ngIf="!show.published">
|
||||
<app-button (click)="onChange(show.id)" *ngIf="!show.published" [icon]="faSliders">
|
||||
Ändern
|
||||
</app-button>
|
||||
</ng-container>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('ShowComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [ShowComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -37,6 +37,7 @@ import {ShareDialogComponent} from '../dialog/share-dialog/share-dialog.componen
|
||||
templateUrl: './show.component.html',
|
||||
styleUrls: ['./show.component.less'],
|
||||
animations: [fade],
|
||||
standalone: false,
|
||||
})
|
||||
export class ShowComponent implements OnInit, OnDestroy {
|
||||
public show$: Observable<Show | null> | null = null;
|
||||
@@ -56,8 +57,11 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
public faUsers = faUsers;
|
||||
public faZoomIn = faMagnifyingGlassPlus;
|
||||
public faZoomOut = faMagnifyingGlassMinus;
|
||||
private subs: Subscription[] = [];
|
||||
public useSwiper = false;
|
||||
public textSize = 1;
|
||||
public faFileLines = faFileLines;
|
||||
public faFile = faFile;
|
||||
private subs: Subscription[] = [];
|
||||
|
||||
public constructor(
|
||||
private activatedRoute: ActivatedRoute,
|
||||
@@ -68,15 +72,16 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
private router: Router,
|
||||
private cRef: ChangeDetectorRef,
|
||||
public dialog: MatDialog,
|
||||
private guestShowService: GuestShowService
|
||||
) {}
|
||||
private guestShowService: GuestShowService,
|
||||
) {
|
||||
}
|
||||
|
||||
public ngOnInit(): void {
|
||||
this.show$ = this.activatedRoute.params.pipe(
|
||||
map(param => param as {showId: string}),
|
||||
map(param => param.showId),
|
||||
tap((_: string) => (this.showId = _)),
|
||||
switchMap((showId: string) => this.showService.read$(showId))
|
||||
switchMap((showId: string) => this.showService.read$(showId)),
|
||||
);
|
||||
this.subs.push(
|
||||
this.activatedRoute.params
|
||||
@@ -84,7 +89,7 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
map(param => param as {showId: string}),
|
||||
map(param => param.showId),
|
||||
switchMap(showId => this.showSongService.list$(showId)),
|
||||
filter(_ => !!_ && _.length > 0)
|
||||
filter(_ => !!_ && _.length > 0),
|
||||
)
|
||||
.subscribe(_ => {
|
||||
this.showSongs = _;
|
||||
@@ -96,7 +101,7 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
.subscribe(_ => {
|
||||
this.songs = _;
|
||||
this.cRef.markForCheck();
|
||||
})
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -104,8 +109,6 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
this.subs.forEach(_ => _.unsubscribe());
|
||||
}
|
||||
|
||||
public textSize = 1;
|
||||
|
||||
public onZoomIn() {
|
||||
this.textSize += 0.1;
|
||||
}
|
||||
@@ -176,9 +179,6 @@ export class ShowComponent implements OnInit, OnDestroy {
|
||||
await this.router.navigateByUrl('/shows/' + showId + '/edit');
|
||||
}
|
||||
|
||||
public faFileLines = faFileLines;
|
||||
public faFile = faFile;
|
||||
|
||||
@HostListener('document:keydown', ['$event'])
|
||||
public handleKeyboardEvent(event: KeyboardEvent) {
|
||||
const swiperEl = document.querySelector('swiper-container') as unknown as Swiper;
|
||||
|
||||
@@ -23,11 +23,11 @@
|
||||
|
||||
<mat-form-field *ngIf="edit" appearance="outline">
|
||||
<mat-label>Songtext</mat-label>
|
||||
<textarea matTooltip="Tonart ändern"
|
||||
class="edit"
|
||||
[cdkTextareaAutosize]="true"
|
||||
<textarea [cdkTextareaAutosize]="true"
|
||||
[formControl]="editSongControl"
|
||||
class="edit"
|
||||
matInput
|
||||
matTooltip="Tonart ändern"
|
||||
></textarea>
|
||||
</mat-form-field>
|
||||
<div *ngIf="edit">Es wird nur der Liedtext für dieser Veranstaltung geändert.</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('SongComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [SongComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -14,6 +14,7 @@ import {MatSelect} from '@angular/material/select';
|
||||
templateUrl: './song.component.html',
|
||||
styleUrls: ['./song.component.less'],
|
||||
animations: [fade],
|
||||
standalone: false,
|
||||
})
|
||||
export class SongComponent implements OnInit {
|
||||
@Input() public show: Show | null = null;
|
||||
@@ -21,9 +22,6 @@ export class SongComponent implements OnInit {
|
||||
@Input() public showText: boolean | null = null;
|
||||
@Input() public index = -1;
|
||||
@Input() public fullscreen = false;
|
||||
|
||||
@ViewChild('option') private keyOptions: MatSelect;
|
||||
|
||||
public keys: string[] = [];
|
||||
public faDelete = faTrash;
|
||||
public faEdit = faPenToSquare;
|
||||
@@ -33,8 +31,10 @@ export class SongComponent implements OnInit {
|
||||
public iSong: ShowSong | null = null;
|
||||
public edit = false;
|
||||
public editSongControl = new UntypedFormControl();
|
||||
@ViewChild('option') private keyOptions: MatSelect;
|
||||
|
||||
public constructor(private showSongService: ShowSongService) {}
|
||||
public constructor(private showSongService: ShowSongService) {
|
||||
}
|
||||
|
||||
@Input()
|
||||
public set showSong(song: ShowSong) {
|
||||
|
||||
@@ -29,4 +29,5 @@ const routes: Routes = [
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class ShowsRoutingModule {}
|
||||
export class ShowsRoutingModule {
|
||||
}
|
||||
|
||||
@@ -72,4 +72,5 @@ import {MatDialogModule} from '@angular/material/dialog';
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
})
|
||||
export class ShowsModule {}
|
||||
export class ShowsModule {
|
||||
}
|
||||
|
||||
@@ -8,7 +8,8 @@ import {DbService} from '../../../services/db.service';
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class FileDataService {
|
||||
public constructor(private db: DbService) {}
|
||||
public constructor(private db: DbService) {
|
||||
}
|
||||
|
||||
public async set(songId: string, file: FileServer): Promise<string> {
|
||||
const songRef = this.db.doc('songs/' + songId);
|
||||
|
||||
@@ -7,7 +7,8 @@ import {FileDataService} from './file-data.service';
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class FileService {
|
||||
public constructor(private storage: AngularFireStorage, private fileDataService: FileDataService) {}
|
||||
public constructor(private storage: AngularFireStorage, private fileDataService: FileDataService) {
|
||||
}
|
||||
|
||||
public getDownloadUrl(path: string): Observable<string> {
|
||||
const ref = this.storage.ref(path);
|
||||
|
||||
@@ -19,7 +19,7 @@ describe('SongDataService', () => {
|
||||
() =>
|
||||
void TestBed.configureTestingModule({
|
||||
providers: [{provide: AngularFirestore, useValue: mockAngularFirestore}],
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
it('should be created', () => {
|
||||
@@ -34,6 +34,6 @@ describe('SongDataService', () => {
|
||||
service.list$().subscribe(s => {
|
||||
void expect(s[0].title).toEqual('title1');
|
||||
});
|
||||
})
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
@@ -8,14 +8,14 @@ import {map} from 'rxjs/operators';
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class SongDataService {
|
||||
public list$ = new BehaviorSubject<Song[]>([]);
|
||||
private collection = 'songs';
|
||||
|
||||
public constructor(private dbService: DbService) {
|
||||
this.dbService.col$<Song>(this.collection).subscribe(_ => this.list$.next(_));
|
||||
}
|
||||
|
||||
public list$ = new BehaviorSubject<Song[]>([]);
|
||||
// public list$ = (): Observable<Song[]> => this.dbService.col$(this.collection);
|
||||
|
||||
//public read$ = (songId: string): Observable<Song | null> => this.dbService.doc$(this.collection + '/' + songId);
|
||||
public read$ = (songId: string): Observable<Song | null> => this.list$.pipe(map(_ => _.find(s => s.id === songId) || null));
|
||||
public update$ = async (songId: string, data: Partial<Song>): Promise<void> => await this.dbService.doc(this.collection + '/' + songId).update(data);
|
||||
|
||||
@@ -9,7 +9,8 @@ import {filter} from 'rxjs/operators';
|
||||
providedIn: 'root',
|
||||
})
|
||||
export class SongListResolver {
|
||||
public constructor(private songService: SongService) {}
|
||||
public constructor(private songService: SongService) {
|
||||
}
|
||||
|
||||
public resolve(): Observable<Song[]> {
|
||||
return this.songService.list$().pipe(filter(_ => _.length > 0));
|
||||
|
||||
@@ -15,7 +15,7 @@ describe('SongService', () => {
|
||||
() =>
|
||||
void TestBed.configureTestingModule({
|
||||
providers: [{provide: SongDataService, useValue: mockSongDataService}],
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
it('should be created', () => {
|
||||
@@ -30,6 +30,6 @@ describe('SongService', () => {
|
||||
service.list$().subscribe(s => {
|
||||
void expect(s[0].title).toEqual('title1');
|
||||
});
|
||||
})
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
@@ -27,7 +27,7 @@ export class SongService {
|
||||
|
||||
public constructor(
|
||||
private songDataService: SongDataService,
|
||||
private userService: UserService
|
||||
private userService: UserService,
|
||||
) {
|
||||
// importCCLI = (songs: Song[]) => this.updateFromCLI(songs);
|
||||
}
|
||||
|
||||
@@ -13,7 +13,8 @@ import {Line} from './line';
|
||||
export class TextRenderingService {
|
||||
private regexSection = /(Strophe|Refrain|Bridge)/;
|
||||
|
||||
public constructor(private transposeService: TransposeService) {}
|
||||
public constructor(private transposeService: TransposeService) {
|
||||
}
|
||||
|
||||
public parse(text: string, transpose: TransposeMode | null): Section[] {
|
||||
if (!text) {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<div [formGroup]="filterFormGroup">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Titel oder Text</mat-label>
|
||||
<input formControlName="q" matInput/>
|
||||
<input formControlName="q" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<div class="third">
|
||||
@@ -10,8 +10,9 @@
|
||||
<mat-select formControlName="type">
|
||||
<mat-option [value]="null">- kein Filter -</mat-option>
|
||||
<mat-option *ngFor="let type of types" [value]="type">{{
|
||||
type | songType
|
||||
}}</mat-option>
|
||||
type | songType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -20,8 +21,9 @@
|
||||
<mat-select formControlName="key">
|
||||
<mat-option [value]="null">- kein Filter -</mat-option>
|
||||
<mat-option *ngFor="let key of keys" [value]="key">{{
|
||||
key | key
|
||||
}}</mat-option>
|
||||
key | key
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -30,8 +32,9 @@
|
||||
<mat-select formControlName="legalType">
|
||||
<mat-option [value]="null">- kein Filter -</mat-option>
|
||||
<mat-option *ngFor="let key of legalType" [value]="key">{{
|
||||
key | legalType
|
||||
}}</mat-option>
|
||||
key | legalType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -40,8 +43,9 @@
|
||||
<mat-select formControlName="flag">
|
||||
<mat-option [value]="null">- kein Filter -</mat-option>
|
||||
<mat-option *ngFor="let flag of getFlags()" [value]="flag">{{
|
||||
flag
|
||||
}}</mat-option>
|
||||
flag
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('FilterComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [FilterComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -10,6 +10,7 @@ import {KEYS} from '../../services/key.helper';
|
||||
selector: 'app-filter',
|
||||
templateUrl: './filter.component.html',
|
||||
styleUrls: ['./filter.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class FilterComponent {
|
||||
public filterFormGroup: UntypedFormGroup;
|
||||
|
||||
@@ -9,11 +9,19 @@
|
||||
<div>{{ song.title }}</div>
|
||||
<div>
|
||||
<ng-container *appRole="['contributor']">
|
||||
<div *ngIf="song.status === 'draft'" class="warning"><fa-icon [icon]="faDraft"></fa-icon></div>
|
||||
<div *ngIf="song.status === 'set'" class="neutral"><fa-icon [icon]="faDraft"></fa-icon></div>
|
||||
<div *ngIf="song.status === 'final'" class="success"><fa-icon [icon]="faFinal"></fa-icon></div>
|
||||
<div *ngIf="song.status === 'draft'" class="warning">
|
||||
<fa-icon [icon]="faDraft"></fa-icon>
|
||||
</div>
|
||||
<div *ngIf="song.status === 'set'" class="neutral">
|
||||
<fa-icon [icon]="faDraft"></fa-icon>
|
||||
</div>
|
||||
<div *ngIf="song.status === 'final'" class="success">
|
||||
<fa-icon [icon]="faFinal"></fa-icon>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div *ngIf="song.legalType === 'open'" class="warning" ><fa-icon [icon]="faLegal"></fa-icon></div>
|
||||
<div *ngIf="song.legalType === 'open'" class="warning">
|
||||
<fa-icon [icon]="faLegal"></fa-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div>{{ song.key }}</div>
|
||||
</div>
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
}
|
||||
|
||||
.neutral, .warning, .success {
|
||||
width: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.neutral {
|
||||
|
||||
@@ -22,7 +22,7 @@ describe('SongListComponent', () => {
|
||||
providers: [{provide: SongService, useValue: mockSongService}],
|
||||
schemas: [NO_ERRORS_SCHEMA],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -16,13 +16,15 @@ import {faBalanceScaleRight, faCheck, faPencilRuler} from '@fortawesome/free-sol
|
||||
styleUrls: ['./song-list.component.less'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
animations: [fade],
|
||||
standalone: false,
|
||||
})
|
||||
export class SongListComponent implements OnInit, OnDestroy {
|
||||
public anyFilterActive = false;
|
||||
public songs$: Observable<Song[]> | null = combineLatest([
|
||||
this.activatedRoute.queryParams.pipe(map(_ => _ as FilterValues)),
|
||||
this.activatedRoute.data.pipe(
|
||||
map(data => data.songList as Song[]),
|
||||
map(songs => songs.sort((a, b) => a.number - b.number))
|
||||
map(songs => songs.sort((a, b) => a.number - b.number)),
|
||||
),
|
||||
]).pipe(
|
||||
map(_ => {
|
||||
@@ -30,14 +32,14 @@ export class SongListComponent implements OnInit, OnDestroy {
|
||||
const filter = _[0];
|
||||
this.anyFilterActive = this.checkIfFilterActive(filter);
|
||||
return songs.filter(song => this.filter(song, filter)).sort((a, b) => a.title?.localeCompare(b.title));
|
||||
})
|
||||
}),
|
||||
);
|
||||
public anyFilterActive = false;
|
||||
public faLegal = faBalanceScaleRight;
|
||||
public faDraft = faPencilRuler;
|
||||
public faFinal = faCheck;
|
||||
|
||||
public constructor(private songService: SongService, private activatedRoute: ActivatedRoute, private scrollService: ScrollService) {}
|
||||
public constructor(private songService: SongService, private activatedRoute: ActivatedRoute, private scrollService: ScrollService) {
|
||||
}
|
||||
|
||||
public ngOnInit(): void {
|
||||
setTimeout(() => this.scrollService.restoreScrollPositionFor('songlist'), 100);
|
||||
@@ -48,6 +50,8 @@ export class SongListComponent implements OnInit, OnDestroy {
|
||||
this.scrollService.storeScrollPositionFor('songlist');
|
||||
}
|
||||
|
||||
public trackBy = (index: number, show: Song) => show.id;
|
||||
|
||||
private filter(song: Song, filter: FilterValues): boolean {
|
||||
let baseFilter = filterSong(song, filter.q);
|
||||
baseFilter = baseFilter && (!filter.type || filter.type === song.type);
|
||||
@@ -74,6 +78,4 @@ export class SongListComponent implements OnInit, OnDestroy {
|
||||
|
||||
return flagStrings.indexOf(flag) !== -1;
|
||||
}
|
||||
|
||||
public trackBy = (index: number, show: Song) => show.id;
|
||||
}
|
||||
|
||||
@@ -3,7 +3,9 @@ import {CommonModule} from '@angular/common';
|
||||
import {SongListComponent} from './song-list.component';
|
||||
import {CardModule} from '../../../widget-modules/components/card/card.module';
|
||||
import {RouterModule} from '@angular/router';
|
||||
import {LegalTypeTranslatorModule} from '../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
|
||||
import {
|
||||
LegalTypeTranslatorModule,
|
||||
} from '../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
|
||||
import {ListHeaderModule} from '../../../widget-modules/components/list-header/list-header.module';
|
||||
import {MatFormFieldModule} from '@angular/material/form-field';
|
||||
import {MatInputModule} from '@angular/material/input';
|
||||
@@ -37,4 +39,5 @@ import {KeyTranslatorModule} from '../../../widget-modules/pipes/key-translator/
|
||||
KeyTranslatorModule,
|
||||
],
|
||||
})
|
||||
export class SongListModule {}
|
||||
export class SongListModule {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
</div>
|
||||
<div class="upload">
|
||||
<label>
|
||||
<input (change)="detectFiles($event)" type="file"/>
|
||||
<input (change)="detectFiles($event)" type="file" />
|
||||
</label>
|
||||
|
||||
<button
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('EditFileComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [EditFileComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -11,6 +11,7 @@ import {File} from '../../../services/file';
|
||||
selector: 'app-edit-file',
|
||||
templateUrl: './edit-file.component.html',
|
||||
styleUrls: ['./edit-file.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class EditFileComponent {
|
||||
public selectedFiles: FileList | null = null;
|
||||
@@ -22,7 +23,7 @@ export class EditFileComponent {
|
||||
this.activatedRoute.params
|
||||
.pipe(
|
||||
map(param => param as {songId: string}),
|
||||
map(param => param.songId)
|
||||
map(param => param.songId),
|
||||
)
|
||||
.subscribe(songId => {
|
||||
this.songId = songId;
|
||||
@@ -31,7 +32,7 @@ export class EditFileComponent {
|
||||
this.files$ = this.activatedRoute.params.pipe(
|
||||
map(param => param as {songId: string}),
|
||||
map(param => param.songId),
|
||||
switchMap(songId => this.fileService.read$(songId))
|
||||
switchMap(songId => this.fileService.read$(songId)),
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('FileComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [FileComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -8,6 +8,7 @@ import {FileService} from '../../../../services/file.service';
|
||||
selector: 'app-file',
|
||||
templateUrl: './file.component.html',
|
||||
styleUrls: ['./file.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class FileComponent {
|
||||
public url$: Observable<string> | null = null;
|
||||
@@ -17,7 +18,8 @@ export class FileComponent {
|
||||
private fileId: string | null = null;
|
||||
private path: string | null = null;
|
||||
|
||||
public constructor(private fileService: FileService) {}
|
||||
public constructor(private fileService: FileService) {
|
||||
}
|
||||
|
||||
@Input()
|
||||
public set file(file: File) {
|
||||
|
||||
@@ -11,7 +11,7 @@ export class EditSongGuard {
|
||||
component: EditComponent,
|
||||
currentRoute: ActivatedRouteSnapshot,
|
||||
currentState: RouterStateSnapshot,
|
||||
nextState: RouterStateSnapshot
|
||||
nextState: RouterStateSnapshot,
|
||||
): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
|
||||
return component.editSongComponent ? component.editSongComponent.askForSave(nextState) : true;
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<form [formGroup]="form" class="form">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Titel</mat-label>
|
||||
<input formControlName="title" matInput/>
|
||||
<input formControlName="title" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<div class="fourth">
|
||||
@@ -10,28 +10,31 @@
|
||||
<mat-label>Typ</mat-label>
|
||||
<mat-select formControlName="type">
|
||||
<mat-option *ngFor="let type of types" [value]="type">{{
|
||||
type | songType
|
||||
}}</mat-option>
|
||||
type | songType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Tonart</mat-label>
|
||||
<mat-select formControlName="key">
|
||||
<mat-option *ngFor="let key of keys" [value]="key">{{
|
||||
key | key
|
||||
}}</mat-option>
|
||||
key | key
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Tempo</mat-label>
|
||||
<input formControlName="tempo" matInput/>
|
||||
<input formControlName="tempo" matInput />
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Status</mat-label>
|
||||
<mat-select formControlName="status">
|
||||
<mat-option *ngFor="let status of status" [value]="status">{{
|
||||
status | status
|
||||
}}</mat-option>
|
||||
status | status
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
@@ -119,8 +122,9 @@
|
||||
<mat-label>Rechtlicher Status</mat-label>
|
||||
<mat-select formControlName="legalType">
|
||||
<mat-option *ngFor="let key of legalType" [value]="key">{{
|
||||
key | legalType
|
||||
}}</mat-option>
|
||||
key | legalType
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -128,14 +132,15 @@
|
||||
<mat-label>Rechteinhaber</mat-label>
|
||||
<mat-select formControlName="legalOwner">
|
||||
<mat-option *ngFor="let key of legalOwner" [value]="key">{{
|
||||
key | legalOwner
|
||||
}}</mat-option>
|
||||
key | legalOwner
|
||||
}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Rechteinhaber ID (z.B. CCLI Liednummer)</mat-label>
|
||||
<input formControlName="legalOwnerId" matInput/>
|
||||
<input formControlName="legalOwnerId" matInput />
|
||||
<a
|
||||
*ngIf="form.value.legalOwner === 'CCLI'"
|
||||
class="link-ccli"
|
||||
@@ -153,22 +158,22 @@
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Künstler</mat-label>
|
||||
<input formControlName="artist" matInput/>
|
||||
<input formControlName="artist" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Verlag / Copyright</mat-label>
|
||||
<input formControlName="label" matInput/>
|
||||
<input formControlName="label" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Nutzungsbedingungen</mat-label>
|
||||
<input formControlName="termsOfUse" matInput/>
|
||||
<input formControlName="termsOfUse" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>abweichende Quelle</mat-label>
|
||||
<input formControlName="origin" matInput/>
|
||||
<input formControlName="origin" matInput />
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('EditSongComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [EditSongComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -16,6 +16,7 @@ import {SaveDialogComponent} from './save-dialog/save-dialog.component';
|
||||
selector: 'app-edit-song',
|
||||
templateUrl: './edit-song.component.html',
|
||||
styleUrls: ['./edit-song.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class EditSongComponent implements OnInit {
|
||||
public song: Song | null = null;
|
||||
@@ -37,8 +38,9 @@ export class EditSongComponent implements OnInit {
|
||||
private songService: SongService,
|
||||
private editService: EditService,
|
||||
private router: Router,
|
||||
public dialog: MatDialog
|
||||
) {}
|
||||
public dialog: MatDialog,
|
||||
) {
|
||||
}
|
||||
|
||||
public ngOnInit(): void {
|
||||
this.activatedRoute.params
|
||||
@@ -46,7 +48,7 @@ export class EditSongComponent implements OnInit {
|
||||
map(param => param as {songId: string}),
|
||||
map(param => param.songId),
|
||||
switchMap(songId => this.songService.read$(songId)),
|
||||
first()
|
||||
first(),
|
||||
)
|
||||
.subscribe(song => {
|
||||
this.song = song;
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('SaveDialogComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [SaveDialogComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -4,5 +4,7 @@ import {Component} from '@angular/core';
|
||||
selector: 'app-save-dialog',
|
||||
templateUrl: './save-dialog.component.html',
|
||||
styleUrls: ['./save-dialog.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class SaveDialogComponent {}
|
||||
export class SaveDialogComponent {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('EditComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [EditComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -5,6 +5,7 @@ import {EditSongComponent} from './edit-song/edit-song.component';
|
||||
selector: 'app-edit',
|
||||
templateUrl: './edit.component.html',
|
||||
styleUrls: ['./edit.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class EditComponent {
|
||||
@ViewChild(EditSongComponent) public editSongComponent: EditSongComponent | null = null;
|
||||
|
||||
@@ -2,7 +2,9 @@ import {NgModule} from '@angular/core';
|
||||
import {CommonModule} from '@angular/common';
|
||||
import {EditComponent} from './edit.component';
|
||||
import {CardModule} from '../../../../widget-modules/components/card/card.module';
|
||||
import {SongTypeTranslaterModule} from '../../../../widget-modules/pipes/song-type-translater/song-type-translater.module';
|
||||
import {
|
||||
SongTypeTranslaterModule,
|
||||
} from '../../../../widget-modules/pipes/song-type-translater/song-type-translater.module';
|
||||
import {ReactiveFormsModule} from '@angular/forms';
|
||||
import {MatInputModule} from '@angular/material/input';
|
||||
import {MatCheckboxModule} from '@angular/material/checkbox';
|
||||
@@ -14,8 +16,12 @@ import {EditSongComponent} from './edit-song/edit-song.component';
|
||||
import {EditFileComponent} from './edit-file/edit-file.component';
|
||||
import {MatIconModule} from '@angular/material/icon';
|
||||
import {FileComponent} from './edit-file/file/file.component';
|
||||
import {LegalOwnerTranslatorModule} from '../../../../widget-modules/pipes/legal-owner-translator/legal-owner-translator.module';
|
||||
import {LegalTypeTranslatorModule} from '../../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
|
||||
import {
|
||||
LegalOwnerTranslatorModule,
|
||||
} from '../../../../widget-modules/pipes/legal-owner-translator/legal-owner-translator.module';
|
||||
import {
|
||||
LegalTypeTranslatorModule,
|
||||
} from '../../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
|
||||
import {KeyTranslatorModule} from '../../../../widget-modules/pipes/key-translator/key-translator.module';
|
||||
import {MatChipsModule} from '@angular/material/chips';
|
||||
import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
|
||||
@@ -57,4 +63,5 @@ import {SongTextModule} from '../../../../widget-modules/components/song-text/so
|
||||
SongTextModule,
|
||||
],
|
||||
})
|
||||
export class EditModule {}
|
||||
export class EditModule {
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('HistoryComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [HistoryComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -8,11 +8,13 @@ import {Song} from '../../../services/song';
|
||||
selector: 'app-history',
|
||||
templateUrl: './history.component.html',
|
||||
styleUrls: ['./history.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class HistoryComponent implements OnInit {
|
||||
public song: Song | null = null;
|
||||
|
||||
public constructor(private activatedRoute: ActivatedRoute, private songService: SongService) {}
|
||||
public constructor(private activatedRoute: ActivatedRoute, private songService: SongService) {
|
||||
}
|
||||
|
||||
public ngOnInit(): void {
|
||||
this.activatedRoute.params
|
||||
@@ -20,7 +22,7 @@ export class HistoryComponent implements OnInit {
|
||||
map(param => param as {songId: string}),
|
||||
map(param => param.songId),
|
||||
switchMap(songId => this.songService.read$(songId)),
|
||||
first()
|
||||
first(),
|
||||
)
|
||||
.subscribe(song => {
|
||||
this.song = song;
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('FileComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [FileComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -7,12 +7,14 @@ import {Observable} from 'rxjs';
|
||||
selector: 'app-file',
|
||||
templateUrl: './file.component.html',
|
||||
styleUrls: ['./file.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class FileComponent {
|
||||
public url$: Observable<string> | null = null;
|
||||
public name = '';
|
||||
|
||||
public constructor(private storage: AngularFireStorage) {}
|
||||
public constructor(private storage: AngularFireStorage) {
|
||||
}
|
||||
|
||||
@Input()
|
||||
public set file(file: File) {
|
||||
|
||||
@@ -2,11 +2,11 @@
|
||||
<div [formGroup]="form" class="split">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Nummer</mat-label>
|
||||
<input formControlName="number" matInput/>
|
||||
<input formControlName="number" matInput />
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Titel</mat-label>
|
||||
<input autofocus formControlName="title" matInput/>
|
||||
<input autofocus formControlName="title" matInput />
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ describe('NewComponent', () => {
|
||||
void TestBed.configureTestingModule({
|
||||
declarations: [NewComponent],
|
||||
}).compileComponents();
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
beforeEach(() => {
|
||||
|
||||
@@ -10,6 +10,7 @@ import {Subscription} from 'rxjs';
|
||||
selector: 'app-new',
|
||||
templateUrl: './new.component.html',
|
||||
styleUrls: ['./new.component.less'],
|
||||
standalone: false,
|
||||
})
|
||||
export class NewComponent implements OnInit, OnDestroy {
|
||||
public faSave = faSave;
|
||||
@@ -17,8 +18,10 @@ export class NewComponent implements OnInit, OnDestroy {
|
||||
number: new UntypedFormControl(null, Validators.required),
|
||||
title: new UntypedFormControl(null, Validators.required),
|
||||
});
|
||||
private subs: Subscription[] = [];
|
||||
|
||||
public constructor(private songService: SongService, private router: Router) {}
|
||||
public constructor(private songService: SongService, private router: Router) {
|
||||
}
|
||||
|
||||
public ngOnInit(): void {
|
||||
this.form.reset();
|
||||
@@ -27,11 +30,10 @@ export class NewComponent implements OnInit, OnDestroy {
|
||||
this.songService.list$().subscribe(songs => {
|
||||
const freeSongnumber = this.getFreeSongNumber(songs);
|
||||
this.form.controls.number.setValue(freeSongnumber);
|
||||
})
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
private subs: Subscription[] = [];
|
||||
public ngOnDestroy(): void {
|
||||
this.subs.forEach(_ => _.unsubscribe());
|
||||
}
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user