From f453165f8844820164909b3a715a6c19a30a1751 Mon Sep 17 00:00:00 2001
From: Benjamin Ifland <benjamin@Apfelbox.local>
Date: Sat, 23 Mar 2019 17:36:33 +0100
Subject: [PATCH] fix: song details

---
 .gitignore                                    |  5 ++++-
 .../app/components/song/song.component.html   |  4 ++--
 WEB/src/app/components/song/song.component.ts | 20 +++++++++++--------
 3 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/.gitignore b/.gitignore
index 63a637d..7279391 100644
--- a/.gitignore
+++ b/.gitignore
@@ -264,4 +264,7 @@ __pycache__/
 */*/App_Data/*
 
 # Mac
-.DS_Store
\ No newline at end of file
+.DS_Store
+
+# Angular
+dist
\ No newline at end of file
diff --git a/WEB/src/app/components/song/song.component.html b/WEB/src/app/components/song/song.component.html
index 99a97cc..cd177e2 100644
--- a/WEB/src/app/components/song/song.component.html
+++ b/WEB/src/app/components/song/song.component.html
@@ -6,10 +6,10 @@
       </button>
     </div>
     <mat-card-title>{{ song.Name }}</mat-card-title>
-    <mat-card-subtitle>{{ song.Key }} - {{ song.Velocity }}</mat-card-subtitle>
+    <mat-card-subtitle>{{ song.Key }} - {{ song.Tempo }}</mat-card-subtitle>
   </mat-card-header>
   <mat-card-content>
-    <p>{{ song.Text }}</p>
+    <p *ngFor="let line of text">{{ line }}</p>
   </mat-card-content>
   <mat-card-actions>
     <button mat-button (click)="onClickDownload()">Herunterladen</button>
diff --git a/WEB/src/app/components/song/song.component.ts b/WEB/src/app/components/song/song.component.ts
index e3fb161..3c41ed0 100644
--- a/WEB/src/app/components/song/song.component.ts
+++ b/WEB/src/app/components/song/song.component.ts
@@ -1,13 +1,13 @@
-import { DownloadService } from './../../data/download.service';
-import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-import { faLongArrowAltLeft } from '@fortawesome/free-solid-svg-icons';
-import { Song } from 'src/app/models/song.model';
+import { DownloadService } from "./../../data/download.service";
+import { Component, OnInit } from "@angular/core";
+import { ActivatedRoute } from "@angular/router";
+import { faLongArrowAltLeft } from "@fortawesome/free-solid-svg-icons";
+import { Song } from "src/app/models/song.model";
 
 @Component({
-  selector: 'app-song',
-  templateUrl: './song.component.html',
-  styleUrls: ['./song.component.less']
+  selector: "app-song",
+  templateUrl: "./song.component.html",
+  styleUrls: ["./song.component.less"]
 })
 export class SongComponent implements OnInit {
   public song: Song;
@@ -28,4 +28,8 @@ export class SongComponent implements OnInit {
     const id = this.song.ID;
     this.downloadService.get(id, false);
   }
+
+  public get text(): string[] {
+    return this.song.Text.split(/\r?\n/).filter(_ => _ !== ' ');
+  }
 }