Made some UI changes, reworked the Emby and Plex screens to make them more user friendly and no so fugly. #865

Also made the login page placeholder text slightly lighter
pull/1510/head
Jamie.Rees 7 years ago
parent ac0f3f3868
commit e34db987d7

@ -8,7 +8,7 @@ $info-colour: #5bc0de;
$warning-colour: #f0ad4e;
$danger-colour: #d9534f;
$success-colour: #5cb85c;
$placeholder-colour: #1b1b1b;
$placeholder-colour: #3b3b3b;
body, html {
height: 100% !important;

@ -7,7 +7,7 @@
</legend>
<div class="row">
<div class="form-group col-md-3">
<div class="form-group col-md-3">
<div class="checkbox">
<input type="checkbox" id="enable" [(ngModel)]="settings.enable" [checked]="settings.enable">
<label for="enable">Enable</label>
@ -29,65 +29,70 @@
</div>
<br />
<br />
<div class="form-group">
<label for="name" class="control-label">Server name</label>
<div>
<input type="text" class="form-control form-control-custom " id="name" name="name" placeholder="Server" [(ngModel)]="server.name" value="{{server.name}}">
<div class="col-md-6">
<div class="form-group">
<label for="name" class="control-label">Server name</label>
<div>
<input type="text" class="form-control form-control-custom " id="name" name="name" placeholder="Server" [(ngModel)]="server.name" value="{{server.name}}">
</div>
</div>
</div>
<div class="form-group">
<label for="Ip" class="control-label">Hostname or IP</label>
<div>
<input type="text" class="form-control form-control-custom " id="Ip" name="Ip" placeholder="localhost" [(ngModel)]="server.ip" value="{{server.ip}}">
<div class="form-group">
<label for="Ip" class="control-label">Hostname or IP</label>
<div>
<input type="text" class="form-control form-control-custom " id="Ip" name="Ip" placeholder="localhost" [(ngModel)]="server.ip" value="{{server.ip}}">
</div>
</div>
</div>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div>
<input type="text" [(ngModel)]="server.port" class="form-control form-control-custom " id="portNumber" name="Port" placeholder="Port Number" value="{{server.port}}">
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div>
<input type="text" [(ngModel)]="server.port" class="form-control form-control-custom " id="portNumber" name="Port" placeholder="Port Number" value="{{server.port}}">
</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="ssl" [(ngModel)]="server.ssl" ng-checked="server.ssl">
<label for="ssl">SSL</label>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="ssl" [(ngModel)]="server.ssl" ng-checked="server.ssl">
<label for="ssl">SSL</label>
</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<!--<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="EnableTvEpisodeSearching" [(ngModel)]="server.enableEpisodeSearching" ng-checked="server.enableEpisodeSearching">
<label for="EnableTvEpisodeSearching">Enable Episode Searching</label>
<input type="checkbox" id="EnableTvEpisodeSearching" [(ngModel)]="server.enableEpisodeSearching" ng-checked="server.enableEpisodeSearching">
<label for="EnableTvEpisodeSearching">Enable Episode Searching</label>
</div>
</div>
</div>
</div>-->
<div class="form-group">
<label for="authToken" class="control-label">Emby Api Key</label>
<div class="">
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.apiKey" placeholder="Emby Api Key" value="{{server.apiKey}}">
<div class="form-group">
<label for="authToken" class="control-label">Emby Api Key</label>
<div class="">
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.apiKey" placeholder="Emby Api Key" value="{{server.apiKey}}">
</div>
</div>
</div>
<div class="form-group">
<div>
<button id="testPlex" type="submit" (click)="test()" class="btn btn-primary-outline">Test Connectivity <div id="spinner"></div></button>
<div class="form-group">
<div>
<button id="testPlex" type="submit" (click)="test()" class="btn btn-primary-outline">Test Connectivity <div id="spinner"></div></button>
</div>
</div>
</div>
</ng-template>
</ngb-tab>
</div>
</ngb-tabset>
<div class="form-group">
<div>
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
<div class="row">
<div class="col-md-1 col-md-push-5">
<div class="form-group">
<div>
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
</div>
</div>
</div>
</div>
</fieldset>
</div>

@ -4,10 +4,6 @@
<legend>Plex Configuration</legend>
<div class="row">
<div class="col-md-2 col-md-offset-10">
<span style="vertical-align: top;">Advanced</span>
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
</div>
<div class="form-group col-md-3">
<div class="checkbox">
@ -33,43 +29,8 @@
<br />
<br />
<div class="form-group">
<label for="username" class="control-label">Username and Password</label>
<div>
<input type="text" class="form-control form-control-custom" id="username" [(ngModel)]="username" placeholder="username">
</div>
<br />
<div>
<input type="password" class="form-control form-control-custom" id="password" [(ngModel)]="password" placeholder="Password">
</div>
</div>
<div class="form-group">
<div>
<button id="requestToken" (click)="requestServers(server)" class="btn btn-primary-outline">Load Servers <i class="fa fa-key"></i></button>
</div>
</div>
<br />
<br />
<div class="form-group">
<label for="username" class="control-label">Please select the server</label><br />
<div class="btn-group">
<div class="btn-group">
<a [attr.disabled]="!serversButton ? true : null" href="#" class="btn btn-info-outline dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
Servers
<span class="caret"></span>
</a>
<ul *ngIf="loadedServers" class="dropdown-menu">
<li *ngFor="let s of loadedServers.servers.server">
<a (click)="selectServer(s,server)">{{s.name}}</a>
</li>
</ul>
</div>
</div>
</div>
<div *ngIf="advanced">
<div class="col-md-6">
<!-- Main Content -->
<div class="form-group">
<label for="name" class="control-label">Server name</label>
<div>
@ -98,7 +59,7 @@
</div>
</div>
<div class="form-group">
<!--<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="EnableTvEpisodeSearching" [(ngModel)]="server.enableEpisodeSearching" [checked]="server.enableEpisodeSearching">
@ -108,7 +69,7 @@
If enabled then we will lookup all episodes on your Plex server and store them in the local database. This will stop episode requests that already exist on Plex (that might not be in Sonarr).
Please be aware that this is a very resource intensive process and while the Plex Episode Cacher job is running the application may appear slow (Depending on the size of your Plex library).
</small>
</div>
</div>-->
<div class="form-group">
<label for="authToken" class="control-label">Plex Authorization Token</label>
@ -124,42 +85,84 @@
</div>
</div>
</div>
<label>Please select the libraries you want Ombi to look in for content</label>
<br />
<small>Note: if nothing is selected, we will monitor all libraries</small>
<div class="form-group">
<div>
<button (click)="loadLibraries(server)" class="btn btn-primary-outline">Load Libraries <i class="fa fa-film"></i></button>
<div class="col-md-6">
<div class="form-group">
<label for="username" class="control-label">Username and Password</label>
<div>
<input type="text" class="form-control form-control-custom" id="username" [(ngModel)]="username" placeholder="username">
</div>
<br />
<div>
<input type="password" class="form-control form-control-custom" id="password" [(ngModel)]="password" placeholder="Password">
</div>
</div>
</div>
<div *ngIf="server.plexSelectedLibraries">
<div *ngFor="let lib of server.plexSelectedLibraries">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="{{lib.title}}" [(ngModel)]="lib.enabled" [checked]="lib.enabled">
<label for="{{lib.title}}">{{lib.title}}</label>
<div class="form-group">
<div>
<button id="requestToken" (click)="requestServers(server)" class="btn btn-primary-outline">Load Servers <i class="fa fa-key"></i></button>
</div>
</div>
<br />
<br />
<div class="form-group" *ngIf="loadedServers">
<label for="username" class="control-label">Please select the server</label><br />
<div class="btn-group">
<div class="btn-group">
<a [attr.disabled]="!serversButton ? true : null" href="#" class="btn btn-info-outline dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
Servers
<span class="caret"></span>
</a>
<ul *ngIf="loadedServers" class="dropdown-menu">
<li *ngFor="let s of loadedServers.servers.server">
<a (click)="selectServer(s,server)">{{s.name}}</a>
</li>
</ul>
</div>
</div>
</div>
<hr/>
<label>Please select the libraries you want Ombi to look in for content</label>
<br />
<small>Note: if nothing is selected, we will monitor all libraries</small>
<div class="form-group">
<div>
<button (click)="loadLibraries(server)" class="btn btn-primary-outline">Load Libraries <i class="fa fa-film"></i></button>
</div>
</div>
<div *ngIf="server.plexSelectedLibraries">
<div *ngFor="let lib of server.plexSelectedLibraries">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="{{lib.title}}" [(ngModel)]="lib.enabled" [checked]="lib.enabled">
<label for="{{lib.title}}">{{lib.title}}</label>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<div>
<button id="testPlex" type="submit" (click)="testPlex(server)" class="btn btn-primary-outline">
Test Connectivity
<div id="spinner"></div>
</button>
<div class="form-group">
<div>
<button id="testPlex" type="submit" (click)="testPlex(server)" class="btn btn-primary-outline">
Test Connectivity
<div id="spinner"></div>
</button>
</div>
</div>
</div>
</ng-template>
</ngb-tab>
</div>
</ngb-tabset>
<div class="col-md-3">
<div class="form-group">
<div>
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
</div>
</div>
</div>
</fieldset>
</div>

@ -24,7 +24,6 @@ export class PlexComponent implements OnInit, OnDestroy {
private subscriptions = new Subject<void>();
username: string;
password: string;
advanced = false;
serversButton = false;
ngOnInit(): void {
@ -42,7 +41,7 @@ export class PlexComponent implements OnInit, OnDestroy {
this.serversButton = true;
this.notificationService.success("Loaded", "Found the servers! Please select one!")
} else {
this.notificationService.warning("Error When Requesting Plex Servers", x.message);
this.notificationService.warning("Error When Requesting Plex Servers", "Please make sure your username and password are correct");
}
});
}
@ -99,7 +98,7 @@ export class PlexComponent implements OnInit, OnDestroy {
server.plexSelectedLibraries.push(lib);
});
},
err => { this.notificationService.error("Error", err) });
err => { this.notificationService.error("Error", err) });
}
save() {

@ -2,124 +2,128 @@
<settings-menu></settings-menu>
<div *ngIf="form">
<fieldset>
<legend>Radarr Settings</legend>
<div style="float: right;">
<span style="vertical-align: top;">Advanced</span>
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
</div>
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
<div *ngIf="form.invalid" class="alert alert-danger">
<div *ngIf="form.dirty">
<legend>Radarr Settings</legend>
<div style="float: right;">
<span style="vertical-align: top;">Advanced</span>
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
</div>
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
<div *ngIf="form.invalid" class="alert alert-danger">
<div *ngIf="form.dirty">
<div *ngIf="form.get('ip').hasError('required')">The IP/Hostname is required</div>
<div *ngIf="form.get('port').hasError('required')">The Port is required</div>
<div *ngIf="form.get('apiKey').hasError('required')">The Api Key is required</div>
</div>
<div>
<div *ngIf="form.get('defaultQualityProfile').hasError('required')">A Default Quality Profile is required</div>
<div *ngIf="form.get('defaultRootPath').hasError('required')">A Default Root Path is required</div>
<div *ngIf="form.get('minimumAvailability').hasError('required')">A Default Minimum Availability is required</div>
</div>
<div>
<div *ngIf="form.get('defaultQualityProfile').hasError('required')">A Default Quality Profile is required</div>
<div *ngIf="form.get('defaultRootPath').hasError('required')">A Default Root Path is required</div>
<div *ngIf="form.get('minimumAvailability').hasError('required')">A Default Minimum Availability is required</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="enable" formControlName="enabled" ng-checked="form.enabled">
<label for="enable">Enable</label>
<div class="col-md-6">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="enable" formControlName="enabled" ng-checked="form.enabled">
<label for="enable">Enable</label>
</div>
</div>
</div>
<div class="form-group">
<label for="Ip" class="control-label">Hostname or IP</label>
<div class="">
<input type="text" class="form-control form-control-custom "id="Ip" name="Ip" placeholder="localhost" formControlName="ip">
<div class="form-group">
<label for="Ip" class="control-label">Hostname or IP</label>
<div class="">
<input type="text" class="form-control form-control-custom " id="Ip" name="Ip" placeholder="localhost" formControlName="ip">
</div>
</div>
</div>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="port" id="portNumber" name="Port" placeholder="Port Number" >
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="port" id="portNumber" name="Port" placeholder="Port Number">
</div>
</div>
</div>
<div class="form-group">
<label for="ApiKey" class="control-label">API Key</label>
<div>
<input type="text" class="form-control form-control-custom " id="ApiKey" name="ApiKey" formControlName="apiKey">
<div class="form-group">
<label for="ApiKey" class="control-label">API Key</label>
<div>
<input type="text" class="form-control form-control-custom " id="ApiKey" name="ApiKey" formControlName="apiKey">
</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
</div>
</div>
</div>
<div class="form-group">
<label for="SubDir" class="control-label">Base Url</label>
<div>
<input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
<div class="form-group">
<label for="SubDir" class="control-label">Base Url</label>
<div>
<input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="submit" (click)="getProfiles(form)" class="btn btn-primary-outline">Get Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"> </span></button>
<div class="col-md-6">
<div class="form-group">
<div>
<button type="submit" (click)="getProfiles(form)" class="btn btn-primary-outline">Get Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"> </span></button>
</div>
</div>
</div>
<div class="form-group">
<label for="select" class="control-label">Quality Profiles</label>
<div id="profiles">
<select formControlName="defaultQualityProfile" class="form-control form-control-custom" id="select">
<option *ngFor='let quality of qualities' value='{{quality.id}}'>{{quality.name}}</option>
</select>
<div class="form-group">
<label for="select" class="control-label">Quality Profiles</label>
<div id="profiles">
<select formControlName="defaultQualityProfile" class="form-control form-control-custom" id="select">
<option *ngFor="let quality of qualities" value="{{quality.id}}">{{quality.name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="submit" (click)="getRootFolders(form)" class="btn btn-primary-outline">Get Root Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin"></span></button>
<div class="form-group">
<div>
<button type="submit" (click)="getRootFolders(form)" class="btn btn-primary-outline">Get Root Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin"></span></button>
</div>
</div>
</div>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Root Folders</label>
<div id="rootFolders">
<select formControlName="defaultRootPath" class="form-control form-control-custom">
<option *ngFor='let folder of rootFolders' value='{{folder.path}}'>{{folder.path}}</option>
</select>
</div>
</div>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Root Folders</label>
<div id="rootFolders">
<select formControlName="defaultRootPath" class="form-control form-control-custom">
<option *ngFor="let folder of rootFolders" value="{{folder.path}}">{{folder.path}}</option>
</select>
</div>
</div>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Minimum Availability</label>
<div id="rootFolders">
<select formControlName="minimumAvailability" class="form-control form-control-custom">
<option *ngFor='let min of minimumAvailabilityOptions' value='{{min.value}}'>{{min.name}}</option>
</select>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Minimum Availability</label>
<div id="rootFolders">
<select formControlName="minimumAvailability" class="form-control form-control-custom">
<option *ngFor="let min of minimumAvailabilityOptions" value="{{min.value}}">{{min.name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group" *ngIf="advanced">
<div class="checkbox">
<input type="checkbox" id="addOnly" formControlName="addOnly">
<label for="addOnly">Do not search</label>
<div class="form-group" *ngIf="advanced" style="color:#ff761b">
<div class="checkbox">
<input type="checkbox" id="addOnly" formControlName="addOnly">
<label for="addOnly">Do not search</label>
</div>
</div>
</div>
<div class="form-group">
<div>
<button [disabled]="form.invalid" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"></span></button>
<div class="form-group">
<div>
<button [disabled]="form.invalid" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"></span></button>
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="submit" [disabled]="form.invalid" class="btn btn-primary-outline ">Submit</button>
<div class="form-group">
<div>
<button type="submit" [disabled]="form.invalid" class="btn btn-primary-outline ">Submit</button>
</div>
</div>
</div>
</form>

@ -1,125 +1,128 @@

<settings-menu></settings-menu>
<div *ngIf="form">
<fieldset>
<legend>Sonarr Settings</legend>
<div style="float: right;">
<span style="vertical-align: top;">Advanced</span>
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
</div>
<fieldset>
<legend>Sonarr Settings</legend>
<div style="float: right;">
<span style="vertical-align: top;">Advanced</span>
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
</div>
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
<div *ngIf="form.invalid" class="alert alert-danger">
<div *ngIf="form.dirty">
<div *ngIf="form.invalid" class="alert alert-danger">
<div *ngIf="form.dirty">
<div *ngIf="form.get('ip').hasError('required')">The IP/Hostname is required</div>
<div *ngIf="form.get('port').hasError('required')">The Port is required</div>
<div *ngIf="form.get('apiKey').hasError('required')">The Api Key is required</div>
</div>
<div>
</div>
<div>
<div *ngIf="form.get('qualityProfile').hasError('required')">A Default Quality Profile is required</div>
<div *ngIf="form.get('rootPath').hasError('required')">A Default Root Path is required</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="enable" formControlName="enabled" >
<label for="enable">Enable</label>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="enable" formControlName="enabled">
<label for="enable">Enable</label>
</div>
</div>
<div class="form-group">
<label for="Ip" class="control-label">Sonarr Hostname or IP</label>
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="ip" id="Ip" name="Ip" placeholder="localhost" >
<div class="form-group">
<label for="Ip" class="control-label">Sonarr Hostname or IP</label>
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="ip" id="Ip" name="Ip" placeholder="localhost">
</div>
</div>
</div>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div class="form-group">
<label for="portNumber" class="control-label">Port</label>
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="port" id="portNumber" name="Port" placeholder="Port Number" >
<div class="">
<input type="text" class="form-control form-control-custom " formControlName="port" id="portNumber" name="Port" placeholder="Port Number">
</div>
</div>
</div>
<div class="form-group">
<label for="ApiKey" class="control-label">Sonarr API Key</label>
<div>
<input type="text" class="form-control form-control-custom " formControlName="apiKey" id="ApiKey" name="ApiKey">
<div class="form-group">
<label for="ApiKey" class="control-label">Sonarr API Key</label>
<div>
<input type="text" class="form-control form-control-custom " formControlName="apiKey" id="ApiKey" name="ApiKey">
</div>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
</div>
</div>
</div>
<div class="form-group">
<label for="SubDir" class="control-label">Sonarr Base Url</label>
<div>
<input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir" >
<div class="form-group">
<label for="SubDir" class="control-label">Sonarr Base Url</label>
<div>
<input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="button" (click)="getProfiles(form)" class="btn btn-primary-outline">Get Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"></span></button>
<div class="col-md-6">
<div class="form-group">
<div>
<button type="button" (click)="getProfiles(form)" class="btn btn-primary-outline">Get Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"></span></button>
</div>
</div>
</div>
<div class="form-group">
<label for="select" class="control-label">Quality Profiles</label>
<div id="profiles">
<select class="form-control form-control-custom" id="select" formControlName="qualityProfile">
<option *ngFor='let quality of qualities' value='{{quality.id}}'>{{quality.name}}</option>
</select>
<div class="form-group">
<label for="select" class="control-label">Quality Profiles</label>
<div id="profiles">
<select class="form-control form-control-custom" id="select" formControlName="qualityProfile">
<option *ngFor="let quality of qualities" value="{{quality.id}}">{{quality.name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="button" (click)="getRootFolders(form)" class="btn btn-primary-outline">Get Root Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin" ></span></button>
<div class="form-group">
<div>
<button type="button" (click)="getRootFolders(form)" class="btn btn-primary-outline">Get Root Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin"></span></button>
</div>
</div>
</div>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Root Folders</label>
<div id="rootFolders">
<select class="form-control form-control-custom" formControlName="rootPath">
<option *ngFor='let folder of rootFolders' value='{{folder.id}}'>{{folder.path}}</option>
</select>
</div>
</div>
<div class="form-group">
<label for="rootFolders" class="control-label">Default Root Folders</label>
<div id="rootFolders">
<select class="form-control form-control-custom" formControlName="rootPath">
<option *ngFor="let folder of rootFolders" value="{{folder.id}}">{{folder.path}}</option>
</select>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="SeasonFolders" name="SeasonFolders"formControlName="seasonFolders">
<label for="SeasonFolders">Enable season folders</label>
<div class="form-group">
<div class="checkbox">
<input type="checkbox" id="SeasonFolders" name="SeasonFolders" formControlName="seasonFolders">
<label for="SeasonFolders">Enable season folders</label>
</div>
<label>Enabled Season Folders to organize seasons into individual folders within a show.</label>
</div>
<label>Enabled Season Folders to organize seasons into individual folders within a show.</label>
</div>
<div class="form-group" *ngIf="advanced">
<div class="checkbox">
<input type="checkbox" id="addOnly" formControlName="addOnly">
<label for="addOnly">Do not search</label>
<div class="form-group" *ngIf="advanced" style="color:#ff761b">
<div class="checkbox">
<input type="checkbox" id="addOnly" formControlName="addOnly">
<label for="addOnly">Do not search</label>
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"> </span></button>
<div class="form-group">
<div>
<button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"> </span></button>
</div>
</div>
</div>
<div class="form-group">
<div>
<button type="submit" class="btn btn-primary-outline ">Submit</button>
<div class="form-group">
<div>
<button type="submit" class="btn btn-primary-outline ">Submit</button>
</div>
</div>
</div>
</form>
</fieldset>
</fieldset>
</div>

Loading…
Cancel
Save