feat: added 4k to the card

src/Ombi/ClientApp/src/app/discover/components/actor/discover-actor.component.html

@@ -5,7 +5,7 @@
     </div>
     <div *ngIf="discoverResults" class="row full-height">
         <div class="col-xl-2 col-lg-3 col-md-3 col-6 col-sm-4 small-padding" *ngFor="let result of discoverResults">
-            <discover-card [isAdmin]="isAdmin" [result]="result"></discover-card>
+            <discover-card [isAdmin]="isAdmin" [result]="result" [is4kEnabled]="is4kEnabled"></discover-card>
         </div>
     </div>
 </div>

src/Ombi/ClientApp/src/app/discover/components/actor/discover-actor.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { SearchV2Service } from "../../../services";
 import { IActorCredits, IActorCast } from "../../../interfaces/ISearchTvResultV2";
@@ -6,30 +6,31 @@ import { IDiscoverCardResult } from "../../interfaces";
 import { RequestType } from "../../../interfaces";
 import { AuthService } from "../../../auth/auth.service";
 import { forkJoin } from "rxjs";
-import { isEqual } from "lodash";
+import { FeaturesFacade } from "../../../state/features/features.facade";
 
 @Component({
     templateUrl: "./discover-actor.component.html",
     styleUrls: ["./discover-actor.component.scss"],
 })
-export class DiscoverActorComponent {
+export class DiscoverActorComponent implements OnInit {
     public actorId: number;
     public loadingFlag: boolean;
     public isAdmin: boolean;
+    public is4kEnabled = false;
 
     public discoverResults: IDiscoverCardResult[] = [];
 
     constructor(private searchService: SearchV2Service,
         private route: ActivatedRoute,
-        private auth: AuthService) {
+        private auth: AuthService,
+        private featureService: FeaturesFacade) {
         this.route.params.subscribe((params: any) => {
             this.actorId = params.actorId;
-            this.isAdmin = this.auth.isAdmin();
-            this.search();
         });
     }
-
+    ngOnInit() {
-    private search() {
+        this.isAdmin = this.auth.isAdmin();
+        this.is4kEnabled = this.featureService.is4kEnabled();
         this.discoverResults = [];
         this.loading();
 

src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.html

@@ -20,12 +20,24 @@
             </a>
         </div>
         <div [ngClass]="result.posterPath.includes('images/') ? 'button-request-container-show' : 'button-request-container'" class="row" *ngIf="!result.available && !result.approved && !result.requested">
-            <div class="button-request poster-overlay">
+            <div *ngIf="!is4kEnabled" class="button-request poster-overlay">
-                <button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" *ngIf="requestable" mat-raised-button class="btn-ombi full-width poster-request-btn" (click)="request($event)">
+                <button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" *ngIf="requestable" mat-raised-button class="btn-ombi full-width poster-request-btn" (click)="request($event, false)">
                     <i *ngIf="!loading" class="fa-lg fas fa-cloud-download-alt"></i>
                     <i *ngIf="loading" class="fas fa-spinner fa-pulse fa-2x fa-fw" aria-hidden="true"></i>
                     {{'Common.Request' | translate }}
                 </button>
             </div>
+            <div *ngIf="is4kEnabled && requestable" class="button-request poster-overlay">
+                <button [matMenuTriggerFor]="menu" id="requestButton{{result.id}}{{result.type}}{{discoverType}}" mat-raised-button class="btn-ombi full-width poster-request-btn">
+                    <i *ngIf="!loading" class="fa-lg fas fa-cloud-download-alt"></i>
+                    <i *ngIf="loading" class="fas fa-spinner fa-pulse fa-2x fa-fw" aria-hidden="true"></i>
+                    {{'Common.Request' | translate }}
+                </button>
+                <mat-menu #menu="matMenu">
+                    <button mat-menu-item  class="btn-ombi full-width poster-request-btn" (click)="request($event, false)">{{'Common.Request' | translate }}</button>
+                    <button mat-menu-item  class="btn-ombi full-width poster-request-btn" (click)="request($event, true)">{{'Common.Request4K' | translate }}</button>
+                  </mat-menu>
+            </div>
+
         </div>
 </div>

src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss

@@ -292,4 +292,8 @@ a.poster-overlay:hover{
 
 .btn-ombi{
   background-color:#293a4c;
+}
+
+::ng-deep .mat-menu-panel {
+  min-width: 190px !important;
 }

src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.ts

@@ -21,6 +21,7 @@ export class DiscoverCardComponent implements OnInit {
     @Input() public discoverType: DiscoverType;
     @Input() public result: IDiscoverCardResult;
     @Input() public isAdmin: boolean;
+    @Input() public is4kEnabled: boolean = false;
     public RequestType = RequestType;
     public hide: boolean;
     public fullyLoaded = false;
@@ -111,7 +112,7 @@ export class DiscoverCardComponent implements OnInit {
         return "";
     }
 
-    public request(event: any) {
+    public request(event: any, is4k: boolean) {
         event.preventDefault();
         this.loading = true;
         switch (this.result.type) {
@@ -121,14 +122,15 @@ export class DiscoverCardComponent implements OnInit {
                 return;
             case RequestType.movie:
                 if (this.isAdmin) {
-                    const dialog = this.dialog.open(AdminRequestDialogComponent, { width: "700px", data: { type: RequestType.movie, id: this.result.id }, panelClass: 'modal-panel' });
+                    const dialog = this.dialog.open(AdminRequestDialogComponent, { width: "700px", data: { type: RequestType.movie, id: this.result.id,  }, panelClass: 'modal-panel' });
                     dialog.afterClosed().subscribe((result) => {
                         if (result) {
                                 this.requestService.requestMovie({ theMovieDbId: +this.result.id,
                                     languageCode: this.translate.currentLang,
                                     qualityPathOverride: result.radarrPathId,
                                     requestOnBehalf: result.username?.id,
-                                    rootFolderOverride: result.radarrFolderId, }).subscribe(x => {
+                                    rootFolderOverride: result.radarrFolderId,
+                                    is4KRequest: is4k }).subscribe(x => {
                                 if (x.result) {
                                     this.result.requested = true;
                                     this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");
@@ -139,7 +141,7 @@ export class DiscoverCardComponent implements OnInit {
                         }
                     });
                 } else {
-                this.requestService.requestMovie({ theMovieDbId: +this.result.id, languageCode: this.translate.currentLang, requestOnBehalf: null, qualityPathOverride: null, rootFolderOverride: null }).subscribe(x => {
+                this.requestService.requestMovie({ theMovieDbId: +this.result.id, languageCode: this.translate.currentLang, requestOnBehalf: null, qualityPathOverride: null, rootFolderOverride: null, is4KRequest: is4k }).subscribe(x => {
                     if (x.result) {
                         this.result.requested = true;
                         this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");

src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.html

@@ -8,6 +8,6 @@
 
 <p-carousel #carousel [numVisible]="10" [numScroll]="10" [page]="0" [value]="discoverResults" [responsiveOptions]="responsiveOptions" (onPage)="newPage()">
     <ng-template let-result pTemplate="item">
-        <discover-card [discoverType]="discoverType" [isAdmin]="isAdmin" [result]="result"></discover-card>
+        <discover-card [discoverType]="discoverType" [isAdmin]="isAdmin" [result]="result" [is4kEnabled]="is4kEnabled"></discover-card>
     </ng-template>
 </p-carousel>

src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.ts

@@ -5,6 +5,7 @@ import { SearchV2Service } from "../../../services";
 import { StorageService } from "../../../shared/storage/storage-service";
 import { MatButtonToggleChange } from '@angular/material/button-toggle';
 import { Carousel } from 'primeng/carousel';
+import { FeaturesFacade } from "../../../state/features/features.facade";
 
 export enum DiscoverType {
     Upcoming,
@@ -36,6 +37,7 @@ export class CarouselListComponent implements OnInit {
     public RequestType = RequestType;
     public loadingFlag: boolean;
     public DiscoverType = DiscoverType;
+    public is4kEnabled = false;
 
     get mediaTypeStorageKey() {
         return "DiscoverOptions" + this.discoverType.toString();
@@ -44,7 +46,8 @@ export class CarouselListComponent implements OnInit {
     private currentlyLoaded = 0;
 
     constructor(private searchService: SearchV2Service,
-        private storageService: StorageService) {
+        private storageService: StorageService,
+        private featureFacade: FeaturesFacade) {
         this.responsiveOptions = [
             {
                 breakpoint: '4000px',
@@ -135,6 +138,7 @@ export class CarouselListComponent implements OnInit {
     }
 
     public async ngOnInit() {
+        this.is4kEnabled = this.featureFacade.is4kEnabled();
         this.currentlyLoaded = 0;
         const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
         if (localDiscoverOptions) {

src/Ombi/ClientApp/src/app/discover/components/collections/discover-collections.component.html

@@ -16,7 +16,7 @@
 </div>
     <div *ngIf="discoverResults" class="row full-height">
         <div class="col-xl-2 col-lg-3 col-md-3 col-6 col-sm-4 small-padding" *ngFor="let result of discoverResults">
-            <discover-card [isAdmin]="isAdmins" [result]="result"></discover-card>
+            <discover-card [isAdmin]="isAdmins" [result]="result" [is4kEnabled]="is4kEnabled"></discover-card>
         </div>
     </div>
 </div>

src/Ombi/ClientApp/src/app/discover/components/collections/discover-collections.component.ts

@@ -8,6 +8,7 @@ import { IDiscoverCardResult } from "../../interfaces";
 import { IMovieCollectionsViewModel } from "../../../interfaces/ISearchTvResultV2";
 import { RequestServiceV2 } from "../../../services/requestV2.service";
 import { RequestType } from "../../../interfaces";
+import { FeaturesFacade } from "../../../state/features/features.facade";
 
 @Component({
     templateUrl: "./discover-collections.component.html",
@@ -19,6 +20,7 @@ export class DiscoverCollectionsComponent implements OnInit {
     public collection: IMovieCollectionsViewModel;
     public loadingFlag: boolean;
     public isAdmin: boolean;
+    public is4kEnabled = false;
 
     public discoverResults: IDiscoverCardResult[] = [];
 
@@ -27,13 +29,15 @@ export class DiscoverCollectionsComponent implements OnInit {
          private requestServiceV2: RequestServiceV2,
          private messageService: MessageService,
          private auth: AuthService,
-         private translate: TranslateService) {
+         private translate: TranslateService,
+         private featureFacade: FeaturesFacade) {
         this.route.params.subscribe((params: any) => {
             this.collectionId = params.collectionId;
         });
      }
 
     public async ngOnInit() {
+        this.is4kEnabled = this.featureFacade.is4kEnabled();
         this.loadingFlag = true;
         this.isAdmin = this.auth.isAdmin();
         this.collection = await this.searchService.getMovieCollections(this.collectionId);

src/Ombi/ClientApp/src/app/discover/components/search-results/search-results.component.html

@@ -4,7 +4,7 @@
     </div>
     <div *ngIf="discoverResults.length > 0" class="row full-height discoverResults col" >
         <div id="searchResults" class="col-xl-2 col-lg-3 col-md-3 col-6 col-sm-4 small-padding" *ngFor="let result of discoverResults" data-test="searchResultsCount" attr.search-count="{{discoverResults.length}}">
-            <discover-card [isAdmin]="isAdmin" [result]="result"></discover-card>
+            <discover-card [isAdmin]="isAdmin" [result]="result" [is4kEnabled]="is4kEnabled"></discover-card>
         </div>
     </div>
     <div *ngIf="!loadingFlag && discoverResults.length === 0">

src/Ombi/ClientApp/src/app/discover/components/search-results/search-results.component.ts

@@ -10,6 +10,7 @@ import { SearchFilter } from "../../../my-nav/SearchFilter";
 import { SearchV2Service } from "../../../services";
 import { StorageService } from "../../../shared/storage/storage-service";
 import { isEqual } from "lodash";
+import { FeaturesFacade } from "../../../state/features/features.facade";
 
 @Component({
     templateUrl: "./search-results.component.html",
@@ -21,6 +22,7 @@ export class DiscoverSearchResultsComponent implements OnInit {
     public searchTerm: string;
     public results: IMultiSearchResult[];
     public isAdmin: boolean;
+    public is4kEnabled = false;
 
     public discoverResults: IDiscoverCardResult[] = [];
 
@@ -34,7 +36,8 @@ export class DiscoverSearchResultsComponent implements OnInit {
         private router: Router,
         private advancedDataService: AdvancedSearchDialogDataService,
         private store: StorageService,
-        private authService: AuthService) {
+        private authService: AuthService,
+        private featureFacade: FeaturesFacade) {
         this.route.params.subscribe((params: any) => {
             this.isAdvancedSearch = this.router.url === '/discover/advanced/search';
             if (this.isAdvancedSearch) {
@@ -53,6 +56,7 @@ export class DiscoverSearchResultsComponent implements OnInit {
     }
 
     public async ngOnInit() {
+        this.is4kEnabled = this.featureFacade.is4kEnabled();
         this.isAdmin = this.authService.isAdmin();
         this.filterService.onFilterChange.subscribe(async x => {
             if (!isEqual(this.filter, x)) {