@page "/watermarks/{Id:int}"
@page "/watermarks/add"
@using ErsatzTV.Application.Artworks
@using ErsatzTV.Application.Images
@using ErsatzTV.Application.Watermarks
@using ErsatzTV.FFmpeg.State
@using ErsatzTV.Validators
@using FluentValidation.Results
@implements IDisposable
@inject NavigationManager NavigationManager
@inject ILogger<WatermarkEditor> 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 Watermark" : "Add Watermark")</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">Watermark</MudText>
            <MudDivider Class="mb-6"/>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <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">
                    <MudText>Mode</MudText>
                </div>
                <MudSelect @bind-Value="_model.Mode" For="@(() => _model.Mode)">
                    <MudSelectItem Value="@(ChannelWatermarkMode.None)">None</MudSelectItem>
                    <MudSelectItem Value="@(ChannelWatermarkMode.Permanent)">Permanent</MudSelectItem>
                    <MudSelectItem Value="@(ChannelWatermarkMode.Intermittent)">Intermittent</MudSelectItem>
                </MudSelect>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Image Source</MudText>
                </div>
                <MudSelect @bind-Value="_model.ImageSource"
                           For="@(() => _model.ImageSource)"
                           Disabled="@(_model.Mode == ChannelWatermarkMode.None)">
                    <MudSelectItem Value="@(ChannelWatermarkImageSource.Custom)">Custom</MudSelectItem>
                    <MudSelectItem Value="@(ChannelWatermarkImageSource.ChannelLogo)">Channel Logo</MudSelectItem>
                </MudSelect>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Image</MudText>
                </div>
                <InputFile id="watermarkFileInput" OnChange="UploadWatermark" style="display: none;"/>
                <MudButton HtmlTag="label"
                           Variant="Variant.Filled"
                           Color="Color.Primary"
                           StartIcon="@Icons.Material.Filled.CloudUpload"
                           Disabled="@(_model.ImageSource != ChannelWatermarkImageSource.Custom)"
                           for="watermarkFileInput">
                    Upload Image
                </MudButton>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Image Preview</MudText>
                </div>
                @if (!string.IsNullOrWhiteSpace(_model.Image?.Path) && _model.ImageSource == ChannelWatermarkImageSource.Custom)
                {
                    <MudElement HtmlTag="img" src="@($"artwork/watermarks/{_model.Image.UrlWithContentType}")" Style="max-height: 50px"/>
                }
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Location</MudText>
                </div>
                <MudSelect @bind-Value="_model.Location"
                           For="@(() => _model.Location)"
                           Disabled="@(_model.Mode == ChannelWatermarkMode.None)">
                    <MudSelectItem Value="@(WatermarkLocation.BottomRight)">Bottom Right</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.BottomMiddle)">Bottom Middle</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.BottomLeft)">Bottom Left</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.LeftMiddle)">Left Middle</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.TopLeft)">Top Left</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.TopMiddle)">Top Middle</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.TopRight)">Top Right</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkLocation.RightMiddle)">Right Middle</MudSelectItem>
                </MudSelect>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Place Within Source Content</MudText>
                </div>
                <MudCheckBox @bind-Value="_model.PlaceWithinSourceContent"
                             For="@(() => _model.PlaceWithinSourceContent)"
                             Disabled="@(_model.Mode == ChannelWatermarkMode.None)"
                             Dense="true"/>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Size</MudText>
                </div>
                <MudSelect @bind-Value="_model.Size"
                           For="@(() => _model.Size)"
                           Disabled="@(_model.Mode == ChannelWatermarkMode.None)">
                    <MudSelectItem Value="@(WatermarkSize.Scaled)">Scaled</MudSelectItem>
                    <MudSelectItem Value="@(WatermarkSize.ActualSize)">Actual Size</MudSelectItem>
                </MudSelect>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Width</MudText>
                </div>
                <MudTextField For="@(() => _model.Width)"
                              Adornment="Adornment.End"
                              AdornmentText="%"
                              Disabled="@(_model.Mode == ChannelWatermarkMode.None || _model.Size == WatermarkSize.ActualSize)"
                              Immediate="true"/>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Horizontal Margin</MudText>
                </div>
                <MudTextField @bind-Value="_model.HorizontalMargin"
                              For="@(() => _model.HorizontalMargin)"
                              Adornment="Adornment.End"
                              AdornmentText="%"
                              Disabled="@(_model.Mode == ChannelWatermarkMode.None)"
                              Immediate="true"/>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Vertical Margin</MudText>
                </div>
                <MudTextField @bind-Value="_model.VerticalMargin"
                              For="@(() => _model.VerticalMargin)"
                              Adornment="Adornment.End"
                              AdornmentText="%"
                              Disabled="@(_model.Mode == ChannelWatermarkMode.None)"
                              Immediate="true"/>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Frequency</MudText>
                </div>
                <MudSelect @bind-Value="_model.FrequencyMinutes"
                           For="@(() => _model.FrequencyMinutes)"
                           Disabled="@(_model.Mode != ChannelWatermarkMode.Intermittent)">
                    <MudSelectItem Value="5">5 minutes</MudSelectItem>
                    <MudSelectItem Value="10">10 minutes</MudSelectItem>
                    <MudSelectItem Value="15">15 minutes</MudSelectItem>
                    <MudSelectItem Value="20">20 minutes</MudSelectItem>
                    <MudSelectItem Value="30">30 minutes</MudSelectItem>
                    <MudSelectItem Value="60">60 minutes</MudSelectItem>
                </MudSelect>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Duration</MudText>
                </div>
                <MudTextField @bind-Value="_model.DurationSeconds"
                              For="@(() => _model.DurationSeconds)"
                              Adornment="Adornment.End"
                              AdornmentText="seconds"
                              Disabled="@(_model.Mode != ChannelWatermarkMode.Intermittent)"
                              Immediate="true"/>
            </MudStack>
            <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                <div class="d-flex">
                    <MudText>Opacity</MudText>
                </div>
                <MudTextField @bind-Value="_model.Opacity"
                              For="@(() => _model.Opacity)"
                              Adornment="Adornment.End"
                              AdornmentText="%"
                              Disabled="@(_model.Mode == ChannelWatermarkMode.None)"
                              Immediate="true"/>
            </MudStack>
        </MudContainer>
    </div>
</MudForm>

@code {
    private readonly CancellationTokenSource _cts = new();

    [Parameter]
    public int Id { get; set; }

    private WatermarkEditViewModel _model = new();
    private readonly WatermarkEditViewModelValidator _validator = new();
    private MudForm _form;

    public void Dispose()
    {
        _cts.Cancel();
        _cts.Dispose();
    }

    protected override async Task OnParametersSetAsync()
    {
        if (IsEdit)
        {
            Option<WatermarkViewModel> watermark = await Mediator.Send(new GetWatermarkById(Id), _cts.Token);
            watermark.Match(
                watermarkViewModel => _model = new WatermarkEditViewModel(watermarkViewModel),
                () => NavigationManager.NavigateTo("404"));
        }
        else
        {
            _model = new WatermarkEditViewModel
            {
                Name = string.Empty,
                Mode = ChannelWatermarkMode.Permanent,
                Image = ArtworkContentTypeModel.None,
                Location = WatermarkLocation.BottomRight,
                Size = WatermarkSize.Scaled,
                Width = 15,
                HorizontalMargin = 5,
                VerticalMargin = 5,
                FrequencyMinutes = 15,
                DurationSeconds = 15,
                Opacity = 100,
                PlaceWithinSourceContent = false
            };
        }
    }

    private bool IsEdit => Id != 0;

    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("Unexpected error saving watermark");
                    Logger.LogError("Unexpected error saving watermark: {Error}", error.Value);
                },
                () => NavigationManager.NavigateTo("watermarks"));
        }
    }

    private async Task UploadWatermark(InputFileChangeEventArgs e)
    {
        try
        {
            Either<BaseError, string> maybeCacheFileName = await Mediator.Send(
                new SaveArtworkToDisk(e.File.OpenReadStream(10 * 1024 * 1024), ArtworkKind.Watermark, e.File.ContentType),
                _cts.Token);
            maybeCacheFileName.Match(
                relativeFileName =>
                {
                    _model.Image = new ArtworkContentTypeModel(relativeFileName, e.File.ContentType);
                    StateHasChanged();
                },
                error =>
                {
                    Snackbar.Add($"Unexpected error saving watermark: {error.Value}", Severity.Error);
                    Logger.LogError("Unexpected error saving watermark: {Error}", error.Value);
                });
        }
        catch (IOException)
        {
            Snackbar.Add("Watermark exceeds maximum allowed file size of 10 MB", Severity.Error);
            Logger.LogError("Watermark exceeds maximum allowed file size of 10 MB");
        }
        catch (Exception ex)
        {
            Snackbar.Add($"Unexpected error saving watermark: {ex.Message}", Severity.Error);
            Logger.LogError("Unexpected error saving watermark: {Error}", ex.Message);
        }
    }

}