benjamin/wgenerator
1
0
Fork 0
Code Releases Activity

new song sync

Browse Source
This commit is contained in:
Benjamin Ifland
2019-03-25 18:04:30 +01:00
parent dc01c60e67
commit 42e9936b6c
9 changed files with 94 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
WEB/src/app/components/songs/song-new/song-new.component.html
View File

@@ -14,8 +14,8 @@
<app-song-form [form]="form"></app-song-form>
</mat-card-content>
<mat-card-actions>
<button mat-button (click)="onClickEdit()">
<fa-icon [icon]="faSave"></fa-icon> Speichern
<button mat-button (click)="onClickAdd()">
<fa-icon [icon]="faSave"></fa-icon> neu anlegen
</button>
</mat-card-actions>
</mat-card>

4
WEB/src/app/components/songs/song-new/song-new.component.ts
View File

@@ -31,4 +31,8 @@ export class SongNewComponent implements OnInit {
this.songsService.state = State.list;
}
public onClickAdd(): void {
this.songsService.saveNewSong$(this.form.value).subscribe();
}
}

10
WEB/src/app/components/songs/song/song.component.html
View File

@@ -7,7 +7,13 @@
</button>
</div>
<mat-card-title>{{ song.Name }}</mat-card-title>
<mat-card-subtitle>{{ song.Key }} - {{ song.Tempo }}</mat-card-subtitle>
<mat-card-subtitle>
<mat-chip-list>
<mat-chip *ngIf="renderSongType(song.SongType)" [style.background]="renderSongType(song.SongType).color">{{ renderSongType(song.SongType).name }}</mat-chip>
<mat-chip *ngIf="song.Key">Tonart: {{ song.Key }}</mat-chip>
<mat-chip *ngIf="song.Tempo">Tempo: {{ song.Tempo }}</mat-chip>
</mat-chip-list></mat-card-subtitle
>
</mat-card-header>
<mat-card-content>
<p *ngFor="let line of text">{{ line }}</p>
@@ -16,7 +22,7 @@
</mat-card-content>
<mat-card-actions>
<button mat-button (click)="onClickEdit()">
<fa-icon [icon]="faEdit"></fa-icon> Bearbeiten
<fa-icon [icon]="faEdit"></fa-icon> bearbeiten
</button>
</mat-card-actions>
</mat-card>

8
WEB/src/app/components/songs/song/song.component.ts
View File

@@ -57,4 +57,12 @@ export class SongComponent {
public get comments(): string[] {
return this.song && this.song.Comments ? this.song.Comments.split(/\r?\n/) : [];
}
public renderSongType(songType: string) {
switch (songType) {
case 'Praise': return {name: 'Lobpreis', color: '#99FFB8'};
case 'Worship': return {name: 'Anbetung', color: '#C999FF'};
default: return null;
}
}
}

2
WEB/src/app/components/songs/songs.component.ts
View File

@@ -12,6 +12,6 @@ import { State } from 'src/app/data/state';
export class SongsComponent {
public State = State;
constructor(public songsService: SongsService) {
songsService.loadSongList();
songsService.loadSongList$().subscribe();
}
}

19
WEB/src/app/components/songs/table/table.component.html
View File

@@ -3,7 +3,9 @@
[class.pinned]="songsService.state !== State.list"
>
<div class="table-container">
<button mat-icon-button (click)="onClickNew()" class="button-new"><fa-icon [icon]="faNew"></fa-icon></button>
<button mat-icon-button (click)="onClickNew()" class="button-new">
<fa-icon [icon]="faNew"></fa-icon>
</button>
<table
mat-table
[dataSource]="songsService.songs | async"
@@ -11,7 +13,11 @@
>
<ng-container matColumnDef="Number">
<th mat-header-cell *matHeaderCellDef>#</th>
<td mat-cell *matCellDef="let element">{{ element.Number }}</td>
<td mat-cell *matCellDef="let element">
<mat-chip-list>
<mat-chip>{{ element.Number }}</mat-chip>
</mat-chip-list>
</td>
</ng-container>
<ng-container matColumnDef="Name">
@@ -31,8 +37,13 @@
<ng-container matColumnDef="SongType">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element">
<mat-chip-list *ngIf="element.SongType && element.SongType!=='None'">
<mat-chip [style.background-color]="renderSongType(element.SongType).color">{{ renderSongType(element.SongType).name }}</mat-chip>
<mat-chip-list
*ngIf="element.SongType && element.SongType !== 'None'"
>
<mat-chip
[style.background-color]="renderSongType(element.SongType).color"
>{{ renderSongType(element.SongType).name }}</mat-chip
>
</mat-chip-list>
</td>
</ng-container>

2
WEB/src/app/data/edit-song.service.ts
View File

@@ -42,7 +42,7 @@ export class EditSongService {
private attachSync(form: FormGroup, song: Song) {
const controls = Object.keys(form.controls);
controls.forEach(control => {
form.controls[control].valueChanges.pipe(switchMap(value => this.songsService.patch(song.ID, control, value))).subscribe();
form.controls[control].valueChanges.pipe(switchMap(value => this.songsService.patch$(song.ID, control, value))).subscribe();
});
}

38
WEB/src/app/data/odata.service.ts
View File

@@ -1,15 +1,16 @@
import { ODataService, ODataQuery } from "odata-v4-ng";
import { Observable } from "rxjs";
import { map, tap } from "rxjs/operators";
import { base } from "./urls";
import { Song } from 'src/app/models/song.model';
import { ODataService, ODataQuery } from 'odata-v4-ng';
import { Observable } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { base } from './urls';
export class OdataService {
private url: string;
constructor(private odataService: ODataService, private entity: string) {
this.url = base + "/odata/";
this.url = base + '/odata/';
}
public list<TResponse>(properties: string[]): Observable<TResponse[]> {
public list$<TResponse>(properties: string[]): Observable<TResponse[]> {
const query = new ODataQuery(this.odataService, this.url)
.entitySet(this.entity)
.select(properties);
@@ -18,7 +19,7 @@ export class OdataService {
return get;
}
public get<TResponse>(
public get$<TResponse>(
id: number,
properties: string[]
): Observable<TResponse> {
@@ -31,15 +32,30 @@ export class OdataService {
return get;
}
public patch(id: number, control: string, value: any): Observable<boolean> {
public patch$(id: number, control: string, value: any): Observable<boolean> {
const valueSet = { [control]: value };
const query = new ODataQuery(this.odataService, this.url)
.entitySet(this.entity)
.entityKey(id);
const get = query.patch(valueSet).pipe(
map(() => true)
);
const get = query.patch(valueSet).pipe(map(() => true));
return get;
}
public post$<TResponse>(values: any): Observable<TResponse> {
const querry = new ODataQuery(this.odataService, this.url);
const post = querry
.entitySet(this.entity)
.post(values)
.pipe(
tap(_ => console.log(_)),
map(_ => {
const mapped = _.toEntity<TResponse>();
return mapped;
}),
tap(_ => console.log(_))
);
return post;
}
}

34
WEB/src/app/data/songs.service.ts
View File

@@ -3,7 +3,7 @@ import { ODataService } from 'odata-v4-ng';
import { OdataService } from './odata.service';
import { Song } from '../models/song.model';
import { BehaviorSubject, Observable } from 'rxjs';
import { tap } from 'rxjs/operators';
import { tap, switchMap } from 'rxjs/operators';
import { State } from './state';
@Injectable({
@@ -19,9 +19,22 @@ export class SongsService extends OdataService {
super(odataService, 'songs');
}
public loadSongList(): void {
public loadSongList$(): Observable<Song[]> {
const properties = ['ID', 'Name', 'Number', 'SongType', 'Key', 'Tempo'];
this.list<Song>(properties).subscribe(_ => this.songs.next(_));
const list = this.list$<Song>(properties).pipe(
tap(_ => this.songs.next(_))
);
return list;
}
public loadSongListAndGoTo$(id: number): Observable<Song[]> {
const properties = ['ID', 'Name', 'Number', 'SongType', 'Key', 'Tempo'];
const list = this.list$<Song>(properties).pipe(tap(_ => {
this.songs.next(_);
this.selectSong(id);
}));
return list;
}
public selectSong(id: number): void {
@@ -32,7 +45,7 @@ export class SongsService extends OdataService {
return;
}
this.get<Song>(id, ['Text', 'Comments']).subscribe(_ => {
this.get$<Song>(id, ['Text', 'Comments']).subscribe(_ => {
song.Text = _.Text;
song.Comments = _.Comments;
this.selectedSong.next(song);
@@ -44,8 +57,8 @@ export class SongsService extends OdataService {
this.selectedSong.next(null);
}
public patch(id: number, control: string, value: any): Observable<boolean> {
const patch = super.patch(id, control, value).pipe(
public patch$(id: number, control: string, value: any): Observable<boolean> {
const patch = super.patch$(id, control, value).pipe(
tap(() => {
const songs = this.songs.value;
const song = songs.filter(_ => _.ID === id)[0];
@@ -54,6 +67,15 @@ export class SongsService extends OdataService {
this.selectedSong.next(song);
})
);
return patch;
}
public saveNewSong$(values: any): Observable<Song[]> {
const newSong = super
.post$<Song>(values)
.pipe(switchMap(_ => this.loadSongListAndGoTo$(_.ID)));
return newSong;
}
}