From f72e48659cca8d33a92b298f6630c7f4123ca8a5 Mon Sep 17 00:00:00 2001 From: TidusJar Date: Fri, 24 Aug 2018 09:06:41 +0100 Subject: [PATCH] Album search actually looks pretty good !wip --- src/Ombi.Core/Engine/MusicSearchEngine.cs | 3 +- .../search/music/albumsearch.component.html | 145 ++++++++++-------- .../search/music/albumsearch.component.scss | 3 + .../app/search/music/albumsearch.component.ts | 1 + .../search/music/musicsearch.component.html | 38 +++-- .../app/search/music/musicsearch.component.ts | 15 +- .../app/search/search.component.html | 4 +- .../ClientApp/app/search/search.component.ts | 4 +- src/Ombi/ClientApp/styles/Themes/plex.scss | 10 ++ 9 files changed, 138 insertions(+), 85 deletions(-) create mode 100644 src/Ombi/ClientApp/app/search/music/albumsearch.component.scss diff --git a/src/Ombi.Core/Engine/MusicSearchEngine.cs b/src/Ombi.Core/Engine/MusicSearchEngine.cs index ebb396d99..abfbd2721 100644 --- a/src/Ombi.Core/Engine/MusicSearchEngine.cs +++ b/src/Ombi.Core/Engine/MusicSearchEngine.cs @@ -139,7 +139,8 @@ namespace Ombi.Core.Engine Monitored = a.monitored, Rating = a.ratings?.value ?? 0m, ReleaseDate = a.releaseDate, - Title = a.title + Title = a.title, + Disk = a.images?.FirstOrDefault(x => x.coverType.Equals("disc"))?.url }; if (vm.Monitored) { diff --git a/src/Ombi/ClientApp/app/search/music/albumsearch.component.html b/src/Ombi/ClientApp/app/search/music/albumsearch.component.html index ccd6b3260..b8e85da3e 100644 --- a/src/Ombi/ClientApp/app/search/music/albumsearch.component.html +++ b/src/Ombi/ClientApp/app/search/music/albumsearch.component.html @@ -1,80 +1,105 @@ -
- -
-
-
- poster - -
-
-
- -

{{result.title}}

-
- -

{{result.artistName}}

-
- - +
+
+ + +
+ poster +
+ + +
+ + + +
+ + - - Release Date: {{result.releaseDate | date:'yyyy-MM-dd'}} + + Release Date: {{result.releaseDate | date:'yyyy-MM-dd'}} + + + {{result.rating}}/10 + - - - - + + + + + + + + + + + + - -
-
-

{{result.overview | truncate: 350 }}

-
+
+
+
-
-
-
+ +
+
+
- +
-
-
- -
-
-
- - - - - - +
+ +
+
+
+ + + + + +
- -
- - -
+
+ + + +
\ No newline at end of file diff --git a/src/Ombi/ClientApp/app/search/music/albumsearch.component.scss b/src/Ombi/ClientApp/app/search/music/albumsearch.component.scss new file mode 100644 index 000000000..799b4957f --- /dev/null +++ b/src/Ombi/ClientApp/app/search/music/albumsearch.component.scss @@ -0,0 +1,3 @@ +.album-cover { + width:300px; +} diff --git a/src/Ombi/ClientApp/app/search/music/albumsearch.component.ts b/src/Ombi/ClientApp/app/search/music/albumsearch.component.ts index 59314df84..388b3dec0 100644 --- a/src/Ombi/ClientApp/app/search/music/albumsearch.component.ts +++ b/src/Ombi/ClientApp/app/search/music/albumsearch.component.ts @@ -9,6 +9,7 @@ import { NotificationService, RequestService } from "../../services"; @Component({ selector: "album-search", templateUrl: "./albumsearch.component.html", + styleUrls: ["./albumsearch.component.scss"], }) export class AlbumSearchComponent { diff --git a/src/Ombi/ClientApp/app/search/music/musicsearch.component.html b/src/Ombi/ClientApp/app/search/music/musicsearch.component.html index e9dc8637e..867d7803e 100644 --- a/src/Ombi/ClientApp/app/search/music/musicsearch.component.html +++ b/src/Ombi/ClientApp/app/search/music/musicsearch.component.html @@ -7,39 +7,43 @@
-
- - - - -
+
+ + + +
- +
+

-
+ +
-
-
+ +
+
- +

-
- -
-
-
+
+
+ +
+
+
+
+ [issueCategory]="issueCategorySelected" [id]="issueRequestId" [providerId]="issueProviderId"> \ No newline at end of file diff --git a/src/Ombi/ClientApp/app/search/music/musicsearch.component.ts b/src/Ombi/ClientApp/app/search/music/musicsearch.component.ts index e17187355..073e64378 100644 --- a/src/Ombi/ClientApp/app/search/music/musicsearch.component.ts +++ b/src/Ombi/ClientApp/app/search/music/musicsearch.component.ts @@ -22,7 +22,7 @@ export class MusicSearchComponent implements OnInit { public albumResult: ISearchAlbumResult[]; public result: IRequestEngineResult; public searchApplied = false; - public searchAlbum: boolean; + public searchAlbum: boolean = true; @Input() public issueCategories: IIssueCategory[]; @Input() public issuesEnabled: boolean; @@ -54,6 +54,9 @@ export class MusicSearchComponent implements OnInit { return; } if(this.searchAlbum) { + if(!this.searchText) { + this.searchText = "iowa"; // REMOVE + } this.searchService.searchAlbum(this.searchText) .subscribe(x => { this.albumResult = x; @@ -167,9 +170,15 @@ export class MusicSearchComponent implements OnInit { private setAlbumBackground() { this.albumResult.forEach((val, index) => { - if (val.cover === null) { - val.cover = this.defaultPoster; + if (val.disk === null) { + if(val.cover === null) { + val.disk = this.defaultPoster; + } else { + val.disk = val.cover; + } } + val.background = this.sanitizer.bypassSecurityTrustStyle + ("url(" + val.cover + ")"); }); } } diff --git a/src/Ombi/ClientApp/app/search/search.component.html b/src/Ombi/ClientApp/app/search/search.component.html index 046635812..35f792efa 100644 --- a/src/Ombi/ClientApp/app/search/search.component.html +++ b/src/Ombi/ClientApp/app/search/search.component.html @@ -22,11 +22,11 @@
- +
- +
diff --git a/src/Ombi/ClientApp/app/search/search.component.ts b/src/Ombi/ClientApp/app/search/search.component.ts index 74221e71c..9347c87f1 100644 --- a/src/Ombi/ClientApp/app/search/search.component.ts +++ b/src/Ombi/ClientApp/app/search/search.component.ts @@ -21,9 +21,9 @@ export class SearchComponent implements OnInit { public ngOnInit() { this.settingsService.getLidarr().subscribe(x => this.musicEnabled = x.enabled); - this.showMovie = true; + this.showMovie = false; this.showTv = false; - this.showMusic = false; + this.showMusic = true; this.issuesService.getCategories().subscribe(x => this.issueCategories = x); this.settingsService.getIssueSettings().subscribe(x => this.issuesEnabled = x.enabled); } diff --git a/src/Ombi/ClientApp/styles/Themes/plex.scss b/src/Ombi/ClientApp/styles/Themes/plex.scss index 1475aef91..f965e72c7 100644 --- a/src/Ombi/ClientApp/styles/Themes/plex.scss +++ b/src/Ombi/ClientApp/styles/Themes/plex.scss @@ -345,11 +345,21 @@ button.list-group-item:focus { height: 100%; position: absolute; } + .album-bg { + width: 92%; + height: 100%; + position: absolute; + } .tint { width: 100%; height: 100%; position: absolute; } + .album-tint { + width: 92%; + height: 100%; + position: absolute; + } table.table > thead > tr > th.active { background-color: $primary-colour; } \ No newline at end of file