better image preview window

This commit is contained in:
EugeneTes
2026-03-19 09:26:05 +01:00
parent b686343811
commit 7173248532
3 changed files with 71 additions and 38 deletions

View File

@@ -1,40 +1,47 @@
@using MudBlazor
@implements IDisposable
<MudDialog>
<MudDialog Class="image-preview-dlg" DefaultFocus="DefaultFocus.None">
<DialogContent>
@if (ViewModel != null)
{
<div class="image-preview-dialog">
<div class="imgpreview-label">@ViewModel.ImageName</div>
<div class="imgpreview-toolbar">
<div class="imgpreview-toolbar-left">
@if (ViewModel.IsPreviousImageEnabled)
{
<MudButton Variant="Variant.Outlined" Color="Color.Primary" Class="imgpreview-btn"
OnClick="OnPrevious">Previous image</MudButton>
}
<MudButton Variant="Variant.Outlined" Color="Color.Primary" Class="imgpreview-btn"
OnClick="OnSwitchView">@(ViewModel.OriginalView ? "Show Analysis" : "Show Original")</MudButton>
</div>
<div class="imgpreview-toolbar-right">
@if (ViewModel.LearnButtonVisible)
{
<MudButton Variant="Variant.Outlined" Color="Color.Primary" Class="imgpreview-btn"
OnClick="OnLearn">Learn this</MudButton>
}
@if (ViewModel.IsNextImageEnabled)
{
<MudButton Variant="Variant.Outlined" Color="Color.Primary" Class="imgpreview-btn"
OnClick="OnNext">Next image</MudButton>
}
<MudButton Variant="Variant.Filled" Color="Color.Primary" Class="imgpreview-btn"
OnClick="Close">Close</MudButton>
</div>
</div>
<div class="imgpreview-image-area">
@{
var imageUri = ViewModel.ImageAnalysis?.ToBase64DataUri();
}
@if (!string.IsNullOrEmpty(imageUri))
{
<img src="@imageUri" alt="@ViewModel.ImageName" class="image-preview-img" />
<img src="@imageUri" alt="@ViewModel.ImageName" class="imgpreview-image" />
}
<div class="image-preview-info">
<MudText Typo="Typo.subtitle1">@ViewModel.ImageName</MudText>
</div>
<div class="image-preview-actions">
<MudButton Variant="Variant.Outlined" Disabled="@(!ViewModel.IsPreviousImageEnabled)"
OnClick="OnPrevious">Previous</MudButton>
<MudButton Variant="Variant.Outlined"
OnClick="OnSwitchView">@(ViewModel.OriginalView ? "Analysis" : "Original")</MudButton>
<MudButton Variant="Variant.Outlined" Disabled="@(!ViewModel.IsNextImageEnabled)"
OnClick="OnNext">Next</MudButton>
@if (ViewModel.LearnButtonVisible)
{
<MudButton Variant="Variant.Filled" Color="Color.Primary"
OnClick="OnLearn">Learn</MudButton>
}
</div>
</div>
}
</DialogContent>
<DialogActions>
<MudButton OnClick="Close">Close</MudButton>
</DialogActions>
</MudDialog>
@code {