Skip to content

Commit

Permalink
Merge pull request #180 from pticostaricags/development
Browse files Browse the repository at this point in the history
Moving video actions bar to a component
  • Loading branch information
efonsecab authored Oct 26, 2024
2 parents aeabfd7 + 9553284 commit db7012d
Show file tree
Hide file tree
Showing 8 changed files with 297 additions and 138 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
@using FairPlayCombined.Models.FairPlayTube.VideoInfo
@using FairPlayCombined.Models.Pagination
@using FairPlayTube.SharedUI.Components.Spinners
@using FairPlayTube.SharedUI.Components.Video
@using Microsoft.Extensions.Localization
@using System.Globalization

Expand Down Expand Up @@ -56,61 +57,7 @@
</div>
}
<div>
<FluentStack Orientation="Orientation.Horizontal" Wrap="true">
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[DeleteVideoTextKey]?.Value"
OnClick="@( () => OnDeleteVideoClickedAsync(context))">
<FluentIcon Value="@(new Icons.Regular.Size20.Delete())" Color="Color.Warning"></FluentIcon>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[CreateYouTubeThumbnailTextKey]?.Value"
OnClick="@( ()=> OnCreateYouTubeThumbnailClicked(context))">
<i class="bi bi-image-fill"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[CreateInfographicTextKey]?.Value"
OnClick="@( ()=> OnCreateInfographicClicked(context))">
<i class="bi bi-file-earmark-bar-graph-fill"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[GetLinkedInMarketingIdeasTextKey]?.Value"
OnClick="@( ()=> OnGetLinkedInDigitalMarketingIdeasClicked(context))">
<i class="bi bi-list-task"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[GetNewLinkedInDailyPostsIdeasTextKey]?.Value"
OnClick="@( ()=> OnGetLinkedInDailyPostsClicked(context))">
<i class="bi bi-linkedin"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[GetPassiveIncomeIdeasTextKey]?.Value"
OnClick="@( ()=> OnGetPassiveIncomeIdeas(context))">
<i class="bi bi-currency-dollar"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[CreateLinkedInArticleTextKey]?.Value"
OnClick="@( ()=> OnCreateLinkedInArticleClicked(context))">
<i class="bi bi-file-richtext-fill"></i>
</FluentButton>
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[ViewMyVideoViewersTextKey]?.Value"
OnClick="@( () => OnViewMyVideoViewersClicked(context))">
<FluentIcon Value="@(new Icons.Regular.Size20.PeopleAudience())"></FluentIcon>
</FluentButton>
@if (!String.IsNullOrWhiteSpace(context.YouTubeVideoId))
{
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[ManageYouTubeCaptionsTextKey]?.Value"
OnClick="@( () => OnManageYouTubeCaptionsButtonClicked(context))">
<i class="bi bi-badge-cc-fill"></i>
</FluentButton>
<FluentAnchor data-enhance-nav="false"
data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[WatchOnYouTubeTextKey]?.Value"
Href="@($"https://youtu.be/{context.YouTubeVideoId}")" Target="_blank">
<i class="bi bi-youtube"></i>
</FluentAnchor>
}
<FluentButton Type="ButtonType.Button" data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[CreateYouTubeChaptersTextKey]?.Value"
OnClick="@( () => OnCreateYouTubeChaptersClicked(context))">
<FluentIcon Value="@(new Icons.Regular.Size20.Timeline())"></FluentIcon>
</FluentButton>
<FluentAnchor Href="@($"/Account/MyVideoDataExport/{context.VideoInfoId}")"
data-bs-toggle="tooltip" data-bs-placement="top" title="@localizer[ExportVideoDataTextKey]?.Value"
Target="_blank">
<FluentIcon Value="@(new Icons.Regular.Size20.ArrowExport())"></FluentIcon>
</FluentAnchor>
</FluentStack>
<VideoActions context="context" OnVideoDeleted="OnVideoDeletedAsync"></VideoActions>
</div>
</ChildContent>
</FluentAccordionItem>
Expand Down Expand Up @@ -166,76 +113,9 @@
};
}

private void OnViewMyVideoViewersClicked(VideoInfoModel videoInfoModel)
private async Task OnVideoDeletedAsync()
{
this.navigationManager.NavigateTo($"{Constants.Routes.FairPlayTubeRoutes.CreatorRoutes.MyVideoViewers}/{videoInfoModel.VideoId}");
}

private void OnManageYouTubeCaptionsButtonClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/VideoCaptions/VideoInfo{videoInfoModel.VideoInfoId}/YouTube/{videoInfoModel.YouTubeVideoId}");
}

private void OnCreateYouTubeThumbnailClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/YouTubeThumbnail/{videoInfoModel.VideoInfoId}");
}

private void OnCreateInfographicClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"{Constants.Routes.FairPlayTubeRoutes.CreatorRoutes.VideoInfographic}/{videoInfoModel.VideoInfoId}");
}

private void OnGetLinkedInDigitalMarketingIdeasClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/VideoDigitalMarketing/{videoInfoModel.VideoInfoId}");
}

private void OnGetPassiveIncomeIdeas(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/VideoPassiveIncome/{videoInfoModel.VideoInfoId}");
}

private void OnGetLinkedInDailyPostsClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"{Constants.Routes.FairPlayTubeRoutes.CreatorRoutes.VideoDailyPosts}/{videoInfoModel.VideoInfoId}");
}

private void OnCreateLinkedInArticleClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/VideoLinkedInArticle/{videoInfoModel.VideoInfoId}");
}

private void OnCreateYouTubeChaptersClicked(VideoInfoModel videoInfoModel)
{
this.navigationManager.NavigateTo($"/Creator/VideoChapters/{videoInfoModel.VideoInfoId}");
}

private async Task OnDeleteVideoClickedAsync(VideoInfoModel videoInfoModel)
{
try
{
var dialogReference =
await dialogService.ShowConfirmationAsync($"Are you sure you want to delete the video: {videoInfoModel.Name}?");
var result = await dialogReference.Result;
if (!result.Cancelled)
{
this.IsBusy = true;
StateHasChanged();
await this.videoInfoService.DeleteMyVideoAsync(videoInfoId: videoInfoModel.VideoInfoId, cancellationToken: this.cancellationTokenSource.Token);
await this.paginationState.SetCurrentPageIndexAsync(this.paginationState.CurrentPageIndex);
this.toastService.ShowSuccess("Your video is now deleted");
}
}
catch (Exception ex)
{
this.toastService.ShowError(ex.Message);
}
finally
{
this.IsBusy = false;
StateHasChanged();
}
await this.paginationState.SetCurrentPageIndexAsync(this.paginationState.CurrentPageIndex);
}

public async ValueTask DisposeAsync()
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,15 @@
@using FairPlayTube.SharedUI.Components.Spinners
@using System.Text
@using System.Globalization
@using FairPlayTube.SharedUI.Components.Video


@inject IJSRuntime jsRuntime
@inject IVideoDigitalMarketingDailyPostsService videoDigitalMarketingDailyPostsService
@inject IToastService toastService
@inject ICustomCache customCache
@inject ICultureService cultureService
@inject IVideoInfoService videoInfoService

<PageTitle>
Video Daily Posts
Expand All @@ -33,9 +35,18 @@

<LoadingIndicator ShowSpinners="this.IsBusy"></LoadingIndicator>

@if (this.VideoInfoId.HasValue)
{
<FluentAccordion>
<FluentAccordionItem Expanded="true">
<VideoActions context="this.VideoInfoModel" OnVideoDeleted="LoadDataAsync"></VideoActions>
</FluentAccordionItem>
</FluentAccordion>
}

<div>
<FluentSelect @bind-SelectedOption="@this.SelectedCulture" Items="@supportedCultures"
Embedded="true">
Embedded="true">
<OptionTemplate>@context!.DisplayName</OptionTemplate>
</FluentSelect>
</div>
Expand All @@ -47,7 +58,7 @@
</div>
<div>
<FluentButton Appearance="Appearance.Accent" Type="ButtonType.Button"
OnClick="OnCreateVideoDailyPostAsync">Create Video Daily Posts</FluentButton>
OnClick="OnCreateVideoDailyPostAsync">Create Video Daily Posts</FluentButton>
</div>

@if (this.ItemsProvider != null)
Expand Down Expand Up @@ -77,6 +88,7 @@
{
[Parameter]
public long? VideoInfoId { get; set; }
private VideoInfoModel? VideoInfoModel { get; set; }
private bool IsBusy { get; set; }
private readonly CancellationTokenSource cancellationTokenSource = new();
private string? DigitalMarketingDailyPostsIdeas { get; set; }
Expand All @@ -92,11 +104,17 @@
private string? SelectedSocialNetwork { get; set; } = "LinkedIn";

protected override async Task OnInitializedAsync()
{
await LoadDataAsync();
}

protected async Task LoadDataAsync()
{
try
{
this.IsBusy = true;
StateHasChanged();
this.VideoInfoModel = await this.videoInfoService.GetVideoInfoByIdAsync(this.VideoInfoId!.Value, this.cancellationTokenSource.Token);
var items = await this.customCache!.GetOrCreateAsync<string[]>(
key: nameof(this.supportedCultures),
retrieveDataTask: async () =>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
@using FairPlayCombined.Models.Pagination
@using FairPlayTube.SharedUI.Components.Spinners
@using System.Globalization
@using FairPlayTube.SharedUI.Components.Video

@inject IJSRuntime jsRuntime
@inject IVideoInfoService videoInfoService
Expand All @@ -31,9 +32,18 @@

<LoadingIndicator ShowSpinners="this.IsBusy"></LoadingIndicator>

@if (this.VideoInfoId.HasValue)
{
<FluentAccordion>
<FluentAccordionItem Expanded="true">
<VideoActions context="this.VideoInfoModel" OnVideoDeleted="LoadDataAsync"></VideoActions>
</FluentAccordionItem>
</FluentAccordion>
}

<div>
<FluentSelect @bind-SelectedOption="@this.SelectedCulture" Items="@supportedCultures"
Embedded="true">
Embedded="true">
<OptionTemplate>@context!.DisplayName</OptionTemplate>
</FluentSelect>
</div>
Expand All @@ -60,6 +70,7 @@
{
[Parameter]
public long? VideoInfoId { get; set; }
private VideoInfoModel? VideoInfoModel{ get; set; }
private CultureInfo[]? supportedCultures { get; set; }
private CultureInfo? SelectedCulture { get; set; }
private bool IsBusy { get; set; }
Expand All @@ -68,10 +79,15 @@
private string? RevisedPrompt { get; set; }

protected override async Task OnInitializedAsync()
{
await LoadDataAsync();
}

private async Task LoadDataAsync()
{
this.IsBusy = true;
StateHasChanged();
var videoInfoModel = await this.videoInfoService.GetVideoInfoByIdAsync(id: this.VideoInfoId!.Value,
this.VideoInfoModel = await this.videoInfoService.GetVideoInfoByIdAsync(id: this.VideoInfoId!.Value,
cancellationToken: this.cancellationTokenSource.Token);
var items = await this.customCache!.GetOrCreateAsync<string[]>(
key: nameof(this.supportedCultures),
Expand All @@ -90,7 +106,7 @@
this.SelectedCulture ??= CultureInfo.CurrentCulture;
this.DigitalMarketingIdeas = (await this.videoDigitalMarketingPlanService
.GetVideoDigitalMarketingPlansAsync(
videoInfoId: videoInfoModel.VideoInfoId,
videoInfoId: this.VideoInfoModel.VideoInfoId,
socialNetworkName: "LinkedIn",
cancellationToken: this.cancellationTokenSource.Token))?.ToList();
if (this.DigitalMarketingIdeas is null)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
@using FairPlayCombined.Models.Pagination
@using FairPlayTube.SharedUI.Components.Spinners
@using System.Collections.Concurrent
@using FairPlayTube.SharedUI.Components.Video

@attribute [StreamRendering(enabled: true)]

Expand All @@ -36,10 +37,18 @@
</FluentLabel>

<LoadingIndicator ShowSpinners="this.IsBusy"></LoadingIndicator>
@if (this.VideoInfoId.HasValue)
{
<FluentAccordion>
<FluentAccordionItem Expanded="true">
<VideoActions context="this.VideoInfoModel" OnVideoDeleted="LoadDataAsync"></VideoActions>
</FluentAccordionItem>
</FluentAccordion>
}

<div>
<FluentButton Appearance="Appearance.Accent" Type="ButtonType.Button"
OnClick="OnCreateNewInfographicClickedAsync">Create New Infographic</FluentButton>
OnClick="OnCreateNewInfographicClickedAsync">Create New Infographic</FluentButton>
</div>
<div>
@if (this.Items?.Items?.Length > 0)
Expand Down Expand Up @@ -84,6 +93,7 @@
{
[Parameter]
public long? VideoInfoId { get; set; }
private VideoInfoModel? VideoInfoModel { get; set; }
private bool IsBusy { get; set; }
private PaginationOfT<VideoInfographicModel>? Items;
private readonly ConcurrentDictionary<long, string> PagePhotos = new();
Expand Down Expand Up @@ -119,6 +129,7 @@
{
this.IsBusy = true;
StateHasChanged();
this.VideoInfoModel = await this.videoInfoService.GetVideoInfoByIdAsync(this.VideoInfoId!.Value, this.cancellationTokenSource.Token);
var items = await videoInfographicService.GetPaginatedVideoInfographicByVideoInfoIdAsync(
this.VideoInfoId!.Value, paginationRequest, this.cancellationTokenSource.Token);
this.Items = items;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
@using FairPlayCombined.Models.FairPlayTube.VideoInfo
@using FairPlayCombined.Models.Pagination
@using FairPlayTube.SharedUI.Components.Spinners
@using FairPlayTube.SharedUI.Components.Video

@inject IJSRuntime jsRuntime
@inject IVideoInfoService videoInfoService
Expand All @@ -30,6 +31,15 @@

<LoadingIndicator ShowSpinners="this.IsBusy"></LoadingIndicator>

@if (this.VideoInfoId.HasValue)
{
<FluentAccordion>
<FluentAccordionItem Expanded="true">
<VideoActions context="this.VideoInfoModel" OnVideoDeleted="LoadDataAsync"></VideoActions>
</FluentAccordionItem>
</FluentAccordion>
}

<FluentButton Type="ButtonType.Button" OnClick="CreateLinkedInArticleAsync">
Re-Create Article
</FluentButton>
Expand All @@ -47,13 +57,20 @@
{
[Parameter]
public long? VideoInfoId { get; set; }
private VideoInfoModel? VideoInfoModel { get; set; }
private bool IsBusy { get; set; }
private readonly CancellationTokenSource cancellationTokenSource = new();
private string? LinkedInArticleDraftText { get; set; }
private string? RevisedPrompt { get; set; }

protected override async Task OnInitializedAsync()
{
await LoadDataAsync();
}

private async Task LoadDataAsync()
{
this.VideoInfoModel = await this.videoInfoService.GetVideoInfoByIdAsync(this.VideoInfoId!.Value, this.cancellationTokenSource.Token);
await this.CreateLinkedInArticleAsync();
}

Expand Down
Loading

0 comments on commit db7012d

Please sign in to comment.