Refactoring, database structure changed
This commit is contained in:
@@ -0,0 +1,148 @@
|
||||
@using Blazorise.Extensions
|
||||
@using WatchIt.DTO.Models.Controllers.Media.Medium.Response
|
||||
@using WatchIt.DTO.Models.Controllers.Roles.Role.Response
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
@using Blazorise.Components
|
||||
@using WatchIt.DTO.Models.Controllers.People.Person
|
||||
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel @(Class)">
|
||||
@if (_loaded)
|
||||
{
|
||||
<div class="vstack gap-3">
|
||||
<div class="container-grid">
|
||||
<div class="row gx-2">
|
||||
<div class="col align-self-center">
|
||||
<h4 class="m-0"><strong>Actor roles</strong></h4>
|
||||
</div>
|
||||
@if (!_editingMode)
|
||||
{
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-secondary" disabled="@(Disabled)" @onclick="@(() => ActivateEditData())">Add</button>
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-secondary" @onclick="@(CancelEditData)">Cancel</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="submit" class="btn btn-secondary" disabled="@(_saving)" @onclick="@(SaveData)">
|
||||
<LoadingButtonContent IsLoading="@(_saving)" Content="Save" LoadingContent="Saving..."/>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (!_editingMode)
|
||||
{
|
||||
if (_roles.IsNullOrEmpty())
|
||||
{
|
||||
<span class="text-center">No items</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-transparent">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">
|
||||
Person
|
||||
</th>
|
||||
<th scope="col">
|
||||
Role type
|
||||
</th>
|
||||
<th scope="col">
|
||||
Role name
|
||||
</th>
|
||||
<th class="table-cell-fit" scope="col">
|
||||
Actions
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-group-divider">
|
||||
@foreach (Guid roleId in _roles.Keys)
|
||||
{
|
||||
RoleActorResponse role = _roles[roleId].Data;
|
||||
PersonResponse person = _peopleDict[role.PersonId];
|
||||
<tr>
|
||||
<td class="align-middle">
|
||||
@(person.Name)
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
@(_roleTypes[role.TypeId])
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
@(role.Name)
|
||||
</td>
|
||||
<td class="align-middle table-cell-fit">
|
||||
<div class="hstack gap-1">
|
||||
<button class="btn btn-outline-secondary btn-sm" type="button" disabled="@(Disabled || _roles[roleId].Deleting)" @onclick="@(() => ActivateEditData(roleId))"><i class="fas fa-edit"></i></button>
|
||||
<button class="btn btn-outline-danger btn-sm" type="button" disabled="@(Disabled || _roles[roleId].Deleting)" @onclick="@(() => DeleteData(roleId))">
|
||||
@if (_roles[roleId].Deleting)
|
||||
{
|
||||
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<i class="fa-solid fa-trash"></i>
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<EditForm Model="@(_roleRequest)">
|
||||
<AntiforgeryToken/>
|
||||
<div class="container-grid">
|
||||
<div class="row form-group mb-1">
|
||||
<label for="actorFormPeople" class="col-1 col-form-label">People:</label>
|
||||
<div class="col">
|
||||
<Autocomplete ElementId="actorFormPeople"
|
||||
TItem="PersonResponse"
|
||||
TValue="long"
|
||||
Data="@(_peopleDict.Values)"
|
||||
TextField="@(item => item.Name)"
|
||||
ValueField="@(item => item.Id)"
|
||||
@bind-SelectedValue="@(_roleRequest.PersonId)"
|
||||
Placeholder="Search..."
|
||||
Filter="AutocompleteFilter.Contains">
|
||||
<NotFoundContent Context="not_found_context"> Sorry... @not_found_context was not found</NotFoundContent>
|
||||
</Autocomplete>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="actorFormType" class="col-1 col-form-label">Type:</label>
|
||||
<div class="col">
|
||||
<InputSelect id="actorFormType" class="form-control" TValue="short" @bind-Value="@(_roleRequest.TypeId)">
|
||||
@foreach (KeyValuePair<short, string> type in _roleTypes)
|
||||
{
|
||||
<option value="@(type.Key)">@(type.Value)</option>
|
||||
}
|
||||
</InputSelect>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="actorFormName" class="col-1 col-form-label">Name:</label>
|
||||
<div class="col">
|
||||
<InputText id="actorFormName" class="form-control" @bind-Value="@(_roleRequest.Name)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<Loading Color="@(Loading.Colors.Light)"/>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,217 @@
|
||||
using System.Net;
|
||||
using Blazorise.Snackbar;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Refit;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Response;
|
||||
using WatchIt.DTO.Models.Controllers.People.Person;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Query;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Request;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Response;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.RoleActorType;
|
||||
using WatchIt.DTO.Query;
|
||||
using WatchIt.Website.Clients;
|
||||
using WatchIt.Website.Components.Layout;
|
||||
using WatchIt.Website.Services.Authentication;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class ActorRolesEditPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] private IAuthenticationService AuthenticationService { get; set; } = null!;
|
||||
[Inject] private IPeopleClient PeopleClient { get; set; } = null!;
|
||||
[Inject] private IMediaClient MediaClient { get; set; } = null!;
|
||||
[Inject] private IRolesClient RolesClient { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public required BaseMediumResponse Data { get; set; }
|
||||
[Parameter] public List<PersonResponse>? People { get; set; }
|
||||
|
||||
[Parameter] public bool Disabled { get; set; }
|
||||
[Parameter] public string Class { get; set; } = string.Empty;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region FIELDS
|
||||
|
||||
private bool _loaded;
|
||||
|
||||
private bool _editingMode;
|
||||
private Guid? _editedId;
|
||||
private RoleActorRequest _roleRequest = null!;
|
||||
private bool _saving;
|
||||
|
||||
private Dictionary<long, PersonResponse> _peopleDict = new Dictionary<long, PersonResponse>();
|
||||
private Dictionary<short, string> _roleTypes = new Dictionary<short, string>();
|
||||
private Dictionary<Guid, (RoleActorResponse Data, bool Deleting)> _roles = new Dictionary<Guid, (RoleActorResponse Data, bool Deleting)>();
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PRIVATE METHODS
|
||||
|
||||
protected override async Task OnFirstRenderAsync()
|
||||
{
|
||||
await base.OnFirstRenderAsync();
|
||||
|
||||
ResetRequest();
|
||||
|
||||
await Task.WhenAll(
|
||||
[
|
||||
LoadRoleTypes(),
|
||||
LoadMedia()
|
||||
]);
|
||||
if (Data is not null)
|
||||
{
|
||||
await LoadRoles();
|
||||
}
|
||||
|
||||
_loaded = true;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private async Task LoadRoleTypes()
|
||||
{
|
||||
IApiResponse<IEnumerable<RoleActorTypeResponse>> response = await RolesClient.GetRoleActorTypes();
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_roleTypes = response.Content.ToDictionary(x => x.Id, x => x.Name);
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Actor role types list could not be obtained.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task LoadMedia()
|
||||
{
|
||||
IEnumerable<PersonResponse>? people = People;
|
||||
if (people is null)
|
||||
{
|
||||
IApiResponse<IEnumerable<PersonResponse>> response = await PeopleClient.GetPeople(includePictures: true);
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
people = response.Content;
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. People list could not be obtained.", SnackbarColor.Danger);
|
||||
return;
|
||||
}
|
||||
}
|
||||
_peopleDict = people.ToDictionary(x => x.Id, x => x);
|
||||
}
|
||||
|
||||
private async Task LoadRoles()
|
||||
{
|
||||
RoleActorFilterQuery filter = new RoleActorFilterQuery
|
||||
{
|
||||
MediumId = Data.Id
|
||||
};
|
||||
IApiResponse<IEnumerable<RoleActorResponse>> response = await RolesClient.GetRoleActors(filter);
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_roles = response.Content.ToDictionary(x => x.Id, x => (x, false));
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Actor roles could not be obtained.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
private void CancelEditData()
|
||||
{
|
||||
_editingMode = false;
|
||||
}
|
||||
|
||||
private async Task SaveData()
|
||||
{
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
_saving = true;
|
||||
|
||||
IApiResponse<RoleActorResponse> response = await (_editedId.HasValue switch
|
||||
{
|
||||
true => RolesClient.PutRoleActor(token, _editedId.Value, _roleRequest),
|
||||
false => RolesClient.PostRoleActor(token, _roleRequest),
|
||||
});
|
||||
switch (response)
|
||||
{
|
||||
case { IsSuccessful: true }:
|
||||
_roles[response.Content.Id] = (response.Content, false);
|
||||
await Base.SnackbarStack.PushAsync("Role saved successfully.", SnackbarColor.Success);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.Forbidden } or { StatusCode: HttpStatusCode.Unauthorized }:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to edit roles data.", SnackbarColor.Danger);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.BadRequest }:
|
||||
string? content = "An unknown error occured.";
|
||||
if (response.Error is ValidationApiException ex)
|
||||
{
|
||||
string? exContent = ex.Content?.Errors.SelectMany(x => x.Value).FirstOrDefault();
|
||||
if (exContent is not null)
|
||||
{
|
||||
content = exContent;
|
||||
}
|
||||
}
|
||||
await Base.SnackbarStack.PushAsync(content, SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
|
||||
_saving = false;
|
||||
_editingMode = false;
|
||||
}
|
||||
|
||||
private void ActivateEditData(Guid? id = null)
|
||||
{
|
||||
_editedId = id;
|
||||
ResetRequest();
|
||||
if (id is not null && _roles.TryGetValue(id.Value, out (RoleActorResponse Data, bool Deleting) role))
|
||||
{
|
||||
_roleRequest.Name = role.Data.Name;
|
||||
_roleRequest.PersonId = role.Data.PersonId;
|
||||
_roleRequest.TypeId = role.Data.TypeId;
|
||||
}
|
||||
_editingMode = true;
|
||||
}
|
||||
|
||||
private async Task DeleteData(Guid id)
|
||||
{
|
||||
_roles[id] = (_roles[id].Data, true);
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
IApiResponse response = await RolesClient.DeleteRole(token, id);
|
||||
switch (response)
|
||||
{
|
||||
case {IsSuccessful: true}:
|
||||
_roles.Remove(id);
|
||||
await Base.SnackbarStack.PushAsync("Role removed successfully.", SnackbarColor.Success);
|
||||
break;
|
||||
case {StatusCode: HttpStatusCode.Forbidden} or {StatusCode: HttpStatusCode.Unauthorized}:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to remove roles.", SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
private void ResetRequest() => _roleRequest = Data is null ? new RoleActorRequest() : new RoleActorRequest
|
||||
{
|
||||
MediumId = Data.Id,
|
||||
};
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,137 @@
|
||||
@using WatchIt.DTO.Models.Controllers.Media.Medium.Response
|
||||
@using WatchIt.DTO.Models.Controllers.Roles.Role.Response
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
@using Blazorise.Components
|
||||
@using WatchIt.DTO.Models.Controllers.People.Person
|
||||
|
||||
@using Blazorise.Extensions
|
||||
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel @(Class)">
|
||||
@if (_loaded)
|
||||
{
|
||||
<div class="vstack gap-3">
|
||||
<div class="container-grid">
|
||||
<div class="row gx-2">
|
||||
<div class="col align-self-center">
|
||||
<h4 class="m-0"><strong>Creator roles</strong></h4>
|
||||
</div>
|
||||
@if (!_editingMode)
|
||||
{
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-secondary" disabled="@(Disabled)" @onclick="@(() => ActivateEditData())">Add</button>
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-secondary" @onclick="@(CancelEditData)">Cancel</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="submit" class="btn btn-secondary" disabled="@(_saving)" @onclick="@(SaveData)">
|
||||
<LoadingButtonContent IsLoading="@(_saving)" Content="Save" LoadingContent="Saving..."/>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (!_editingMode)
|
||||
{
|
||||
if (_roles.IsNullOrEmpty())
|
||||
{
|
||||
<span class="text-center">No items</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-transparent">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">
|
||||
Person
|
||||
</th>
|
||||
<th scope="col">
|
||||
Role type
|
||||
</th>
|
||||
<th class="table-cell-fit" scope="col">
|
||||
Actions
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-group-divider">
|
||||
@foreach (Guid roleId in _roles.Keys)
|
||||
{
|
||||
RoleCreatorResponse role = _roles[roleId].Data;
|
||||
PersonResponse person = _peopleDict[role.PersonId];
|
||||
<tr>
|
||||
<td class="align-middle">
|
||||
@(person.Name)
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
@(_roleTypes[role.TypeId])
|
||||
</td>
|
||||
<td class="align-middle table-cell-fit">
|
||||
<div class="hstack gap-1">
|
||||
<button class="btn btn-outline-secondary btn-sm" type="button" disabled="@(Disabled || _roles[roleId].Deleting)" @onclick="@(() => ActivateEditData(roleId))"><i class="fas fa-edit"></i></button>
|
||||
<button class="btn btn-outline-danger btn-sm" type="button" disabled="@(Disabled || _roles[roleId].Deleting)" @onclick="@(() => DeleteData(roleId))">
|
||||
@if (_roles[roleId].Deleting)
|
||||
{
|
||||
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<i class="fa-solid fa-trash"></i>
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<EditForm Model="@(_roleRequest)">
|
||||
<AntiforgeryToken/>
|
||||
<div class="container-grid">
|
||||
<div class="row form-group mb-1">
|
||||
<label for="actorFormPeople" class="col-1 col-form-label">People:</label>
|
||||
<div class="col">
|
||||
<Autocomplete ElementId="actorFormPeople"
|
||||
TItem="PersonResponse"
|
||||
TValue="long"
|
||||
Data="@(_peopleDict.Values)"
|
||||
TextField="@(item => item.Name)"
|
||||
ValueField="@(item => item.Id)"
|
||||
@bind-SelectedValue="@(_roleRequest.PersonId)"
|
||||
Placeholder="Search..."
|
||||
Filter="AutocompleteFilter.Contains">
|
||||
<NotFoundContent Context="not_found_context"> Sorry... @not_found_context was not found</NotFoundContent>
|
||||
</Autocomplete>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="actorFormType" class="col-1 col-form-label">Type:</label>
|
||||
<div class="col">
|
||||
<InputSelect id="actorFormType" class="form-control" TValue="short" @bind-Value="@(_roleRequest.TypeId)">
|
||||
@foreach (KeyValuePair<short, string> type in _roleTypes)
|
||||
{
|
||||
<option value="@(type.Key)">@(type.Value)</option>
|
||||
}
|
||||
</InputSelect>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<Loading Color="@(Loading.Colors.Light)"/>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,214 @@
|
||||
using System.Net;
|
||||
using Blazorise.Snackbar;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Refit;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Response;
|
||||
using WatchIt.DTO.Models.Controllers.People.Person;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Query;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Request;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.Role.Response;
|
||||
using WatchIt.DTO.Models.Controllers.Roles.RoleCreatorType;
|
||||
using WatchIt.DTO.Query;
|
||||
using WatchIt.Website.Clients;
|
||||
using WatchIt.Website.Components.Layout;
|
||||
using WatchIt.Website.Services.Authentication;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class CreatorRolesEditPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] private IAuthenticationService AuthenticationService { get; set; } = null!;
|
||||
[Inject] private IPeopleClient PeopleClient { get; set; } = null!;
|
||||
[Inject] private IRolesClient RolesClient { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public required BaseMediumResponse Data { get; set; }
|
||||
[Parameter] public List<PersonResponse>? People { get; set; }
|
||||
|
||||
[Parameter] public bool Disabled { get; set; }
|
||||
[Parameter] public string Class { get; set; } = string.Empty;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region FIELDS
|
||||
|
||||
private bool _loaded;
|
||||
|
||||
private bool _editingMode;
|
||||
private Guid? _editedId;
|
||||
private RoleCreatorRequest _roleRequest = null!;
|
||||
private bool _saving;
|
||||
|
||||
private Dictionary<long, PersonResponse> _peopleDict = new Dictionary<long, PersonResponse>();
|
||||
private Dictionary<short, string> _roleTypes = new Dictionary<short, string>();
|
||||
private Dictionary<Guid, (RoleCreatorResponse Data, bool Deleting)> _roles = new Dictionary<Guid, (RoleCreatorResponse Data, bool Deleting)>();
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PRIVATE METHODS
|
||||
|
||||
protected override async Task OnFirstRenderAsync()
|
||||
{
|
||||
await base.OnFirstRenderAsync();
|
||||
|
||||
ResetRequest();
|
||||
|
||||
await Task.WhenAll(
|
||||
[
|
||||
LoadRoleTypes(),
|
||||
LoadMedia(),
|
||||
]);
|
||||
if (Data is not null)
|
||||
{
|
||||
await LoadRoles();
|
||||
}
|
||||
|
||||
_loaded = true;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private async Task LoadRoleTypes()
|
||||
{
|
||||
IApiResponse<IEnumerable<RoleCreatorTypeResponse>> response = await RolesClient.GetRoleCreatorTypes();
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_roleTypes = response.Content.ToDictionary(x => x.Id, x => x.Name);
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Creator role types list could not be obtained.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task LoadMedia()
|
||||
{
|
||||
IEnumerable<PersonResponse>? people = People;
|
||||
if (people is null)
|
||||
{
|
||||
IApiResponse<IEnumerable<PersonResponse>> response = await PeopleClient.GetPeople(includePictures: true);
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
people = response.Content;
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. People list could not be obtained.", SnackbarColor.Danger);
|
||||
return;
|
||||
}
|
||||
}
|
||||
_peopleDict = people.ToDictionary(x => x.Id, x => x);
|
||||
}
|
||||
|
||||
private async Task LoadRoles()
|
||||
{
|
||||
RoleCreatorFilterQuery filter = new RoleCreatorFilterQuery
|
||||
{
|
||||
MediumId = Data.Id
|
||||
};
|
||||
IApiResponse<IEnumerable<RoleCreatorResponse>> response = await RolesClient.GetRoleCreators(filter);
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_roles = response.Content.ToDictionary(x => x.Id, x => (x, false));
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Creator roles could not be obtained.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
private void CancelEditData()
|
||||
{
|
||||
_editingMode = false;
|
||||
}
|
||||
|
||||
private async Task SaveData()
|
||||
{
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
_saving = true;
|
||||
|
||||
IApiResponse<RoleCreatorResponse> response = await (_editedId.HasValue switch
|
||||
{
|
||||
true => RolesClient.PutRoleCreator(token, _editedId.Value, _roleRequest),
|
||||
false => RolesClient.PostRoleCreator(token, _roleRequest),
|
||||
});
|
||||
switch (response)
|
||||
{
|
||||
case { IsSuccessful: true }:
|
||||
_roles[response.Content.Id] = (response.Content, false);
|
||||
await Base.SnackbarStack.PushAsync("Role saved successfully.", SnackbarColor.Success);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.Forbidden } or { StatusCode: HttpStatusCode.Unauthorized }:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to edit roles data.", SnackbarColor.Danger);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.BadRequest }:
|
||||
string? content = "An unknown error occured.";
|
||||
if (response.Error is ValidationApiException ex)
|
||||
{
|
||||
string? exContent = ex.Content?.Errors.SelectMany(x => x.Value).FirstOrDefault();
|
||||
if (exContent is not null)
|
||||
{
|
||||
content = exContent;
|
||||
}
|
||||
}
|
||||
await Base.SnackbarStack.PushAsync(content, SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
|
||||
_saving = false;
|
||||
_editingMode = false;
|
||||
}
|
||||
|
||||
private void ActivateEditData(Guid? id = null)
|
||||
{
|
||||
_editedId = id;
|
||||
ResetRequest();
|
||||
if (id is not null && _roles.TryGetValue(id.Value, out (RoleCreatorResponse Data, bool Deleting) role))
|
||||
{
|
||||
_roleRequest.PersonId = role.Data.PersonId;
|
||||
_roleRequest.TypeId = role.Data.TypeId;
|
||||
}
|
||||
_editingMode = true;
|
||||
}
|
||||
|
||||
private async Task DeleteData(Guid id)
|
||||
{
|
||||
_roles[id] = (_roles[id].Data, true);
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
IApiResponse response = await RolesClient.DeleteRole(token, id);
|
||||
switch (response)
|
||||
{
|
||||
case {IsSuccessful: true}:
|
||||
_roles.Remove(id);
|
||||
await Base.SnackbarStack.PushAsync("Role removed successfully.", SnackbarColor.Success);
|
||||
break;
|
||||
case {StatusCode: HttpStatusCode.Forbidden} or {StatusCode: HttpStatusCode.Unauthorized}:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to remove roles.", SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
private void ResetRequest() => _roleRequest = Data is null ? new RoleCreatorRequest() : new RoleCreatorRequest
|
||||
{
|
||||
MediumId = Data.Id,
|
||||
};
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
@using WatchIt.DTO.Models.Controllers.Media.Medium.Request
|
||||
@using WatchIt.DTO.Models.Controllers.Media.Medium.Response
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel @(Class)">
|
||||
@if (_loaded)
|
||||
{
|
||||
<EditForm Model="@(_request)">
|
||||
<AntiforgeryToken/>
|
||||
<div class="container-grid">
|
||||
<div class="row form-group mb-1">
|
||||
<label for="title" class="col-2 col-form-label">Title*</label>
|
||||
<div class="col-10">
|
||||
<InputText id="title" class="form-control" @bind-Value="_request!.Title"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="og-title" class="col-2 col-form-label">Original title</label>
|
||||
<div class="col-10">
|
||||
<InputText id="og-title" class="form-control" @bind-Value="_request!.OriginalTitle"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="desc" class="col-2 col-form-label">Description</label>
|
||||
<div class="col-10">
|
||||
<InputTextArea id="desc" class="form-control" @bind-Value="_request!.Description"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="rel-date" class="col-2 col-form-label">Release date</label>
|
||||
<div class="col-4">
|
||||
<InputDate TValue="DateOnly?" id="rel-date" class="form-control" @bind-Value="_request!.ReleaseDate"/>
|
||||
</div>
|
||||
<label for="length" class="col-2 col-form-label">Length</label>
|
||||
<div class="col-4">
|
||||
<InputNumber TValue="short?" id="length" class="form-control" @bind-Value="_request!.Duration"/>
|
||||
</div>
|
||||
</div>
|
||||
@switch (_request)
|
||||
{
|
||||
case MediumMovieRequest movieRequest:
|
||||
<div class="row form-group mt-1">
|
||||
<label for="budget" class="col-2 col-form-label">Budget</label>
|
||||
<div class="col-10">
|
||||
<InputNumber TValue="decimal?" id="budget" class="form-control" @bind-Value="movieRequest!.Budget"/>
|
||||
</div>
|
||||
</div>
|
||||
break;
|
||||
case MediumSeriesRequest seriesRequest:
|
||||
<div class="row form-group mt-1">
|
||||
<label class="col-2 col-form-label">Has ended</label>
|
||||
<div class="col-10 col-form-label">
|
||||
<div class="d-flex gap-3">
|
||||
<InputRadioGroup TValue="bool" @bind-Value="seriesRequest!.HasEnded">
|
||||
<div class="d-flex gap-2">
|
||||
<InputRadio TValue="bool" Value="true"/>
|
||||
Yes
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<InputRadio TValue="bool" Value="false"/>
|
||||
No
|
||||
</div>
|
||||
</InputRadioGroup>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
break;
|
||||
}
|
||||
<div class="row mt-2">
|
||||
<div class="col d-flex flex-column align-items-end">
|
||||
<button type="submit" class="btn btn-secondary" disabled="@(_saving)" @onclick="@(SaveData)">
|
||||
<LoadingButtonContent IsLoading="@(_saving)" Content="Save" LoadingContent="Saving..."/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
}
|
||||
else
|
||||
{
|
||||
<Loading Color="@(Loading.Colors.Light)"/>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,121 @@
|
||||
using System.Net;
|
||||
using Blazorise.Snackbar;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Refit;
|
||||
using WatchIt.DTO.Models.Controllers.Media;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Request;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Response;
|
||||
using WatchIt.Website.Clients;
|
||||
using WatchIt.Website.Components.Layout;
|
||||
using WatchIt.Website.Services.Authentication;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class EditFormPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] private NavigationManager NavigationManager { get; set; } = null!;
|
||||
[Inject] private IAuthenticationService AuthenticationService { get; set; } = null!;
|
||||
[Inject] private IMediaClient MediaClient { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public BaseMediumResponse? Data { get; set; }
|
||||
[Parameter] public required NullType TypeIfNull { get; set; }
|
||||
[Parameter] public string Class { get; set; } = string.Empty;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region FIELDS
|
||||
|
||||
private bool _loaded;
|
||||
private bool _saving;
|
||||
|
||||
private MediumRequest? _request;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PRIVATE METHODS
|
||||
|
||||
protected override async Task OnFirstRenderAsync()
|
||||
{
|
||||
await base.OnFirstRenderAsync();
|
||||
|
||||
LoadData();
|
||||
|
||||
_loaded = true;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private void LoadData()
|
||||
{
|
||||
_request = Data switch
|
||||
{
|
||||
null => TypeIfNull switch
|
||||
{
|
||||
NullType.Movie => new MediumMovieRequest(),
|
||||
NullType.Series => new MediumSeriesRequest(),
|
||||
},
|
||||
_ => Data.ToRequest()
|
||||
};
|
||||
}
|
||||
|
||||
private async Task SaveData()
|
||||
{
|
||||
_saving = true;
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
|
||||
IApiResponse<BaseMediumResponse> response = Data switch
|
||||
{
|
||||
null => TypeIfNull switch
|
||||
{
|
||||
NullType.Movie => await MediaClient.PostMediumMovie(token, _request as MediumMovieRequest ?? throw new InvalidOperationException()),
|
||||
NullType.Series => await MediaClient.PostMediumSeries(token, _request as MediumSeriesRequest ?? throw new InvalidOperationException()),
|
||||
},
|
||||
MediumMovieResponse => await MediaClient.PutMediumMovie(token, Data.Id, _request as MediumMovieRequest ?? throw new InvalidOperationException()),
|
||||
MediumSeriesResponse => await MediaClient.PutMediumSeries(token, Data.Id, _request as MediumSeriesRequest ?? throw new InvalidOperationException()),
|
||||
_ => throw new InvalidOperationException()
|
||||
};
|
||||
switch (response)
|
||||
{
|
||||
case { IsSuccessful: true }:
|
||||
switch (Data)
|
||||
{
|
||||
case null: NavigationManager.NavigateTo($"media/{response.Content.Id}/edit", true); break;
|
||||
default: await Base.SnackbarStack.PushAsync("Data saved successfully.", SnackbarColor.Success); break;
|
||||
}
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.Forbidden } or { StatusCode: HttpStatusCode.Unauthorized }:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to edit media data.", SnackbarColor.Danger);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.BadRequest }:
|
||||
string? content = "An unknown error occured.";
|
||||
if (response.Error is ValidationApiException ex)
|
||||
{
|
||||
string? exContent = ex.Content?.Errors.SelectMany(x => x.Value).FirstOrDefault();
|
||||
if (exContent is not null)
|
||||
{
|
||||
content = exContent;
|
||||
}
|
||||
}
|
||||
await Base.SnackbarStack.PushAsync(content, SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
_saving = false;
|
||||
}
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
@using Blazorise.Extensions
|
||||
@using WatchIt.DTO.Models.Controllers.Genres.Genre
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel">
|
||||
<div class="vstack gap-3">
|
||||
<h4 class="fw-bold">Genres</h4>
|
||||
<div class="d-flex gap-3">
|
||||
<InputSelect class="w-100 form-control" TValue="short?" @bind-Value="@(_selectedGenre)" disabled="@(Data is null || _addLoading || _chosenGenres.Values.Any(x => x))">
|
||||
<option value="@(default(short?))" selected hidden="hidden">Choose genre...</option>
|
||||
@foreach (GenreResponse genre in _availableGenres)
|
||||
{
|
||||
<option value="@(genre.Id)">@(genre.Name)</option>
|
||||
}
|
||||
</InputSelect>
|
||||
<button class="btn btn-secondary" @onclick="AddGenre" disabled="@(Data is null || _selectedGenre is null || _addLoading || _chosenGenres.Values.Any(x => x))">
|
||||
<LoadingButtonContent Content="Add" LoadingContent="Adding..." IsLoading="@(_addLoading)"/>
|
||||
</button>
|
||||
</div>
|
||||
@if (_chosenGenres.IsNullOrEmpty())
|
||||
{
|
||||
<span class="text-center">No items</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-transparent">
|
||||
<tbody>
|
||||
@foreach (KeyValuePair<GenreResponse, bool> genre in _chosenGenres)
|
||||
{
|
||||
<tr>
|
||||
<td class="align-middle">
|
||||
@(genre.Key.Name)
|
||||
</td>
|
||||
<td class="align-middle table-cell-fit">
|
||||
<button class="btn btn-outline-danger btn-sm w-100" type="button" disabled="@(_addLoading || genre.Value)" @onclick="@(() => RemoveGenre(genre.Key))">
|
||||
<LoadingButtonContent IsLoading="@(genre.Value)">
|
||||
<i class="fa-solid fa-trash"></i>
|
||||
</LoadingButtonContent>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,117 @@
|
||||
using Blazorise.Snackbar;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Refit;
|
||||
using WatchIt.DTO.Models.Controllers.Genres.Genre;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Response;
|
||||
using WatchIt.Website.Clients;
|
||||
using WatchIt.Website.Components.Layout;
|
||||
using WatchIt.Website.Services.Authentication;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class GenresEditPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] private IAuthenticationService AuthenticationService { get; set; } = null!;
|
||||
[Inject] private IGenresClient GenresClient { get; set; } = null!;
|
||||
[Inject] private IMediaClient MediaClient { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public required BaseMediumResponse? Data { get; set; }
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region FIELDS
|
||||
|
||||
private Dictionary<GenreResponse, bool> _chosenGenres = new Dictionary<GenreResponse, bool>();
|
||||
private List<GenreResponse> _availableGenres = new List<GenreResponse>();
|
||||
|
||||
private short? _selectedGenre;
|
||||
private bool _addLoading;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PRIVATE METHODS
|
||||
|
||||
protected override async Task OnFirstRenderAsync()
|
||||
{
|
||||
await LoadData();
|
||||
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private async Task LoadData()
|
||||
{
|
||||
if (Data is not null)
|
||||
{
|
||||
foreach (GenreResponse genre in Data.Genres)
|
||||
{
|
||||
_chosenGenres[genre] = false;
|
||||
}
|
||||
}
|
||||
|
||||
IApiResponse<IEnumerable<GenreResponse>> response = await GenresClient.GetGenres();
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
IEnumerable<short> tempSelected = _chosenGenres.Keys.Select(x => x.Id);
|
||||
_availableGenres.AddRange(response.Content.Where(x => !tempSelected.Contains(x.Id)));
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Genres could not be obtained.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task AddGenre()
|
||||
{
|
||||
_addLoading = true;
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
|
||||
IApiResponse response = await MediaClient.PostMediumGenre(token, Data.Id, _selectedGenre!.Value);
|
||||
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
GenreResponse selectedGenre = _availableGenres.First(x => x.Id == _selectedGenre);
|
||||
_availableGenres.Remove(selectedGenre);
|
||||
_chosenGenres[selectedGenre] = false;
|
||||
_selectedGenre = null;
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Genre could not be added.", SnackbarColor.Danger);
|
||||
}
|
||||
_addLoading = false;
|
||||
}
|
||||
|
||||
private async Task RemoveGenre(GenreResponse genre)
|
||||
{
|
||||
_chosenGenres[genre] = true;
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
|
||||
IApiResponse response = await MediaClient.DeleteMediumGenre(token, Data.Id, genre.Id);
|
||||
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_chosenGenres.Remove(genre);
|
||||
_availableGenres.Add(genre);
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Genre could not be removed.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel" role="button" @onclick="@(Data is not null ? () => NavigationManager.NavigateTo($"/media/{Data.Id}") : null)" style="cursor: @(Data is null ? "default" : "pointer")">
|
||||
<div class="d-flex gap-3 align-items-center">
|
||||
<Image Content="@(Data?.Picture)" Height="60" Placeholder="/assets/placeholders/medium.png" AlternativeText="poster"/>
|
||||
<div class="d-flex-inline flex-column">
|
||||
<h2 id="primaryText" class="m-0">
|
||||
@if (Data is null)
|
||||
{
|
||||
<span class="fw-bold">New @(TypeIfNull == NullType.Movie ? "movie" : "TV series")</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="fw-bold">@(Data.Title)</span>
|
||||
}
|
||||
</h2>
|
||||
@if (Data is not null)
|
||||
{
|
||||
<span id="secondaryText" class="text-secondary">Medium settings</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,24 @@
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using WatchIt.DTO.Models.Controllers.Media.Medium.Response;
|
||||
using WatchIt.Website.Clients;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class HeaderPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] public IMediaClient MediaClient { get; set; } = null!;
|
||||
[Inject] public NavigationManager NavigationManager { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public required BaseMediumResponse? Data { get; set; }
|
||||
[Parameter] public required NullType TypeIfNull { get; set; }
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
/* IDS */
|
||||
|
||||
#primaryText {
|
||||
margin-top: -8px !important;
|
||||
}
|
||||
|
||||
#secondaryText {
|
||||
color: lightgray !important;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public enum NullType
|
||||
{
|
||||
Movie,
|
||||
Series
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
@using System.Drawing
|
||||
@using Blazorise.Extensions
|
||||
@using WatchIt.DTO.Models.Controllers.Photos.Photo
|
||||
@using WatchIt.Website.Components.Subcomponents.Common
|
||||
|
||||
@inherits Component
|
||||
|
||||
|
||||
|
||||
<div class="panel">
|
||||
<div class="container-grid">
|
||||
<div class="row mb-3">
|
||||
<div class="col">
|
||||
<div class="d-flex align-items-center h-100">
|
||||
<h4 class="m-0"><strong>Photos</strong></h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
@if (!_photoEditMode)
|
||||
{
|
||||
<button type="button" class="btn btn-secondary" disabled="@(!Id.HasValue || !_loaded)" @onclick="() => InitEditPhoto(null)">Add new photo</button>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="d-flex gap-3 align-items-center">
|
||||
<button type="button" class="btn btn-secondary" disabled="@(_photoEditSaving)" @onclick="SaveEditPhoto">
|
||||
<LoadingButtonContent IsLoading="@(_photoEditSaving)" LoadingContent="Saving..." Content="Save"/>
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary" disabled="@(_photoEditSaving)" @onclick="CancelEditPhoto">Cancel</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
@if (!_photoEditMode)
|
||||
{
|
||||
if (_loaded)
|
||||
{
|
||||
if (!_photos.IsNullOrEmpty())
|
||||
{
|
||||
<div id="scrollPhotos" class="d-flex p-3 gap-3" data-bs-spy="scroll" tabindex="0">
|
||||
@foreach (PhotoResponse photo in _photos)
|
||||
{
|
||||
<div class="container-grid photo-container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<Image Content="@(photo)" AlternativeText="photo" Width="350" Placeholder="/assets/placeholders/photo.png" AspectRatio="Image.ImageComponentAspectRatio.Photo"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-2 gx-2">
|
||||
@if (photo.Background is not null)
|
||||
{
|
||||
<div class="col-auto">
|
||||
<div class="d-flex align-items-center">
|
||||
<div id="backgroundIndicator" class="border rounded-circle circle-@(photo.Background.IsUniversal ? "blue" : "grey") p-1" data-toggle="tooltip" data-placement="top" title="@(photo.Background.IsUniversal ? "Universal" : "Media-only") background">
|
||||
<img class="no-vertical-align" src="assets/icons/background.png" alt="background_icon" height="20px" width="20px"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div class="col">
|
||||
<div class="d-flex align-items-center h-100 text-size-upload-date">
|
||||
Upload: @(photo.UploadDate.ToString("g"))
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-secondary btn-sm" @onclick="() => InitEditPhoto(photo.Id)" disabled="@(_photoDeleting.Contains(photo.Id))">
|
||||
<img src="assets/icons/edit.png" alt="edit_icon" height="20px" width="20px"/>
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-danger btn-sm" disabled="@(_photoDeleting.Contains(photo.Id))" @onclick="() => DeletePhoto(photo.Id)">
|
||||
@if (!_photoDeleting.Contains(photo.Id))
|
||||
{
|
||||
<img src="assets/icons/delete.png" alt="delete_icon" height="20px" width="20px"/>
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="d-flex justify-content-center">
|
||||
Photo list is empty
|
||||
</div>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="d-flex justify-content-center">
|
||||
<Loading Color="Loading.Colors.Light"/>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="container-grid">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<div class="container-grid">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<Image Content="@(_photoEditRequest)" Placeholder="/assets/placeholders/photo.png" AlternativeText="edit_photo" Width="300" AspectRatio="Image.ImageComponentAspectRatio.Photo"/>
|
||||
</div>
|
||||
</div>
|
||||
@if (_photoEditId is null)
|
||||
{
|
||||
<div class="row mt-2">
|
||||
<div class="col">
|
||||
<InputFile class="form-control" OnChange="LoadPhoto" autocomplete="off" style="width: 300px;"/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="container-grid">
|
||||
<div class="row form-group">
|
||||
<div class="col">
|
||||
<div class="form-check">
|
||||
<InputCheckbox class="form-check-input" @bind-Value="_photoEditIsBackground"/>
|
||||
<label class="form-check-label">Use as background</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="form-check">
|
||||
<InputCheckbox class="form-check-input" @bind-Value="_photoEditBackgroundData.IsUniversal" disabled="@(!_photoEditIsBackground)"/>
|
||||
<label class="form-check-label">Use as universal background</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group my-1">
|
||||
<label for="first-gradient-color" class="col-4 col-form-label">First gradient color</label>
|
||||
<div class="col-8">
|
||||
<input type="color" class="form-control form-control-color w-100" id="first-gradient-color" value="@(ColorTranslator.ToHtml(_photoEditBackgroundData.FirstGradientColor))" disabled="@(!_photoEditIsBackground)" @onchange="EditPhotoFirstGradientColorChanged">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row form-group">
|
||||
<label for="second-gradient-color" class="col-4 col-form-label">Second gradient color</label>
|
||||
<div class="col-8">
|
||||
<input type="color" class="form-control form-control-color w-100" id="second-gradient-color" value="@(ColorTranslator.ToHtml(_photoEditBackgroundData.SecondGradientColor))" disabled="@(!_photoEditIsBackground)" @onchange="EditPhotoSecondGradientColorChanged">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,215 @@
|
||||
using System.Drawing;
|
||||
using System.Net;
|
||||
using Blazorise;
|
||||
using Blazorise.Snackbar;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Microsoft.AspNetCore.Components.Forms;
|
||||
using Refit;
|
||||
using WatchIt.DTO.Models.Controllers.Photos;
|
||||
using WatchIt.DTO.Models.Controllers.Photos.Photo;
|
||||
using WatchIt.DTO.Models.Controllers.Photos.PhotoBackground;
|
||||
using WatchIt.Website.Clients;
|
||||
using WatchIt.Website.Components.Layout;
|
||||
using WatchIt.Website.Services.Authentication;
|
||||
using Color = System.Drawing.Color;
|
||||
|
||||
namespace WatchIt.Website.Components.Panels.Pages.MediumEditPage;
|
||||
|
||||
public partial class PhotosEditPanel : Component
|
||||
{
|
||||
#region SERVICES
|
||||
|
||||
[Inject] public NavigationManager NavigationManager { get; set; } = null!;
|
||||
[Inject] public IAuthenticationService AuthenticationService { get; set; } = null!;
|
||||
[Inject] public IPhotosClient PhotosClient { get; set; } = null!;
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PARAMETERS
|
||||
|
||||
[Parameter] public long? Id { get; set; }
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region FIELDS
|
||||
|
||||
private bool _loaded;
|
||||
|
||||
private IEnumerable<PhotoResponse> _photos = new List<PhotoResponse>();
|
||||
private List<Guid> _photoDeleting = new List<Guid>();
|
||||
private bool _photoEditMode;
|
||||
private Guid? _photoEditId;
|
||||
private bool _photoEditSaving;
|
||||
private bool _photoEditIsBackground;
|
||||
private PhotoRequest? _photoEditRequest;
|
||||
private PhotoBackgroundRequest? _photoEditBackgroundData = new PhotoBackgroundRequest()
|
||||
{
|
||||
FirstGradientColor = Color.FromArgb(0xFF, 0xFF, 0xFF),
|
||||
SecondGradientColor = Color.FromArgb(0x00, 0x00, 0x00),
|
||||
IsUniversal = false
|
||||
};
|
||||
|
||||
#endregion
|
||||
|
||||
|
||||
|
||||
#region PRIVATE METHODS
|
||||
|
||||
protected override async Task OnFirstRenderAsync()
|
||||
{
|
||||
await base.OnFirstRenderAsync();
|
||||
|
||||
if (Id.HasValue)
|
||||
{
|
||||
IApiResponse<IEnumerable<PhotoResponse>> response = await PhotosClient.GetPhotos(new PhotoFilterQuery
|
||||
{
|
||||
MediumId = Id.Value,
|
||||
});
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
_photos = response.Content;
|
||||
}
|
||||
else
|
||||
{
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Photos cannot be downloaded.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
_loaded = true;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private async Task DeletePhoto(Guid id)
|
||||
{
|
||||
_photoDeleting.Add(id);
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
|
||||
IApiResponse response = await PhotosClient.DeletePhoto(token, id);
|
||||
|
||||
if (response.IsSuccessful)
|
||||
{
|
||||
NavigationManager.Refresh(true);
|
||||
}
|
||||
else
|
||||
{
|
||||
_photoDeleting.Remove(id);
|
||||
await Base.SnackbarStack.PushAsync("An error occured. Photo cannot be removed.", SnackbarColor.Danger);
|
||||
}
|
||||
}
|
||||
|
||||
private void InitEditPhoto(Guid? id)
|
||||
{
|
||||
_photoEditMode = true;
|
||||
_photoEditId = id;
|
||||
_photoEditRequest = null;
|
||||
_photoEditIsBackground = false;
|
||||
_photoEditBackgroundData = new PhotoBackgroundRequest
|
||||
{
|
||||
FirstGradientColor = Color.FromArgb(0xFF, 0xFF, 0xFF),
|
||||
SecondGradientColor = Color.FromArgb(0x00, 0x00, 0x00),
|
||||
IsUniversal = false
|
||||
};
|
||||
Console.WriteLine(ColorTranslator.ToHtml(_photoEditBackgroundData.FirstGradientColor));
|
||||
if (id is not null)
|
||||
{
|
||||
PhotoResponse response = _photos.First(x => x.Id == id);
|
||||
_photoEditRequest = response.ToRequest();
|
||||
if (_photoEditRequest.BackgroundData is not null)
|
||||
{
|
||||
_photoEditIsBackground = true;
|
||||
_photoEditBackgroundData = _photoEditRequest.BackgroundData;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private void CancelEditPhoto()
|
||||
{
|
||||
_photoEditMode = false;
|
||||
_photoEditId = null;
|
||||
}
|
||||
|
||||
private async Task SaveEditPhoto()
|
||||
{
|
||||
_photoEditSaving = true;
|
||||
|
||||
string token = await AuthenticationService.GetRawAccessTokenAsync() ?? string.Empty;
|
||||
|
||||
IApiResponse response;
|
||||
_photoEditRequest.BackgroundData = _photoEditIsBackground ? _photoEditBackgroundData : null;
|
||||
if (_photoEditId is null)
|
||||
{
|
||||
response = await PhotosClient.PostPhoto(token, _photoEditRequest);
|
||||
}
|
||||
else
|
||||
{
|
||||
response = await PhotosClient.PutPhoto(token, _photoEditId.Value, _photoEditRequest);
|
||||
}
|
||||
|
||||
switch (response)
|
||||
{
|
||||
case { IsSuccessful: true }:
|
||||
await Base.SnackbarStack.PushAsync("Photo saved successfully.", SnackbarColor.Success);
|
||||
NavigationManager.Refresh(true);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.Forbidden } or { StatusCode: HttpStatusCode.Unauthorized }:
|
||||
await Base.SnackbarStack.PushAsync("You are not authorized to edit photos.", SnackbarColor.Danger);
|
||||
break;
|
||||
case { StatusCode: HttpStatusCode.BadRequest }:
|
||||
string? content = "An unknown error occured.";
|
||||
if (response.Error is ValidationApiException ex)
|
||||
{
|
||||
string? exContent = ex.Content?.Errors.SelectMany(x => x.Value).FirstOrDefault();
|
||||
if (exContent is not null)
|
||||
{
|
||||
content = exContent;
|
||||
}
|
||||
}
|
||||
await Base.SnackbarStack.PushAsync(content, SnackbarColor.Danger);
|
||||
break;
|
||||
default:
|
||||
await Base.SnackbarStack.PushAsync("An unknown error occured.", SnackbarColor.Danger);
|
||||
break;
|
||||
}
|
||||
|
||||
_photoEditMode = false;
|
||||
_photoEditId = null;
|
||||
}
|
||||
|
||||
private async Task LoadPhoto(InputFileChangeEventArgs args)
|
||||
{
|
||||
if (args.File.ContentType.StartsWith("image"))
|
||||
{
|
||||
Stream stream = args.File.OpenReadStream(5242880);
|
||||
byte[] array;
|
||||
using (MemoryStream ms = new MemoryStream())
|
||||
{
|
||||
await stream.CopyToAsync(ms);
|
||||
array = ms.ToArray();
|
||||
}
|
||||
|
||||
_photoEditRequest = new PhotoRequest
|
||||
{
|
||||
MediumId = Id!.Value,
|
||||
Image = array,
|
||||
MimeType = args.File.ContentType
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
private void EditPhotoFirstGradientColorChanged(ChangeEventArgs e)
|
||||
{
|
||||
_photoEditBackgroundData.FirstGradientColor = ColorTranslator.FromHtml(e.Value.ToString());
|
||||
}
|
||||
|
||||
private void EditPhotoSecondGradientColorChanged(ChangeEventArgs e)
|
||||
{
|
||||
_photoEditBackgroundData.SecondGradientColor = ColorTranslator.FromHtml(e.Value.ToString());
|
||||
}
|
||||
|
||||
#endregion
|
||||
}
|
||||
@@ -0,0 +1,45 @@
|
||||
/* IDS */
|
||||
|
||||
#scrollPhotos {
|
||||
overflow-x: scroll;
|
||||
|
||||
border-color: grey;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#backgroundIndicator {
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* CLASSES */
|
||||
|
||||
.circle-blue {
|
||||
background-color: dodgerblue;
|
||||
border-color: dodgerblue;
|
||||
}
|
||||
|
||||
.circle-grey {
|
||||
background-color: grey;
|
||||
border-color: grey;
|
||||
}
|
||||
|
||||
.no-vertical-align {
|
||||
vertical-align: inherit;
|
||||
}
|
||||
|
||||
.photo-container {
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.text-size-upload-date {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.photo-default-aspect-ratio {
|
||||
aspect-ratio: 16/9;
|
||||
}
|
||||
Reference in New Issue
Block a user