82 lines
2.8 KiB
Text
82 lines
2.8 KiB
Text
@inject IJSRuntime JS
|
|
@inject State State
|
|
@inject RestService api
|
|
@inject NavigationManager navigationManager
|
|
|
|
<div class="overlay @(Active ? "active" : string.Empty)" data-ui="#@id"></div>
|
|
<dialog id="@id" class="@(Active ? "active" : string.Empty)" open="@Active" style="overflow:auto;">
|
|
<h5>Choose a theme</h5>
|
|
<nav class="wrap max">
|
|
@if(themes != null) foreach(Theme theme in themes.Values) {
|
|
<a onclick="@(() => ClickTheme(theme))" class="min" style="text-decoration:none;">
|
|
<ThemeCard theme="@theme"></ThemeCard>
|
|
</a>
|
|
}
|
|
</nav>
|
|
<nav class="right-align no-space">
|
|
<button class="transparent link" data-ui="#@id">Cancel</button>
|
|
</nav>
|
|
</dialog>
|
|
|
|
<div class="overlay" data-ui="#@previewId"></div>
|
|
<dialog id="@previewId" style="overflow:auto;">
|
|
<h5 class="address">@activeTheme?.Name</h5>
|
|
<div class="max">
|
|
<p>@((MarkupString)(activeTheme?.Description ?? string.Empty)) A theme by <a href="@activeTheme?.AuthorUrl" target="_blank">@activeTheme?.Author</a>.</p>
|
|
@if(themePreview != null) {
|
|
<ExternalPageComponent id="profile_page" @ref="iframe" SrcString="@themePreview.ToString()"></ExternalPageComponent>
|
|
}
|
|
</div>
|
|
<nav class="right-align no-space">
|
|
<button class="transparent link" @onclick="CancelPreview">Back</button>
|
|
<button @onclick=UseTheme><i class="fa-solid fa-palette"></i> Use the @activeTheme?.Name theme</button>
|
|
</nav>
|
|
</dialog>
|
|
|
|
@code {
|
|
private Dictionary<string, Theme>? themes;
|
|
[Parameter]
|
|
public string? id { get; set; }
|
|
private string? previewId { get => $"{id}-preview"; }
|
|
[Parameter]
|
|
public bool Active { get; set; }
|
|
[Parameter]
|
|
public Action<Theme?>? onthemechanged { get; set; }
|
|
|
|
private Theme? activeTheme { get; set; }
|
|
private MarkupString? themePreview { get; set; }
|
|
private ExternalPageComponent iframe { get; set; }
|
|
|
|
protected override async Task OnInitializedAsync() {
|
|
await base.OnInitializedAsync();
|
|
activeTheme = null;
|
|
themes = await State.GetThemes();
|
|
await InvokeAsync(StateHasChanged);
|
|
}
|
|
|
|
public async Task ClickTheme(Theme theme) {
|
|
activeTheme = theme;
|
|
await InvokeAsync(StateHasChanged);
|
|
await JS.InvokeVoidAsync("ui", "#" + id);
|
|
await JS.InvokeVoidAsync("ui", "#" + previewId);
|
|
themePreview = await api.GetThemePreview(theme.Id);
|
|
await InvokeAsync(StateHasChanged);
|
|
@* iframe.SrcString = themePreview.ToString(); *@
|
|
await iframe.Reload();
|
|
}
|
|
|
|
public async Task CancelPreview() {
|
|
activeTheme = null;
|
|
await InvokeAsync(StateHasChanged);
|
|
await JS.InvokeVoidAsync("ui", "#" + previewId);
|
|
await JS.InvokeVoidAsync("ui", "#" + id);
|
|
}
|
|
|
|
public async Task UseTheme() {
|
|
// todo: update theme
|
|
onthemechanged?.Invoke(activeTheme);
|
|
activeTheme = null;
|
|
await InvokeAsync(StateHasChanged);
|
|
await JS.InvokeVoidAsync("ui", "#" + previewId);
|
|
}
|
|
}
|