feat(mobile-ux): implement auto-hiding bars on scroll and widen reader container

This commit is contained in:
2026-06-15 19:25:44 +02:00
parent c94e8f0acb
commit 4432c901f0
7 changed files with 80 additions and 4 deletions
@@ -20,10 +20,10 @@
@inject NavigationManager Navigation
@inject ILogger<ReaderCanvas> Logger
<div class="reader-canvas @(ThemeService.IsLightMode ? "theme-light" : "theme-dark")">
<div class="reader-canvas @(ThemeService.IsLightMode ? "theme-light" : "theme-dark") @(StateService.IsBarsHidden ? "immersive-zen-mode" : "")">
@if (_isMobile && ViewModel != null)
{
<header class="nexus-mobile-reader-header">
<header class="nexus-mobile-reader-header @(StateService.IsBarsHidden ? "immersive-zen-mode" : "")">
<button class="nexus-mobile-escape-btn" @onclick="HandleEscape" aria-label="Powrót do pulpitu">
<NexusIcon Name="chevron-left" Size="18" />
<span>Pulpit</span>
@@ -130,6 +130,7 @@
ThemeService.OnThemeChanged += HandleThemeChanged;
NavigationService.OnNavigationChanged += OnNavigationChanged;
QuizService.OnQuizUpdated += HandleUpdate;
StateService.OnBarsHiddenChanged += HandleBarsHiddenChanged;
InteractionService.OnScrollToBlockRequested += HandleScrollRequested;
InteractionService.OnHighlightBlockRequested += HandleHighlightRequested;
@@ -250,7 +251,7 @@
if (_selfReference != null)
{
await module.InvokeVoidAsync("initObserver", _selfReference, ".reader-flow-container", ".block-wrapper");
_scrollListenerReference = await module.InvokeAsync<IJSObjectReference>("initScrollListener", _selfReference, ".reader-flow-container");
_scrollListenerReference = await module.InvokeAsync<IJSObjectReference>("initScrollListener", _selfReference, ".reader-canvas");
}
}
catch (Exception ex)
@@ -266,6 +267,17 @@
await InteractionService.NotifyScrollPercentChanged(percent);
}
[JSInvokable]
public async Task HandleScrollDelta(bool hideBars)
{
if (StateService.IsBarsHidden != hideBars)
{
StateService.IsBarsHidden = hideBars;
}
}
private Task HandleBarsHiddenChanged() => InvokeAsync(StateHasChanged);
[JSInvokable]
public async Task HandleBlockReached(string blockId, string content)
{
@@ -471,6 +483,7 @@
ThemeService.OnThemeChanged -= HandleThemeChanged;
NavigationService.OnNavigationChanged -= OnNavigationChanged;
QuizService.OnQuizUpdated -= HandleUpdate;
StateService.OnBarsHiddenChanged -= HandleBarsHiddenChanged;
InteractionService.OnScrollToBlockRequested -= HandleScrollRequested;
InteractionService.OnHighlightBlockRequested -= HandleHighlightRequested;