From 8aba799681b7ada7f78472daca1eb974795ce3f4 Mon Sep 17 00:00:00 2001 From: TidusJar Date: Sat, 18 Aug 2018 21:20:52 +0100 Subject: [PATCH] !wip almost finished the add plex friend --- .../usermanagement/addplexuser.component.html | 59 ++++++++++++ .../usermanagement/addplexuser.component.ts | 93 +++++++++++++++---- .../usermanagement.component.html | 2 +- .../usermanagement.component.ts | 59 +----------- src/Ombi/ClientApp/styles/base.scss | 15 +++ 5 files changed, 154 insertions(+), 74 deletions(-) create mode 100644 src/Ombi/ClientApp/app/usermanagement/addplexuser.component.html diff --git a/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.html b/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.html new file mode 100644 index 000000000..d21509043 --- /dev/null +++ b/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.html @@ -0,0 +1,59 @@ + + + + \ No newline at end of file diff --git a/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.ts b/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.ts index da63b67dd..c45dfc0e9 100644 --- a/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.ts +++ b/src/Ombi/ClientApp/app/usermanagement/addplexuser.component.ts @@ -1,25 +1,84 @@ -import { Component, Input } from "@angular/core"; +import { Component, Input, OnInit } from "@angular/core"; +import { FormBuilder, FormGroup, Validators } from "@angular/forms"; import { NgbActiveModal } from "@ng-bootstrap/ng-bootstrap"; +import { NotificationService, PlexService } from "../services"; + +import { IPlexLibraries, IPlexServersAdd } from "../interfaces"; + @Component({ - selector: "ngbd-modal-content", -template: ` - - - -`, + selector: "ngbd-modal-content", + templateUrl: "./addplexuser.component.html", }) -export class AddPlexUserComponent { - - @Input() public name: string; +export class AddPlexUserComponent implements OnInit { + + @Input() public name: string; + + public plexServers: IPlexServersAdd[]; + public plexLibs: IPlexLibraries; + + public libsSelected: number[] = []; + + public form: FormGroup; + + constructor(public activeModal: NgbActiveModal, + private plexService: PlexService, + private notificationService: NotificationService, + private fb: FormBuilder) { + } + + public ngOnInit(): void { + this.form = this.fb.group({ + selectedServer: [null, Validators.required], + allLibsSelected: [true], + username:[null, Validators.required], + }); + this.getServers(); + } - constructor(public activeModal: NgbActiveModal) { - console.log("called"); + public getServers() { + this.plexService.getServersFromSettings().subscribe(x => { + if (x.success) { + this.plexServers = x.servers; + } + }); } + public getPlexLibs(machineId: string) { + this.plexService.getLibrariesFromSettings(machineId).subscribe(x => { + if (x.successful) { + this.plexLibs = x.data; + } + }); + } + + public selected() { + this.getPlexLibs(this.form.value.selectedServer); + } + + public checkedLib(checked: boolean, value: number) { + if(checked) { + this.libsSelected.push(value); + } else { + this.libsSelected = this.libsSelected.filter(v => v !== value); + } + } + + public onSubmit(form: FormGroup) { + debugger; + if (form.invalid) { + this.notificationService.error("Please check your entered values"); + return; + } + const libs = form.value.allLibsSelected ? this.plexLibs.mediaContainer.directory.map(x => +x.key) : this.libsSelected; + + this.plexService.addUserToServer({ username: form.value.username, machineIdentifier: form.value.selectedServer, libsSelected: libs }).subscribe(x => { + if (x.success) { + this.notificationService.success("User added to Plex"); + } else { + this.notificationService.error(x.error); + } + }); + + } } diff --git a/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.html b/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.html index c38e87a51..6d371847d 100644 --- a/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.html +++ b/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.html @@ -2,7 +2,7 @@
- +
diff --git a/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.ts b/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.ts index 6f48d4080..082a6086c 100644 --- a/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.ts +++ b/src/Ombi/ClientApp/app/usermanagement/usermanagement.component.ts @@ -1,28 +1,12 @@ import { Component, OnInit } from "@angular/core"; import { NgbModal } from "@ng-bootstrap/ng-bootstrap"; -import { ICheckbox, ICustomizationSettings, IEmailNotificationSettings, IPlexLibraries, IPlexServersAdd, IUser } from "../interfaces"; -import { IdentityService, NotificationService, PlexService, SettingsService } from "../services"; +import { ICheckbox, ICustomizationSettings, IEmailNotificationSettings, IUser } from "../interfaces"; +import { IdentityService, NotificationService, SettingsService } from "../services"; import { AddPlexUserComponent } from "./addplexuser.component"; @Component({ templateUrl: "./usermanagement.component.html", - styles:[`.modal-backdrop.fade{opacity:0.5} - .fade { - opacity:1 !important; - } - .modal { - display: none; - overflow: hidden; - position: fixed; - top: 100px; - right: 0; - bottom: 0; - left: 0; - z-index: 1050; - -webkit-overflow-scrolling: touch; - outline: 0; - }`], }) export class UserManagementComponent implements OnInit { @@ -39,18 +23,11 @@ export class UserManagementComponent implements OnInit { public bulkMovieLimit?: number; public bulkEpisodeLimit?: number; public plexEnabled: boolean; - public plexServers: IPlexServersAdd[]; - public plexLibs: IPlexLibraries; - - public plexUsername: string; - public libsSelected: number[]; - public machineId: string; constructor(private identityService: IdentityService, private settingsService: SettingsService, private notificationService: NotificationService, private plexSettings: SettingsService, - private plexService: PlexService, private modalService: NgbModal) { } public ngOnInit() { @@ -67,7 +44,7 @@ export class UserManagementComponent implements OnInit { } public open() { - const modalRef = this.modalService.open(AddPlexUserComponent, {container:"ombi"}); + const modalRef = this.modalService.open(AddPlexUserComponent, {container:"ombi", backdropClass:"custom-modal-backdrop", windowClass:"window"}); modalRef.componentInstance.name = "World"; } @@ -153,34 +130,4 @@ export class UserManagementComponent implements OnInit { this.order = value; } - - public getServers() { - if(!this.plexEnabled) { - return this.notificationService.error("Plex is not enabled"); - } - - this.plexService.getServersFromSettings().subscribe(x => { - if(x.success) { - this.plexServers = x.servers; - } - }); - } - - public getPlexLibs(machineId: string) { - this.plexService.getLibrariesFromSettings(machineId).subscribe(x => { - if(x.successful) { - this.plexLibs = x.data; - } - }); - } - - public addUser() { - this.plexService.addUserToServer({ username: this.plexUsername, machineIdentifier: this.machineId, libsSelected: this.libsSelected}).subscribe(x => { - if(x.success) { - this.notificationService.success("User added to Plex"); - } else { - this.notificationService.error(x.error); - } - }); - } } diff --git a/src/Ombi/ClientApp/styles/base.scss b/src/Ombi/ClientApp/styles/base.scss index d36986be8..9666e9077 100644 --- a/src/Ombi/ClientApp/styles/base.scss +++ b/src/Ombi/ClientApp/styles/base.scss @@ -966,3 +966,18 @@ a > h4:hover { .subject { display: inline-block; } + +.custom-modal-backdrop { + opacity: 0.5 !important; + filter: alpha(opacity=0.5); +} + +.window { + opacity: 1 !important; + top: 7%; +} + +.modal-header { + background-color: #282828; + padding-top:75px; +} \ No newline at end of file