Profile page finished
This commit is contained in:
@@ -13,7 +13,7 @@
|
||||
<link rel="stylesheet" href="css/panel.css?version=0.3.0.3"/>
|
||||
<link rel="stylesheet" href="css/main_button.css?version=0.3.0.0"/>
|
||||
<link rel="stylesheet" href="css/gaps.css?version=0.3.0.1"/>
|
||||
<link rel="stylesheet" href="WatchIt.Website.styles.css?version=0.4.0.12"/>
|
||||
<link rel="stylesheet" href="WatchIt.Website.styles.css?version=0.4.0.13"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
|
||||
<!-- BOOTSTRAP -->
|
||||
|
||||
@@ -1,12 +1,10 @@
|
||||
@using WatchIt.Website.Components.Pages.HomePage.Subcomponents
|
||||
|
||||
@typeparam TItem
|
||||
|
||||
|
||||
|
||||
<div class="panel">
|
||||
<div class="vstack gap-3">
|
||||
<span class="panel-text-title">Top @(Count) @(Name) this week by popularity</span>
|
||||
<span class="panel-text-title">@(Title)</span>
|
||||
@if (_loaded)
|
||||
{
|
||||
<div class="container-grid">
|
||||
@@ -18,10 +16,10 @@
|
||||
{
|
||||
<a class="text-reset text-decoration-none" href="@(string.Format(ItemUrlFormatString, IdSource(_items.ElementAt(i))))">
|
||||
@{int iCopy = i;}
|
||||
<ViewRankItemComponent Place="@(i + 1)"
|
||||
Name="@(NameSource(_items.ElementAt(iCopy)))"
|
||||
PosterPlaceholder="@(PosterPlaceholder)"
|
||||
GetPosterAction="@(action => GetPictureAction(IdSource(_items.ElementAt(iCopy)), action))"/>
|
||||
<HorizontalListItemComponent Place="@(i + 1)"
|
||||
Name="@(NameSource(_items.ElementAt(iCopy)))"
|
||||
PosterPlaceholder="@(PosterPlaceholder)"
|
||||
GetPosterAction="@(action => GetPictureAction(IdSource(_items.ElementAt(iCopy)), action))"/>
|
||||
</a>
|
||||
}
|
||||
</div>
|
||||
@@ -3,19 +3,19 @@ using Microsoft.AspNetCore.Components;
|
||||
using WatchIt.Common.Model;
|
||||
using WatchIt.Common.Query;
|
||||
|
||||
namespace WatchIt.Website.Components.Pages.HomePage.Panels;
|
||||
namespace WatchIt.Website.Components.Common.Panels;
|
||||
|
||||
public partial class ViewRankPanelComponent<TItem> : ComponentBase
|
||||
public partial class HorizontalListPanelComponent<TItem> : ComponentBase
|
||||
{
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public int Count { get; set; } = 5;
|
||||
[Parameter] public required string Name {get; set; }
|
||||
[Parameter] public required Func<int, Action<IEnumerable<TItem>>, Task> GetViewRankAction { get; set; }
|
||||
[Parameter] public required string Title {get; set; }
|
||||
[Parameter] public required Func<Action<IEnumerable<TItem>>, Task> GetItemsAction { get; set; }
|
||||
[Parameter] public required string ItemUrlFormatString { get; set; }
|
||||
[Parameter] public required Func<TItem, long> IdSource { get; set; }
|
||||
[Parameter] public required Func<TItem, string> NameSource { get; set; }
|
||||
[Parameter] public required string PosterPlaceholder {get; set; }
|
||||
[Parameter] public required string PosterPlaceholder { get; set; }
|
||||
[Parameter] public required Func<long, Action<Picture>, Task> GetPictureAction { get; set; }
|
||||
|
||||
#endregion
|
||||
@@ -43,7 +43,7 @@ public partial class ViewRankPanelComponent<TItem> : ComponentBase
|
||||
// STEP 0
|
||||
endTasks.AddRange(
|
||||
[
|
||||
GetViewRankAction(Count, data => _items = data)
|
||||
GetItemsAction(data => _items = data)
|
||||
]);
|
||||
|
||||
// END
|
||||
@@ -1,9 +1,9 @@
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using WatchIt.Common.Model;
|
||||
|
||||
namespace WatchIt.Website.Components.Pages.HomePage.Subcomponents;
|
||||
namespace WatchIt.Website.Components.Common.Subcomponents;
|
||||
|
||||
public partial class ViewRankItemComponent : ComponentBase
|
||||
public partial class HorizontalListItemComponent : ComponentBase
|
||||
{
|
||||
#region PARAMETERS
|
||||
|
||||
@@ -70,5 +70,13 @@
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="1" @bind-Value="@(Query.UserRatingTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">User rating date</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingDateFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingDateTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
@@ -8,25 +8,25 @@
|
||||
<div class="container-grid">
|
||||
<div class="row mb-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Name</span>
|
||||
<span class="col-4 input-group-text">Name</span>
|
||||
<InputText class="col form-control" placeholder="Search with regex" @bind-Value="@(Query.Name)"></InputText>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Full name</span>
|
||||
<span class="col-4 input-group-text">Full name</span>
|
||||
<InputText class="col form-control" placeholder="Search with regex" @bind-Value="@(Query.FullName)"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Description</span>
|
||||
<span class="col-4 input-group-text">Description</span>
|
||||
<InputText class="col form-control" placeholder="Search with regex" @bind-Value="@(Query.Description)"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Birth date</span>
|
||||
<span class="col-4 input-group-text">Birth date</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.BirthDateFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.BirthDateTo)"/>
|
||||
@@ -34,7 +34,7 @@
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Death date</span>
|
||||
<span class="col-4 input-group-text">Death date</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.DeathDateFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.DeathDateTo)"/>
|
||||
@@ -42,7 +42,7 @@
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Gender</span>
|
||||
<span class="col-4 input-group-text">Gender</span>
|
||||
<InputSelect TValue="short?" class="col form-control" @bind-Value="@(Query.GenderId)">
|
||||
<option @onclick="() => Query.GenderId = null">No choice</option>
|
||||
@foreach (GenderResponse gender in _genders)
|
||||
@@ -54,7 +54,7 @@
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Rating (count)</span>
|
||||
<span class="col-4 input-group-text">Rating (count)</span>
|
||||
<NumericEdit TValue="long?" Class="col form-control" Min="0" @bind-Value="@(Query.RatingCountFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<NumericEdit TValue="long?" Class="col form-control" Min="0" @bind-Value="@(Query.RatingCountTo)"/>
|
||||
@@ -62,7 +62,7 @@
|
||||
</div>
|
||||
<div class="row mt-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">Rating (average)</span>
|
||||
<span class="col-4 input-group-text">Rating (average)</span>
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="@(0.01M)" @bind-Value="@(Query.RatingAverageFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="@(0.01M)" @bind-Value="@(Query.RatingAverageTo)"/>
|
||||
@@ -70,7 +70,7 @@
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">User rating (count)</span>
|
||||
<span class="col-4 input-group-text">User rating (count)</span>
|
||||
<NumericEdit TValue="long?" Class="col form-control" Min="0" @bind-Value="@(Query.UserRatingCountFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<NumericEdit TValue="long?" Class="col form-control" Min="0" @bind-Value="@(Query.UserRatingCountTo)"/>
|
||||
@@ -78,11 +78,19 @@
|
||||
</div>
|
||||
<div class="row mt-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">User rating (average)</span>
|
||||
<span class="col-4 input-group-text">User rating (average)</span>
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="@(0.01M)" @bind-Value="@(Query.UserRatingAverageFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="@(0.01M)" @bind-Value="@(Query.UserRatingAverageTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-4 input-group-text">User rating (date)</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingLastDateFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingLastDateTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
@@ -73,5 +73,13 @@
|
||||
<NumericEdit TValue="decimal?" Class="col form-control" Min="0" Max="10" Step="1" @bind-Value="@(Query.UserRatingTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row my-1">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="col-3 input-group-text">User rating date</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingDateFrom)"/>
|
||||
<span class="col-auto input-group-text">-</span>
|
||||
<InputDate TValue="DateOnly?" class="col form-control" @bind-Value="@(Query.UserRatingDateTo)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
@@ -1,7 +1,6 @@
|
||||
@using WatchIt.Common.Model.Movies
|
||||
@using WatchIt.Common.Model.Persons
|
||||
@using WatchIt.Common.Model.Series
|
||||
@using WatchIt.Website.Components.Pages.HomePage.Panels
|
||||
|
||||
@page "/"
|
||||
|
||||
@@ -10,28 +9,28 @@
|
||||
|
||||
|
||||
<div class="vstack gap-default">
|
||||
<ViewRankPanelComponent TItem="MovieResponse"
|
||||
Name="movies"
|
||||
GetViewRankAction="@((count, action) => MoviesClientService.GetMoviesViewRank(count, successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<ViewRankPanelComponent TItem="SeriesResponse"
|
||||
Name="TV series"
|
||||
GetViewRankAction="@((count, action) => SeriesClientService.GetSeriesViewRank(count, successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<ViewRankPanelComponent TItem="PersonResponse"
|
||||
Name="people"
|
||||
GetViewRankAction="@((count, action) => PersonsClientService.GetPersonsViewRank(count, successAction: action))"
|
||||
ItemUrlFormatString="/person/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.Name)"
|
||||
PosterPlaceholder="/assets/person_poster.png"
|
||||
GetPictureAction="@((id, action) => PersonsClientService.GetPersonPhoto(id, action))"/>
|
||||
<HorizontalListPanelComponent TItem="MovieResponse"
|
||||
Title="Top 5 movies this week by popularity"
|
||||
GetItemsAction="@(action => MoviesClientService.GetMoviesViewRank(successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<HorizontalListPanelComponent TItem="SeriesResponse"
|
||||
Title="Top 5 TV series this week by popularity"
|
||||
GetItemsAction="@(action => SeriesClientService.GetSeriesViewRank(successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<HorizontalListPanelComponent TItem="PersonResponse"
|
||||
Title="Top 5 people this week by popularity"
|
||||
GetItemsAction="@(action => PersonsClientService.GetPersonsViewRank(successAction: action))"
|
||||
ItemUrlFormatString="/person/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.Name)"
|
||||
PosterPlaceholder="/assets/person_poster.png"
|
||||
GetPictureAction="@((id, action) => PersonsClientService.GetPersonPhoto(id, action))"/>
|
||||
</div>
|
||||
@@ -65,7 +65,35 @@
|
||||
</Items>
|
||||
<Content>
|
||||
<TabPanel Name="summary">
|
||||
|
||||
<div class="vstack gap-default mt-default">
|
||||
<HorizontalListPanelComponent TItem="MovieRatedResponse"
|
||||
Title="Recently rated movies"
|
||||
Count="6"
|
||||
GetItemsAction="@(action => AccountsClientService.GetAccountRatedMovies(Id!.Value, new MovieRatedQueryParameters { First = 6, OrderBy = "user_rating_date" }, successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<HorizontalListPanelComponent TItem="SeriesRatedResponse"
|
||||
Title="Recently rated TV series"
|
||||
Count="6"
|
||||
GetItemsAction="@(action => AccountsClientService.GetAccountRatedSeries(Id!.Value, new SeriesRatedQueryParameters { First = 6, OrderBy = "user_rating_date" }, successAction: action))"
|
||||
ItemUrlFormatString="/media/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.ReleaseDate.HasValue ? $"{item.Title} ({item.ReleaseDate.Value.Year})" : item.Title)"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetPictureAction="@((id, action) => MediaClientService.GetMediaPoster(id, action))"/>
|
||||
<HorizontalListPanelComponent TItem="PersonRatedResponse"
|
||||
Title="Recently rated people"
|
||||
Count="6"
|
||||
GetItemsAction="@(action => AccountsClientService.GetAccountRatedPersons(Id!.Value, new PersonRatedQueryParameters { First = 6, OrderBy = "user_rating_last_date" }, successAction: action))"
|
||||
ItemUrlFormatString="/person/{0}"
|
||||
IdSource="@(item => item.Id)"
|
||||
NameSource="@(item => item.Name)"
|
||||
PosterPlaceholder="/assets/person_poster.png"
|
||||
GetPictureAction="@((id, action) => PersonsClientService.GetPersonPhoto(id, action))"/>
|
||||
</div>
|
||||
</TabPanel>
|
||||
<TabPanel Name="movies">
|
||||
<div class="mt-default">
|
||||
@@ -81,7 +109,7 @@
|
||||
UrlIdTemplate="/media/{0}"
|
||||
PictureDownloadingTask="@((id, action) => MediaClientService.GetMediaPoster(id, action))"
|
||||
ItemDownloadingTask="@((query, action) => AccountsClientService.GetAccountRatedMovies(Id!.Value, query, action))"
|
||||
SortingOptions="@(new Dictionary<string, string> { { "user_rating", "User rating" }, { "rating.count", "Number of ratings" }, { "rating.average", "Average rating" }, { "title", "Title" }, { "release_date", "Release date" } })"
|
||||
SortingOptions="@(new Dictionary<string, string> { { "user_rating", "User rating" }, { "user_rating_date", "User rating date" }, { "rating.count", "Number of ratings" }, { "rating.average", "Average rating" }, { "title", "Title" }, { "release_date", "Release date" } })"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetGlobalRatingMethod="@((id, action) => MediaClientService.GetMediaRating(id, action))"
|
||||
GetUserRatingMethod="@((id, userId, successAction, notfoundAction) => MediaClientService.GetMediaRatingByUser(id, userId, successAction, notfoundAction))"
|
||||
@@ -105,7 +133,7 @@
|
||||
UrlIdTemplate="/media/{0}"
|
||||
PictureDownloadingTask="@((id, action) => MediaClientService.GetMediaPoster(id, action))"
|
||||
ItemDownloadingTask="@((query, action) => AccountsClientService.GetAccountRatedSeries(Id!.Value, query, action))"
|
||||
SortingOptions="@(new Dictionary<string, string> { { "user_rating", "User rating" }, { "rating.count", "Number of ratings" }, { "rating.average", "Average rating" }, { "title", "Title" }, { "release_date", "Release date" } })"
|
||||
SortingOptions="@(new Dictionary<string, string> { { "user_rating", "User rating" }, { "user_rating_date", "User rating date" }, { "rating.count", "Number of ratings" }, { "rating.average", "Average rating" }, { "title", "Title" }, { "release_date", "Release date" } })"
|
||||
PosterPlaceholder="/assets/media_poster.png"
|
||||
GetGlobalRatingMethod="@((id, action) => MediaClientService.GetMediaRating(id, action))"
|
||||
GetUserRatingMethod="@((id, userId, successAction, notfoundAction) => MediaClientService.GetMediaRatingByUser(id, userId, successAction, notfoundAction))"
|
||||
@@ -132,6 +160,7 @@
|
||||
{
|
||||
{ "user_rating.average", "Average user rating" },
|
||||
{ "user_rating.count", "Number of user ratings" },
|
||||
{ "user_rating_last_date", "User rating date" },
|
||||
{ "rating.average", "Average rating" },
|
||||
{ "rating.count", "Number of ratings" },
|
||||
{ "name", "Name" },
|
||||
|
||||
Reference in New Issue
Block a user