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

more !wip

Browse source
This commit is contained in:
tidusjar 2019-01-25 21:20:34 +00:00
commit c0a4b20152
19 changed files with 197 additions and 1200 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/Ombi/ClientApp/src/app/app.module.ts
View file

@ -57,7 +57,7 @@ const routes: Routes = [
{ path: "token", component: TokenResetPasswordComponent },
{ path: "landingpage", component: LandingPageComponent },
{ path: "auth/cookie", component: CookieComponent },
{ loadChildren: "./home/home.module#HomeModule", path: "home" },
{ loadChildren: "./discover/discover.module#DiscoverModule", path: "home" },
{ loadChildren: "./issues/issues.module#IssuesModule", path: "issues" },
{ loadChildren: "./settings/settings.module#SettingsModule", path: "Settings" },
{ loadChildren: "./wizard/wizard.module#WizardModule", path: "Wizard" },

19
src/Ombi/ClientApp/src/app/discover/card/discover-card.component.html Normal file
View file

@ -0,0 +1,19 @@
<mat-card>
<a *ngIf="result.url" href="{{result.url}}" target="_blank">
<img mat-card-image src="{{result.posterPath}}" class="card-poster" alt="{{result.title}}">
</a>
<img *ngIf="!result.url" mat-card-image src="{{result.posterPath}}" class="card-poster" alt="{{result.title}}">
<mat-card-content>
<h5 *ngIf="result.title.length <= 10">{{result.title}}</h5>
<h6 *ngIf="result.title.length > 10 && result.title.length <= 13">{{result.title}}</h6>
<h6 *ngIf="result.title.length > 13" matTooltip="{{result.title}}">{{result.title | truncate:13}}</h6>
</mat-card-content>
<mat-card-actions>
<button *ngIf="!result.requested && !result.available" mat-raised-button color="primary">Request</button>
<button *ngIf="result.requested && !result.available" mat-raised-button color="warn">Requested</button>
<button *ngIf="!result.requested && result.available" mat-raised-button color="accent">Available</button>
</mat-card-actions>
</mat-card>

3
src/Ombi/ClientApp/src/app/discover/card/discover-card.component.scss Normal file
View file

@ -0,0 +1,3 @@
.card-poster {
max-height: 225px;
}

67
src/Ombi/ClientApp/src/app/discover/card/discover-card.component.ts Normal file
View file

@ -0,0 +1,67 @@
import { Component, OnInit, Input } from "@angular/core";
import { IDiscoverCardResult } from "../interfaces";
import { RequestType, ISearchTvResult, ISearchMovieResult } from "../../interfaces";
import { SearchService } from "../../services";
@Component({
selector: "discover-card",
templateUrl: "./discover-card.component.html",
styleUrls: ["./discover-card.component.scss"],
})
export class DiscoverCardComponent implements OnInit {
@Input() public result: IDiscoverCardResult;
constructor(private searchService: SearchService) { }
public ngOnInit() {
if (this.result.type == RequestType.tvShow) {
this.getExtraTvInfo();
}
if (this.result.type == RequestType.movie) {
this.getExtraMovieInfo();
}
}
public getExtraTvInfo() {
this.searchService.getShowInformation(this.result.id)
.subscribe(x => {
if (x) {
this.setTvDefaults(x);
this.updateTvItem(x);
}
});
}
private getExtraMovieInfo() {
this.searchService.getMovieInformation(this.result.id)
.subscribe(m => {
this.updateMovieItem(m);
});
}
private updateMovieItem(updated: ISearchMovieResult) {
this.result.url = "http://www.imdb.com/title/" + updated.imdbId + "/";
this.result.available = updated.available;
this.result.requested = updated.requested;
this.result.requested = updated.requestProcessing;
}
private setTvDefaults(x: ISearchTvResult) {
if (!x.imdbId) {
x.imdbId = "https://www.tvmaze.com/shows/" + x.seriesId;
} else {
x.imdbId = "http://www.imdb.com/title/" + x.imdbId + "/";
}
}
private updateTvItem(updated: ISearchTvResult) {
this.result.title = updated.title;
this.result.id = updated.id;
this.result.available = updated.fullyAvailable;
this.result.posterPath = updated.banner;
this.result.requested = updated.requested;
this.result.url = updated.imdbId;
}
}

5
src/Ombi/ClientApp/src/app/discover/discover.component.html Normal file
View file

@ -0,0 +1,5 @@
<div *ngIf="discoverResults" class="row">
<div class="col-lg-2 col-md-4 col-6" *ngFor="let result of discoverResults">
<discover-card [result]="result"></discover-card>
</div>
</div>

58
src/Ombi/ClientApp/src/app/discover/discover.component.ts Normal file
View file

@ -0,0 +1,58 @@
import { Component, OnInit } from "@angular/core";
import { SearchService } from "../services";
import { ISearchMovieResult, ISearchTvResult, RequestType } from "../interfaces";
import { IDiscoverCardResult } from "./interfaces";
@Component({
templateUrl: "./discover.component.html",
})
export class DiscoverComponent implements OnInit {
public discoverResults: IDiscoverCardResult[] = [];
private movies: ISearchMovieResult[];
private tvShows: ISearchTvResult[];
public defaultTvPoster: string;
constructor(private searchService: SearchService) {
}
public async ngOnInit() {
this.movies = await this.searchService.popularMovies().toPromise();
this.tvShows = await this.searchService.popularTv().toPromise();
this.movies.forEach(m => {
debugger;
this.discoverResults.push({
available: m.available,
posterPath: `https://image.tmdb.org/t/p/w300/${m.posterPath}`,
requested: m.requested,
title: m.title,
type: RequestType.movie,
id: m.id,
url: `http://www.imdb.com/title/${m.imdbId}/`
});
});
this.tvShows.forEach(m => {
this.discoverResults.push({
available: m.available,
posterPath: "../../../images/default_tv_poster.png",
requested: m.requested,
title: m.title,
type: RequestType.tvShow,
id: m.id,
url: undefined
});
});
this.shuffle(this.discoverResults);
}
private shuffle(discover: IDiscoverCardResult[]) : IDiscoverCardResult[] {
for (let i = discover.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[discover[i], discover[j]] = [discover[j], discover[i]];
}
return discover;
}
}

14
src/Ombi/ClientApp/src/app/home/home.module.ts → src/Ombi/ClientApp/src/app/discover/discover.module.ts
View file

@ -6,12 +6,11 @@ import { SearchService } from "../services";
import { AuthGuard } from "../auth/auth.guard";
import { SharedModule } from "../shared/shared.module";
import { HomeComponent } from "./home.component";
import { PopularMoviesComponent } from "./movies/popular-movies.component";
import { PopularTvComponent } from "./tv/popular-tv.component";
import { DiscoverComponent } from "./discover.component";
import { DiscoverCardComponent } from "./card/discover-card.component";
const routes: Routes = [
{ path: "", component: HomeComponent, canActivate: [AuthGuard] },
{ path: "", component: DiscoverComponent, canActivate: [AuthGuard] },
];
@NgModule({
imports: [
@ -19,9 +18,8 @@ const routes: Routes = [
SharedModule,
],
declarations: [
HomeComponent,
PopularMoviesComponent,
PopularTvComponent,
DiscoverComponent,
DiscoverCardComponent
],
exports: [
RouterModule,
@ -31,4 +29,4 @@ const routes: Routes = [
],
})
export class HomeModule { }
export class DiscoverModule { }

11
src/Ombi/ClientApp/src/app/discover/interfaces.ts Normal file
View file

@ -0,0 +1,11 @@
import { RequestType } from "../interfaces";
export interface IDiscoverCardResult {
id: number;
posterPath: string;
url: string | undefined;
title: string;
type: RequestType;
available: boolean;
requested: boolean;
}

6
src/Ombi/ClientApp/src/app/home/home.component.html
View file

@ -1,6 +0,0 @@
<h3>Movies</h3>
<popular-movies></popular-movies>
<mat-divider></mat-divider>
<h3>TV Shows</h3>
<popular-tv></popular-tv>

23
src/Ombi/ClientApp/src/app/home/home.component.ts
View file

@ -1,23 +0,0 @@
import { Component, OnInit } from "@angular/core";
import { SearchService } from "../services";
import { ISearchMovieResult, ISearchTvResult } from "../interfaces";
@Component({
templateUrl: "./home.component.html",
})
export class HomeComponent implements OnInit {
public movies: ISearchMovieResult[];
public tvShows: ISearchTvResult[];
public defaultTvPoster: string;
constructor(private searchService: SearchService) {
}
public ngOnInit() {
this.defaultTvPoster = "../../../images/default_tv_poster.png";
this.searchService.popularMovies().subscribe(x => this.movies = x);
this.searchService.popularTv().subscribe(x => this.tvShows = x);
}
}

16
src/Ombi/ClientApp/src/app/home/movies/popular-movies.component.html
View file

@ -1,16 +0,0 @@
<div *ngIf="movies" class="row">
<div class="col-lg-2 col-md-4 col-6" *ngFor="let movie of movies">
<mat-card>
<img mat-card-image src="https://image.tmdb.org/t/p/w300/{{movie.posterPath}}" alt="{{movie.title}}">
<mat-card-content>
<h5>{{movie.title}}</h5>
</mat-card-content>
<mat-card-actions>
<button mat-raised-button color="primary">Request</button>
</mat-card-actions>
</mat-card>
</div>
</div>

19
src/Ombi/ClientApp/src/app/home/movies/popular-movies.component.ts
View file

@ -1,19 +0,0 @@
import { Component, OnInit } from "@angular/core";
import { SearchService } from "../../services";
import { ISearchMovieResult, ISearchTvResult } from "../../interfaces";
@Component({
selector:"popular-movies",
templateUrl: "./popular-movies.component.html",
})
export class PopularMoviesComponent implements OnInit {
public movies: ISearchMovieResult[];
constructor(private searchService: SearchService) {
}
public ngOnInit() {
this.searchService.popularMovies().subscribe(x => this.movies = x);
}
}

15
src/Ombi/ClientApp/src/app/home/tv/popular-tv.component.html
View file

@ -1,15 +0,0 @@
<div *ngIf="tvShows" class="row">
<div class="col-lg-2 col-md-4 col-6" *ngFor="let tv of tvShows">
<mat-card>
<img mat-card-image src="{{tv.banner}}" alt="{{tv.title}}">
<mat-card-content>
<h5>{{tv.title}}</h5>
</mat-card-content>
<mat-card-actions>
<button mat-raised-button color="primary">Request</button>
</mat-card-actions>
</mat-card>
</div>
</div>

66
src/Ombi/ClientApp/src/app/home/tv/popular-tv.component.ts
View file

@ -1,66 +0,0 @@
import { Component, OnInit } from "@angular/core";
import { SearchService } from "../../services";
import { ISearchTvResult } from "../../interfaces";
@Component({
selector: "popular-tv",
templateUrl: "./popular-tv.component.html",
})
export class PopularTvComponent implements OnInit {
public tvShows: ISearchTvResult[];
public defaultPoster: string;
constructor(private searchService: SearchService) {
}
public ngOnInit() {
this.defaultPoster = "../../../images/default_tv_poster.png";
this.searchService.popularTv().subscribe(x => {this.tvShows = x; this.getExtraInfo();});
}
public getExtraInfo() {
this.tvShows.forEach((val, index) => {
this.searchService.getShowInformation(val.id)
.subscribe(x => {
if (x) {
this.setDefaults(x);
this.updateItem(val, x);
} else {
const index = this.tvShows.indexOf(val, 0);
if (index > -1) {
this.tvShows.splice(index, 1);
}
}
});
});
}
private setDefaults(x: ISearchTvResult) {
if (x.banner === null) {
x.banner = this.defaultPoster;
}
if (x.imdbId === null) {
x.imdbId = "https://www.tvmaze.com/shows/" + x.seriesId;
} else {
x.imdbId = "http://www.imdb.com/title/" + x.imdbId + "/";
}
}
private updateItem(key: ISearchTvResult, updated: ISearchTvResult) {
const index = this.tvShows.indexOf(key, 0);
if (index > -1) {
// Update certain properties, otherwise we will loose some data
this.tvShows[index].title = updated.title;
this.tvShows[index].banner = updated.banner;
this.tvShows[index].imdbId = updated.imdbId;
this.tvShows[index].seasonRequests = updated.seasonRequests;
this.tvShows[index].seriesId = updated.seriesId;
this.tvShows[index].fullyAvailable = updated.fullyAvailable;
this.tvShows[index].background = updated.banner;
}
}
}

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

@ -3,7 +3,7 @@
[mode]="(isHandset | async)!.matches ? 'over' : 'side'" [opened]="!(isHandset | async)!.matches">
<mat-toolbar color="primary">Ombi</mat-toolbar>
<mat-nav-list>
<a mat-list-item routerLink="/">Home</a>
<a mat-list-item routerLink="/">Discover</a>
<a mat-list-item routerLink="/search">Search</a>
<a mat-list-item routerLink="/settings">Settings</a>
</mat-nav-list>

3
src/Ombi/ClientApp/src/app/shared/shared.module.ts
View file

@ -10,7 +10,7 @@ import { IssuesReportComponent } from "./issues-report.component";
import { InputSwitchModule, SidebarModule } from "primeng/primeng";
import {
MatButtonModule, MatNativeDateModule, MatIconModule, MatSidenavModule, MatListModule, MatToolbarModule} from '@angular/material';
MatButtonModule, MatNativeDateModule, MatIconModule, MatSidenavModule, MatListModule, MatToolbarModule, MatTooltipModule} from '@angular/material';
import { MatCardModule, MatInputModule, MatTabsModule } from "@angular/material";
@NgModule({
@ -51,6 +51,7 @@ import {
MatSidenavModule,
MatListModule,
MatToolbarModule,
MatTooltipModule,
],
})
export class SharedModule {}

25
src/Ombi/ClientApp/src/styles/Styles.scss
View file

@ -1 +1,24 @@
@import '@angular/material/prebuilt-themes/deeppurple-amber.css';
@import '~@angular/material/theming';
// Plus imports for other components in your app.
// Include the common styles for Angular Material. We include this here so that you only
// have to load a single css file for Angular Material in your app.
// Be sure that you only ever include this mixin once!
@include mat-core();
// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
$ombi-app-primary: mat-palette($mat-blue-grey, 900);
$ombi-app-accent: mat-palette($mat-pink, A200, A100, A400);
// The warn palette is optional (defaults to red).
$ombi-app-warn: mat-palette($mat-deep-orange);
// Create the theme object (a Sass map containing all of the palettes).
$ombi-app-theme: mat-light-theme($ombi-app-primary, $ombi-app-accent, $ombi-app-warn);
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
@include angular-material-theme($ombi-app-theme);

1020
src/Ombi/ClientApp/src/styles/base.scss
View file

File diff suppressed because it is too large Load diff

23
src/Ombi/ClientApp/src/styles/scrollbar.scss
View file

@ -1,23 +0,0 @@
::-webkit-scrollbar {
width: 15px;
}
::-webkit-scrollbar-track {
background-color: rgba(0,0,0,.2);
}
::-webkit-scrollbar-thumb {
min-height: 50px;
background-color: rgba(255,255,255,.15);
border: 3px solid transparent;
border-radius: 8px;
background-clip: padding-box;
}
pre::-webkit-scrollbar-track {
background-color: rgba(255,255,255,.2);
}
pre::-webkit-scrollbar-thumb {
background-color: rgba(0,0,0,.15);
}