From 1b2891684cfc7820f06ce141d86108e7b7614b09 Mon Sep 17 00:00:00 2001 From: TidusJar Date: Fri, 15 Feb 2019 16:29:18 +0000 Subject: [PATCH] !wip --- .../Search/V2/MovieFullInfoViewModel.cs | 11 + src/Ombi.Mapping/Profiles/MovieProfile.cs | 4 + src/Ombi/ClientApp/angular.json | 3 +- src/Ombi/ClientApp/package.json | 2 +- src/Ombi/ClientApp/src/app/app.module.ts | 6 +- .../app/interfaces/ISearchMovieResultV2.ts | 3 +- .../app/media-details/media-details.module.ts | 3 + .../movie-details.component.html | 75 ++-- .../movie-details.component.scss | 4 + .../media-details/movie-details.component.ts | 12 +- src/Ombi/ClientApp/src/app/services/index.ts | 1 + .../src/app/services/message.service.ts | 17 + .../ClientApp/src/app/shared/shared.module.ts | 6 +- .../ClientApp/src/styles/Themes/original.scss | 2 - .../ClientApp/src/styles/Themes/plex.scss | 363 ------------------ src/Ombi/ClientApp/src/styles/_imports.scss | 3 +- src/Ombi/ClientApp/src/styles/buttons.scss | 20 + src/Ombi/ClientApp/src/styles/shared.scss | 35 +- 18 files changed, 134 insertions(+), 436 deletions(-) create mode 100644 src/Ombi/ClientApp/src/app/services/message.service.ts delete mode 100644 src/Ombi/ClientApp/src/styles/Themes/original.scss delete mode 100644 src/Ombi/ClientApp/src/styles/Themes/plex.scss create mode 100644 src/Ombi/ClientApp/src/styles/buttons.scss diff --git a/src/Ombi.Core/Models/Search/V2/MovieFullInfoViewModel.cs b/src/Ombi.Core/Models/Search/V2/MovieFullInfoViewModel.cs index 138219458..f1d8665b0 100644 --- a/src/Ombi.Core/Models/Search/V2/MovieFullInfoViewModel.cs +++ b/src/Ombi.Core/Models/Search/V2/MovieFullInfoViewModel.cs @@ -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 { get; set; } + } + + public class KeywordsValue + { + public int Id { get; set; } + public string Name { get; set; } } public class CollectionsViewModel diff --git a/src/Ombi.Mapping/Profiles/MovieProfile.cs b/src/Ombi.Mapping/Profiles/MovieProfile.cs index d0e1ea095..2c37e91be 100644 --- a/src/Ombi.Mapping/Profiles/MovieProfile.cs +++ b/src/Ombi.Mapping/Profiles/MovieProfile.cs @@ -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().ReverseMap(); CreateMap().ReverseMap(); CreateMap().ReverseMap(); + CreateMap().ReverseMap(); + CreateMap().ReverseMap(); } } } \ No newline at end of file diff --git a/src/Ombi/ClientApp/angular.json b/src/Ombi/ClientApp/angular.json index 68d9b9cd8..53547eace 100644 --- a/src/Ombi/ClientApp/angular.json +++ b/src/Ombi/ClientApp/angular.json @@ -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", diff --git a/src/Ombi/ClientApp/package.json b/src/Ombi/ClientApp/package.json index f2515bc07..7cabf0321 100644 --- a/src/Ombi/ClientApp/package.json +++ b/src/Ombi/ClientApp/package.json @@ -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", diff --git a/src/Ombi/ClientApp/src/app/app.module.ts b/src/Ombi/ClientApp/src/app/app.module.ts index 76805bfc4..7cac73bba 100644 --- a/src/Ombi/ClientApp/src/app/app.module.ts +++ b/src/Ombi/ClientApp/src/app/app.module.ts @@ -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], }) diff --git a/src/Ombi/ClientApp/src/app/interfaces/ISearchMovieResultV2.ts b/src/Ombi/ClientApp/src/app/interfaces/ISearchMovieResultV2.ts index 1d95c800c..5787a363a 100644 --- a/src/Ombi/ClientApp/src/app/interfaces/ISearchMovieResultV2.ts +++ b/src/Ombi/ClientApp/src/app/interfaces/ISearchMovieResultV2.ts @@ -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; diff --git a/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts b/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts index 942e16fe5..64fc132fe 100644 --- a/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts +++ b/src/Ombi/ClientApp/src/app/media-details/media-details.module.ts @@ -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, diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html index 288427d88..ba08ccb10 100644 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.html @@ -103,7 +103,8 @@
- + @@ -163,8 +164,49 @@
-
-
+
+
+ + +
+ + Keywords/Tags: + + + {{keyword.name}} + + + +
+ + +
+ +
+ + Cast + + + +
+
+ + +
+
+ Character: {{item.character}} +
+
+ Actor: {{item.name}} +
+
+ + + + +
+ -
- - -
+ <
+
diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss index b7f865045..59aeefdae 100644 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss @@ -208,3 +208,7 @@ section { margin: auto; width: 86%; } + +.keywords-panel { + margin-top: 8%; +} \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts index c28d2eb91..1dd235752 100644 --- a/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts +++ b/src/Ombi/ClientApp/src/app/media-details/movie-details.component.ts @@ -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"); } } diff --git a/src/Ombi/ClientApp/src/app/services/index.ts b/src/Ombi/ClientApp/src/app/services/index.ts index 51e698de8..911f41910 100644 --- a/src/Ombi/ClientApp/src/app/services/index.ts +++ b/src/Ombi/ClientApp/src/app/services/index.ts @@ -18,3 +18,4 @@ export * from "./vote.service"; export * from "./requestretry.service"; export * from "./searchV2.service"; export * from "./custompage.service"; +export * from "./message.service"; diff --git a/src/Ombi/ClientApp/src/app/services/message.service.ts b/src/Ombi/ClientApp/src/app/services/message.service.ts new file mode 100644 index 000000000..452318c59 --- /dev/null +++ b/src/Ombi/ClientApp/src/app/services/message.service.ts @@ -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) + } +} diff --git a/src/Ombi/ClientApp/src/app/shared/shared.module.ts b/src/Ombi/ClientApp/src/app/shared/shared.module.ts index 50c1da1eb..516c4d115 100644 --- a/src/Ombi/ClientApp/src/app/shared/shared.module.ts +++ b/src/Ombi/ClientApp/src/app/shared/shared.module.ts @@ -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, diff --git a/src/Ombi/ClientApp/src/styles/Themes/original.scss b/src/Ombi/ClientApp/src/styles/Themes/original.scss deleted file mode 100644 index 46800d16a..000000000 --- a/src/Ombi/ClientApp/src/styles/Themes/original.scss +++ /dev/null @@ -1,2 +0,0 @@ -body { -} diff --git a/src/Ombi/ClientApp/src/styles/Themes/plex.scss b/src/Ombi/ClientApp/src/styles/Themes/plex.scss deleted file mode 100644 index 80685f9ea..000000000 --- a/src/Ombi/ClientApp/src/styles/Themes/plex.scss +++ /dev/null @@ -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; -} \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/styles/_imports.scss b/src/Ombi/ClientApp/src/styles/_imports.scss index 6563b6f85..1fe2f4e01 100644 --- a/src/Ombi/ClientApp/src/styles/_imports.scss +++ b/src/Ombi/ClientApp/src/styles/_imports.scss @@ -1,2 +1,3 @@ @import "./styles.scss"; -@import "./shared.scss"; \ No newline at end of file +@import "./shared.scss"; +@import "./buttons.scss"; \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/styles/buttons.scss b/src/Ombi/ClientApp/src/styles/buttons.scss new file mode 100644 index 000000000..6343ce35b --- /dev/null +++ b/src/Ombi/ClientApp/src/styles/buttons.scss @@ -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; +} \ No newline at end of file diff --git a/src/Ombi/ClientApp/src/styles/shared.scss b/src/Ombi/ClientApp/src/styles/shared.scss index dbcaec107..8d6bf5bec 100644 --- a/src/Ombi/ClientApp/src/styles/shared.scss +++ b/src/Ombi/ClientApp/src/styles/shared.scss @@ -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%; + position: relative; + margin-left: 50%; } -.active-button { - background-color: #5dffbd !important; - color:white; +.bottom-page-gap { + height: 50px; } \ No newline at end of file