github/Ombi
1
0
Fork 0
mirror of https://github.com/Ombi-app/Ombi.git synced 2025-08-20 13:23:20 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Done the wizard

Browse source
This commit is contained in:
Jamie Rees 2019-08-07 13:22:34 +01:00
commit 0c3e04e91c
11 changed files with 135 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/Ombi/ClientApp/src/app/login/login.component.html
View file

@ -20,7 +20,7 @@
<input color="black" type="password" matInput placeholder="{{'Login.PasswordPlaceholder' | translate}}" formControlName="password" />
</mat-form-field>
<mat-checkbox class="white-checkbox" formControlName="rememberMe">{{'Login.RememberMe' | translate}}</mat-checkbox>
<mat-checkbox formControlName="rememberMe">{{'Login.RememberMe' | translate}}</mat-checkbox>
<button mat-raised-button color="accent" type="submit">{{'Login.SignInButton' | translate}}</button>

31
src/Ombi/ClientApp/src/app/wizard/createadmin/createadmin.component.html
View file

@ -1,27 +1,12 @@

<img class="landing-header" src="{{baseUrl}}/images/logo.png" width="300" />
<div class="landing-block shadow">
<div class="media">
<div id="contentBody" class="media-body">
<h4 class="media-heading landing-title">Create the Admin account</h4>
<small>This account will be used to configure your settings and also manage all of the requests.</small>
<div class="form-group">
<div>
<label for="adminUsername">Username</label>
<input type="text" class="form-control form-control-custom" id="adminUsername" name="Username" [(ngModel)]="username" placeholder="Username">
</div>
<br />
<div>
<label for="adminPassword">Password</label>
<input type="password" class="form-control form-control-custom" id="adminPassword" name="Password" [(ngModel)]="password" placeholder="Password">
</div>
<div>
<mat-form-field>
<input matInput type="text" id="adminUsername" name="Username" [(ngModel)]="user.username" placeholder="Username">
</mat-form-field>
</div> <div>
<mat-form-field>
<input type="password" matInput id="adminPassword" name="Password" [(ngModel)]="user.password" placeholder="Password">
</mat-form-field>
</div>
<div class="form-group">
<div style="text-align: center; margin-top: 20px">
<button (click)="createUser()" data-test="createuserbtn" type="submit" class="btn btn-success-outline">Finish</button>
</div>
</div>
</div>
</div>
</div>

21
src/Ombi/ClientApp/src/app/wizard/createadmin/createadmin.component.ts
View file

@ -1,21 +1,25 @@
import { Component, OnInit } from "@angular/core";
import { Component, OnInit, Input } from "@angular/core";
import { Router } from "@angular/router";
import { PlatformLocation } from "@angular/common";
import { IdentityService } from "../../services";
import { NotificationService } from "../../services";
import { ICreateWizardUser } from "../../interfaces";
@Component({
selector: "wizard-local-admin",
templateUrl: "./createadmin.component.html",
})
export class CreateAdminComponent implements OnInit {
@Input() user: ICreateWizardUser;
public username: string;
public password: string;
public baseUrl: string;
constructor(private identityService: IdentityService, private notificationService: NotificationService,
private router: Router, private location: PlatformLocation) { }
constructor(private location: PlatformLocation) { }
public ngOnInit(): void {
const base = this.location.getBaseHrefFromDOM();
@ -24,15 +28,4 @@ export class CreateAdminComponent implements OnInit {
}
}
public createUser() {
this.identityService.createWizardUser({ username: this.username, password: this.password, usePlexAdminAccount: false }).subscribe(x => {
if (x.result) {
this.router.navigate(["login"]);
} else {
if (x.errors.length > 0) {
this.notificationService.error(x.errors[0]);
}
}
});
}
}

40
src/Ombi/ClientApp/src/app/wizard/emby/emby.component.html
View file

@ -1,43 +1,31 @@

<img class="landing-header" src="{{baseUrl}}/images/logo.png" width="300" />
<div class="landing-block shadow">
<div class="media">
<div id="contentBody" class="media-body">
<h4 class="media-heading landing-title">Emby Authentication</h4>
<div *ngIf="embySettings">
<div *ngIf="embySettings.servers">
<div *ngFor="let server of embySettings.servers">
<div class="form-group">
<label for="Ip" class="control-label">Emby Hostname or IP Address</label>
<div>
<input type="text" [(ngModel)]="server.ip" class="form-control form-control-custom " id="Ip" name="Ip" placeholder="192.168.1.1">
</div>
<mat-form-field>
<input type="text" matInput [(ngModel)]="server.ip" id="Ip" name="Ip" placeholder="Emby Hostname or IP Address">
</mat-form-field>
</div>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div>
<mat-form-field>
<input type="text" matInput [(ngModel)]="server.port" id="portNumber" name="Port" value="{{server.port}}">
</mat-form-field>
</div>
<div>
<input type="text" [(ngModel)]="server.port" class="form-control form-control-custom " id="portNumber" name="Port" value="{{server.port}}">
<mat-slide-toggle [(ngModel)]="server.ssl">Enable SSL</mat-slide-toggle>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" [(ngModel)]="server.ssl" id="Ssl" name="Ssl"><label for="Ssl">SSL</label>
</div>
</div>
<div class="form-group">
<label for="username" class="control-label">Api Key</label>
<div>
<input type="text" [(ngModel)]="server.apiKey" class="form-control form-control-custom" id="apiKey" name="ApiKey" placeholder="ApiKey">
</div>
<mat-form-field>
<input type="text" matInput [(ngModel)]="server.apiKey" id="apiKey" name="ApiKey" placeholder="Emby API Key">
</mat-form-field>
</div>
<div style="text-align: center; margin-top: 20px">
<a (click)="save()" id="embyApiKeySave" class="btn btn-primary-outline">Next <div id="spinner"></div></a>
<a (click)="save()" id="embyApiKeySave" mat-raised-button color="primary">Save <div id="spinner"></div></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

4
src/Ombi/ClientApp/src/app/wizard/emby/emby.component.ts
View file

@ -8,6 +8,7 @@ import { PlatformLocation } from "@angular/common";
import { IEmbySettings } from "../../interfaces";
@Component({
selector: "wizard-emby",
templateUrl: "./emby.component.html",
})
export class EmbyComponent implements OnInit {
@ -52,7 +53,8 @@ export class EmbyComponent implements OnInit {
this.notificationService.error("Username or password was incorrect. Could not authenticate with Emby.");
return;
}
this.router.navigate(["Wizard/CreateAdmin"]);
this.notificationService.success("Done! Please press next");
});
}
}

36
src/Ombi/ClientApp/src/app/wizard/plex/plex.component.html
View file

@ -1,34 +1,24 @@

<img class="landing-header" src="{{baseUrl}}/images/logo.png" width="300" />
<div class="landing-block shadow">
<div class="media">
<div id="contentBody" class="media-body">
<h4 class="media-heading landing-title">Plex Authentication</h4>
<div class="form-group">
<label for="username" class="control-label">Username and Password</label>
<div class="form-group">
<div>
<input type="text" [(ngModel)]="login" class="form-control form-control-custom" id="username" placeholder="Username">
</div>
<br />
<div>
<input type="password" [(ngModel)]="password" class="form-control form-control-custom" placeholder="Password">
</div>
<mat-form-field>
<input matInput type="text" [(ngModel)]="login" id="username" placeholder="Username">
</mat-form-field>
</div>
<small>Please note we do not store this information, we only store your Plex Authorization Token that will allow Ombi to view your media and friends</small>
<div>
<mat-form-field>
<input matInput type="password" [(ngModel)]="password" placeholder="Password">
</mat-form-field>
</div>
</div>
<small>Please note we do not store this information, we only store your Plex Authorization Token that will allow Ombi to view your media and users</small>
<div class="form-group">
<div style="text-align: center; margin-top: 20px">
<button (click)="requestAuthToken()" class="btn btn-success-outline">Request Token <i class="fa fa-key"></i></button>
<button (click)="requestAuthToken()" mat-raised-button color="primary" >Request Token <i class="fa fa-key"></i></button>
</div>
</div>
<p class="text-center">OR</p>
<div class="form-group">
<div style="text-align: center; margin-top: 20px">
<button (click)="oauth()" class="btn btn-primary" type="button">Continue With Plex</button>
<button (click)="oauth()" mat-raised-button color="accent" type="button">Continue With Plex</button>
</div>
</div>
</div>
</div>
</div>
<p-confirmDialog></p-confirmDialog>

1
src/Ombi/ClientApp/src/app/wizard/plex/plex.component.ts
View file

@ -8,6 +8,7 @@ import { IdentityService, NotificationService } from "../../services";
import { StorageService } from "../../shared/storage/storage-service";
@Component({
selector: "wizard-plex",
templateUrl: "./plex.component.html",
})
export class PlexComponent implements OnInit, OnDestroy {

58
src/Ombi/ClientApp/src/app/wizard/welcome/welcome.component.html
View file

@ -1,18 +1,56 @@
<div class="container">
<img class="landing-header" src="{{baseUrl}}/images/logo.png" width="300" />
<div id="area" class="landing-block shadow">
<div class="media">
<div id="contentBody" class="media-body">
<h4 class="media-heading landing-title" id="statusTitle">Welcome to Ombi</h4>
<div class="form-group">
<small>we are just going to run though the initial Ombi setup!</small>
<mat-horizontal-stepper linear #stepper>
<mat-step >
<form >
<ng-template matStepLabel>Welcome</ng-template>
<p>Welcome to Ombi, this wizard will quickly take you through the inital setup!</p>
<div>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<div style="text-align: center; margin-top: 20px">
<a (click)="next()" data-test="nextbtn" class="btn btn-primary-outline">Next</a>
<mat-step [optional]="true">
<form >
<ng-template matStepLabel>Plex</ng-template>
<wizard-plex></wizard-plex>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step [optional]="true">
<form >
<ng-template matStepLabel>Emby</ng-template>
<wizard-emby></wizard-emby>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step>
<form >
<ng-template matStepLabel>Create a local admin</ng-template>
<wizard-local-admin [user]="localUser"></wizard-local-admin>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step>
<ng-template matStepLabel>Done</ng-template>
All setup! Press Finish to continue and login to Ombi!
<div>
<button mat-button matStepperPrevious (click)="createUser()">Finish</button>
<button mat-button (click)="stepper.reset()">Reset</button>
</div>
</div>
</mat-step>
</mat-horizontal-stepper>
</div>

23
src/Ombi/ClientApp/src/app/wizard/welcome/welcome.component.ts
View file

@ -1,6 +1,8 @@
import { PlatformLocation } from "@angular/common";
import { Component, OnInit } from "@angular/core";
import { Router } from "@angular/router";
import { ICreateWizardUser } from "../../interfaces";
import { IdentityService, NotificationService } from "../../services";
@Component({
templateUrl: "./welcome.component.html",
@ -8,17 +10,32 @@ import { Router } from "@angular/router";
export class WelcomeComponent implements OnInit {
public baseUrl: string;
public localUser: ICreateWizardUser;
constructor(private router: Router, private location: PlatformLocation) { }
constructor(private router: Router, private location: PlatformLocation,
private identityService: IdentityService, private notificationService: NotificationService) { }
public ngOnInit(): void {
this.localUser = {
password:"",
username:"",
usePlexAdminAccount:false
}
const base = this.location.getBaseHrefFromDOM();
if (base.length > 1) {
this.baseUrl = base;
}
}
public next() {
this.router.navigate(["Wizard/MediaServer"]);
public createUser() {
this.identityService.createWizardUser(this.localUser).subscribe(x => {
if (x.result) {
this.router.navigate(["login"]);
} else {
if (x.errors.length > 0) {
this.notificationService.error(x.errors[0]);
}
}
});
}
}

8
src/Ombi/ClientApp/src/app/wizard/wizard.module.ts
View file

@ -1,6 +1,6 @@
import { CommonModule } from "@angular/common";
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { RouterModule, Routes } from "@angular/router";
import {ConfirmationService, ConfirmDialogModule } from "primeng/primeng";
@ -17,6 +17,8 @@ import { PlexService } from "../services";
import { IdentityService } from "../services";
import { PlexOAuthService } from "../services";
import { SharedModule } from "../shared/shared.module";
const routes: Routes = [
{ path: "", component: WelcomeComponent},
{ path: "MediaServer", component: MediaServerComponent},
@ -28,7 +30,10 @@ const routes: Routes = [
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
ConfirmDialogModule,
SharedModule,
MatStepperModule,
RouterModule.forChild(routes),
],
declarations: [
@ -46,7 +51,6 @@ const routes: Routes = [
IdentityService,
EmbyService,
ConfirmationService,
MatStepperModule,
PlexOAuthService,
],

10
src/Ombi/Controllers/V1/IdentityController.cs
View file

@ -204,6 +204,11 @@ namespace Ombi.Controllers.V1
{
_log.LogInformation("Added the Admin role");
}
// Update the wizard flag
var settings = await OmbiSettings.GetSettingsAsync();
settings.Wizard = true;
await OmbiSettings.SaveSettingsAsync(settings);
}
if (!result.Succeeded)
{
@ -211,11 +216,6 @@ namespace Ombi.Controllers.V1
retVal.Errors.AddRange(result.Errors.Select(x => x.Description));
}
// Update the wizard flag
var settings = await OmbiSettings.GetSettingsAsync();
settings.Wizard = true;
await OmbiSettings.SaveSettingsAsync(settings);
retVal.Result = result.Succeeded;
return retVal;
}