mirror of https://github.com/ErsatzTV/ErsatzTV.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
413 lines
22 KiB
413 lines
22 KiB
@page "/channels/{Id:int?}" |
|
@page "/channels/add" |
|
@using ErsatzTV.Application.Artworks |
|
@using ErsatzTV.Application.Channels |
|
@using ErsatzTV.Application.FFmpegProfiles |
|
@using ErsatzTV.Application.Filler |
|
@using ErsatzTV.Application.Images |
|
@using ErsatzTV.Application.MediaItems |
|
@using ErsatzTV.Application.Templates |
|
@using ErsatzTV.Application.Watermarks |
|
@using ErsatzTV.Core.Domain.Filler |
|
@using ErsatzTV.Validators |
|
@using FluentValidation.Results |
|
@using static Prelude |
|
@implements IDisposable |
|
@inject NavigationManager NavigationManager |
|
@inject ILogger<ChannelEditor> Logger |
|
@inject ISnackbar Snackbar |
|
@inject IMediator Mediator |
|
|
|
<MudForm Model="@_model" @ref="@_form" Validation="@(_validator.ValidateValue)" ValidationDelay="0" Style="max-height: 100%"> |
|
<MudPaper Square="true" Style="display: flex; height: 64px; min-height: 64px; width: 100%; z-index: 100; align-items: center"> |
|
<MudButton Variant="Variant.Filled" Color="Color.Primary" Class="ml-8" OnClick="HandleSubmitAsync" StartIcon="@(IsEdit ? Icons.Material.Filled.Save : Icons.Material.Filled.Add)">@(IsEdit ? "Save Changes" : "Add Channel")</MudButton> |
|
</MudPaper> |
|
<div class="d-flex flex-column" style="height: 100vh; overflow-x: auto"> |
|
<MudContainer MaxWidth="MaxWidth.ExtraLarge" Class="pt-8"> |
|
<MudText Typo="Typo.h5" Class="mb-2">@(IsEdit ? "Edit Channel" : "Add Channel")</MudText> |
|
<MudDivider Class="mb-6"/> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Number</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.Number" For="@(() => _model.Number)" Immediate="true"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Name</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.Name" For="@(() => _model.Name)"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Group</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.Group" For="@(() => _model.Group)"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Categories</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.Categories" For="@(() => _model.Categories)" HelperText="Comma-separated list of categories"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Active Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.ActiveMode" For="@(() => _model.ActiveMode)"> |
|
<MudSelectItem Value="@(ChannelActiveMode.Active)">Active</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelActiveMode.Hidden)">Hidden</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelActiveMode.Inactive)">Inactive</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Progress Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.ProgressMode" For="@(() => _model.ProgressMode)"> |
|
<MudSelectItem Value="@(ChannelProgressMode.Always)">Always</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelProgressMode.OnDemand)">On Demand</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Streaming Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.StreamingMode" For="@(() => _model.StreamingMode)"> |
|
<MudSelectItem Value="@(StreamingMode.TransportStreamHybrid)">MPEG-TS</MudSelectItem> |
|
<MudSelectItem Value="@(StreamingMode.TransportStream)">MPEG-TS (Legacy)</MudSelectItem> |
|
<MudSelectItem Value="@(StreamingMode.HttpLiveStreamingDirect)">HLS Direct</MudSelectItem> |
|
<MudSelectItem Value="@(StreamingMode.HttpLiveStreamingSegmenter)">HLS Segmenter</MudSelectItem> |
|
<MudSelectItem Value="@(StreamingMode.HttpLiveStreamingSegmenterV2)">HLS Segmenter V2</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>FFmpeg Profile</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.FFmpegProfileId" For="@(() => _model.FFmpegProfileId)" |
|
Disabled="@(_model.StreamingMode == StreamingMode.HttpLiveStreamingDirect)"> |
|
@foreach (FFmpegProfileViewModel profile in _ffmpegProfiles) |
|
{ |
|
<MudSelectItem Value="@profile.Id">@profile.Name</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Stream Selector Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.StreamSelectorMode" For="@(() => _model.StreamSelectorMode)"> |
|
<MudSelectItem Value="@(ChannelStreamSelectorMode.Default)">Default</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelStreamSelectorMode.Custom)">Custom</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
@if (_model.StreamSelectorMode is ChannelStreamSelectorMode.Default) |
|
{ |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Preferred Audio Language</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.PreferredAudioLanguageCode" |
|
For="@(() => _model.PreferredAudioLanguageCode)" |
|
Clearable="true"> |
|
<MudSelectItem Value="@((string)null)">(none)</MudSelectItem> |
|
@foreach (LanguageCodeViewModel culture in _availableCultures) |
|
{ |
|
<MudSelectItem Value="@culture.ThreeLetterISOLanguageName">@culture.EnglishName</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Preferred Audio Title</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.PreferredAudioTitle" For="@(() => _model.PreferredAudioTitle)"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Preferred Subtitle Language</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.PreferredSubtitleLanguageCode" |
|
For="@(() => _model.PreferredSubtitleLanguageCode)" |
|
Clearable="true"> |
|
<MudSelectItem Value="@((string)null)">(none)</MudSelectItem> |
|
@foreach (LanguageCodeViewModel culture in _availableCultures) |
|
{ |
|
<MudSelectItem Value="@culture.ThreeLetterISOLanguageName">@culture.EnglishName</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Subtitle Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.SubtitleMode" For="@(() => _model.SubtitleMode)"> |
|
<MudSelectItem Value="@(ChannelSubtitleMode.None)">None</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelSubtitleMode.Forced)">Forced</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelSubtitleMode.Default)">Default</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelSubtitleMode.Any)">Any</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
} |
|
else |
|
{ |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Stream Selector</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.StreamSelector" |
|
For="@(() => _model.StreamSelector)"> |
|
<MudSelectItem T="string" Value="@((string)null)">(none)</MudSelectItem> |
|
@foreach (string selector in _streamSelectors) |
|
{ |
|
<MudSelectItem T="string" Value="@selector">@selector</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
} |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Music Video Credits Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.MusicVideoCreditsMode" For="@(() => _model.MusicVideoCreditsMode)"> |
|
<MudSelectItem Value="@(ChannelMusicVideoCreditsMode.None)">None</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelMusicVideoCreditsMode.GenerateSubtitles)">Generate Subtitles</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Music Video Credits Template</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.MusicVideoCreditsTemplate" |
|
For="@(() => _model.MusicVideoCreditsTemplate)" |
|
Disabled="@(_model.MusicVideoCreditsMode != ChannelMusicVideoCreditsMode.GenerateSubtitles)"> |
|
<MudSelectItem T="string" Value="@((string)null)">(none)</MudSelectItem> |
|
@foreach (string template in _musicVideoCreditsTemplates) |
|
{ |
|
<MudSelectItem T="string" Value="@template">@template</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Song Video Mode</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.SongVideoMode" For="@(() => _model.SongVideoMode)"> |
|
<MudSelectItem Value="@(ChannelSongVideoMode.Default)">Default</MudSelectItem> |
|
<MudSelectItem Value="@(ChannelSongVideoMode.WithProgress)">With Progress</MudSelectItem> |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Logo</MudText> |
|
</div> |
|
<InputFile id="fileInput" OnChange="UploadLogo" hidden/> |
|
<MudButton HtmlTag="label" |
|
Variant="Variant.Filled" |
|
Color="Color.Primary" |
|
StartIcon="@Icons.Material.Filled.CloudUpload" |
|
for="fileInput"> |
|
Upload Logo |
|
</MudButton> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>External Logo URL</MudText> |
|
</div> |
|
<MudTextField @bind-Value="_model.ExternalLogoUrl" For="@(() => _model.ExternalLogoUrl)"/> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Logo Preview</MudText> |
|
</div> |
|
@if (!string.IsNullOrWhiteSpace(_model.Logo?.Path) || !string.IsNullOrWhiteSpace(_model.ExternalLogoUrl)) |
|
{ |
|
<MudElement HtmlTag="img" src="@(string.IsNullOrWhiteSpace(_model.ExternalLogoUrl) ? _model.Logo.UrlWithContentType : _model.ExternalLogoUrl)" Style="max-height: 50px"/> |
|
} |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Watermark</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.WatermarkId" For="@(() => _model.WatermarkId)" |
|
Disabled="@(_model.StreamingMode == StreamingMode.HttpLiveStreamingDirect)" |
|
Clearable="true"> |
|
<MudSelectItem T="int?" Value="@((int?)null)">(none)</MudSelectItem> |
|
@foreach (WatermarkViewModel watermark in _watermarks) |
|
{ |
|
<MudSelectItem T="int?" Value="@watermark.Id">@watermark.Name</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
<MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5"> |
|
<div class="d-flex justify-md-end"> |
|
<MudText>Fallback Filler</MudText> |
|
</div> |
|
<MudSelect @bind-Value="_model.FallbackFillerId" For="@(() => _model.FallbackFillerId)" Clearable="true"> |
|
<MudSelectItem T="int?" Value="@((int?)null)">(none)</MudSelectItem> |
|
@foreach (FillerPresetViewModel fillerPreset in _fillerPresets) |
|
{ |
|
<MudSelectItem T="int?" Value="@fillerPreset.Id">@fillerPreset.Name</MudSelectItem> |
|
} |
|
</MudSelect> |
|
</MudStack> |
|
</MudContainer> |
|
</div> |
|
</MudForm> |
|
|
|
@code { |
|
private readonly CancellationTokenSource _cts = new(); |
|
|
|
[Parameter] |
|
public int? Id { get; set; } |
|
|
|
private readonly ChannelEditViewModel _model = new(); |
|
private readonly ChannelEditViewModelValidator _validator = new(); |
|
private MudForm _form; |
|
|
|
private List<FFmpegProfileViewModel> _ffmpegProfiles = []; |
|
private List<LanguageCodeViewModel> _availableCultures = []; |
|
private List<WatermarkViewModel> _watermarks = []; |
|
private List<FillerPresetViewModel> _fillerPresets = []; |
|
private List<string> _musicVideoCreditsTemplates = []; |
|
private List<string> _streamSelectors = []; |
|
|
|
public void Dispose() |
|
{ |
|
_cts.Cancel(); |
|
_cts.Dispose(); |
|
} |
|
|
|
protected override async Task OnParametersSetAsync() |
|
{ |
|
await LoadFFmpegProfiles(_cts.Token); |
|
_availableCultures = await Mediator.Send(new GetAllLanguageCodes(), _cts.Token); |
|
await LoadWatermarks(_cts.Token); |
|
await LoadFillerPresets(_cts.Token); |
|
await LoadMusicVideoCreditsTemplates(_cts.Token); |
|
await LoadChannelStreamSelectors(_cts.Token); |
|
|
|
if (Id.HasValue) |
|
{ |
|
Option<ChannelViewModel> maybeChannel = await Mediator.Send(new GetChannelById(Id.Value), _cts.Token); |
|
maybeChannel.Match( |
|
channelViewModel => |
|
{ |
|
_model.Id = channelViewModel.Id; |
|
_model.Name = channelViewModel.Name; |
|
_model.Group = channelViewModel.Group; |
|
_model.Categories = channelViewModel.Categories; |
|
_model.Number = channelViewModel.Number; |
|
_model.FFmpegProfileId = channelViewModel.FFmpegProfileId; |
|
|
|
if (channelViewModel.Logo.IsExternalUrl) |
|
{ |
|
_model.ExternalLogoUrl = channelViewModel.Logo.Path; |
|
} |
|
else |
|
{ |
|
_model.Logo = channelViewModel.Logo; |
|
} |
|
|
|
_model.ProgressMode = channelViewModel.ProgressMode; |
|
_model.StreamingMode = channelViewModel.StreamingMode; |
|
_model.StreamSelectorMode = channelViewModel.StreamSelectorMode; |
|
_model.StreamSelector = channelViewModel.StreamSelector; |
|
_model.PreferredAudioLanguageCode = channelViewModel.PreferredAudioLanguageCode; |
|
_model.PreferredAudioTitle = channelViewModel.PreferredAudioTitle; |
|
_model.WatermarkId = channelViewModel.WatermarkId; |
|
_model.FallbackFillerId = channelViewModel.FallbackFillerId; |
|
_model.PreferredSubtitleLanguageCode = channelViewModel.PreferredSubtitleLanguageCode; |
|
_model.SubtitleMode = channelViewModel.SubtitleMode; |
|
_model.MusicVideoCreditsMode = channelViewModel.MusicVideoCreditsMode; |
|
_model.MusicVideoCreditsTemplate = channelViewModel.MusicVideoCreditsTemplate; |
|
_model.SongVideoMode = channelViewModel.SongVideoMode; |
|
_model.ActiveMode = channelViewModel.ActiveMode; |
|
}, |
|
() => NavigationManager.NavigateTo("404")); |
|
} |
|
else |
|
{ |
|
FFmpegSettingsViewModel ffmpegSettings = await Mediator.Send(new GetFFmpegSettings(), _cts.Token); |
|
|
|
// TODO: command for new channel |
|
IEnumerable<int> channelNumbers = await Mediator.Send(new GetAllChannels(), _cts.Token) |
|
.Map(list => list.Map(c => int.TryParse(c.Number.Split(".").Head(), out int result) ? result : 0)); |
|
int maxNumber = Optional(channelNumbers).Flatten().DefaultIfEmpty(0).Max(); |
|
_model.Number = (maxNumber + 1).ToString(); |
|
_model.Name = "New Channel"; |
|
_model.Group = "ErsatzTV"; |
|
_model.FFmpegProfileId = ffmpegSettings.DefaultFFmpegProfileId; |
|
_model.StreamingMode = StreamingMode.TransportStreamHybrid; |
|
} |
|
} |
|
|
|
private bool IsEdit => Id.HasValue; |
|
|
|
private async Task LoadFFmpegProfiles(CancellationToken cancellationToken) => |
|
_ffmpegProfiles = await Mediator.Send(new GetAllFFmpegProfiles(), cancellationToken); |
|
|
|
private async Task LoadWatermarks(CancellationToken cancellationToken) => |
|
_watermarks = await Mediator.Send(new GetAllWatermarks(), cancellationToken); |
|
|
|
private async Task LoadFillerPresets(CancellationToken cancellationToken) => |
|
_fillerPresets = await Mediator.Send(new GetAllFillerPresets(), cancellationToken) |
|
.Map(list => list.Filter(vm => vm.FillerKind == FillerKind.Fallback).ToList()); |
|
|
|
private async Task LoadMusicVideoCreditsTemplates(CancellationToken cancellationToken) => |
|
_musicVideoCreditsTemplates = await Mediator.Send(new GetMusicVideoCreditTemplates(), cancellationToken); |
|
|
|
private async Task LoadChannelStreamSelectors(CancellationToken cancellationToken) => |
|
_streamSelectors = await Mediator.Send(new GetChannelStreamSelectors(), cancellationToken); |
|
|
|
private async Task HandleSubmitAsync() |
|
{ |
|
await _form.Validate(); |
|
ValidationResult result = await _validator.ValidateAsync(_model, _cts.Token); |
|
if (result.IsValid) |
|
{ |
|
Seq<BaseError> errorMessage = IsEdit ? (await Mediator.Send(_model.ToUpdate(), _cts.Token)).LeftToSeq() : (await Mediator.Send(_model.ToCreate(), _cts.Token)).LeftToSeq(); |
|
|
|
errorMessage.HeadOrNone().Match( |
|
error => |
|
{ |
|
Snackbar.Add(error.Value, Severity.Error); |
|
Logger.LogError("Unexpected error saving channel: {Error}", error.Value); |
|
}, |
|
() => NavigationManager.NavigateTo("channels")); |
|
} |
|
} |
|
|
|
private async Task UploadLogo(InputFileChangeEventArgs e) |
|
{ |
|
try |
|
{ |
|
Either<BaseError, string> maybeCacheFileName = |
|
await Mediator.Send(new SaveArtworkToDisk(e.File.OpenReadStream(10 * 1024 * 1024), ArtworkKind.Logo, e.File.ContentType), _cts.Token); |
|
maybeCacheFileName.Match( |
|
relativeFileName => |
|
{ |
|
_model.Logo = new ArtworkContentTypeModel($"iptv/logos/{relativeFileName}", e.File.ContentType); |
|
_model.ExternalLogoUrl = null; |
|
StateHasChanged(); |
|
}, |
|
error => |
|
{ |
|
Snackbar.Add($"Unexpected error saving channel logo: {error.Value}", Severity.Error); |
|
Logger.LogError("Unexpected error saving channel logo: {Error}", error.Value); |
|
}); |
|
} |
|
catch (IOException) |
|
{ |
|
Snackbar.Add("Channel logo exceeds maximum allowed file size of 10 MB", Severity.Error); |
|
Logger.LogError("Channel logo exceeds maximum allowed file size of 10 MB"); |
|
} |
|
catch (Exception ex) |
|
{ |
|
Snackbar.Add($"Unexpected error saving channel logo: {ex.Message}", Severity.Error); |
|
Logger.LogError("Unexpected error saving channel logo: {Error}", ex.Message); |
|
} |
|
} |
|
|
|
} |