benjamin/wgenerator
1
0
Fork 0
Code Releases Activity

update tslint -> eslint

Browse Source
This commit is contained in:
smuddyx
2021-05-21 20:17:26 +02:00
parent 80260df71f
commit a195fafa6b
252 changed files with 3080 additions and 2420 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/modules/shows/list/list-item/list-item.component.html
View File

@@ -1,4 +1,4 @@
<div class="list-item">
<div>{{show.date.toDate()|date:'dd.MM.yyyy'}}</div>
<div>{{show.showType|showType}}</div>
<div>{{ show.date.toDate() | date: "dd.MM.yyyy" }}</div>
<div>{{ show.showType | showType }}</div>
</div>

13
src/app/modules/shows/list/list-item/list-item.component.spec.ts
View File

@@ -6,12 +6,13 @@ describe('ListItemComponent', () => {
let component: ListItemComponent;
let fixture: ComponentFixture<ListItemComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ListItemComponent]
beforeEach(
waitForAsync(() => {
void TestBed.configureTestingModule({
declarations: [ListItemComponent],
}).compileComponents();
})
.compileComponents();
}));
);
beforeEach(() => {
fixture = TestBed.createComponent(ListItemComponent);
@@ -20,6 +21,6 @@ describe('ListItemComponent', () => {
});
it('should create', () => {
expect(component).toBeTruthy();
void expect(component).toBeTruthy();
});
});

2
src/app/modules/shows/list/list-item/list-item.component.ts
View File

@@ -4,7 +4,7 @@ import {Show} from '../../services/show';
@Component({
selector: 'app-list-item',
templateUrl: './list-item.component.html',
styleUrls: ['./list-item.component.less']
styleUrls: ['./list-item.component.less'],
})
export class ListItemComponent {
@Input() public show: Show;

27
src/app/modules/shows/list/list.component.html
View File

@@ -2,15 +2,32 @@
<app-list-header></app-list-header>
<ng-container *ngIf="shows$ | async as shows">
<app-card *ngIf="getPrivateSongs(shows).length>0" [@fade] [padding]="false" heading="meine Veranstaltungen">
<app-list-item *ngFor="let show of getPrivateSongs(shows)" [routerLink]="show.id" [show]="show"></app-list-item>
<app-card
*ngIf="getPrivateSongs(shows).length > 0"
[@fade]
[padding]="false"
heading="meine Veranstaltungen"
>
<app-list-item
*ngFor="let show of getPrivateSongs(shows)"
[routerLink]="show.id"
[show]="show"
></app-list-item>
</app-card>
</ng-container>
<ng-container *ngIf="shows$ | async as shows">
<app-card *ngIf="getPublicShows(shows).length>0" [@fade] [padding]="false"
heading="veröffentlichte Veranstaltungen">
<app-list-item *ngFor="let show of getPublicShows(shows)" [routerLink]="show.id" [show]="show"></app-list-item>
<app-card
*ngIf="getPublicShows(shows).length > 0"
[@fade]
[padding]="false"
heading="veröffentlichte Veranstaltungen"
>
<app-list-item
*ngFor="let show of getPublicShows(shows)"
[routerLink]="show.id"
[show]="show"
></app-list-item>
</app-card>
</ng-container>
</div>

13
src/app/modules/shows/list/list.component.spec.ts
View File

@@ -6,12 +6,13 @@ describe('ListComponent', () => {
let component: ListComponent;
let fixture: ComponentFixture<ListComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ListComponent]
beforeEach(
waitForAsync(() => {
void TestBed.configureTestingModule({
declarations: [ListComponent],
}).compileComponents();
})
.compileComponents();
}));
);
beforeEach(() => {
fixture = TestBed.createComponent(ListComponent);
@@ -20,6 +21,6 @@ describe('ListComponent', () => {
});
it('should create', () => {
expect(component).toBeTruthy();
void expect(component).toBeTruthy();
});
});

5
src/app/modules/shows/list/list.component.ts
View File

@@ -8,12 +8,12 @@ import {ShowService} from '../services/show.service';
selector: 'app-list',
templateUrl: './list.component.html',
styleUrls: ['./list.component.less'],
animations: [fade]
animations: [fade],
})
export class ListComponent {
public shows$: Observable<Show[]>;
constructor(showService: ShowService) {
public constructor(showService: ShowService) {
this.shows$ = showService.list$();
}
@@ -24,5 +24,4 @@ export class ListComponent {
public getPrivateSongs(songs: Show[]): Show[] {
return songs.filter(_ => !_.published);
}
}

11
src/app/modules/shows/new/new.component.html
View File

@@ -1,21 +1,24 @@
<div>
<app-card closeLink="/shows" heading="Neue Veranstaltung">
<div [formGroup]="form" class="split">
<mat-form-field appearance="outline">
<mat-label>Art der Veranstaltung</mat-label>
<mat-select formControlName="showType">
<mat-optgroup label="öffentlich">
<mat-option *ngFor="let key of showTypePublic" [value]="key">{{key|showType}}</mat-option>
<mat-option *ngFor="let key of showTypePublic" [value]="key">{{
key | showType
}}</mat-option>
</mat-optgroup>
<mat-optgroup label="privat">
<mat-option *ngFor="let key of showTypePrivate" [value]="key">{{key|showType}}</mat-option>
<mat-option *ngFor="let key of showTypePrivate" [value]="key">{{
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>

13
src/app/modules/shows/new/new.component.spec.ts
View File

@@ -6,12 +6,13 @@ describe('NewComponent', () => {
let component: NewComponent;
let fixture: ComponentFixture<NewComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [NewComponent]
beforeEach(
waitForAsync(() => {
void TestBed.configureTestingModule({
declarations: [NewComponent],
}).compileComponents();
})
.compileComponents();
}));
);
beforeEach(() => {
fixture = TestBed.createComponent(NewComponent);
@@ -20,6 +21,6 @@ describe('NewComponent', () => {
});
it('should create', () => {
expect(component).toBeTruthy();
void expect(component).toBeTruthy();
});
});

6
src/app/modules/shows/new/new.component.ts
View File

@@ -10,7 +10,7 @@ import {faSave} from '@fortawesome/free-solid-svg-icons/faSave';
@Component({
selector: 'app-new',
templateUrl: './new.component.html',
styleUrls: ['./new.component.less']
styleUrls: ['./new.component.less'],
})
export class NewComponent implements OnInit {
public shows$: Observable<Show[]>;
@@ -19,7 +19,7 @@ export class NewComponent implements OnInit {
public form: FormGroup;
public faSave = faSave;
constructor(private showService: ShowService, showDataService: ShowDataService, private router: Router) {
public constructor(private showService: ShowService, showDataService: ShowDataService, private router: Router) {
this.shows$ = showDataService.list$();
}
@@ -30,7 +30,7 @@ export class NewComponent implements OnInit {
});
}
public async onSave() {
public async onSave(): Promise<void> {
this.form.markAllAsTouched();
if (!this.form.valid) {
return;

4
src/app/modules/shows/services/docx.service.spec.ts
View File

@@ -6,11 +6,11 @@ describe('DocxService', () => {
let service: DocxService;
beforeEach(() => {
TestBed.configureTestingModule({});
void TestBed.configureTestingModule({});
service = TestBed.inject(DocxService);
});
it('should be created', () => {
expect(service).toBeTruthy();
void expect(service).toBeTruthy();
});
});

73
src/app/modules/shows/services/docx.service.ts
View File

@@ -24,29 +24,24 @@ export interface DownloadOptions {
}
@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class DocxService {
constructor(
public constructor(
private showService: ShowService,
private showSongService: ShowSongService,
private songService: SongService,
private textRenderingService: TextRenderingService,
private userService: UserService,
private configService: ConfigService,
) {
}
private configService: ConfigService
) {}
public async create(showId: string, options: DownloadOptions = {}): Promise<any> {
public async create(showId: string, options: DownloadOptions = {}): Promise<void> {
const {show, songs, user, config} = await this.prepareData(showId);
const type = new ShowTypePipe().transform(show.showType);
const title = `${type} ${show.date.toDate().toLocaleDateString()}`;
const paragraphs = [
...this.renderTitle(title),
...this.renderSongs(songs, options, config),
];
const paragraphs = [...this.renderTitle(title), ...this.renderSongs(songs, options, config)];
const sections: ISectionOptions[] = [
{
@@ -56,11 +51,10 @@ export class DocxService {
},
},
children: paragraphs,
}
]
},
];
const document = this.prepareNewDocument(type, user.name, options, sections);
const blob = await Packer.toBlob(document);
// saveAs from FileSaver will download the file
@@ -72,7 +66,7 @@ export class DocxService {
creator: name,
title: type,
description: '... mit Beschreibung',
sections: sections,
sections,
styles: {
paragraphStyles: [
{
@@ -83,7 +77,8 @@ export class DocxService {
quickFormat: true,
run: options?.chordMode === 'hide' ? {} : {font: 'courier new'},
paragraph: {indent: {left: 0}},
}, {
},
{
id: 'licence',
name: 'Lizenz',
basedOn: 'Normal',
@@ -92,13 +87,13 @@ export class DocxService {
run: {size: 15, color: 'grey'},
paragraph: {indent: {left: 0}},
},
]
}
],
},
});
}
private renderSongs(songs: { showSong: ShowSong; song: Song; sections: Section[] }[], options: DownloadOptions, config: Config): Paragraph[] {
return songs.reduce((p, song) => [...p, ...this.renderSong(song.showSong, song.song, song.sections, options, config)], []);
private renderSongs(songs: {showSong: ShowSong; song: Song; sections: Section[]}[], options: DownloadOptions, config: Config): Paragraph[] {
return songs.reduce((p: Paragraph[], song) => [...p, ...this.renderSong(song.showSong, song.song, song.sections, options, config)], []);
}
private renderSong(showSong: ShowSong, song: Song, sections: Section[], options: DownloadOptions, config: Config): Paragraph[] {
@@ -106,15 +101,11 @@ export class DocxService {
const copyright = this.renderCopyright(song, options, config);
const songText = this.renderSongText(sections, options?.chordMode ?? showSong.chordMode);
return [
songTitle,
copyright,
...songText
].filter(_ => _);
return [songTitle, copyright, ...songText].filter(_ => _);
}
private renderSongText(sections: Section[], chordMode: ChordMode) {
return sections.reduce((p, section) => [...p, ...this.renderSection(section, chordMode)], []);
private renderSongText(sections: Section[], chordMode: ChordMode): Paragraph[] {
return sections.reduce((p: Paragraph[], section) => [...p, ...this.renderSection(section, chordMode)], []);
}
private renderSongTitle(song: Song): Paragraph {
@@ -137,9 +128,7 @@ export class DocxService {
const artist = song.artist ? song.artist + ', ' : '';
const termsOfUse = song.termsOfUse ? song.termsOfUse + ', ' : '';
const origin = song.origin ? song.origin + ', ' : '';
const licence = song.legalOwner === 'CCLI'
? 'CCLI-Liednummer: ' + song.legalOwnerId + ', CCLI-Lizenz: ' + config.ccliLicenseId
: 'CCLI-Liednummer: ' + song.legalOwnerId;
const licence = song.legalOwner === 'CCLI' ? 'CCLI-Liednummer: ' + song.legalOwnerId + ', CCLI-Lizenz: ' + config.ccliLicenseId : 'CCLI-Liednummer: ' + song.legalOwnerId;
return new Paragraph({
text: artist + label + termsOfUse + origin + licence,
@@ -147,7 +136,6 @@ export class DocxService {
});
}
private renderSection(section: Section, chordMode: ChordMode): Paragraph[] {
return section.lines
.filter(line => {
@@ -171,13 +159,11 @@ export class DocxService {
return new Paragraph({
text: line.text,
style: 'songtext',
spacing
spacing,
});
}
private renderTitle(type: string): Paragraph[] {
const songTitle = new Paragraph({
text: type,
heading: HeadingLevel.HEADING_1,
@@ -187,34 +173,39 @@ export class DocxService {
return [songTitle];
}
private async prepareData(showId: string): Promise<{ songs: ({ showSong: ShowSong, song: Song, sections: Section[] })[]; show: Show, user: User, config: Config }> {
private async prepareData(showId: string): Promise<{
songs: {showSong: ShowSong; song: Song; sections: Section[]}[];
show: Show;
user: User;
config: Config;
}> {
const show = await this.showService.read$(showId).pipe(first()).toPromise();
const user = await this.userService.getUserbyId(show.owner);
const config = await this.configService.get();
const showSongs = await this.showSongService.list(showId);
const songsAsync = await showSongs.map(async showSong => {
const songsAsync = showSongs.map(async showSong => {
const song = await this.songService.read(showSong.songId);
const sections = this.textRenderingService.parse(song.text, {
baseKey: showSong.keyOriginal,
targetKey: showSong.key
targetKey: showSong.key,
});
return {
showSong,
song,
sections
sections,
};
});
const songs = await Promise.all(songsAsync);
return {songs, show, user, config};
}
private saveAs(blob, fileName) {
const a = document.createElement('a') as any;
private saveAs(blob: Blob, fileName: string) {
const a = document.createElement('a');
document.body.appendChild(a);
a.setAttribute('target', '_self');
a.style = 'display: none';
a.style.display = 'none';
const url = window.URL.createObjectURL(blob);
a.href = url;

6
src/app/modules/shows/services/show-data.service.spec.ts
View File

@@ -3,10 +3,10 @@ import {TestBed} from '@angular/core/testing';
import {ShowDataService} from './show-data.service';
describe('ShowDataService', () => {
beforeEach(() => TestBed.configureTestingModule({}));
beforeEach(() => void TestBed.configureTestingModule({}));
it('should be created', () => {
const service: ShowDataService = TestBed.get(ShowDataService);
expect(service).toBeTruthy();
const service: ShowDataService = TestBed.inject(ShowDataService);
void expect(service).toBeTruthy();
});
});

8
src/app/modules/shows/services/show-data.service.ts
View File

@@ -2,17 +2,17 @@ import {Injectable} from '@angular/core';
import {Observable} from 'rxjs';
import {DbService} from '../../../services/db.service';
import {Show} from './show';
import {QueryFn} from '@angular/fire/firestore/interfaces';
@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class ShowDataService {
private collection = 'shows';
constructor(private dbService: DbService) {
}
public constructor(private dbService: DbService) {}
public list$ = (queryFn?): Observable<Show[]> => this.dbService.col$(this.collection, queryFn);
public list$ = (queryFn?: QueryFn): Observable<Show[]> => this.dbService.col$(this.collection, queryFn);
public read$ = (showId: string): Observable<Show | undefined> => this.dbService.doc$(`${this.collection}/${showId}`);
public update = async (showId: string, data: Partial<Show>): Promise<void> => await this.dbService.doc(`${this.collection}/${showId}`).update(data);
public add = async (data: Partial<Show>): Promise<string> => (await this.dbService.col(this.collection).add(data)).id;

4
src/app/modules/shows/services/show-song-data.service.spec.ts
View File

@@ -6,11 +6,11 @@ describe('ShowSongDataService', () => {
let service: ShowSongDataService;
beforeEach(() => {
TestBed.configureTestingModule({});
void TestBed.configureTestingModule({});
service = TestBed.inject(ShowSongDataService);
});
it('should be created', () => {
expect(service).toBeTruthy();
void expect(service).toBeTruthy();
});
});

11
src/app/modules/shows/services/show-song-data.service.ts
View File

@@ -2,20 +2,21 @@ import {Injectable} from '@angular/core';
import {DbService} from '../../../services/db.service';
import {Observable} from 'rxjs';
import {ShowSong} from './show-song';
import {QueryFn} from '@angular/fire/firestore/interfaces';
@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class ShowSongDataService {
private collection = 'shows';
private subCollection = 'songs';
constructor(private dbService: DbService) {
}
public constructor(private dbService: DbService) {}
public list$ = (showId: string, queryFn?): Observable<ShowSong[]> => this.dbService.col$(`${this.collection}/${showId}/${this.subCollection}`, queryFn);
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 | undefined> => this.dbService.doc$(`${this.collection}/${showId}/${this.subCollection}/${songId}`);
public update$ = async (showId: string, songId: string, data: Partial<ShowSong>): Promise<void> => await this.dbService.doc(`${this.collection}/${showId}/${this.subCollection}/${songId}`).update(data);
public update$ = async (showId: string, songId: string, data: Partial<ShowSong>): Promise<void> =>
await this.dbService.doc(`${this.collection}/${showId}/${this.subCollection}/${songId}`).update(data);
public delete = async (showId: string, songId: string): Promise<void> => await this.dbService.doc(`${this.collection}/${showId}/${this.subCollection}/${songId}`).delete();
public add = async (showId: string, data: Partial<ShowSong>): Promise<string> => (await this.dbService.col(`${this.collection}/${showId}/${this.subCollection}`).add(data)).id;
}

4
src/app/modules/shows/services/show-song.service.spec.ts
View File

@@ -6,11 +6,11 @@ describe('ShowSongService', () => {
let service: ShowSongService;
beforeEach(() => {
TestBed.configureTestingModule({});
void TestBed.configureTestingModule({});
service = TestBed.inject(ShowSongService);
});
it('should be created', () => {
expect(service).toBeTruthy();
void expect(service).toBeTruthy();
});
});

12
src/app/modules/shows/services/show-song.service.ts
View File

@@ -7,16 +7,10 @@ import {first, take} from 'rxjs/operators';
import {UserService} from '../../../services/user/user.service';
@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class ShowSongService {
constructor(
private showSongDataService: ShowSongDataService,
private songDataService: SongDataService,
private userService: UserService,
) {
}
public constructor(private showSongDataService: ShowSongDataService, private songDataService: SongDataService, private userService: UserService) {}
public async new$(showId: string, songId: string, order: number, addedLive = false): Promise<string> {
const song = await this.songDataService.read$(songId).pipe(take(1)).toPromise();
@@ -27,7 +21,7 @@ export class ShowSongService {
key: song.key,
keyOriginal: song.key,
chordMode: user.chordMode,
addedLive
addedLive,
};
return await this.showSongDataService.add(showId, data);
}

29
src/app/modules/shows/services/show.service.spec.ts
View File

@@ -5,33 +5,40 @@ import {ShowDataService} from './show-data.service';
describe('ShowService', () => {
const mockShowDataService = {add: Promise.resolve(null)};
beforeEach(() => TestBed.configureTestingModule({
providers: [
{provide: ShowDataService, useValue: mockShowDataService}
]
}));
beforeEach(
() =>
void TestBed.configureTestingModule({
providers: [{provide: ShowDataService, useValue: mockShowDataService}],
})
);
ShowService.SHOW_TYPE_PUBLIC.forEach(type => {
it('should calc public flag for ' + type, async () => {
const service: ShowService = TestBed.get(ShowService);
const service: ShowService = TestBed.inject(ShowService);
const addSpy = spyOn(TestBed.inject(ShowDataService), 'add').and.returnValue(Promise.resolve('id'));
const id = await service.new$({showType: type});
expect(id).toBe('id');
expect(addSpy).toHaveBeenCalledWith({showType: type, public: true});
void expect(id).toBe('id');
void expect(addSpy).toHaveBeenCalledWith({
showType: type,
public: true,
});
});
});
ShowService.SHOW_TYPE_PRIVATE.forEach(type => {
it('should calc private flag for ' + type, async () => {
const service: ShowService = TestBed.get(ShowService);
const service: ShowService = TestBed.inject(ShowService);
const addSpy = spyOn(TestBed.inject(ShowDataService), 'add').and.returnValue(Promise.resolve('id'));
const id = await service.new$({showType: type});
expect(id).toBe('id');
expect(addSpy).toHaveBeenCalledWith({showType: type, public: false});
void expect(id).toBe('id');
void expect(addSpy).toHaveBeenCalledWith({
showType: type,
public: false,
});
});
});
});

23
src/app/modules/shows/services/show.service.ts
View File

@@ -7,31 +7,28 @@ import {map, switchMap} from 'rxjs/operators';
import {User} from '../../../services/user/user';
@Injectable({
providedIn: 'root'
providedIn: 'root',
})
export class ShowService {
public static SHOW_TYPE = ['service-worship', 'service-praise', 'home-group-big', 'home-group', 'prayer-group', 'teens-group', 'kids-group', 'misc-public', 'misc-private'];
public static SHOW_TYPE_PUBLIC = ['service-worship', 'service-praise', 'home-group-big', 'teens-group', 'kids-group', 'misc-public'];
public static SHOW_TYPE_PRIVATE = ['home-group', 'prayer-group', 'misc-private',];
public static SHOW_TYPE_PRIVATE = ['home-group', 'prayer-group', 'misc-private'];
private user: User;
constructor(private showDataService: ShowDataService, private userService: UserService) {
userService.user$.subscribe(_ => this.user = _);
public constructor(private showDataService: ShowDataService, private userService: UserService) {
userService.user$.subscribe(_ => (this.user = _));
}
public read$ = (showId: string): Observable<Show> => this.showDataService.read$(showId);
public list$(publishedOnly: boolean = false): Observable<Show[]> {
public list$(publishedOnly = false): Observable<Show[]> {
return this.userService.user$.pipe(
switchMap(_ => this.showDataService.list$(), (user: User, shows: Show[]) => ({user, shows})),
map(_ => _.shows
.filter(_ => !_.archived)
.filter(show => show.published || (show.owner === _.user.id && !publishedOnly))
)
switchMap(
() => this.showDataService.list$(),
(user: User, shows: Show[]) => ({user, shows})
),
map(s => s.shows.filter(_ => !_.archived).filter(show => show.published || (show.owner === s.user.id && !publishedOnly)))
);
}
public update$ = async (showId: string, data: Partial<Show>): Promise<void> => this.showDataService.update(showId, data);

2
src/app/modules/shows/services/show.ts
View File

@@ -14,6 +14,4 @@ export interface Show {
presentationSongId: string;
presentationSection: number;
presentationZoom: number;
}

73
src/app/modules/shows/show/show.component.html
View File

@@ -1,49 +1,82 @@
<div *ngIf="(show$|async) as show">
<div *ngIf="show$ | async as show">
<app-card
closeLink="../"
heading="{{show.showType|showType}}, {{show.date.toDate()|date:'dd.MM.yyyy'}} - {{getStatus(show)}}">
<i *ngIf="show.public">öffentliche Veranstaltung von
heading="{{ show.showType | showType }}, {{
show.date.toDate() | date: 'dd.MM.yyyy'
}} - {{ getStatus(show) }}"
>
<i *ngIf="show.public"
>öffentliche Veranstaltung von
<app-user-name [userId]="show.owner"></app-user-name>
</i>
<i *ngIf="!show.public">geschlossene Veranstaltung von
<i *ngIf="!show.public"
>geschlossene Veranstaltung von
<app-user-name [userId]="show.owner"></app-user-name>
</i>
<p *ngIf="!show.published">
<mat-checkbox [(ngModel)]="showText">Text anzeigen</mat-checkbox>
</p>
<div *ngIf="showSongs && songs" class="song-list">
<app-song *ngFor="let song of showSongs" [showId]="showId"
[showSong]="song"
[showSongs]="showSongs"
[showText]="showText"
[show]="show"
[song]="getSong(song.songId)"
class="song-row"
<app-song
*ngFor="let song of showSongs"
[Song]="getSong(song.songId)"
[showId]="showId"
[showSong]="song"
[showSongs]="showSongs"
[showText]="showText"
[show]="show"
class="song-row"
></app-song>
</div>
<app-add-song *ngIf="songs && !show.published" [showId]="showId" [showSongs]="showSongs"
[songs]="songs"></app-add-song>
<app-add-song
*ngIf="songs && !show.published"
[showId]="showId"
[showSongs]="showSongs"
[songs]="songs"
></app-add-song>
<app-button-row>
<ng-container *appOwner="show.owner">
<app-button (click)="onArchive(true)" *ngIf="!show.archived" [icon]="faBox">
<app-button
(click)="onArchive(true)"
*ngIf="!show.archived"
[icon]="faBox"
>
Archivieren
</app-button>
<app-button (click)="onArchive(false)" *ngIf="show.archived" [icon]="faBoxOpen">
<app-button
(click)="onArchive(false)"
*ngIf="show.archived"
[icon]="faBoxOpen"
>
Wiederherstellen
</app-button>
<app-button (click)="onPublish(true)" *ngIf="!show.published" [icon]="faPublish">
<app-button
(click)="onPublish(true)"
*ngIf="!show.published"
[icon]="faPublish"
>
Veröffentlichen
</app-button>
<app-button (click)="onPublish(false)" *ngIf="show.published" [icon]="faUnpublish">
<app-button
(click)="onPublish(false)"
*ngIf="show.published"
[icon]="faUnpublish"
>
Veröffentlichung zurückziehen
</app-button>
</ng-container>
<app-button [icon]="faDownload" [matMenuTriggerFor]="menu">Herunterladen</app-button>
<app-button [icon]="faDownload" [matMenuTriggerFor]="menu"
>Herunterladen
</app-button>
<mat-menu #menu="matMenu">
<app-button (click)="onDownload()" [icon]="faUser">Ablauf für Lobpreisleiter</app-button>
<app-button (click)="onDownloadHandout()" [icon]="faUsers">Handout mit Copyright Infos</app-button>
<app-button (click)="onDownload()" [icon]="faUser"
>Ablauf für Lobpreisleiter
</app-button>
<app-button (click)="onDownloadHandout()" [icon]="faUsers"
>Handout mit Copyright Infos
</app-button>
</mat-menu>
</app-button-row>
</app-card>

13
src/app/modules/shows/show/show.component.spec.ts
View File

@@ -6,12 +6,13 @@ describe('ShowComponent', () => {
let component: ShowComponent;
let fixture: ComponentFixture<ShowComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ShowComponent]
beforeEach(
waitForAsync(() => {
void TestBed.configureTestingModule({
declarations: [ShowComponent],
}).compileComponents();
})
.compileComponents();
}));
);
beforeEach(() => {
fixture = TestBed.createComponent(ShowComponent);
@@ -20,6 +21,6 @@ describe('ShowComponent', () => {
});
it('should create', () => {
expect(component).toBeTruthy();
void expect(component).toBeTruthy();
});
});

41
src/app/modules/shows/show/show.component.ts
View File

@@ -20,7 +20,7 @@ import {faUsers} from '@fortawesome/free-solid-svg-icons/faUsers';
@Component({
selector: 'app-show',
templateUrl: './show.component.html',
styleUrls: ['./show.component.less']
styleUrls: ['./show.component.less'],
})
export class ShowComponent implements OnInit {
public show$: Observable<Show>;
@@ -37,29 +37,31 @@ export class ShowComponent implements OnInit {
public faUser = faUser;
public faUsers = faUsers;
constructor(
public constructor(
private activatedRoute: ActivatedRoute,
private showService: ShowService,
private songService: SongService,
private showSongService: ShowSongService,
private docxService: DocxService,
) {
}
private docxService: DocxService
) {}
ngOnInit(): void {
public ngOnInit(): void {
this.show$ = this.activatedRoute.params.pipe(
map(param => param.showId),
tap(_ => this.showId = _),
switchMap(showId => this.showService.read$(showId))
map((param: {showId: string}) => param.showId),
tap((_: string) => (this.showId = _)),
switchMap((showId: string) => this.showService.read$(showId))
);
this.activatedRoute.params.pipe(
map(param => param.showId),
switchMap(showId => this.showSongService.list$(showId)),
filter(_ => !!_)
).subscribe(_ => this.showSongs = _);
this.songService.list$().pipe(
filter(_ => !!_)
).subscribe(_ => this.songs = _);
this.activatedRoute.params
.pipe(
map((param: {showId: string}) => param.showId),
switchMap(showId => this.showSongService.list$(showId)),
filter(_ => !!_)
)
.subscribe(_ => (this.showSongs = _));
this.songService
.list$()
.pipe(filter(_ => !!_))
.subscribe(_ => (this.songs = _));
}
public getSong(songId: string): Song {
@@ -90,6 +92,9 @@ export class ShowComponent implements OnInit {
}
public async onDownloadHandout(): Promise<void> {
await this.docxService.create(this.showId, {chordMode: 'hide', copyright: true});
await this.docxService.create(this.showId, {
chordMode: 'hide',
copyright: true,
});
}
}

47
src/app/modules/shows/show/song/song.component.html
View File

@@ -1,21 +1,42 @@
<div *ngIf="_song">
<div *ngIf="show.published" class="title published">{{_song.title}}</div>
<div *ngIf="iSong">
<div *ngIf="show.published" class="title published">{{ iSong.title }}</div>
<div *ngIf="!show.published" class="song">
<app-menu-button (click)="reorder(true)" [icon]="faUp" class="btn-up btn-icon"></app-menu-button>
<app-menu-button (click)="reorder(false)" [icon]="faDown" class="btn-down btn-icon"></app-menu-button>
<span class="title">{{_song.title}}</span>
<app-menu-button
(click)="reorder(true)"
[icon]="faUp"
class="btn-up btn-icon"
></app-menu-button>
<app-menu-button
(click)="reorder(false)"
[icon]="faDown"
class="btn-down btn-icon"
></app-menu-button>
<span class="title">{{ iSong.title }}</span>
<span class="keys">
<span *ngIf="showSong.keyOriginal!==showSong.key">{{showSong.keyOriginal}}&nbsp;→&nbsp;</span>
<mat-form-field *ngIf="keys" appearance="standard">
<span *ngIf="showSong.keyOriginal !== showSong.key"
>{{ showSong.keyOriginal }}&nbsp;→&nbsp;</span
>
<mat-form-field *ngIf="keys" appearance="standard">
<mat-select [formControl]="keyFormControl">
<mat-option *ngFor="let key of keys" [value]="key">{{key}}</mat-option>
<mat-option *ngFor="let key of keys" [value]="key">{{
key
}}</mat-option>
</mat-select>
</mat-form-field>
</span>
<app-menu-button (click)="onDelete()" [icon]="faDelete" class="btn-delete btn-icon"></app-menu-button>
</span>
<app-menu-button
(click)="onDelete()"
[icon]="faDelete"
class="btn-delete btn-icon"
></app-menu-button>
</div>
<app-song-text (chordModeChanged)="onChordModeChanged($event)" *ngIf="showText || show.published"
[chordMode]="showSong.chordMode" [transpose]="{baseKey: showSong.keyOriginal, targetKey: showSong.key}"
[showSwitch]="!show.published" [text]="_song.text"></app-song-text>
<app-song-text
(chordModeChanged)="onChordModeChanged($event)"
*ngIf="showText || show.published"
[chordMode]="showSong.chordMode"
[showSwitch]="!show.published"
[text]="iSong.text"
[transpose]="{ baseKey: showSong.keyOriginal, targetKey: showSong.key }"
></app-song-text>
</div>

13
src/app/modules/shows/show/song/song.component.spec.ts
View File

@@ -6,12 +6,13 @@ describe('SongComponent', () => {
let component: SongComponent;
let fixture: ComponentFixture<SongComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [SongComponent]
beforeEach(
waitForAsync(() => {
void TestBed.configureTestingModule({
declarations: [SongComponent],
}).compileComponents();
})
.compileComponents();
}));
);
beforeEach(() => {
fixture = TestBed.createComponent(SongComponent);
@@ -20,6 +21,6 @@ describe('SongComponent', () => {
});
it('should create', () => {
expect(component).toBeTruthy();
void expect(component).toBeTruthy();
});
});

46
src/app/modules/shows/show/song/song.component.ts
View File

@@ -13,7 +13,7 @@ import {Show} from '../../services/show';
@Component({
selector: 'app-song',
templateUrl: './song.component.html',
styleUrls: ['./song.component.less']
styleUrls: ['./song.component.less'],
})
export class SongComponent implements OnInit {
@Input() public show: Show;
@@ -22,30 +22,25 @@ export class SongComponent implements OnInit {
@Input() public showId: string;
@Input() public showText: boolean;
public keys: string[];
public faDelete = faTrash;
public faUp = faCaretUp;
public faDown = faCaretDown;
public keyFormControl: FormControl;
public iSong: Song;
constructor(
private showSongService: ShowSongService,
) {
}
public _song: Song;
public constructor(private showSongService: ShowSongService) {}
@Input()
public set song(song: Song) {
this._song = song;
this.keys = !!song ? getScale(song.key) : [];
public set Song(song: Song) {
this.iSong = song;
this.keys = song ? getScale(song.key) : [];
}
public ngOnInit(): void {
this.keyFormControl = new FormControl(this.showSong.key);
this.keyFormControl.valueChanges.subscribe(async value => {
await this.showSongService.update$(this.showId, this.showSong.id, {key: value});
this.keyFormControl.valueChanges.subscribe((value: string) => {
void this.showSongService.update$(this.showId, this.showSong.id, {key: value});
});
}
@@ -53,7 +48,6 @@ export class SongComponent implements OnInit {
await this.showSongService.delete$(this.showId, this.showSong.id);
}
public async reorder(up: boolean): Promise<void> {
if (up) {
await this.reorderUp();
@@ -63,7 +57,7 @@ export class SongComponent implements OnInit {
}
public async reorderUp(): Promise<void> {
const index = this.showSongs.findIndex(_ => _.songId === this._song.id);
const index = this.showSongs.findIndex(_ => _.songId === this.iSong.id);
if (index === 0) {
return;
}
@@ -71,12 +65,16 @@ export class SongComponent implements OnInit {
const song = this.showSongs[index];
const toggleSong = this.showSongs[index - 1];
await this.showSongService.update$(this.showId, song.id, {order: toggleSong.order});
await this.showSongService.update$(this.showId, toggleSong.id, {order: song.order});
await this.showSongService.update$(this.showId, song.id, {
order: toggleSong.order,
});
await this.showSongService.update$(this.showId, toggleSong.id, {
order: song.order,
});
}
public async reorderDown(): Promise<void> {
const index = this.showSongs.findIndex(_ => _.songId === this._song.id);
const index = this.showSongs.findIndex(_ => _.songId === this.iSong.id);
if (index === this.showSongs.length - 1) {
return;
}
@@ -84,11 +82,17 @@ export class SongComponent implements OnInit {
const song = this.showSongs[index];
const toggleSong = this.showSongs[index + 1];
await this.showSongService.update$(this.showId, song.id, {order: toggleSong.order});
await this.showSongService.update$(this.showId, toggleSong.id, {order: song.order});
await this.showSongService.update$(this.showId, song.id, {
order: toggleSong.order,
});
await this.showSongService.update$(this.showId, toggleSong.id, {
order: song.order,
});
}
public async onChordModeChanged(value: ChordMode): Promise<void> {
await this.showSongService.update$(this.showId, this.showSong.id, {chordMode: value});
await this.showSongService.update$(this.showId, this.showSong.id, {
chordMode: value,
});
}
}

14
src/app/modules/shows/shows-routing.module.ts
View File

@@ -4,26 +4,24 @@ import {NewComponent} from './new/new.component';
import {ListComponent} from './list/list.component';
import {ShowComponent} from './show/show.component';
const routes: Routes = [
{
path: '',
pathMatch: 'full',
component: ListComponent
component: ListComponent,
},
{
path: 'new',
component: NewComponent
component: NewComponent,
},
{
path: ':showId',
component: ShowComponent
}
component: ShowComponent,
},
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
exports: [RouterModule],
})
export class ShowsRoutingModule {
}
export class ShowsRoutingModule {}

6
src/app/modules/shows/shows.module.ts
View File

@@ -29,7 +29,6 @@ import {OwnerModule} from '../../services/user/owner.module';
import {UserNameModule} from '../../services/user/user-name/user-name.module';
import {MatMenuModule} from '@angular/material/menu';
@NgModule({
declarations: [NewComponent, ListComponent, ListItemComponent, ShowComponent, SongComponent],
imports: [
@@ -57,7 +56,6 @@ import {MatMenuModule} from '@angular/material/menu';
OwnerModule,
UserNameModule,
MatMenuModule,
]
],
})
export class ShowsModule {
}
export class ShowsModule {}