MediaDataPage - info section completed

This commit is contained in:
2024-09-19 22:58:39 +02:00
Unverified
parent 3f926d63d6
commit 774b8832b5
9 changed files with 170 additions and 13 deletions

View File

@@ -8,6 +8,7 @@ public interface IMediaWebAPIService
Task Get(long mediaId, Action<MediaResponse> successAction = null, Action? notFoundAction = null);
Task GetGenres(long mediaId, Action<IEnumerable<GenreResponse>>? successAction = null, Action? notFoundAction = null);
Task PostGenre(long mediaId, long genreId, Action? successAction = null, Action? unauthorizedAction = null, Action? forbiddenAction = null, Action? notFoundAction = null);
Task GetPhotoMediaRandomBackground(long mediaId, Action<MediaPhotoResponse>? successAction = null, Action? notFoundAction = null);
Task GetPhotoRandomBackground(Action<MediaPhotoResponse>? successAction = null, Action? notFoundAction = null);
Task GetPoster(long mediaId, Action<MediaPosterResponse>? successAction = null, Action<IDictionary<string, string[]>>? badRequestAction = null, Action? notFoundAction = null);
Task PutPoster(long mediaId, MediaPosterRequest data, Action? successAction = null, Action<IDictionary<string, string[]>>? badRequestAction = null, Action? unauthorizedAction = null, Action? forbiddenAction = null);

View File

@@ -49,6 +49,18 @@ public class MediaWebAPIService(IHttpClientService httpClientService, IConfigura
.ExecuteAction();
}
public async Task GetPhotoMediaRandomBackground(long mediaId, Action<MediaPhotoResponse>? successAction = null, Action? notFoundAction = null)
{
string url = GetUrl(EndpointsConfiguration.Media.GetPhotoMediaRandomBackground, mediaId);
HttpRequest request = new HttpRequest(HttpMethodType.Get, url);
HttpResponse response = await httpClientService.SendRequestAsync(request);
response.RegisterActionFor2XXSuccess(successAction)
.RegisterActionFor404NotFound(notFoundAction)
.ExecuteAction();
}
public async Task GetPhotoRandomBackground(Action<MediaPhotoResponse>? successAction = null, Action? notFoundAction = null)
{
string url = GetUrl(EndpointsConfiguration.Media.GetPhotoRandomBackground);
@@ -57,8 +69,8 @@ public class MediaWebAPIService(IHttpClientService httpClientService, IConfigura
HttpResponse response = await httpClientService.SendRequestAsync(request);
response.RegisterActionFor2XXSuccess(successAction)
.RegisterActionFor404NotFound(notFoundAction)
.ExecuteAction();
.RegisterActionFor404NotFound(notFoundAction)
.ExecuteAction();
}
public async Task GetPoster(long mediaId, Action<MediaPosterResponse>? successAction = null, Action<IDictionary<string, string[]>>? badRequestAction = null, Action? notFoundAction = null)

View File

@@ -9,8 +9,8 @@
<link rel="icon" type="image/png" href="favicon.png"/>
<!-- CSS -->
<link rel="stylesheet" href="app.css?version=0.14"/>
<link rel="stylesheet" href="WatchIt.Website.styles.css?version=0.12"/>
<link rel="stylesheet" href="app.css?version=0.15"/>
<link rel="stylesheet" href="WatchIt.Website.styles.css?version=0.15"/>
<!-- BOOTSTRAP -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>

View File

@@ -60,6 +60,7 @@
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
}
.logo, .main-button {

View File

@@ -1,5 +1,7 @@
@page "/media/{id:long}"
@using System.Text
@using Microsoft.IdentityModel.Tokens
@using WatchIt.Common.Model.Genres
@layout MainLayout
@@ -15,14 +17,96 @@
</div>
<div class="col">
<div class="d-flex h-100">
<h1 class="align-self-end font-weight-bold">@_media.Title</h1>
<div class="container-fluid px-0 align-self-end">
<div class="row">
<div class="col">
<h1 class="align-self-end title-shadow">
<strong>@_media.Title</strong>
</h1>
</div>
</div>
@if (!string.IsNullOrWhiteSpace(_media.Description))
{
<div class="row">
<div class="col">
<div class="description-shadow">
@_media.Description
</div>
</div>
</div>
}
</div>
</div>
</div>
</div>
<div class="row mt-2">
<div class="row mt-3 gx-3">
<div class="col">
<div class="rounded-3 panel panel-regular">
Test
<div class="rounded-3 panel panel-regular p-4 h-100">
<div class="container-fluid px-0">
<div class="row">
<div class="col">
<div class="d-flex flex-wrap gap-3">
@if (!string.IsNullOrWhiteSpace(_media.OriginalTitle))
{
<div class="metadata-pill">
<strong>Original title:</strong> @_media.OriginalTitle
</div>
}
@if (_media.ReleaseDate is not null)
{
<div class="metadata-pill">
<strong>Release date:</strong> @_media.ReleaseDate.ToString()
</div>
}
@if (_media.Length is not null)
{
<div class="metadata-pill">
<strong>Length:</strong> @TimeSpan.FromMinutes(_media.Length.Value).ToString(@"hh\:mm")
</div>
}
@if (_movie?.Budget is not null)
{
<div class="metadata-pill">
<strong>Budget:</strong> @(Math.Round(_movie.Budget.Value))$
</div>
}
</div>
</div>
</div>
<div class="row mt-4">
<div class="col">
<h4><strong>Genres:</strong></h4>
</div>
</div>
<div class="row">
<div class="col">
<div class="d-flex flex-wrap gap-3">
@if (_genres.IsNullOrEmpty())
{
<div>
No genres assigned.
</div>
}
else
{
foreach (GenreResponse genre in _genres)
{
<a class="text-decoration-none text-light" href="/genre/@genre.Id">
<div class="metadata-pill">
@genre.Name
</div>
</a>
}
}
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-auto">
<div class="rounded-3 panel panel-yellow p-2 h-100">
Oceny tutaj będą
</div>
</div>
</div>
@@ -42,4 +126,19 @@
{
<LoadingPageComponent/>
}
</div>
</div>
@if (_background is not null)
{
<style>
body {
background-image: url('@($"data:{_background.MimeType};base64,{Convert.ToBase64String(_background.Image)}")') !important;
}
.logo, .main-button {
background-image: linear-gradient(45deg, @($"#{BitConverter.ToString(_background.Background.FirstGradientColor).Replace("-", string.Empty)}"), @($"#{BitConverter.ToString(_background.Background.SecondGradientColor).Replace("-", string.Empty)}")) !important;
}
</style>
}

View File

@@ -1,5 +1,7 @@
using Microsoft.AspNetCore.Components;
using WatchIt.Common.Model.Genres;
using WatchIt.Common.Model.Media;
using WatchIt.Common.Model.Movies;
using WatchIt.Website.Services.Utility.Authentication;
using WatchIt.Website.Services.WebAPI.Media;
using WatchIt.Website.Services.WebAPI.Movies;
@@ -34,6 +36,9 @@ public partial class MediaDataPage : ComponentBase
private string? _error;
private MediaResponse? _media;
private MovieResponse? _movie;
private IEnumerable<GenreResponse> _genres;
private MediaPhotoResponse? _background;
private MediaPosterResponse? _poster;
private User? _user;
@@ -51,13 +56,28 @@ public partial class MediaDataPage : ComponentBase
if (_error is null)
{
Task<User?> userTask = AuthenticationService.GetUserAsync();
Task backgroundTask = MediaWebAPIService.GetPhotoMediaRandomBackground(Id, data => _background = data);
Task posterTask = MediaWebAPIService.GetPoster(Id, data => _poster = data);
Task<User?> userTask = AuthenticationService.GetUserAsync();
Task genresTask = MediaWebAPIService.GetGenres(Id, data => _genres = data);
Task specificMediaTask;
if (_media.Type == MediaType.Movie)
{
specificMediaTask = MoviesWebAPIService.Get(Id, data => _movie = data);
}
else
{
// TODO: download tv series info
specificMediaTask = null;
}
await Task.WhenAll(
[
userTask,
posterTask
userTask,
specificMediaTask,
genresTask,
backgroundTask,
posterTask,
]);
_user = await userTask;

View File

@@ -1 +1,18 @@
/* CLASSES */
.metadata-pill {
border-color: gray;
border-width: 2px;
border-radius: 30px;
border-style: solid;
padding: 2px 10px;
}
.title-shadow {
text-shadow: 2px 2px 2px #000;
}
.description-shadow {
text-shadow: 1px 1px 1px #000;
}

View File

@@ -27,6 +27,10 @@ body, html {
background-color: rgba(0, 0, 0, 0.6);
}
.panel-yellow {
background-color: rgba(255, 184, 58, 0.6);
}
.panel {
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
backdrop-filter: blur(25px);