user preferences - chord type - apply in song and show-song

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

@@ -4,6 +4,7 @@ import {Observable} from 'rxjs';
 import {ShowSong} from './showSong';
 import {SongDataService} from '../../songs/services/song-data.service';
 import {take} from 'rxjs/operators';
+import {UserService} from '../../../services/user.service';
 
 @Injectable({
   providedIn: 'root'
@@ -12,13 +13,15 @@ export class ShowSongService {
 
   constructor(
     private showSongDataService: ShowSongDataService,
-    private songDataService: SongDataService
+    private songDataService: SongDataService,
+    private userService: UserService,
   ) {
   }
 
   public async new$(showId: string, songId: string, order: number): Promise<string> {
     const song = await this.songDataService.read$(songId).pipe(take(1)).toPromise();
-    const data = {songId, order, key: song.key, keyOriginal: song.key};
+    const user = await this.userService.user$.pipe(take(1)).toPromise();
+    const data: Partial<ShowSong> = {songId, order, key: song.key, keyOriginal: song.key, chordMode: user.chordMode};
     return await this.showSongDataService.add(showId, data);
   }
 

src/app/modules/shows/services/showSong.ts

@@ -1,7 +1,10 @@
+import {ChordMode} from '../../../widget-modules/components/song-text/song-text.component';
+
 export interface ShowSong {
   id: string;
   songId: string;
   key: string;
   keyOriginal: string;
   order: number;
+  chordMode: ChordMode
 }

src/app/modules/shows/show/song/song.component.html

@@ -13,5 +13,6 @@
   </span>
     <app-menu-button (click)="onDelete()" [icon]="faDelete" class="btnDelete"></app-menu-button>
   </div>
-  <app-song-text *ngIf="showText" [text]="_song.text"></app-song-text>
+  <app-song-text (chordModeChanged)="onChordModeChanged($event)" *ngIf="showText" [chordMode]="showSong.chordMode"
+                 [text]="_song.text"></app-song-text>
 </div>

src/app/modules/shows/show/song/song.component.ts

@@ -7,6 +7,7 @@ import {ShowSongService} from '../../services/show-song.service';
 import {ShowSong} from '../../services/showSong';
 import {getScale} from '../../../songs/services/key.helper';
 import {FormControl} from '@angular/forms';
+import {ChordMode} from '../../../../widget-modules/components/song-text/song-text.component';
 
 @Component({
   selector: 'app-song',
@@ -77,5 +78,7 @@ export class SongComponent implements OnInit {
     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});
+  }
 }