ListPage version for movies added

This commit is contained in:
2024-10-01 01:12:47 +02:00
Unverified
parent 450e4a2f94
commit 6d37253184
9 changed files with 200 additions and 3 deletions

View File

@@ -0,0 +1,7 @@
using Microsoft.AspNetCore.Components;
namespace WatchIt.Website.Components.ListPage;
public partial class ListComponent : ComponentBase
{
}

View File

@@ -51,7 +51,7 @@
else else
{ {
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
<span>Saving...</span> <span>Loading...</span>
} }
</button> </button>
</div> </div>

View File

@@ -32,7 +32,13 @@
} }
else else
{ {
<button type="button" class="btn btn-sm">Rankings</button> <Dropdown>
<DropdownToggle Color="Color.Default" Size="Size.Small" ToggleIconVisible="false">Lists</DropdownToggle>
<DropdownMenu>
<DropdownItem Clicked="@(() => NavigationManager.NavigateTo("/lists/movies"))">Movies</DropdownItem>
<DropdownItem Clicked="@(() => NavigationManager.NavigateTo("/lists/series"))">TV Series</DropdownItem>
</DropdownMenu>
</Dropdown>
<button type="button" class="btn btn-sm" @onclick="@(() => _searchbarVisible = true)">⌕</button> <button type="button" class="btn btn-sm" @onclick="@(() => _searchbarVisible = true)">⌕</button>
} }
</div> </div>

View File

@@ -0,0 +1,88 @@
@layout MainLayout
@page "/lists/movies"
@using WatchIt.Common.Model.Movies
<div class="container-grid">
@if (_loaded)
{
if (string.IsNullOrWhiteSpace(_error))
{
<div class="row">
<div class="col">
<div class="rounded-3 panel panel-regular p-2">
<div class="container-grid">
<div class="row">
<div class="col">
<h3 class="m-0">Movies database</h3>
</div>
<div class="col-auto">
</div>
<div class="col-auto">
</div>
</div>
</div>
</div>
</div>
</div>
foreach (MovieResponse item in _items)
{
<div class="row mt-3">
<div class="col">
<a class="text-reset text-decoration-none" href="/media/@(item.Id)">
<div class="rounded-3 panel panel-regular p-2">
<ListItemComponent Id="@(item.Id)"
Name="@(item.Title)"
AdditionalNameInfo="@(item.ReleaseDate.HasValue ? $" ({item.ReleaseDate.Value.Year})" : null)"
Rating="@(item.Rating)"
PictureDownloadingTask="@((id, action) => MediaWebAPIService.GetMediaPoster(id, action))"/>
</div>
</a>
</div>
</div>
}
if (!_allItemsLoaded)
{
<div class="row mt-3">
<div class="col">
<div role="button" class="rounded-3 panel panel-regular p-3" @onclick="DownloadItems">
<div class="d-flex justify-content-center">
@if (!_itemsLoading)
{
<strong>Load more</strong>
}
else
{
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
<strong>Load more</strong>
}
</div>
</div>
</div>
</div>
}
}
else
{
<div class="row">
<div class="col">
<ErrorComponent ErrorMessage="@_error"/>
</div>
</div>
}
}
else
{
<div class="row">
<div class="col">
<div class="m-5">
<LoadingComponent/>
</div>
</div>
</div>
}
</div>

View File

@@ -0,0 +1,96 @@
using Microsoft.AspNetCore.Components;
using WatchIt.Common.Model.Movies;
using WatchIt.Website.Services.WebAPI.Media;
using WatchIt.Website.Services.WebAPI.Movies;
namespace WatchIt.Website.Pages;
public partial class ListPage : ComponentBase
{
#region SERVICES
[Inject] private IMoviesWebAPIService MoviesWebAPIService { get; set; } = default!;
[Inject] private IMediaWebAPIService MediaWebAPIService { get; set; } = default!;
#endregion
#region PARAMETERS
#endregion
#region FIELDS
private bool _loaded;
private string? _error;
private MovieQueryParameters _query = new MovieQueryParameters { OrderBy = "rating.average" };
private List<MovieResponse> _items = new List<MovieResponse>();
private bool _allItemsLoaded;
private bool _itemsLoading;
#endregion
#region PUBLIC METHODS
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
// INIT
_query.First = 5;
List<Task> endTasks = new List<Task>();
// STEP 0
endTasks.AddRange(
[
MoviesWebAPIService.GetAllMovies(_query, data =>
{
_items.AddRange(data);
if (data.Count() < 5)
{
_allItemsLoaded = true;
}
else
{
_query.After = 5;
}
})
]);
// END
await Task.WhenAll(endTasks);
_loaded = true;
StateHasChanged();
}
}
private async Task DownloadItems()
{
_itemsLoading = true;
await MoviesWebAPIService.GetAllMovies(_query, data =>
{
_items.AddRange(data);
if (data.Count() < 5)
{
_allItemsLoaded = true;
}
else
{
_query.After += 5;
}
_itemsLoading = false;
});
}
#endregion
}

View File

@@ -50,7 +50,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<div class="rounded-3 panel panel-regular p-2"> <div class="rounded-3 panel panel-regular p-2">
<h2 class="m-0 mx-2 mb-1 p-0">@(_media is not null ? "Edit" : "Create new") @(_movieRequest is not null ? "movie" : "series")@(_media is not null ? $" \"{_media.Title}\"" : string.Empty)</h2> <h3 class="m-0 mx-2 mb-1 p-0">@(_media is not null ? "Edit" : "Create new") @(_movieRequest is not null ? "movie" : "series")@(_media is not null ? $" \"{_media.Title}\"" : string.Empty)</h3>
</div> </div>
</div> </div>
</div> </div>