mirror of
https://github.com/Ombi-app/Ombi.git
synced 2025-07-13 08:42:57 -07:00
feat: added 4k to the card
This commit is contained in:
parent
55026e5820
commit
8bb9a08f68
11 changed files with 52 additions and 21 deletions
|
@ -5,7 +5,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="discoverResults" class="row full-height">
|
<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">
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
|
@ -1,4 +1,4 @@
|
||||||
import { Component } from "@angular/core";
|
import { Component, OnInit } from "@angular/core";
|
||||||
import { ActivatedRoute } from "@angular/router";
|
import { ActivatedRoute } from "@angular/router";
|
||||||
import { SearchV2Service } from "../../../services";
|
import { SearchV2Service } from "../../../services";
|
||||||
import { IActorCredits, IActorCast } from "../../../interfaces/ISearchTvResultV2";
|
import { IActorCredits, IActorCast } from "../../../interfaces/ISearchTvResultV2";
|
||||||
|
@ -6,30 +6,31 @@ import { IDiscoverCardResult } from "../../interfaces";
|
||||||
import { RequestType } from "../../../interfaces";
|
import { RequestType } from "../../../interfaces";
|
||||||
import { AuthService } from "../../../auth/auth.service";
|
import { AuthService } from "../../../auth/auth.service";
|
||||||
import { forkJoin } from "rxjs";
|
import { forkJoin } from "rxjs";
|
||||||
import { isEqual } from "lodash";
|
import { FeaturesFacade } from "../../../state/features/features.facade";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
templateUrl: "./discover-actor.component.html",
|
templateUrl: "./discover-actor.component.html",
|
||||||
styleUrls: ["./discover-actor.component.scss"],
|
styleUrls: ["./discover-actor.component.scss"],
|
||||||
})
|
})
|
||||||
export class DiscoverActorComponent {
|
export class DiscoverActorComponent implements OnInit {
|
||||||
public actorId: number;
|
public actorId: number;
|
||||||
public loadingFlag: boolean;
|
public loadingFlag: boolean;
|
||||||
public isAdmin: boolean;
|
public isAdmin: boolean;
|
||||||
|
public is4kEnabled = false;
|
||||||
|
|
||||||
public discoverResults: IDiscoverCardResult[] = [];
|
public discoverResults: IDiscoverCardResult[] = [];
|
||||||
|
|
||||||
constructor(private searchService: SearchV2Service,
|
constructor(private searchService: SearchV2Service,
|
||||||
private route: ActivatedRoute,
|
private route: ActivatedRoute,
|
||||||
private auth: AuthService) {
|
private auth: AuthService,
|
||||||
|
private featureService: FeaturesFacade) {
|
||||||
this.route.params.subscribe((params: any) => {
|
this.route.params.subscribe((params: any) => {
|
||||||
this.actorId = params.actorId;
|
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.discoverResults = [];
|
||||||
this.loading();
|
this.loading();
|
||||||
|
|
||||||
|
|
|
@ -20,12 +20,24 @@
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div [ngClass]="result.posterPath.includes('images/') ? 'button-request-container-show' : 'button-request-container'" class="row" *ngIf="!result.available && !result.approved && !result.requested">
|
<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="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>
|
<i *ngIf="loading" class="fas fa-spinner fa-pulse fa-2x fa-fw" aria-hidden="true"></i>
|
||||||
{{'Common.Request' | translate }}
|
{{'Common.Request' | translate }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</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>
|
||||||
</div>
|
</div>
|
|
@ -293,3 +293,7 @@ a.poster-overlay:hover{
|
||||||
.btn-ombi{
|
.btn-ombi{
|
||||||
background-color:#293a4c;
|
background-color:#293a4c;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mat-menu-panel {
|
||||||
|
min-width: 190px !important;
|
||||||
|
}
|
|
@ -21,6 +21,7 @@ export class DiscoverCardComponent implements OnInit {
|
||||||
@Input() public discoverType: DiscoverType;
|
@Input() public discoverType: DiscoverType;
|
||||||
@Input() public result: IDiscoverCardResult;
|
@Input() public result: IDiscoverCardResult;
|
||||||
@Input() public isAdmin: boolean;
|
@Input() public isAdmin: boolean;
|
||||||
|
@Input() public is4kEnabled: boolean = false;
|
||||||
public RequestType = RequestType;
|
public RequestType = RequestType;
|
||||||
public hide: boolean;
|
public hide: boolean;
|
||||||
public fullyLoaded = false;
|
public fullyLoaded = false;
|
||||||
|
@ -111,7 +112,7 @@ export class DiscoverCardComponent implements OnInit {
|
||||||
return "";
|
return "";
|
||||||
}
|
}
|
||||||
|
|
||||||
public request(event: any) {
|
public request(event: any, is4k: boolean) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
switch (this.result.type) {
|
switch (this.result.type) {
|
||||||
|
@ -121,14 +122,15 @@ export class DiscoverCardComponent implements OnInit {
|
||||||
return;
|
return;
|
||||||
case RequestType.movie:
|
case RequestType.movie:
|
||||||
if (this.isAdmin) {
|
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) => {
|
dialog.afterClosed().subscribe((result) => {
|
||||||
if (result) {
|
if (result) {
|
||||||
this.requestService.requestMovie({ theMovieDbId: +this.result.id,
|
this.requestService.requestMovie({ theMovieDbId: +this.result.id,
|
||||||
languageCode: this.translate.currentLang,
|
languageCode: this.translate.currentLang,
|
||||||
qualityPathOverride: result.radarrPathId,
|
qualityPathOverride: result.radarrPathId,
|
||||||
requestOnBehalf: result.username?.id,
|
requestOnBehalf: result.username?.id,
|
||||||
rootFolderOverride: result.radarrFolderId, }).subscribe(x => {
|
rootFolderOverride: result.radarrFolderId,
|
||||||
|
is4KRequest: is4k }).subscribe(x => {
|
||||||
if (x.result) {
|
if (x.result) {
|
||||||
this.result.requested = true;
|
this.result.requested = true;
|
||||||
this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");
|
this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");
|
||||||
|
@ -139,7 +141,7 @@ export class DiscoverCardComponent implements OnInit {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} 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) {
|
if (x.result) {
|
||||||
this.result.requested = true;
|
this.result.requested = true;
|
||||||
this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");
|
this.messageService.send(this.translate.instant("Requests.RequestAddedSuccessfully", { title: this.result.title }), "Ok");
|
||||||
|
|
|
@ -8,6 +8,6 @@
|
||||||
|
|
||||||
<p-carousel #carousel [numVisible]="10" [numScroll]="10" [page]="0" [value]="discoverResults" [responsiveOptions]="responsiveOptions" (onPage)="newPage()">
|
<p-carousel #carousel [numVisible]="10" [numScroll]="10" [page]="0" [value]="discoverResults" [responsiveOptions]="responsiveOptions" (onPage)="newPage()">
|
||||||
<ng-template let-result pTemplate="item">
|
<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>
|
</ng-template>
|
||||||
</p-carousel>
|
</p-carousel>
|
|
@ -5,6 +5,7 @@ import { SearchV2Service } from "../../../services";
|
||||||
import { StorageService } from "../../../shared/storage/storage-service";
|
import { StorageService } from "../../../shared/storage/storage-service";
|
||||||
import { MatButtonToggleChange } from '@angular/material/button-toggle';
|
import { MatButtonToggleChange } from '@angular/material/button-toggle';
|
||||||
import { Carousel } from 'primeng/carousel';
|
import { Carousel } from 'primeng/carousel';
|
||||||
|
import { FeaturesFacade } from "../../../state/features/features.facade";
|
||||||
|
|
||||||
export enum DiscoverType {
|
export enum DiscoverType {
|
||||||
Upcoming,
|
Upcoming,
|
||||||
|
@ -36,6 +37,7 @@ export class CarouselListComponent implements OnInit {
|
||||||
public RequestType = RequestType;
|
public RequestType = RequestType;
|
||||||
public loadingFlag: boolean;
|
public loadingFlag: boolean;
|
||||||
public DiscoverType = DiscoverType;
|
public DiscoverType = DiscoverType;
|
||||||
|
public is4kEnabled = false;
|
||||||
|
|
||||||
get mediaTypeStorageKey() {
|
get mediaTypeStorageKey() {
|
||||||
return "DiscoverOptions" + this.discoverType.toString();
|
return "DiscoverOptions" + this.discoverType.toString();
|
||||||
|
@ -44,7 +46,8 @@ export class CarouselListComponent implements OnInit {
|
||||||
private currentlyLoaded = 0;
|
private currentlyLoaded = 0;
|
||||||
|
|
||||||
constructor(private searchService: SearchV2Service,
|
constructor(private searchService: SearchV2Service,
|
||||||
private storageService: StorageService) {
|
private storageService: StorageService,
|
||||||
|
private featureFacade: FeaturesFacade) {
|
||||||
this.responsiveOptions = [
|
this.responsiveOptions = [
|
||||||
{
|
{
|
||||||
breakpoint: '4000px',
|
breakpoint: '4000px',
|
||||||
|
@ -135,6 +138,7 @@ export class CarouselListComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
public async ngOnInit() {
|
public async ngOnInit() {
|
||||||
|
this.is4kEnabled = this.featureFacade.is4kEnabled();
|
||||||
this.currentlyLoaded = 0;
|
this.currentlyLoaded = 0;
|
||||||
const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
|
const localDiscoverOptions = +this.storageService.get(this.mediaTypeStorageKey);
|
||||||
if (localDiscoverOptions) {
|
if (localDiscoverOptions) {
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="discoverResults" class="row full-height">
|
<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">
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
|
@ -8,6 +8,7 @@ import { IDiscoverCardResult } from "../../interfaces";
|
||||||
import { IMovieCollectionsViewModel } from "../../../interfaces/ISearchTvResultV2";
|
import { IMovieCollectionsViewModel } from "../../../interfaces/ISearchTvResultV2";
|
||||||
import { RequestServiceV2 } from "../../../services/requestV2.service";
|
import { RequestServiceV2 } from "../../../services/requestV2.service";
|
||||||
import { RequestType } from "../../../interfaces";
|
import { RequestType } from "../../../interfaces";
|
||||||
|
import { FeaturesFacade } from "../../../state/features/features.facade";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
templateUrl: "./discover-collections.component.html",
|
templateUrl: "./discover-collections.component.html",
|
||||||
|
@ -19,6 +20,7 @@ export class DiscoverCollectionsComponent implements OnInit {
|
||||||
public collection: IMovieCollectionsViewModel;
|
public collection: IMovieCollectionsViewModel;
|
||||||
public loadingFlag: boolean;
|
public loadingFlag: boolean;
|
||||||
public isAdmin: boolean;
|
public isAdmin: boolean;
|
||||||
|
public is4kEnabled = false;
|
||||||
|
|
||||||
public discoverResults: IDiscoverCardResult[] = [];
|
public discoverResults: IDiscoverCardResult[] = [];
|
||||||
|
|
||||||
|
@ -27,13 +29,15 @@ export class DiscoverCollectionsComponent implements OnInit {
|
||||||
private requestServiceV2: RequestServiceV2,
|
private requestServiceV2: RequestServiceV2,
|
||||||
private messageService: MessageService,
|
private messageService: MessageService,
|
||||||
private auth: AuthService,
|
private auth: AuthService,
|
||||||
private translate: TranslateService) {
|
private translate: TranslateService,
|
||||||
|
private featureFacade: FeaturesFacade) {
|
||||||
this.route.params.subscribe((params: any) => {
|
this.route.params.subscribe((params: any) => {
|
||||||
this.collectionId = params.collectionId;
|
this.collectionId = params.collectionId;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
public async ngOnInit() {
|
public async ngOnInit() {
|
||||||
|
this.is4kEnabled = this.featureFacade.is4kEnabled();
|
||||||
this.loadingFlag = true;
|
this.loadingFlag = true;
|
||||||
this.isAdmin = this.auth.isAdmin();
|
this.isAdmin = this.auth.isAdmin();
|
||||||
this.collection = await this.searchService.getMovieCollections(this.collectionId);
|
this.collection = await this.searchService.getMovieCollections(this.collectionId);
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="discoverResults.length > 0" class="row full-height discoverResults col" >
|
<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}}">
|
<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>
|
</div>
|
||||||
<div *ngIf="!loadingFlag && discoverResults.length === 0">
|
<div *ngIf="!loadingFlag && discoverResults.length === 0">
|
||||||
|
|
|
@ -10,6 +10,7 @@ import { SearchFilter } from "../../../my-nav/SearchFilter";
|
||||||
import { SearchV2Service } from "../../../services";
|
import { SearchV2Service } from "../../../services";
|
||||||
import { StorageService } from "../../../shared/storage/storage-service";
|
import { StorageService } from "../../../shared/storage/storage-service";
|
||||||
import { isEqual } from "lodash";
|
import { isEqual } from "lodash";
|
||||||
|
import { FeaturesFacade } from "../../../state/features/features.facade";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
templateUrl: "./search-results.component.html",
|
templateUrl: "./search-results.component.html",
|
||||||
|
@ -21,6 +22,7 @@ export class DiscoverSearchResultsComponent implements OnInit {
|
||||||
public searchTerm: string;
|
public searchTerm: string;
|
||||||
public results: IMultiSearchResult[];
|
public results: IMultiSearchResult[];
|
||||||
public isAdmin: boolean;
|
public isAdmin: boolean;
|
||||||
|
public is4kEnabled = false;
|
||||||
|
|
||||||
public discoverResults: IDiscoverCardResult[] = [];
|
public discoverResults: IDiscoverCardResult[] = [];
|
||||||
|
|
||||||
|
@ -34,7 +36,8 @@ export class DiscoverSearchResultsComponent implements OnInit {
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private advancedDataService: AdvancedSearchDialogDataService,
|
private advancedDataService: AdvancedSearchDialogDataService,
|
||||||
private store: StorageService,
|
private store: StorageService,
|
||||||
private authService: AuthService) {
|
private authService: AuthService,
|
||||||
|
private featureFacade: FeaturesFacade) {
|
||||||
this.route.params.subscribe((params: any) => {
|
this.route.params.subscribe((params: any) => {
|
||||||
this.isAdvancedSearch = this.router.url === '/discover/advanced/search';
|
this.isAdvancedSearch = this.router.url === '/discover/advanced/search';
|
||||||
if (this.isAdvancedSearch) {
|
if (this.isAdvancedSearch) {
|
||||||
|
@ -53,6 +56,7 @@ export class DiscoverSearchResultsComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
public async ngOnInit() {
|
public async ngOnInit() {
|
||||||
|
this.is4kEnabled = this.featureFacade.is4kEnabled();
|
||||||
this.isAdmin = this.authService.isAdmin();
|
this.isAdmin = this.authService.isAdmin();
|
||||||
this.filterService.onFilterChange.subscribe(async x => {
|
this.filterService.onFilterChange.subscribe(async x => {
|
||||||
if (!isEqual(this.filter, x)) {
|
if (!isEqual(this.filter, x)) {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue