mirror of
https://github.com/Ombi-app/Ombi.git
synced 2025-08-21 05:43:19 -07:00
css changes
This commit is contained in:
parent
3ca0aebfd6
commit
743794ac40
104 changed files with 1871 additions and 453 deletions
|
@ -1,5 +1,87 @@
|
|||
@import "~styles/variables.scss";
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
//Kinda restyled the entire calendar
|
||||
::ng-deep .dark .fc th {
|
||||
background-color:#545454 !important;
|
||||
color: #FFF;
|
||||
border: 1px solid #303030;
|
||||
}
|
||||
|
||||
::ng-deep .dark .fc td.ui-widget-content{
|
||||
background-color:#424242 !important;
|
||||
color: #FFF;
|
||||
border: 1px solid #303030;
|
||||
}
|
||||
|
||||
::ng-deep .dark .fc td.fc-head-container {
|
||||
border: 1px solid #303030;
|
||||
}
|
||||
|
||||
::ng-deep .dark fc-day-grid-event fc-h-event fc-event fc-start fc-end{
|
||||
background:$accent-dark !important;
|
||||
}
|
||||
|
||||
::ng-deep .ui-button {
|
||||
margin-top:10px !important;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
padding: 8px;
|
||||
border: 1px solid rgb(221, 221, 221) !important;
|
||||
display: inline-block;
|
||||
transition: all 0.4s ease 0s;
|
||||
background-color: $accent !important;
|
||||
}
|
||||
|
||||
::ng-deep .dark .ui-button {
|
||||
background-color: $accent-dark !important;
|
||||
border: 1px solid #494949 !important;
|
||||
color: #494949 !important;
|
||||
}
|
||||
|
||||
::ng-deep .dark .ui-button:enabled:hover {
|
||||
color: #303030 !important;
|
||||
background: $accent-dark !important;
|
||||
border-color: $accent-dark !important;
|
||||
transition: all 0.4s ease 0s;
|
||||
}
|
||||
|
||||
::ng-deep .input-group-addon{
|
||||
margin-left:10px;
|
||||
}
|
||||
|
||||
::ng-deep .fc .fc-event{
|
||||
background: $accent !important;
|
||||
color:#FFF !important;
|
||||
font-size:0.9em;
|
||||
font-weight:400;
|
||||
border: 0px solid !important;
|
||||
}
|
||||
|
||||
::ng-deep .dark .fc .fc-event{
|
||||
background:$accent-dark !important;
|
||||
color:#303030 !important;
|
||||
font-size:0.9em;
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
::ng-deep .fc-header-toolbar{
|
||||
display:block;
|
||||
}
|
||||
|
||||
::ng-deep .fc-left{
|
||||
float:left;
|
||||
}
|
||||
|
||||
::ng-deep .fc-right{
|
||||
float:right;
|
||||
}
|
||||
|
||||
::ng-deep .fc-center{
|
||||
margin-left:44%;
|
||||
padding-top: 10px;
|
||||
}
|
|
@ -17,7 +17,6 @@ export class CalendarComponent implements OnInit {
|
|||
constructor(private calendarService: CalendarService) { }
|
||||
|
||||
public async ngOnInit() {
|
||||
debugger;
|
||||
this.loading()
|
||||
this.entries = await this.calendarService.getCalendarEntries();
|
||||
|
||||
|
@ -26,10 +25,9 @@ export class CalendarComponent implements OnInit {
|
|||
header: {
|
||||
left: 'prev,next',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek'
|
||||
right: 'agendaWeek,month'
|
||||
},
|
||||
eventClick: (e: any) => {
|
||||
debugger;
|
||||
e.preventDefault();
|
||||
}
|
||||
};
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
.details strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.grow {
|
||||
transition: all .2s ease-in-out;
|
||||
}
|
||||
|
@ -47,4 +48,4 @@ h3 strong {
|
|||
.overview {
|
||||
height:300px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,14 +2,17 @@ $ombi-primary:#3f3f3f;
|
|||
$card-background: #2b2b2b;
|
||||
#cardImage {
|
||||
border-radius: 5px 5px 0px 0px;
|
||||
height:75%;
|
||||
}
|
||||
|
||||
.dark-card {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
// Changed height to 100% to make all cards the same height
|
||||
.card-spacing {
|
||||
margin-top: 10%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
|
||||
|
@ -39,8 +42,10 @@ $border-width: 3px;
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
// Changed height to 100% to make all cards the same height
|
||||
.grow {
|
||||
transition: all .2s ease-in-out;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.grow:hover {
|
||||
|
@ -52,3 +57,25 @@ $border-width: 3px;
|
|||
// color: white;
|
||||
border-radius: 2%
|
||||
}
|
||||
|
||||
|
||||
/* Title adjust for the Discover page */
|
||||
.mat-card-content h6 {
|
||||
overflow:hidden;
|
||||
white-space:nowrap;
|
||||
font-weight:400;
|
||||
font-size:1.1rem;
|
||||
}
|
||||
|
||||
/* Summary adjust for Discover page */
|
||||
.small, small {
|
||||
font-size:0.8rem;
|
||||
}
|
||||
|
||||
@media (min-width: 2000px) {
|
||||
#cardImage {
|
||||
height:80%;
|
||||
object-fit:cover;
|
||||
display:block;
|
||||
}
|
||||
}
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
.small-middle-container {
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
.small-padding {
|
||||
|
@ -24,4 +24,153 @@
|
|||
|
||||
.small-space {
|
||||
padding-top: 1%;
|
||||
}
|
||||
|
||||
::ng-deep .mat-card-image {
|
||||
height:75%;
|
||||
object-fit:cover;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.card-spacing {
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.mat-card-content h6 {
|
||||
overflow:hidden;
|
||||
white-space:nowrap;
|
||||
font-weight:500;
|
||||
font-size:1.1rem;
|
||||
}
|
||||
|
||||
@media (min-width: 300px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
min-width: 100%;
|
||||
}
|
||||
.small-middle-container{
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
width:100%;
|
||||
}
|
||||
|
||||
mat-button-base {
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.col{
|
||||
padding-right: 10px !important;
|
||||
padding-left:10px !important;
|
||||
}
|
||||
|
||||
.row{
|
||||
margin-left:0px;
|
||||
}
|
||||
|
||||
.small-padding{
|
||||
padding-left: 5px !important;
|
||||
padding-right: 0px !important;
|
||||
height: 40em;
|
||||
}
|
||||
|
||||
::ng-deep .mat-card-image {
|
||||
height:85% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 600px) {
|
||||
.justify-content-md-center {
|
||||
justify-content: center !important;
|
||||
}
|
||||
.small-middle-container{
|
||||
width:auto;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
width:auto;
|
||||
}
|
||||
|
||||
mat-button-base {
|
||||
width:auto;
|
||||
}
|
||||
|
||||
::ng-deep .mat-card-image {
|
||||
height:75% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 700px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
min-width: 50%;
|
||||
}
|
||||
|
||||
.col{
|
||||
padding-right: 15px !important;
|
||||
padding-left: 15px !important;
|
||||
}
|
||||
|
||||
.small-padding{
|
||||
padding-left: 20px !important;
|
||||
padding-right: 20px !important;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
.row{
|
||||
margin-left:0px;
|
||||
}
|
||||
|
||||
.small-middle-container{
|
||||
width:auto;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
width:auto;
|
||||
}
|
||||
|
||||
mat-button-base {
|
||||
width:auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
min-width: 33.33333%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1300px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 25%;
|
||||
min-width: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 20%;
|
||||
min-width: 20%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1900px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 16.66666667%;
|
||||
max-width: 16.66666667%;
|
||||
min-width: 16.66666667%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 2200px) {
|
||||
.col-xl-2 {
|
||||
flex: 0 0 14.285713%;
|
||||
max-width: 14.285713%;
|
||||
min-width: 14.285713%;
|
||||
}
|
||||
}
|
|
@ -9,10 +9,12 @@
|
|||
{{nav.name | translate}}
|
||||
</a> </span>
|
||||
|
||||
<a class="bottom-nav-link" mat-list-item [routerLinkActive]="theme === 'dark' ? 'active-list-item-dark' : 'active-list-item'" aria-label="Toggle sidenav" (click)="logOut();">
|
||||
<mat-icon aria-label="Side nav toggle icon">exit_to_app</mat-icon>
|
||||
{{ 'NavigationBar.Logout' | translate }}
|
||||
</a>
|
||||
<a class="bottom-nav-link" mat-list-item
|
||||
[routerLinkActive]="getTheme()" aria-label="Toggle sidenav"
|
||||
(click)="logOut();">
|
||||
<mat-icon aria-label="Side nav toggle icon">exit_to_app</mat-icon>
|
||||
{{ 'NavigationBar.Logout' | translate }}
|
||||
</a>
|
||||
|
||||
|
||||
</mat-nav-list>
|
||||
|
@ -32,16 +34,16 @@
|
|||
</span>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="col-1">
|
||||
<div class="float-right">
|
||||
<a mat-list-item (click)="switchTheme()">
|
||||
<mat-icon *ngIf="theme === 'dark'" aria-label="Side nav toggle icon">brightness_7</mat-icon>
|
||||
<mat-icon *ngIf="theme === 'light'" aria-label="Side nav toggle icon">brightness_4</mat-icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</mat-toolbar>
|
||||
</div>
|
||||
<div class="col-1">
|
||||
<div class="float-right">
|
||||
<a mat-list-item (click)="switchTheme()">
|
||||
<mat-icon *ngIf="theme === 'dark'" aria-label="Side nav toggle icon">wb_incandescent</mat-icon>
|
||||
<mat-icon *ngIf="theme === 'light'" aria-label="Side nav toggle icon">brightness_4</mat-icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</mat-toolbar>
|
||||
|
||||
<!-- Page -->
|
||||
<ng-container *ngTemplateOutlet="template"></ng-container>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
}
|
||||
|
||||
.sidenav {
|
||||
width: 200px;
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
.sidenav .mat-toolbar {
|
||||
|
@ -47,12 +47,26 @@
|
|||
color:white;
|
||||
}
|
||||
|
||||
.active-list-item-dark {
|
||||
::ng-deep .dark .active-list-item {
|
||||
background: $accent-dark !important;
|
||||
color:black;
|
||||
color:black !important;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
// Changed color with !important and changed the font weight
|
||||
/*.active-list-item-dark {
|
||||
background: $accent-dark !important;
|
||||
color:black !important;
|
||||
font-weight:500;
|
||||
}*/
|
||||
|
||||
// changed bottom to 10px so when you overlay a link it won't get blocked by URL
|
||||
.bottom-nav-link {
|
||||
bottom: 0;
|
||||
bottom: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
//background-color:#E84C3D;
|
||||
}
|
||||
|
||||
/*bottom-nav-link:hover{
|
||||
background-color:rgb(226, 52, 36) !important;
|
||||
}*/
|
|
@ -63,8 +63,9 @@ export class MyNavComponent implements OnInit {
|
|||
}
|
||||
}
|
||||
|
||||
// @TIDUSJAR Don't know if we need this method anymore?
|
||||
public getTheme(){
|
||||
return this.theme === 'dark' ? 'active-list-item-dark' : 'active-list-item';
|
||||
return 'active-list-item';
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -0,0 +1,31 @@
|
|||
@import "~styles/variables.scss";
|
||||
|
||||
.dark .mat-header-cell {
|
||||
background: $accent-dark !important;
|
||||
font-size: 1em;
|
||||
font-weight: bold;
|
||||
color: #303030;
|
||||
}
|
||||
|
||||
.mat-form-field {
|
||||
float:right;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-form-field-label{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
::ng-deep .mat-form-field-infix {
|
||||
width: 10em;
|
||||
margin-top:1em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-tab-label-active{
|
||||
background: $accent-dark !important;
|
||||
color: #303030 !important;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
::ng-deep .mat-tab-label{
|
||||
opacity: 1;
|
||||
}
|
|
@ -12,7 +12,7 @@ import { RequestFilterType } from "../../models/RequestFilterType";
|
|||
@Component({
|
||||
templateUrl: "./movies-grid.component.html",
|
||||
selector: "movies-grid",
|
||||
styleUrls: ["../requests-list.component.scss"]
|
||||
styleUrls: ["./movies-grid.component.scss"]
|
||||
})
|
||||
export class MoviesGridComponent implements OnInit, AfterViewInit {
|
||||
public dataSource: IMovieRequests[] = [];
|
||||
|
|
|
@ -1,19 +1,21 @@
|
|||
<div class="small-middle-container">
|
||||
<mat-tab-group>
|
||||
<div class="buttons">
|
||||
<mat-tab label="Movies">
|
||||
<ng-template matTabContent>
|
||||
<movies-grid (onOpenOptions)="onOpenOptions($event)"></movies-grid>
|
||||
<movies-grid (onOpenOptions)="onOpenOptions($event)"></movies-grid>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
<mat-tab label="TV Shows">
|
||||
<ng-template matTabContent>
|
||||
<tv-grid (onOpenOptions)="onOpenOptions($event)"></tv-grid>
|
||||
<tv-grid (onOpenOptions)="onOpenOptions($event)"></tv-grid>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
<mat-tab label="Albums">
|
||||
<h1>Coming soon</h1>
|
||||
<p>...</p>
|
||||
</mat-tab>
|
||||
</div>
|
||||
</mat-tab-group>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -1,4 +1,53 @@
|
|||
@import "~styles/variables.scss";
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-header-cell {
|
||||
background: rgba(0, 0, 0, 0.381)!important;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 0.842) !important;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-header-cell .mat-checkbox-frame {
|
||||
border-color: #FFF;
|
||||
}
|
||||
|
||||
.mat-form-field {
|
||||
float:right;
|
||||
}
|
||||
|
||||
::ng-deep .mat-form-field-label{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
::ng-deep .mat-form-field-infix {
|
||||
width: 10em;
|
||||
margin-top:1em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-tab-label-active{
|
||||
background: $accent-dark !important;
|
||||
color: #303030 !important;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
::ng-deep .mat-tab-label{
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
::ng-deep .mat-tab-header {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .mat-sort-header-arrow{
|
||||
color:#303030;
|
||||
}
|
||||
|
||||
::ng-deep .mat-column-actions{
|
||||
text-align:end;
|
||||
}
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div *ngIf="about" class="container">
|
||||
<div *ngIf="about" class="small-middle-container">
|
||||
<legend>About</legend>
|
||||
|
||||
<div class="mat-table">
|
||||
|
|
|
@ -17,4 +17,10 @@
|
|||
flex: 1;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Authentication-Settings'"></wiki>
|
||||
<fieldset *ngIf="form">
|
||||
<legend>Authentication</legend>
|
||||
|
@ -64,4 +64,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,20 @@
|
|||
@import "~styles/variables.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -6,6 +6,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./authentication.component.html",
|
||||
styleUrls: ["./authentication.component.scss"],
|
||||
})
|
||||
export class AuthenticationComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,18 +1,29 @@
|
|||
<settings-menu>
|
||||
</settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<div *ngIf="form">
|
||||
<fieldset>
|
||||
<legend>CouchPotato Settings</legend>
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<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 class="col-md-6" style="display:block;">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" formControlName="enabled">
|
||||
<label for="enable">Enable</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl">
|
||||
<label for="Ssl">SSL</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="Ip" class="control-label">Hostname or IP</label>
|
||||
<div class="">
|
||||
|
@ -37,13 +48,6 @@
|
|||
|
||||
<small *ngIf="form.get('apiKey').hasError('required')" class="error-text">The API Key is required</small>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
|
||||
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="SubDir" class="control-label">Base Url</label>
|
||||
<div>
|
||||
|
@ -97,4 +101,5 @@
|
|||
</div>
|
||||
</form>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,32 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
.col-md-4{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-4{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -7,6 +7,7 @@ import { ICouchPotatoProfiles } from "../../interfaces";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./couchpotato.component.html",
|
||||
styleUrls: ["./couchpotato.component.scss"]
|
||||
})
|
||||
export class CouchPotatoComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Customization-Settings'"></wiki>
|
||||
<fieldset *ngIf="settings" class="container">
|
||||
<fieldset *ngIf="settings">
|
||||
<legend>Customization</legend>
|
||||
|
||||
<div class="col-12">
|
||||
|
@ -14,7 +14,7 @@
|
|||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Custom Logo" [(ngModel)]="settings.logo">
|
||||
<input matInput placeholder="Custom Logo" type="url"[(ngModel)]="settings.logo">
|
||||
</mat-form-field>
|
||||
|
||||
<div *ngIf="settings.logo" class="form-group">
|
||||
|
@ -42,12 +42,13 @@
|
|||
</mat-checkbox>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<button mat-raised-button (click)="save()" type="submit" type="submit" id="save" color="accent">Submit</button>
|
||||
</div>
|
||||
|
||||
<mat-form-field>
|
||||
<textarea matInput [(ngModel)]="settings.customCss" placeholder="Custom CSS"></textarea>
|
||||
</mat-form-field>
|
||||
<div class="form-group">
|
||||
<button mat-raised-button (click)="save()" type="submit" type="submit" id="save" color="accent">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-7"> -->
|
||||
|
||||
|
@ -57,4 +58,5 @@
|
|||
|
||||
|
||||
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,42 @@
|
|||
@import "~styles/shared.scss";
|
||||
.col-12 {
|
||||
display:grid;
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height:100px;
|
||||
height: auto;
|
||||
max-height:800px;
|
||||
}
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -6,6 +6,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./customization.component.html",
|
||||
styleUrls: ["./customization.component.scss"],
|
||||
})
|
||||
export class CustomizationComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
<settings-menu>
|
||||
</settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/DogNzb-Settings'"></wiki>
|
||||
<div *ngIf="form">
|
||||
<fieldset>
|
||||
<legend>DogNzb Settings</legend>
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
|
@ -51,4 +51,5 @@
|
|||
</div>
|
||||
</form>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,16 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -5,6 +5,7 @@ import { NotificationService, SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./dognzb.component.html",
|
||||
styleUrls: ["./dognzb.component.scss"]
|
||||
})
|
||||
export class DogNzbComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -0,0 +1,110 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<div *ngIf="settings">
|
||||
<fieldset>
|
||||
<legend>
|
||||
Emby/Jellyfin Configuration
|
||||
</legend>
|
||||
|
||||
<div class="row">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 col-md-push-7">
|
||||
<button type="button" (click)="addTab()" class="btn btn-success-outline">Add Server</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ngb-tabset>
|
||||
<div *ngFor="let server of settings.servers">
|
||||
<ngb-tab [id]="server.id" [title]="server.name">
|
||||
<ng-template ngbTabContent>
|
||||
<br />
|
||||
<br />
|
||||
<div class="col-md-2" style="float: right;">
|
||||
<button type="button" (click)="removeServer(server)" class="btn btn-danger-outline">Remove Server</button>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<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 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 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 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 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 class="form-group">
|
||||
<label for="authToken" class="control-label">Externally Facing Hostname
|
||||
<i class="fa fa-question-circle"
|
||||
pTooltip="This will be the external address that users will navigate to when they press the 'View On Emby' button"></i>
|
||||
</label>
|
||||
<div>
|
||||
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.serverHostname" placeholder="e.g. https://jellyfin.server.com/" value="{{server.serverHostname}}">
|
||||
<small><span *ngIf="server.serverHostname">Current URL: "{{server.serverHostname}}/#!/{{settings.isJellyfin ? ("itemdetails"): ("item/item")}}.html?id=1"</span>
|
||||
<span *ngIf="!server.serverHostname">Current URL: "https://app.emby.media/#!/{{settings.isJellyfin ? ("itemdetails"): ("item/item")}}.html?id=1</span></small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button id="testEmby" type="button" (click)="test(server)" class="btn btn-primary-outline">Test Connectivity <div id="spinner"></div></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button id="discover" type="button" (click)="discoverServerInfo(server)" class="btn btn-primary-outline">Discover Server Information <div id="spinner"></div></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ngb-tab>
|
||||
</div>
|
||||
</ngb-tabset>
|
||||
<div class="col-md-1">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button [disabled]="!hasDiscovered" (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="runCacher()" type="button" id="save" class="btn btn-primary-outline">Manually Run Cacher</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
|
@ -1,7 +1,7 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
|
||||
<div *ngIf="settings" class="container">
|
||||
<div class="small-middle-container">
|
||||
<div *ngIf="settings">
|
||||
<fieldset>
|
||||
<legend>
|
||||
Emby/Jellyfin Configuration
|
||||
|
@ -15,23 +15,16 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-2 offset-md-7">
|
||||
<button mat-raised-button type="button" (click)="addTab()" color="accent">Add Server</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ngb-tabset>
|
||||
<div *ngFor="let server of settings.servers">
|
||||
<ngb-tab [id]="server.id" [title]="server.name">
|
||||
<ng-template ngbTabContent>
|
||||
|
||||
<mat-tab-group #tabGroup [selectedIndex]="selected.value" (selectedTabChange)="addTab($event)" (selectedIndexChange)="selected.setValue($event)" animationDuration="0ms">
|
||||
<mat-tab *ngFor="let server of settings.servers" [label]="server.name">
|
||||
<div class="col-md-2" style="float: right;">
|
||||
<button type="button" (click)="removeServer(server)" class="btn btn-danger-outline">Remove Server</button>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<div class="row">
|
||||
<br />
|
||||
<br />
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-10">
|
||||
<mat-form-field class="full">
|
||||
<input matInput placeholder="Server Name" [(ngModel)]="server.name" value="{{server.name}}">
|
||||
</mat-form-field>
|
||||
|
@ -81,23 +74,19 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 offset-md-4">
|
||||
<button mat-raised-button type="button" (click)="removeServer(server)" color="warn">Remove Server</button>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ngb-tab>
|
||||
</div>
|
||||
</ngb-tabset>
|
||||
|
||||
<div class="col-md-1">
|
||||
</mat-tab>
|
||||
<mat-tab label="" disabled=true> </mat-tab>
|
||||
<mat-tab label="Add Server" position=100> </mat-tab>
|
||||
|
||||
</mat-tab-group>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button mat-raised-button [disabled]="!hasDiscovered" (click)="save()" type="submit" id="save" color="accent">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button mat-raised-button (click)="runCacher()" type="button" id="save" color="primary">Manually Run Cacher</button>
|
||||
|
@ -106,3 +95,4 @@
|
|||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,3 +1,45 @@
|
|||
.full {
|
||||
width: 100%;
|
||||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-10{
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.col-md-2{
|
||||
display: contents;
|
||||
}
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-2{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -2,6 +2,8 @@
|
|||
|
||||
import { IEmbyServer, IEmbySettings } from "../../interfaces";
|
||||
import { EmbyService, JobService, NotificationService, SettingsService, TesterService } from "../../services";
|
||||
import { MatTabChangeEvent, MatTabGroup } from "@angular/material";
|
||||
import {FormControl} from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
templateUrl: "./emby.component.html",
|
||||
|
@ -11,6 +13,7 @@ export class EmbyComponent implements OnInit {
|
|||
|
||||
public settings: IEmbySettings;
|
||||
public hasDiscovered: boolean;
|
||||
selected = new FormControl(0);
|
||||
|
||||
constructor(private settingsService: SettingsService,
|
||||
private notificationService: NotificationService,
|
||||
|
@ -29,21 +32,25 @@ export class EmbyComponent implements OnInit {
|
|||
this.hasDiscovered = true;
|
||||
}
|
||||
|
||||
public addTab() {
|
||||
if (this.settings.servers == null) {
|
||||
this.settings.servers = [];
|
||||
public addTab(event: MatTabChangeEvent) {
|
||||
const tabName = event.tab.textLabel;
|
||||
if (tabName == "Add Server"){
|
||||
if (this.settings.servers == null) {
|
||||
this.settings.servers = [];
|
||||
}
|
||||
this.settings.servers.push({
|
||||
name: "New " + this.settings.servers.length + "*",
|
||||
id: Math.floor(Math.random() * (99999 - 0 + 1) + 1),
|
||||
apiKey: "",
|
||||
administratorId: "",
|
||||
enableEpisodeSearching: false,
|
||||
ip: "",
|
||||
port: 0,
|
||||
ssl: false,
|
||||
subDir: "",
|
||||
} as IEmbyServer);
|
||||
this.selected.setValue(this.settings.servers.length - 1);
|
||||
}
|
||||
this.settings.servers.push({
|
||||
name: " ",
|
||||
id: Math.floor(Math.random() * (99999 - 0 + 1) + 1),
|
||||
apiKey: "",
|
||||
administratorId: "",
|
||||
enableEpisodeSearching: false,
|
||||
ip: "",
|
||||
port: 8097,
|
||||
ssl: false,
|
||||
subDir: "",
|
||||
} as IEmbyServer);
|
||||
}
|
||||
|
||||
public test(server: IEmbyServer) {
|
||||
|
@ -60,6 +67,7 @@ export class EmbyComponent implements OnInit {
|
|||
const index = this.settings.servers.indexOf(server, 0);
|
||||
if (index > -1) {
|
||||
this.settings.servers.splice(index, 1);
|
||||
this.selected.setValue(this.settings.servers.length - 1);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -0,0 +1,27 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<table class="table table-striped table-hover table-responsive table-condensed">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Title</td>
|
||||
<td>Type</td>
|
||||
<td>Retry Count</td>
|
||||
<td>Error Description</td>
|
||||
<td>Delete</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let v of vm">
|
||||
<td class="vcenter">
|
||||
{{v.title}}
|
||||
</td>
|
||||
<td>{{RequestType[v.type] | humanize}}</td>
|
||||
<td class="vcenter">{{v.retryCount}}</td>
|
||||
<td class="vcenter"> <i [pTooltip]="v.error" class="fa fa-info-circle"></i></td>
|
||||
<td class="vcenter"><button class="btn btn-sm btn-danger-outline" (click)="remove(v)">Remove</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
|
@ -0,0 +1,5 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -3,7 +3,8 @@ import { IFailedRequestsViewModel, RequestType } from "../../interfaces";
|
|||
import { RequestRetryService } from "../../services";
|
||||
|
||||
@Component({
|
||||
templateUrl: "./failedrequest.component.html",
|
||||
templateUrl: "./failedrequests.component.html",
|
||||
styleUrls: ["./failedrequests.component.scss"],
|
||||
})
|
||||
export class FailedRequestsComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Issue-Settings'"></wiki>
|
||||
|
||||
<fieldset>
|
||||
<legend>Issues</legend>
|
||||
<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
|
@ -61,7 +62,8 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="row categoryResults">
|
||||
<legend>Categories:</legend>
|
||||
<div *ngFor="let cat of categories">
|
||||
<div class="col-md-9">
|
||||
{{cat.value}}
|
||||
|
@ -73,4 +75,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,52 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
.col-md-9{
|
||||
display: inline-table;
|
||||
}
|
||||
.col-md-3{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .categoryResults{
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -6,6 +6,7 @@ import { IssuesService, NotificationService, SettingsService } from "../../servi
|
|||
|
||||
@Component({
|
||||
templateUrl: "./issues.component.html",
|
||||
styleUrls: ["./issues.component.scss"]
|
||||
})
|
||||
export class IssuesComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -5,6 +5,7 @@ import { NotificationService, SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./jobs.component.html",
|
||||
styleUrls: ["./jobs.component.scss"]
|
||||
})
|
||||
export class JobsComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,59 +1,59 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
|
||||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Landing-Page-Settings'"></wiki>
|
||||
<div *ngIf="settings">
|
||||
<fieldset>
|
||||
<fieldset *ngIf="settings" class="container">
|
||||
<legend>Landing Page Configuration</legend>
|
||||
|
||||
<mat-checkbox [(ngModel)]="settings.enabled">
|
||||
|
||||
<div class="col-12">
|
||||
<mat-checkbox [(ngModel)]="settings.enabled">
|
||||
Enable
|
||||
</mat-checkbox>
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" name="enable" [(ngModel)]="settings.enabled" ng-checked="settings.enabled">
|
||||
<label for="enable">Enable</label>
|
||||
</mat-checkbox>
|
||||
<!--<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" name="enable" [(ngModel)]="settings.enabled" ng-checked="settings.enabled">
|
||||
<label for="enable">Enable</label>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
<p class="form-group">Notice Message</p>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<textarea rows="4" type="text" class="form-control-custom form-control " id="NoticeMessage" name="NoticeMessage" placeholder="e.g. The server will be down for maintenance (HTML is allowed)" [(ngModel)]="settings.noticeText">{{settings.noticeText}}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="form-group">Notice Preview:</p>
|
||||
<div class="form-group">
|
||||
<div [innerHTML]="settings.noticeText"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" name="enable" [(ngModel)]="settings.timeLimit" ng-checked="settings.timeLimit">
|
||||
<label for="enable">Only show the notification message between the below times</label>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
|
||||
|
||||
|
||||
<!--<p class="form-group">Start Time</p>
|
||||
<div class="form-group">
|
||||
<p-calendar [(ngModel)]="settings.startDateTime" [showTime]="true"></p-calendar>
|
||||
</div>
|
||||
<p class="form-group">End Time</p>
|
||||
<div class="form-group">
|
||||
<p-calendar [(ngModel)]="settings.endDateTime" [showTime]="true"></p-calendar>
|
||||
</div>-->
|
||||
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="form-group">Notice Message</p>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<textarea rows="4" type="text" class="form-control-custom form-control " id="NoticeMessage" name="NoticeMessage" placeholder="e.g. The server will be down for maintenance (HTML is allowed)" [(ngModel)]="settings.noticeText">{{settings.noticeText}}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="form-group">Notice Preview:</p>
|
||||
<div class="form-group">
|
||||
<div [innerHTML]="settings.noticeText"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" name="enable" [(ngModel)]="settings.timeLimit" ng-checked="settings.timeLimit">
|
||||
<label for="enable">Only show the notification message between the below times</label>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
|
||||
|
||||
|
||||
<!--<p class="form-group">Start Time</p>
|
||||
<div class="form-group">
|
||||
<p-calendar [(ngModel)]="settings.startDateTime" [showTime]="true"></p-calendar>
|
||||
</div>
|
||||
<p class="form-group">End Time</p>
|
||||
<div class="form-group">
|
||||
<p-calendar [(ngModel)]="settings.endDateTime" [showTime]="true"></p-calendar>
|
||||
</div>-->
|
||||
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,30 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px){
|
||||
.container {
|
||||
max-width: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px){
|
||||
.container {
|
||||
max-width: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px){
|
||||
.container {
|
||||
max-width: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 576px){
|
||||
.container {
|
||||
max-width: inherit;
|
||||
}
|
||||
}
|
|
@ -6,6 +6,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./landingpage.component.html",
|
||||
styleUrls: ["./landingpage.component.scss"],
|
||||
})
|
||||
export class LandingPageComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,18 +1,17 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form" class="container">
|
||||
<div class="small-middle-container">
|
||||
<div *ngIf="form">
|
||||
<fieldset>
|
||||
<legend>Lidarr Settings</legend>
|
||||
<div style="float: right;">
|
||||
|
||||
<mat-slide-toggle [(ngModel)]="advanced">Advanced</mat-slide-toggle>
|
||||
<div style="float: right;">
|
||||
<div class="md-form-field"><mat-slide-toggle formControlName="enabled">Enable</mat-slide-toggle></div>
|
||||
<div class="md-form-field"><mat-slide-toggle [(ngModel)]="advanced">Advanced</mat-slide-toggle></div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<form novalidate [formGroup]="form" class="row" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<div class="col">
|
||||
<div>
|
||||
<mat-slide-toggle formControlName="enabled">Enable</mat-slide-toggle>
|
||||
</div>
|
||||
|
||||
<form novalidate [formGroup]="form" class="row" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
|
||||
<div class="col-md-5">
|
||||
|
||||
<div class="md-form-field">
|
||||
<mat-form-field>
|
||||
|
@ -44,7 +43,7 @@
|
|||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col-md-5">
|
||||
|
||||
<div class="md-form-field">
|
||||
<mat-form-field>
|
||||
|
@ -117,3 +116,4 @@
|
|||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,50 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./lidarr.component.html",
|
||||
styleUrls: ["./lidarr.component.scss"]
|
||||
})
|
||||
export class LidarrComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,8 +1,13 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.code-block {
|
||||
font-size: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .code-block {
|
||||
color:#FFF !important;
|
||||
}
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Mass-Email'"></wiki>
|
||||
<fieldset>
|
||||
<legend>Mass Email</legend>
|
||||
|
@ -47,4 +47,5 @@
|
|||
|
||||
|
||||
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,5 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -5,6 +5,7 @@ import { IdentityService, NotificationMessageService, NotificationService, Setti
|
|||
|
||||
@Component({
|
||||
templateUrl: "./massemail.component.html",
|
||||
styleUrls: ["./massemail.component.scss"]
|
||||
})
|
||||
export class MassEmailComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Discord Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./discord.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class DiscordComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="emailForm">
|
||||
<div *ngIf="emailForm" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Email Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -9,6 +9,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./emailnotification.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class EmailNotificationComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Gotify Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./gotify.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class GotifyComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Mattermost Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./mattermost.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class MattermostComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<settings-menu>
|
||||
</settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Mobile Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { MobileService, SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./mobile.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class MobileComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Newsletter-Settings'"></wiki>
|
||||
<div *ngIf="settings">
|
||||
<div *ngIf="settings" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Newsletter</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -6,6 +6,7 @@ import { TesterService } from "../../services/applications/tester.service";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./newsletter.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class NewsletterComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
::ng-deep ngb-accordion > div.card {
|
||||
@import "~styles/shared.scss";
|
||||
::ng-deep ngb-accordion > div.card {
|
||||
color:white;
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
@ -6,3 +7,9 @@
|
|||
::ng-deep ngb-accordion > div.card > div.card-header {
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Pushbullet Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./pushbullet.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class PushbulletComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Pushover Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./pushover.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class PushoverComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Slack Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./slack.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class SlackComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<settings-menu>
|
||||
</settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Telegram Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./telegram.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class TelegramComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Webhook Notifications</legend>
|
||||
<div class="col-md-6">
|
||||
|
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./webhook.component.html",
|
||||
styleUrls: ["./notificationtemplate.component.scss"]
|
||||
})
|
||||
export class WebhookComponent implements OnInit {
|
||||
public NotificationType = NotificationType;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Ombi-Settings'"></wiki>
|
||||
<fieldset *ngIf="form" class="container">
|
||||
<legend>Ombi Configuration</legend>
|
||||
|
@ -71,4 +71,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
|
21
src/Ombi/ClientApp/src/app/settings/ombi/ombi.component.scss
Normal file
21
src/Ombi/ClientApp/src/app/settings/ombi/ombi.component.scss
Normal file
|
@ -0,0 +1,21 @@
|
|||
.col-12 {
|
||||
display:grid;
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height:100px;
|
||||
height: auto;
|
||||
max-height:800px;
|
||||
}
|
||||
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
.container {
|
||||
max-width: 1500px;
|
||||
}
|
||||
}
|
|
@ -9,6 +9,7 @@ import * as languageData from "../../../other/iso-lang.json";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./ombi.component.html",
|
||||
styleUrls: ["./ombi.component.scss"],
|
||||
})
|
||||
export class OmbiComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -0,0 +1,198 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<div class="row">
|
||||
<div class="col-md-2 col-md-push-10" style="float:right;">
|
||||
<span style="vertical-align: top;">Advanced</span>
|
||||
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="settings">
|
||||
<fieldset>
|
||||
<legend>Plex Configuration</legend>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 col-md-push-7" style="float:right;">
|
||||
<button type="button" (click)="addTab()" class="btn btn-success-outline">Add Server</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ngb-tabset>
|
||||
|
||||
<div *ngFor="let server of settings.servers">
|
||||
<ngb-tab [id]="server.id" [title]="server.name">
|
||||
<ng-template ngbTabContent>
|
||||
<br />
|
||||
<br />
|
||||
<div class="col-md-2 " style="float: right;">
|
||||
<button type="button" (click)="removeServer(server)" class="btn btn-danger-outline">Remove Server</button>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<div class="col-md-6">
|
||||
<!-- Main Content -->
|
||||
<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 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 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 class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="ssl" [(ngModel)]="server.ssl" [checked]="server.ssl">
|
||||
<label for="ssl">SSL</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="authToken" class="control-label">Plex Authorization Token</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.plexAuthToken" placeholder="Plex Auth Token"
|
||||
value="{{server.plexAuthToken}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="MachineIdentifier" class="control-label">Machine Identifier</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="MachineIdentifier" name="MachineIdentifier" [(ngModel)]="server.machineIdentifier"
|
||||
value="{{server.machineIdentifier}}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-5" style="float:right;">
|
||||
<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" *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 class="form-group" *ngIf="advanced">
|
||||
<label for="episodeBatchSize" class="control-label">Episode Batch Size</label>
|
||||
<div>
|
||||
<input type="number" class="form-control-custom form-small form-control" id="episodeBatchSize" name="episodeBatchSize" [(ngModel)]="server.episodeBatchSize"
|
||||
value="{{server.episodeBatchSize}}" tooltipPosition="top" pTooltip="This is used when we cache the episodes, we cache in batches of 50 by default, you can configure how many we do at a time here">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button id="testPlex" type="button" (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-2">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="save()" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="runCacher()" type="button" id="save" class="btn btn-primary-outline">Manually Run Full Sync</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button (click)="runRecentlyAddedCacher()" type="button" id="save" class="btn btn-primary-outline">Manually Run Recently Added Sync</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
|
@ -1,6 +1,7 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<div class="row">
|
||||
<div class="col-md-2 col-md-push-10">
|
||||
<div class="col-md-2 col-md-push-10" style="float:right;">
|
||||
<span style="vertical-align: top;">Advanced</span>
|
||||
<p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced"></p-inputSwitch>
|
||||
</div>
|
||||
|
@ -17,160 +18,151 @@
|
|||
<label for="enable">Enable</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 col-md-push-7">
|
||||
<button type="button" (click)="addTab()" class="btn btn-success-outline">Add Server</button>
|
||||
</div>
|
||||
</div>
|
||||
<mat-tab-group #tabGroup [selectedIndex]="selected.value" (selectedTabChange)="addTab($event)" (selectedIndexChange)="selected.setValue($event)" animationDuration="0ms">
|
||||
<mat-tab *ngFor="let server of settings.servers" [label]="server.name">
|
||||
<div class="col-md-2 " style="float: right;">
|
||||
<button type="button" (click)="removeServer(server)" class="btn btn-danger-outline">Remove Server</button>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<ngb-tabset>
|
||||
|
||||
<div *ngFor="let server of settings.servers">
|
||||
<ngb-tab [id]="server.id" [title]="server.name">
|
||||
<ng-template ngbTabContent>
|
||||
<br />
|
||||
<br />
|
||||
<div class="col-md-2 " style="float: right;">
|
||||
<button type="button" (click)="removeServer(server)" class="btn btn-danger-outline">Remove Server</button>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<div class="col-md-6">
|
||||
<!-- Main Content -->
|
||||
<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 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 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 class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="ssl" [(ngModel)]="server.ssl" [checked]="server.ssl">
|
||||
<label for="ssl">SSL</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="authToken" class="control-label">Plex Authorization Token</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.plexAuthToken" placeholder="Plex Auth Token"
|
||||
value="{{server.plexAuthToken}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="MachineIdentifier" class="control-label">Machine Identifier</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="MachineIdentifier" name="MachineIdentifier" [(ngModel)]="server.machineIdentifier"
|
||||
value="{{server.machineIdentifier}}">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<!-- Main Content -->
|
||||
<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 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 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 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 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 class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="ssl" [(ngModel)]="server.ssl" [checked]="server.ssl">
|
||||
<label for="ssl">SSL</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="authToken" class="control-label">Plex Authorization Token</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="authToken" [(ngModel)]="server.plexAuthToken" placeholder="Plex Auth Token"
|
||||
value="{{server.plexAuthToken}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="MachineIdentifier" class="control-label">Machine Identifier</label>
|
||||
<div class="">
|
||||
<input type="text" class="form-control-custom form-control" id="MachineIdentifier" name="MachineIdentifier" [(ngModel)]="server.machineIdentifier"
|
||||
value="{{server.machineIdentifier}}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4" style="float:right;">
|
||||
<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" *ngIf="loadedServers">
|
||||
<label for="username" class="control-label">Please select the server</label>
|
||||
<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">
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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 class="form-group" *ngIf="advanced">
|
||||
<label for="episodeBatchSize" class="control-label">Episode Batch Size</label>
|
||||
<div>
|
||||
<input type="number" class="form-control-custom form-small form-control" id="episodeBatchSize" name="episodeBatchSize" [(ngModel)]="server.episodeBatchSize"
|
||||
value="{{server.episodeBatchSize}}" tooltipPosition="top" pTooltip="This is used when we cache the episodes, we cache in batches of 50 by default, you can configure how many we do at a time here">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button id="testPlex" type="button" (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="form-group" *ngIf="advanced">
|
||||
<label for="episodeBatchSize" class="control-label">Episode Batch Size</label>
|
||||
<div>
|
||||
<input type="number" class="form-control-custom form-small form-control" id="episodeBatchSize" name="episodeBatchSize" [(ngModel)]="server.episodeBatchSize"
|
||||
value="{{server.episodeBatchSize}}" tooltipPosition="top" pTooltip="This is used when we cache the episodes, we cache in batches of 50 by default, you can configure how many we do at a time here">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button id="testPlex" type="button" (click)="testPlex(server)" class="btn btn-primary-outline">
|
||||
Test Connectivity
|
||||
<div id="spinner"></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</mat-tab>
|
||||
<mat-tab label="" disabled=true> </mat-tab>
|
||||
<mat-tab label="Add Server" position=100> </mat-tab>
|
||||
|
||||
</mat-tab-group>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
|
@ -194,3 +186,4 @@
|
|||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
50
src/Ombi/ClientApp/src/app/settings/plex/plex.component.scss
Normal file
50
src/Ombi/ClientApp/src/app/settings/plex/plex.component.scss
Normal file
|
@ -0,0 +1,50 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -1,12 +1,15 @@
|
|||
import { Component, OnDestroy, OnInit } from "@angular/core";
|
||||
import { Component, OnDestroy, OnInit, ViewChild } from "@angular/core";
|
||||
import { Subject } from "rxjs";
|
||||
import { takeUntil } from "rxjs/operators";
|
||||
|
||||
import { IPlexLibrariesSettings, IPlexServer, IPlexServerResponse, IPlexServerViewModel, IPlexSettings } from "../../interfaces";
|
||||
import { JobService, NotificationService, PlexService, SettingsService, TesterService } from "../../services";
|
||||
import { MatTabChangeEvent, MatTabGroup } from "@angular/material";
|
||||
import {FormControl} from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
templateUrl: "./plex.component.html",
|
||||
styleUrls: ["./plex.component.scss"]
|
||||
})
|
||||
export class PlexComponent implements OnInit, OnDestroy {
|
||||
public settings: IPlexSettings;
|
||||
|
@ -14,6 +17,8 @@ export class PlexComponent implements OnInit, OnDestroy {
|
|||
public username: string;
|
||||
public password: string;
|
||||
public serversButton = false;
|
||||
selected = new FormControl(0);
|
||||
@ViewChild("tabGroup", {static: false}) public tagGroup: MatTabGroup;
|
||||
|
||||
public advanced = false;
|
||||
|
||||
|
@ -67,18 +72,26 @@ export class PlexComponent implements OnInit, OnDestroy {
|
|||
});
|
||||
}
|
||||
|
||||
public addTab() {
|
||||
if (this.settings.servers == null) {
|
||||
public addTab(event: MatTabChangeEvent) {
|
||||
|
||||
const tabName = event.tab.textLabel;
|
||||
if (tabName == "Add Server"){
|
||||
|
||||
if (this.settings.servers == null) {
|
||||
this.settings.servers = [];
|
||||
}
|
||||
this.settings.servers.push(<IPlexServer> { name: "New*", id: Math.floor(Math.random() * (99999 - 0 + 1) + 1) });
|
||||
}
|
||||
this.settings.servers.push(<IPlexServer> { name: "New" + this.settings.servers.length + "*", id: Math.floor(Math.random() * (99999 - 0 + 1) + 1) });
|
||||
|
||||
//this.tagGroup.selectedIndex = (0);
|
||||
this.selected.setValue(this.settings.servers.length - 1);
|
||||
}
|
||||
}
|
||||
|
||||
public removeServer(server: IPlexServer) {
|
||||
const index = this.settings.servers.indexOf(server, 0);
|
||||
if (index > -1) {
|
||||
this.settings.servers.splice(index, 1);
|
||||
this.selected.setValue(this.settings.servers.length - 1);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,21 +1,14 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form" class="container">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Radarr Settings</legend>
|
||||
<div style="float: right;">
|
||||
|
||||
<mat-slide-toggle [(ngModel)]="advanced">Advanced</mat-slide-toggle>
|
||||
|
||||
<div class="md-form-field"><mat-slide-toggle formControlName="enabled">Enable</mat-slide-toggle></div>
|
||||
<div class="md-form-field"><mat-slide-toggle [(ngModel)]="advanced">Advanced</mat-slide-toggle></div>
|
||||
</div>
|
||||
<div>
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<div class="col">
|
||||
|
||||
<div>
|
||||
<mat-slide-toggle formControlName="enabled">Enable</mat-slide-toggle>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-md-12">
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
|
||||
<div class="col-md-5">
|
||||
<div class="md-form-field">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Hostname or IP" formControlName="ip">
|
||||
|
@ -46,7 +39,7 @@
|
|||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col-md-5">
|
||||
|
||||
<div class="md-form-field">
|
||||
<mat-form-field>
|
||||
|
|
|
@ -0,0 +1,56 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-4{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
::ng-deep .load {
|
||||
max-width: fit-content;
|
||||
margin-left:3em;
|
||||
padding: 0.5rem 1.14rem;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-4{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -10,6 +10,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./radarr.component.html",
|
||||
styleUrls: ["./radarr.component.scss"]
|
||||
})
|
||||
export class RadarrComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -60,6 +60,4 @@
|
|||
<button mat-menu-item [routerLink]="['/Settings/Update']">Update</button>
|
||||
<button mat-menu-item [routerLink]="['/Settings/Jobs']">Scheduled Tasks</button>
|
||||
<button mat-menu-item [routerLink]="['/Settings/Logs']">Logs</button>
|
||||
</mat-menu>
|
||||
|
||||
<hr/>
|
||||
</mat-menu>
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>SickRage Settings</legend>
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
|
|
|
@ -0,0 +1,15 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -8,6 +8,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./sickrage.component.html",
|
||||
styleUrls: ["./sickrage.component.scss"]
|
||||
})
|
||||
export class SickRageComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<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%;">
|
||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:3%;">
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-6" style="display:block;">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="enable" formControlName="enabled">
|
||||
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="v3" formControlName="v3">
|
||||
|
@ -27,6 +27,16 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl">
|
||||
<label for="Ssl">SSL</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label for="Ip" class="control-label">Sonarr Hostname or IP
|
||||
|
||||
|
@ -57,13 +67,6 @@
|
|||
<input type="text" class="form-control form-control-custom " [ngClass]="{'form-error': form.get('apiKey').hasError('required')}"
|
||||
formControlName="apiKey" id="ApiKey" name="ApiKey">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
|
||||
<input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="SubDir" class="control-label">Sonarr Base Url</label>
|
||||
<div>
|
||||
|
@ -72,7 +75,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="col-md-5">
|
||||
|
||||
<div class="form-group col-md-12">
|
||||
<label for="profiles" class="control-label">Quality Profiles
|
||||
|
@ -83,7 +86,7 @@
|
|||
id="select" formControlName="qualityProfile">
|
||||
<option *ngFor="let quality of qualities" value="{{quality.id}}">{{quality.name}}</option>
|
||||
</select>
|
||||
<button type="button" (click)="getProfiles(form)" class="btn btn-primary-outline col-md-4 col-md-push-1">
|
||||
<button type="button" (click)="getProfiles(form)" class="btn btn-primary-outline col-md-4 col-md-push-1 load">
|
||||
Load Qualities <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"></span></button>
|
||||
|
||||
</div>
|
||||
|
@ -111,7 +114,7 @@
|
|||
[ngClass]="{'form-error': form.get('rootPath').hasError('required')}">
|
||||
<option *ngFor="let folder of rootFolders" value="{{folder.id}}">{{folder.path}}</option>
|
||||
</select>
|
||||
<button type="button" (click)="getRootFolders(form)" class="btn btn-primary-outline col-md-4 col-md-push-1">
|
||||
<button type="button" (click)="getRootFolders(form)" class="btn btn-primary-outline load col-md-4 col-md-push-1">
|
||||
Load Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -156,20 +159,20 @@
|
|||
<label for="addOnly">Do not search</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group col-md-6">
|
||||
<div>
|
||||
<button type="submit" class="btn btn-primary-outline ">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group col-md-6">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group col-md-7">
|
||||
<div>
|
||||
<button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity
|
||||
<span id="spinner"> </span></button>
|
||||
<button type="submit" class="btn btn-primary-outline ">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group col-md-7">
|
||||
<div>
|
||||
<button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity
|
||||
<span id="spinner"> </span></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</fieldset>
|
||||
|
|
|
@ -0,0 +1,56 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-4{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
::ng-deep .load {
|
||||
max-width: fit-content;
|
||||
margin-left:3em;
|
||||
padding: 0.5rem 1.14rem;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-4{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -11,6 +11,7 @@ import { SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./sonarr.component.html",
|
||||
styleUrls: ["./sonarr.component.scss"]
|
||||
})
|
||||
export class SonarrComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<fieldset *ngIf="settings">
|
||||
<legend>The Movie Database</legend>
|
||||
<div class="col-md-6">
|
||||
|
@ -47,4 +47,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,16 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -14,6 +14,7 @@ interface IKeywordTag {
|
|||
|
||||
@Component({
|
||||
templateUrl: "./themoviedb.component.html",
|
||||
styleUrls: ["./themoviedb.component.scss"]
|
||||
})
|
||||
export class TheMovieDbComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
|
||||
<settings-menu></settings-menu>
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Update-Settings'"></wiki>
|
||||
<div *ngIf="form">
|
||||
<div *ngIf="form" class="small-middle-container">
|
||||
<fieldset>
|
||||
<legend>Update Settings</legend>
|
||||
<div class="form-group" style="float: right">
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 85%;
|
||||
margin-top:10px;
|
||||
}
|
|
@ -6,6 +6,7 @@ import { JobService, SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./update.component.html",
|
||||
styleUrls: ["./update.component.scss"]
|
||||
})
|
||||
export class UpdateComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<settings-menu></settings-menu>
|
||||
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/User-Importer-Settings'"></wiki>
|
||||
<fieldset *ngIf="settings">
|
||||
<legend>User Importer Settings</legend>
|
||||
|
@ -81,4 +81,5 @@
|
|||
<div class="form-group">
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,50 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.col-md-6{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.control-label{
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.row{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.btn-danger-outline{
|
||||
background-color: #E84C3D;
|
||||
}
|
||||
|
||||
.btn-success-outline{
|
||||
background-color: #1b9d1b;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@media (min-width:1440px) {
|
||||
.col-md-6{
|
||||
display: inline-table;
|
||||
}
|
||||
|
||||
.col-md-5{
|
||||
display: inline-table;
|
||||
}
|
||||
}
|
|
@ -6,6 +6,7 @@ import { EmbyService, IdentityService, JobService, NotificationService, PlexServ
|
|||
|
||||
@Component({
|
||||
templateUrl: "./usermanagement.component.html",
|
||||
styleUrls: ["./usermanagement.component.scss"]
|
||||
})
|
||||
export class UserManagementComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
<settings-menu></settings-menu>
|
||||
<div class="small-middle-container">
|
||||
<wiki [url]="'https://github.com/tidusjar/Ombi/wiki/Vote-Settings'"></wiki>
|
||||
|
||||
<fieldset>
|
||||
<legend>Vote</legend>
|
||||
<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
|
||||
<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
|
||||
<div class="col-md-12">
|
||||
<div class="form-group">
|
||||
<div class="checkbox">
|
||||
|
@ -42,9 +43,5 @@
|
|||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
</div>
|
16
src/Ombi/ClientApp/src/app/settings/vote/vote.component.scss
Normal file
16
src/Ombi/ClientApp/src/app/settings/vote/vote.component.scss
Normal file
|
@ -0,0 +1,16 @@
|
|||
@import "~styles/shared.scss";
|
||||
.small-middle-container{
|
||||
margin: auto;
|
||||
width: 95%;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
::ng-deep .dark .small-middle-container{
|
||||
background-color: rgba(0, 0, 0, 0.10);
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
::ng-deep .dark .btn:hover{
|
||||
box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
|
||||
color: inherit;
|
||||
}
|
|
@ -5,6 +5,7 @@ import { NotificationService, SettingsService } from "../../services";
|
|||
|
||||
@Component({
|
||||
templateUrl: "./vote.component.html",
|
||||
styleUrls: ["vote.component.scss"]
|
||||
})
|
||||
export class VoteComponent implements OnInit {
|
||||
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue