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

!wip

Browse source
This commit is contained in:
TidusJar 2019-02-15 16:29:18 +00:00
commit 1b2891684c
18 changed files with 137 additions and 439 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/Ombi.Core/Models/Search/V2/MovieFullInfoViewModel.cs
View file

@ -40,6 +40,17 @@ namespace Ombi.Core.Models.Search.V2
public Similar Similar { get; set; }
public Recommendations Recommendations { get; set; }
public ExternalIds ExternalIds { get; set; }
public Keywords Keywords { get; set; }
}
public class Keywords
{
public List<KeywordsValue> KeywordsValue { get; set; }
}
public class KeywordsValue
{
public int Id { get; set; }
public string Name { get; set; }
}
public class CollectionsViewModel

4
src/Ombi.Mapping/Profiles/MovieProfile.cs
View file

@ -4,6 +4,8 @@ using Ombi.Api.TheMovieDb.Models;
using Ombi.Core.Models.Search;
using Ombi.Core.Models.Search.V2;
using Ombi.TheMovieDbApi.Models;
using Keywords = Ombi.Core.Models.Search.V2.Keywords;
using KeywordsValue = Ombi.Api.TheMovieDb.Models.KeywordsValue;
namespace Ombi.Mapping.Profiles
{
@ -87,6 +89,8 @@ namespace Ombi.Mapping.Profiles
CreateMap<Ombi.Api.TheMovieDb.Models.FullMovieCrew, Ombi.Core.Models.Search.V2.FullMovieCrewViewModel>().ReverseMap();
CreateMap<Ombi.Api.TheMovieDb.Models.ExternalIds, Ombi.Core.Models.Search.V2.ExternalIds>().ReverseMap();
CreateMap<BelongsToCollection, Ombi.Core.Models.Search.V2.CollectionsViewModel>().ReverseMap();
CreateMap<Api.TheMovieDb.Models.Keywords, Ombi.Core.Models.Search.V2.Keywords>().ReverseMap();
CreateMap<KeywordsValue, Ombi.Core.Models.Search.V2.KeywordsValue>().ReverseMap();
}
}
}

3
src/Ombi/ClientApp/angular.json
View file

@ -28,7 +28,8 @@
"node_modules/bootstrap/scss/bootstrap.scss",
"node_modules/angular-bootstrap-md/scss/mdb-free.scss",
"node_modules/pace/themes/orange/pace-theme-flat-top.css",
"node_modules/font-awesome/scss/font-awesome.scss"
"node_modules/font-awesome/scss/font-awesome.scss",
"node_modules/primeng/resources/primeng.min.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js",

2
src/Ombi/ClientApp/package.json
View file

@ -53,7 +53,7 @@
"ngx-page-scroll": "^5.0.1",
"pace": "github:HubSpot/pace#v1.0.2",
"popper.js": "^1.14.3",
"primeng": "^7.0.3",
"primeng": "^7.1.0",
"rxjs": "^6.0.0",
"socket.io-client": "^2.2.0",
"store": "^2.0.12",

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

@ -21,7 +21,7 @@ import {
} from "primeng/primeng";
import {
MatButtonModule, MatNativeDateModule, MatIconModule, MatSidenavModule, MatListModule, MatToolbarModule, MatAutocompleteModule, MatCheckboxModule
MatButtonModule, MatNativeDateModule, MatIconModule, MatSidenavModule, MatListModule, MatToolbarModule, MatAutocompleteModule, MatCheckboxModule, MatSnackBarModule
} from '@angular/material';
import { MatCardModule, MatInputModule, MatTabsModule } from "@angular/material";
@ -45,7 +45,7 @@ import { AuthService } from "./auth/auth.service";
import { ImageService, SettingsService, CustomPageService } from "./services";
import { LandingPageService } from "./services";
import { NotificationService } from "./services";
import { IssuesService, JobService, PlexTvService, StatusService, SearchService, IdentityService } from "./services";
import { IssuesService, JobService, PlexTvService, StatusService, SearchService, IdentityService, MessageService } from "./services";
import { MyNavComponent } from './my-nav/my-nav.component';
import { LayoutModule } from '@angular/cdk/layout';
import { SearchV2Service } from "./services/searchV2.service";
@ -104,6 +104,7 @@ export function JwtTokenGetter() {
ButtonModule,
FormsModule,
DataTableModule,
MatSnackBarModule,
SharedModule,
NgxEditorModule,
DialogModule,
@ -168,6 +169,7 @@ export function JwtTokenGetter() {
PlexTvService,
SearchService,
SearchV2Service,
MessageService,
],
bootstrap: [AppComponent],
})

3
src/Ombi/ClientApp/src/app/interfaces/ISearchMovieResultV2.ts
View file

@ -40,7 +40,7 @@
showSubscribe: boolean;
externalIds: IExternalIds;
keywords: IKeywords;
collections: ICollectionsModel;
belongsToCollection: ICollectionsModel;
// for the UI
requestProcessing: boolean;
@ -48,6 +48,7 @@
background: any;
}
export interface ICollectionsModel {
id: number;
name: string;

3
src/Ombi/ClientApp/src/app/media-details/media-details.module.ts
View file

@ -3,6 +3,8 @@ import { RouterModule, Routes } from "@angular/router";
import { SearchService, RequestService } from "../services";
import {CarouselModule} from 'primeng/carousel';
import { SharedModule } from "../shared/shared.module";
import { MovieDetailsComponent } from "./movie-details.component";
import { PipeModule } from "../pipes/pipe.module";
@ -16,6 +18,7 @@ const routes: Routes = [
RouterModule.forChild(routes),
SharedModule,
PipeModule,
CarouselModule,
],
declarations: [
MovieDetailsComponent,

77
src/Ombi/ClientApp/src/app/media-details/movie-details.component.html
View file

@ -103,7 +103,8 @@
<div class="row">
<div class="col-12 col-md-3">
<button *ngIf="movie.belongsToCollection" mat-raised-button class="btn-spacing-below full-width mat-elevation-z8">{{movie.belongsToCollection.name}}</button>
<button *ngIf="movie.belongsToCollection" mat-raised-button
class="btn-spacing-below full-width mat-elevation-z8">{{movie.belongsToCollection.name}}</button>
<mat-card class="card-full mat-elevation-z8">
<mat-card-content>
@ -163,8 +164,49 @@
</div>
<div class="row card-spacer">
<div class="col-12 col-md-9 offset-md-3">
<div class="row card-spacer media-row">
<div class="col-12 col-md-3">
<mat-card class="mat-elevation-z8 keywords-panel">
<mat-card-content>
<div>
<span>
<strong>Keywords/Tags:</strong>
<mat-chip-list>
<mat-chip *ngFor="let keyword of movie.keywords.keywordsValue">
{{keyword.name}}
</mat-chip>
</mat-chip-list>
</span>
</div>
</mat-card-content>
</mat-card>
</div>
<div class="col-12 col-md-9">
<mat-card class="card-full mat-elevation-z8">
<mat-card-header>Cast</mat-card-header>
<mat-card-content>
<p-carousel [value]="movie.credits.cast" [numVisible]="5" easing="easeOutStrong">
<ng-template let-item pTemplate="item">
<div class="row justify-content-md-center">
<div class="col-12">
<img width="150px" *ngIf="item.profile_path"
src="https://image.tmdb.org/t/p/w300/{{item.profile_path}}">
<!-- TODO get profile image default -->
</div>
<div class="col-12">
<span><strong>Character:</strong> {{item.character}}</span>
</div>
<div class="col-12">
<span><strong>Actor:</strong> {{item.name}}</span>
</div>
</div>
</ng-template>
</p-carousel>
</mat-card-content>
</mat-card>
</div>
<!-- <div class="col-12 col-md-9">
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
@ -230,34 +272,11 @@
</div>
</mat-expansion-panel>
</mat-accordion>
</div>
<!-- <div class="col-12 col-md-2">
<div *ngFor="let castIndex of [0,1,2,3,4]" class="row align-items-center cast-row ">
<div class="col-4">
<img src="https://image.tmdb.org/t/p/w300/{{movie.credits.cast[castIndex].profile_path}}"
class="cast-profile-img mat-elevation-z8" />
</div>
<div class="col-8">
<div class="row cast-names">
<div class="col-12">
<div><small>{{movie.credits.cast[castIndex].character}}</small></div>
</div>
<div class="col-12 cast-name">
<div><small>{{movie.credits.cast[castIndex].name}}</small></div>
</div>
</div>
</div>
</div>
</div> -->
< </div> </div> <div class="bottom-page-gap">
</div>
</div>
</section>

4
src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss
View file

@ -208,3 +208,7 @@ section {
margin: auto;
width: 86%;
}
.keywords-panel {
margin-top: 8%;
}

12
src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts
View file

@ -1,5 +1,5 @@
import { Component } from "@angular/core";
import { ImageService, SearchV2Service, RequestService } from "../services";
import { ImageService, SearchV2Service, RequestService, NotificationService, MessageService } from "../services";
import { ActivatedRoute } from "@angular/router";
import { DomSanitizer } from "@angular/platform-browser";
import { ISearchMovieResultV2 } from "../interfaces/ISearchMovieResultV2";
@ -17,7 +17,7 @@ export class MovieDetailsComponent {
constructor(private searchService: SearchV2Service, private route: ActivatedRoute,
private sanitizer: DomSanitizer, private imageService: ImageService,
public dialog: MatDialog, private requestService: RequestService,
public snackBar: MatSnackBar) {
public messageService: MessageService) {
this.route.params.subscribe((params: any) => {
this.theMovidDbId = params.movieDbId;
this.load();
@ -39,13 +39,9 @@ export class MovieDetailsComponent {
var result = await this.requestService.requestMovie({theMovieDbId: this.theMovidDbId, languageCode: null}).toPromise();
if(result.result) {
this.movie.requested = true;
this.snackBar.open(result.message, "Ok", {
duration:3000
});
this.messageService.send(result.message, "Ok");
} else {
this.snackBar.open(result.errorMessage, "Ok", {
duration:3000,
});
this.messageService.send(result.errorMessage, "Ok");
}
}

1
src/Ombi/ClientApp/src/app/services/index.ts
View file

@ -18,3 +18,4 @@ export * from "./vote.service";
export * from "./requestretry.service";
export * from "./searchV2.service";
export * from "./custompage.service";
export * from "./message.service";

17
src/Ombi/ClientApp/src/app/services/message.service.ts Normal file
View file

@ -0,0 +1,17 @@
import { Injectable } from "@angular/core";
import { MatSnackBar, MatSnackBarConfig } from "@angular/material";
@Injectable()
export class MessageService {
constructor(private snackBar: MatSnackBar) {
this.config = {
duration: 4000,
}
}
private config: MatSnackBarConfig;
public send(message: string, action?: string) {
this.snackBar.open(message, action.toUpperCase(), this.config)
}
}

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

@ -12,7 +12,7 @@ import { InputSwitchModule, SidebarModule } from "primeng/primeng";
import {
MatButtonModule, MatNativeDateModule, MatIconModule, MatSidenavModule, MatListModule, MatToolbarModule, MatTooltipModule} from '@angular/material';
import { MatCardModule, MatInputModule, MatTabsModule, MatAutocompleteModule, MatCheckboxModule, MatExpansionModule, MatDialogModule, MatProgressSpinnerModule,
MatSnackBarModule } from "@angular/material";
MatChipsModule } from "@angular/material";
@NgModule({
declarations: [
@ -32,6 +32,7 @@ import {
MatTabsModule,
MatButtonModule,
MatNativeDateModule,
MatChipsModule,
MatIconModule,
MatSidenavModule,
MatListModule,
@ -39,12 +40,10 @@ import {
MatCheckboxModule,
MatExpansionModule,
MatDialogModule,
MatSnackBarModule,
],
exports: [
TranslateModule,
CommonModule,
MatSnackBarModule,
FormsModule,
SidebarModule,
MatProgressSpinnerModule,
@ -54,6 +53,7 @@ import {
MomentModule,MatCardModule,
MatInputModule,
MatTabsModule,
MatChipsModule,
MatButtonModule,
MatNativeDateModule,
MatIconModule,

2
src/Ombi/ClientApp/src/styles/Themes/original.scss
View file

@ -1,2 +0,0 @@
body {
}

363
src/Ombi/ClientApp/src/styles/Themes/plex.scss
View file

@ -1,363 +0,0 @@
$primary-colour: #df691a;
$primary-colour-outline: #ff761b;
$bg-colour: #333333;
$bg-colour-disabled: #252424;
$i:!important;
.form-control-custom {
background-color: $bg-colour $i;
}
.form-control-custom-disabled {
background-color: $bg-colour-disabled $i;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
background: $primary-colour;
}
.scroll-top-wrapper {
background-color: $bg-colour;
}
.scroll-top-wrapper:hover {
background-color: $primary-colour;
}
* {
display:none !important;
}
.table-striped > tbody > tr:nth-of-type(odd) {
background-color: #333;
}
.table-hover > tbody > tr:hover {
background-color: #282828;
}
fieldset {
padding: 15px;
}
legend {
border-bottom: 1px solid #333333;
}
.form-control {
color: #fefefe;
background-color: #333;
border-radius: 5px;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
margin-left: -0px;
}
.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
margin-top: -15px;
}
.dropdown-menu {
background-color: #282828;
}
.dropdown-menu .divider {
background-color: #333333;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
background-color: #333;
}
.input-group-addon {
background-color: #333333;
}
.right-radius {
border-radius: 0px 5px 5px 0px;
}
.left-radius {
border-radius: 5px 0px 0px 5px;
}
.nav > li > a:hover,
.nav > li > a:focus {
background-color: #df691a;
}
.nav-tabs > li > a:hover {
border-color: #df691a #df691a transparent;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
background-color: #df691a;
border: 1px solid #df691a;
}
.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
border: 1px solid #df691a;
}
/*.navbar {
position: relative;
min-height: 40px;
margin-bottom: 21px;
z-index: 1000;
padding: 0px 3px;
font-size: 24px;
background-color: #000;
box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0.2);
}*/
.navbar-default {
background-color: #0a0a0a;
border-color: #0a0a0a;
}
.navbar-default .navbar-brand {
color: #DF691A;
}
.nav-tabs {
border-bottom: 1px solid $bg-colour-disabled;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #F0ad4e;
background-color: #282828;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
background-color: #282828;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
background-color: #df691a;
color: #fff;
}
.pagination > li > a,
.pagination > li > span {
background-color: #282828;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
background-color: #333;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #fefefe;
background-color: #333333;
}
.list-group-item {
background-color: #282828;
}
a.list-group-item:hover,
button.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:focus {
background-color: #333333;
}
.input-addon,
.input-group-addon {
color: #df691a;
}
.modal-header,
.modal-footer {
background-color: #282828;
}
.modal-content {
position: relative;
background-color: #282828;
border: 1px solid transparent;
border-radius: 0;
-webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;
background-clip: padding-box;
outline: 0;
}
.badge {
display: inline-block;
min-width: 10px;
padding: 3px 7px;
font-size: 12px;
font-weight: 300;
color: #ebebeb;
line-height: 1;
vertical-align: middle;
white-space: nowrap;
text-align: center;
background-color: $bg-colour;
border-radius: 10px;
}
.bootstrap-datetimepicker-widget.dropdown-menu {
background-color: $bg-colour;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
border-bottom: 6px solid $bg-colour $i;
}
#sidebar-wrapper {
background: $bg-colour-disabled;
}
#cacherRunning {
background-color: $bg-colour;
text-align: center;
font-size: 15px;
padding: 3px 0;
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
background-color: $bg-colour;
border-color: $bg-colour-disabled;
}
.card-header {
background-color: $bg-colour;
color: #ebebeb;
padding: 10px 15px;
border-bottom: 1px solid #1f1f1f;
}
.card-header > a {
color: white;
}
.card-block {
background: $bg-colour-disabled;
}
.panel {
margin-bottom: 21px;
background-color: $bg-colour-disabled;
border: 1px solid transparent;
border-radius: 0;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.ui-widget-content {
border: 1px solid #1f1f1f !important;
background: #1f1f1f !important;
}
.ui-widget-content {
color: #ffffff;
}
.ui-inputtext {
background: $bg-colour;
color:white;
}
.ui-autocomplete-input-token input{
color:white;
}
.ui-state-default {
border: 2px solid $bg-colour-disabled;
}
.ui-button {
background: $primary-colour $i;
border: 1px solid $primary-colour-outline $i;
}
.ui-dialog-titlebar{
background:$bg-colour-disabled;
color:white;
}
.ui-state-active{
color:$primary-colour $i;
}
.ui-radiobutton-box .ui-widget .ui-state-default {
border-width: 2px;
border-style: solid;
border-color: $primary-colour-outline;
border-image: initial;
}
.ui-radiobutton, .ui-radiobutton-label{
vertical-align: baseline;
}
.side-back {
padding-top:5%;
box-shadow: 0px 0px 3.5em #000000;
}
.side-small {
width:20em $i;
}
.ui-widget-overlay .ui-sidebar-mask {
background: black;
}
.myBg {
width: 100%;
height: 100%;
position: absolute;
}
.album-bg {
width: 92%;
height: 100%;
position: absolute;
}
.tint {
width: 100%;
height: 100%;
position: absolute;
}
.album-tint {
width: 92%;
height: 100%;
position: absolute;
}
table.table > thead > tr > th.active {
background-color: $primary-colour;
}

3
src/Ombi/ClientApp/src/styles/_imports.scss
View file

@ -1,2 +1,3 @@
@import "./styles.scss";
@import "./shared.scss";
@import "./shared.scss";
@import "./buttons.scss";

20
src/Ombi/ClientApp/src/styles/buttons.scss Normal file
View file

@ -0,0 +1,20 @@
.btn-blue {
background-color: #1976D2;
}
.btn-pink {
background-color: #C2185B;
}
.btn-green {
background-color: #1DE9B6;
}
.btn-orange {
background-color: #F57C00;
}
.active-button {
background-color: #5dffbd !important;
color: white;
}

39
src/Ombi/ClientApp/src/styles/shared.scss
View file

@ -1,37 +1,20 @@

@media (max-width: 978px) {
@media (max-width: 978px) {
.top-spacing {
padding-top: 10%;
}
}
@media (min-width: 979px) {
}
@media (min-width: 979px) {
.top-spacing {
padding-top: 4%;
}
}
.btn-blue {
background-color: #1976D2;
}
.btn-pink {
background-color: #C2185B;
}
.btn-green {
background-color: #1DE9B6;
}
.btn-orange {
background-color: #F57C00;
}
.spinner-container {
position: relative;
margin-left: 50%;
}
.active-button {
background-color: #5dffbd !important;
color:white;
.spinner-container {
position: relative;
margin-left: 50%;
}
.bottom-page-gap {
height: 50px;
}