From 6aa44360bc1edec055a94fea2d02c6f7fa2c4eca Mon Sep 17 00:00:00 2001 From: Zoe Roux Date: Mon, 3 Aug 2020 06:02:52 +0200 Subject: [PATCH] The people list now uses the new api --- .../people-list/people-list.component.html | 4 +-- .../people-list/people-list.component.ts | 35 ++++--------------- .../show-details/show-details.component.html | 2 +- .../show-details/show-details.component.ts | 8 +++-- src/app/services/api.service.ts | 18 ++++++++++ src/models/people.ts | 4 +-- 6 files changed, 36 insertions(+), 35 deletions(-) diff --git a/src/app/components/people-list/people-list.component.html b/src/app/components/people-list/people-list.component.html index 3183cd49..5a271f41 100644 --- a/src/app/components/people-list/people-list.component.html +++ b/src/app/components/people-list/people-list.component.html @@ -1,6 +1,6 @@
-
- +
+
{{people.name}}

{{people.role}}

diff --git a/src/app/components/people-list/people-list.component.ts b/src/app/components/people-list/people-list.component.ts index 7bc29d78..874e2a30 100644 --- a/src/app/components/people-list/people-list.component.ts +++ b/src/app/components/people-list/people-list.component.ts @@ -2,43 +2,22 @@ import { Component, ElementRef, Input, ViewChild } from '@angular/core'; import { MatButton } from "@angular/material/button"; import { DomSanitizer } from "@angular/platform-browser"; import { People } from "../../../models/people"; +import {HorizontalScroller} from "../../misc/horizontal-scroller"; +import {Page} from "../../../models/page"; +import {HttpClient} from "@angular/common/http"; @Component({ selector: 'app-people-list', templateUrl: './people-list.component.html', styleUrls: ['./people-list.component.scss'] }) -export class PeopleListComponent +export class PeopleListComponent extends HorizontalScroller { - @Input() people: People[]; - @ViewChild("scrollView", { static: true }) private scrollView: ElementRef; - @ViewChild("leftBtn", { static: false }) private leftBtn: MatButton; - @ViewChild("rightBtn", { static: false }) private rightBtn: MatButton; + @Input() people: Page; - constructor(private sanitizer: DomSanitizer) { } - - scrollLeft() + constructor(private sanitizer: DomSanitizer, public client: HttpClient) { - let scroll: number = this.scrollView.nativeElement.offsetWidth * 0.80; - this.scrollView.nativeElement.scrollBy({ top: 0, left: -scroll, behavior: "smooth" }); - } - - scrollRight() - { - let scroll: number = this.scrollView.nativeElement.offsetWidth * 0.80; - this.scrollView.nativeElement.scrollBy({ top: 0, left: scroll, behavior: "smooth" }); - } - - onScroll() - { - if (this.scrollView.nativeElement.scrollLeft <= 0) - this.leftBtn._elementRef.nativeElement.classList.add("d-none"); - else - this.leftBtn._elementRef.nativeElement.classList.remove("d-none"); - if (this.scrollView.nativeElement.scrollLeft >= this.scrollView.nativeElement.scrollWidth - this.scrollView.nativeElement.clientWidth) - this.rightBtn._elementRef.nativeElement.classList.add("d-none"); - else - this.rightBtn._elementRef.nativeElement.classList.remove("d-none"); + super(); } getPeopleIcon(slug: string) diff --git a/src/app/pages/show-details/show-details.component.html b/src/app/pages/show-details/show-details.component.html index 9cd8ddf7..25d96cd0 100644 --- a/src/app/pages/show-details/show-details.component.html +++ b/src/app/pages/show-details/show-details.component.html @@ -89,4 +89,4 @@

Staff

- + diff --git a/src/app/pages/show-details/show-details.component.ts b/src/app/pages/show-details/show-details.component.ts index 4d1cbaf1..db17ac7c 100644 --- a/src/app/pages/show-details/show-details.component.ts +++ b/src/app/pages/show-details/show-details.component.ts @@ -8,8 +8,9 @@ import {MatDialog} from "@angular/material/dialog"; import {TrailerDialogComponent} from "../trailer-dialog/trailer-dialog.component"; import {MetadataEditComponent} from "../metadata-edit/metadata-edit.component"; import {Season} from "../../../models/season"; -import {EpisodeService, SeasonService} from "../../services/api.service"; +import {EpisodeService, PeopleService, SeasonService} from "../../services/api.service"; import {Page} from "../../../models/page"; +import {People} from "../../../models/people"; @Component({ selector: 'app-show-details', @@ -22,6 +23,7 @@ export class ShowDetailsComponent implements OnInit seasons: Season[]; season: number = 1; episodes: Page[] = []; + people: Page; private toolbar: HTMLElement; private backdrop: HTMLElement; @@ -32,7 +34,8 @@ export class ShowDetailsComponent implements OnInit private router: Router, private dialog: MatDialog, private seasonService: SeasonService, - private episodeService: EpisodeService) + private episodeService: EpisodeService, + private peopleService: PeopleService) { this.route.queryParams.subscribe(params => { @@ -57,6 +60,7 @@ export class ShowDetailsComponent implements OnInit } }); this.getEpisodes(this.season); + this.peopleService.getFromShow(this.show.slug).subscribe(x => this.people = x); }); } diff --git a/src/app/services/api.service.ts b/src/app/services/api.service.ts index 5d698eb2..821a538e 100644 --- a/src/app/services/api.service.ts +++ b/src/app/services/api.service.ts @@ -8,6 +8,7 @@ import {LibraryItem} from "../../models/library-item"; import {map} from "rxjs/operators"; import {Season} from "../../models/season"; import {Episode} from "../../models/episode"; +import {People} from "../../models/people"; export interface ApiArgs { @@ -118,3 +119,20 @@ export class EpisodeService extends CrudApi .pipe(map(x => Object.assign(new Page(), x))); } } + +@Injectable({ + providedIn: 'root' +}) +export class PeopleService extends CrudApi +{ + constructor(client: HttpClient) + { + super(client, "people"); + } + + getFromShow(show: string | number, args?: ApiArgs): Observable> + { + return this.client.get(`/api/shows/${show}/people${this.ArgsAsQuery(args)}`) + .pipe(map(x => Object.assign(new Page(), x))); + } +} diff --git a/src/models/people.ts b/src/models/people.ts index fc2bd7b9..eec7b335 100644 --- a/src/models/people.ts +++ b/src/models/people.ts @@ -1,8 +1,8 @@ import {ExternalID} from "./external-id"; +import {IResource} from "./resources/resource"; -export interface People +export interface People extends IResource { - slug: string; name: string; role: string; type: string;