daniel/deepdrft
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 13 Wiki Activity

fix: enable player controls on load, clear track selection on stop and end-of-track

Browse Source 
Add StateChanged multicast event to IPlayerService so AudioPlayerBar and TracksView
re-render themselves without relying on the IsFixed cascade re-render path. Clear
_selectedTrack in TracksView when IsLoaded drops (stop, unload, end-of-track). Set
IsLoaded=false in OnPlaybackEndCallback so end-of-track triggers the same clear path.
Add JS-module readiness probe in AudioInteropService; delete dead TS and buffered C#
path; consolidate GetPlayIcon/FormatTime helpers; fix misleading minimize dock icon.
This commit is contained in:
daniel-c-harvey
2026-06-03 14:30:15 -04:00
parent b8a51e4656
commit 7d49c64a5d
9 changed files with 135 additions and 443 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor
+2 -2
View File
@@ -2,8 +2,8 @@
{
<div class="minimized-dock d-flex align-center justify-center"
@onclick="@ToggleMinimized">
<MudIconButton Icon="@GetPlayIcon()"
Color="Color.Primary"
<MudIconButton Icon="@Icons.Material.Filled.ExpandLess"
Color="Color.Primary"
Size="Size.Large"
Class="minimized-button"
OnClick="@ToggleMinimized"/>
DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.cs
+18 -13
View File
@@ -15,6 +15,7 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
private double _seekPosition = 0;
private bool _isDesktop = true;
private Guid _viewportSubscriptionId;
private IStreamingPlayerService? _subscribedService;
private bool IsLoaded => PlayerService?.IsLoaded ?? false;
private bool IsLoading => PlayerService?.IsLoading ?? false;
@@ -42,14 +43,23 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
{
// PlayerService is cascaded by AudioPlayerProvider; once it arrives,
// wire our track-selection handler. The provider owns OnStateChanged —
// we intentionally do NOT wrap or replace it. Re-renders propagate
// from the provider via the standard Blazor child render path.
if (PlayerService != null)
// we intentionally do NOT wrap or replace it. Because the cascade is
// IsFixed, the provider's re-render does NOT reliably re-render this bar
// (it has no incoming parameters that change), so we subscribe to the
// multicast StateChanged side-channel to re-render ourselves.
if (PlayerService != null && !ReferenceEquals(PlayerService, _subscribedService))
{
if (_subscribedService != null)
_subscribedService.StateChanged -= OnPlayerStateChanged;
PlayerService.OnTrackSelected = new EventCallback(this, Expand);
PlayerService.StateChanged += OnPlayerStateChanged;
_subscribedService = PlayerService;
}
}
private void OnPlayerStateChanged() => InvokeAsync(StateHasChanged);
private async Task Expand()
{
if (_isMinimized)
@@ -58,11 +68,6 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
StateHasChanged();
}
}
private static string FormatTime(double seconds)
{
var timeSpan = TimeSpan.FromSeconds(seconds);
return timeSpan.ToString(timeSpan.TotalHours >= 1 ? @"h\:mm\:ss" : @"m\:ss");
}
private async Task TogglePlayPause()
{
@@ -127,11 +132,6 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
}
}
private string GetPlayIcon()
{
return IsPlaying ? Icons.Material.Filled.Pause : Icons.Material.Filled.PlayArrow;
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
@@ -156,6 +156,11 @@ public partial class AudioPlayerBar : ComponentBase, IAsyncDisposable
public async ValueTask DisposeAsync()
{
if (_subscribedService != null)
{
_subscribedService.StateChanged -= OnPlayerStateChanged;
_subscribedService = null;
}
await BrowserViewportService.UnsubscribeAsync(_viewportSubscriptionId);
}
}
DeepDrftPublic.Client/Pages/TracksView.razor.cs
+42 -3
View File
@@ -6,21 +6,51 @@ using Models.Common;
namespace DeepDrftPublic.Client.Pages;
public partial class TracksView : ComponentBase
public partial class TracksView : ComponentBase, IDisposable
{
[Inject] public required TracksViewModel ViewModel { get; set; }
[CascadingParameter] public required IStreamingPlayerService PlayerService { get; set; }
private TrackDto? _selectedTrack = null;
private int _clickCount = 0;
private string _lifecycleStatus = "Not initialized";
private IStreamingPlayerService? _subscribedService;
protected override async Task OnInitializedAsync()
{
_lifecycleStatus = "OnInitializedAsync called";
await SetPage(1);
}
protected override void OnParametersSet()
{
// The Stop/Close buttons on the player bar reset the player directly,
// bypassing PlayTrack — so the gallery's selection must follow player
// state rather than only its own clicks. Subscribe to the multicast
// side-channel (the cascade is IsFixed, so provider re-renders don't
// reach us) and clear the highlight when nothing is loaded.
if (PlayerService != null && !ReferenceEquals(PlayerService, _subscribedService))
{
if (_subscribedService != null)
_subscribedService.StateChanged -= OnPlayerStateChanged;
PlayerService.StateChanged += OnPlayerStateChanged;
_subscribedService = PlayerService;
}
}
private void OnPlayerStateChanged()
{
// Sync the gallery selection to the player. When the player is no longer
// loaded (stopped/closed/ended) drop the highlight; guard against a
// redundant re-render when nothing actually changed.
if (!PlayerService.IsLoaded && _selectedTrack != null)
{
_selectedTrack = null;
InvokeAsync(StateHasChanged);
}
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
@@ -62,4 +92,13 @@ public partial class TracksView : ComponentBase
_selectedTrack = track;
}
public void Dispose()
{
if (_subscribedService != null)
{
_subscribedService.StateChanged -= OnPlayerStateChanged;
_subscribedService = null;
}
}
}
DeepDrftPublic.Client/Services/AudioInteropService.cs
+34 -20
View File
@@ -16,6 +16,15 @@ public class AudioInteropService : IAsyncDisposable
{
try
{
if (!await WaitForModuleReadyAsync())
{
return new AudioOperationResult
{
Success = false,
Error = "Audio engine failed to load (timed out waiting for DeepDrftAudio module)."
};
}
var result = await _jsRuntime.InvokeAsync<AudioOperationResult>("DeepDrftAudio.createPlayer", playerId);
return result;
}
@@ -25,19 +34,34 @@ public class AudioInteropService : IAsyncDisposable
}
}
public async Task<AudioOperationResult> InitializeBufferedPlayerAsync(string playerId)
// The audio engine is loaded as an ES module via a deferred `import(...)` in
// App.razor, so on a slow WASM boot or cache miss it may not have executed by
// the time the first track is selected. Poll its readiness probe (tolerating
// the window before `window.DeepDrftAudio` even exists, when the call throws)
// up to a short timeout before the first interop call.
private async Task<bool> WaitForModuleReadyAsync()
{
return await InvokeJsAsync<AudioOperationResult>("DeepDrftAudio.initializeBufferedPlayer", playerId);
}
const int timeoutMs = 5000;
const int pollIntervalMs = 50;
var elapsed = 0;
public async Task<AudioOperationResult> AppendAudioBlockAsync(string playerId, byte[] audioBlock)
{
return await InvokeJsAsync<AudioOperationResult>("DeepDrftAudio.appendAudioBlock", playerId, audioBlock);
}
while (elapsed < timeoutMs)
{
try
{
if (await _jsRuntime.InvokeAsync<bool>("DeepDrftAudio.isReady"))
return true;
}
catch
{
// window.DeepDrftAudio not attached yet — keep polling until timeout.
}
public async Task<AudioLoadResult> FinalizeAudioBufferAsync(string playerId)
{
return await InvokeJsAsync<AudioLoadResult>("DeepDrftAudio.finalizeAudioBuffer", playerId);
await Task.Delay(pollIntervalMs);
elapsed += pollIntervalMs;
}
return false;
}
// Streaming methods
@@ -238,8 +262,6 @@ public class AudioInteropService : IAsyncDisposable
{
if (typeof(T) == typeof(AudioOperationResult))
return (T)(object)new AudioOperationResult { Success = false, Error = ex.Message };
if (typeof(T) == typeof(AudioLoadResult))
return (T)(object)new AudioLoadResult { Success = false, Error = ex.Message };
if (typeof(T) == typeof(StreamingResult))
return (T)(object)new StreamingResult { Success = false, Error = ex.Message };
if (typeof(T) == typeof(SeekResult))
@@ -331,14 +353,6 @@ public class SeekResult : AudioOperationResult
public long ByteOffset { get; set; }
}
public class AudioLoadResult : AudioOperationResult
{
public double Duration { get; set; }
public int SampleRate { get; set; }
public int NumberOfChannels { get; set; }
public double LoadProgress { get; set; }
}
public class StreamingResult : AudioOperationResult
{
public bool CanStartStreaming { get; set; }
DeepDrftPublic.Client/Services/AudioPlayerService.cs
+16 -129
View File
@@ -2,7 +2,6 @@ using DeepDrftModels.DTOs;
using DeepDrftPublic.Client.Clients;
using Microsoft.AspNetCore.Components;
using NetBlocks.Models;
using System.Buffers;
namespace DeepDrftPublic.Client.Services;
@@ -38,6 +37,9 @@ public abstract class AudioPlayerService : IPlayerService, IAsyncDisposable
public EventCallback? OnStateChanged { get; set; }
public EventCallback? OnTrackSelected { get; set; }
/// <inheritdoc />
public event Action? StateChanged;
protected AudioPlayerService(AudioInteropService audioInterop, TrackMediaClient trackMediaClient)
{
_audioInterop = audioInterop;
@@ -74,134 +76,16 @@ public abstract class AudioPlayerService : IPlayerService, IAsyncDisposable
}
}
public virtual async Task SelectTrack(TrackDto track)
{
await EnsureInitializedAsync();
await NotifyStateChanged();
if (OnTrackSelected.HasValue)
await OnTrackSelected.Value.InvokeAsync();
await LoadTrack(track);
await NotifyStateChanged();
}
private async Task LoadTrack(TrackDto track)
{
try
{
if (IsLoading) return;
if (IsPlaying || IsPaused)
{
await Unload();
}
// Reset state to indicate loading has started
ErrorMessage = null;
LoadProgress = 0;
IsLoaded = false;
IsLoading = true;
Duration = null;
CurrentTime = 0;
await NotifyStateChanged();
var loadResult = await _audioInterop.InitializeBufferedPlayerAsync(PlayerId);
if (loadResult?.Success != true)
{
ErrorMessage = $"Failed to initialize audio buffer: {loadResult?.Error ?? "Unknown error"}";
return;
}
var mediaResult = await _trackMediaClient.GetTrackMedia(track.EntryKey);
if (!mediaResult.Success)
{
ErrorMessage = mediaResult.GetMessage();
return;
}
if (mediaResult.Value == null)
{
ErrorMessage = "No audio returned from server";
return;
}
TrackMediaResponse audio = mediaResult.Value;
await StreamAudio(audio);
}
catch (Exception ex)
{
ErrorMessage = $"Error loading audio: {ex.Message}";
LoadProgress = 0;
IsLoaded = false;
}
finally
{
IsLoading = false;
await NotifyStateChanged();
}
}
private async Task StreamAudio(TrackMediaResponse audio)
{
const int bufferSize = 32 * 1024;
var rentedBuffer = ArrayPool<byte>.Shared.Rent(bufferSize);
try
{
long totalBytesRead = 0;
int currentBytes;
do
{
currentBytes = await audio.Stream.ReadAsync(rentedBuffer, 0, bufferSize);
if (currentBytes > 0)
{
totalBytesRead += currentBytes;
// Slice to actual bytes read before sending to interop
var chunk = rentedBuffer[..currentBytes];
var appendResult = await _audioInterop.AppendAudioBlockAsync(PlayerId, chunk);
if (!appendResult.Success)
{
throw new Exception($"Failed to append audio block: {appendResult.Error}");
}
if (audio.ContentLength > 0)
{
LoadProgress = Math.Min(1.0, (double)totalBytesRead / audio.ContentLength);
await NotifyStateChanged();
}
}
} while (currentBytes > 0);
var finalizeResult = await _audioInterop.FinalizeAudioBufferAsync(PlayerId);
if (!finalizeResult.Success)
{
throw new Exception($"Failed to finalize audio buffer: {finalizeResult.Error}");
}
Duration = finalizeResult.Duration;
LoadProgress = 1.0;
IsLoaded = true;
ErrorMessage = null;
await NotifyStateChanged();
}
catch (Exception ex)
{
ErrorMessage = $"Error streaming audio: {ex.Message}";
LoadProgress = 0;
IsLoaded = false;
await NotifyStateChanged();
throw;
}
finally
{
ArrayPool<byte>.Shared.Return(rentedBuffer);
}
}
/// <summary>
/// Selecting a track is only supported through the streaming path. The former
/// base buffered implementation drove JS no-ops (<c>initializeBufferedPlayer</c> /
/// <c>appendAudioBlock</c> / <c>finalizeAudioBuffer</c>) and silently played
/// silence. Subclasses must override with a real load path (see
/// <see cref="StreamingAudioPlayerService.SelectTrack"/>).
/// </summary>
public virtual Task SelectTrack(TrackDto track) =>
throw new NotSupportedException(
"The base buffered player path is not implemented. Use a streaming player (SelectTrackStreaming).");
public async Task TogglePlayPause()
{
@@ -377,7 +261,9 @@ public abstract class AudioPlayerService : IPlayerService, IAsyncDisposable
{
IsPlaying = false;
IsPaused = false;
IsLoaded = false;
CurrentTime = 0;
Duration = null;
await NotifyStateChanged();
}
@@ -394,6 +280,7 @@ public abstract class AudioPlayerService : IPlayerService, IAsyncDisposable
{
if (OnStateChanged.HasValue)
await OnStateChanged.Value.InvokeAsync();
StateChanged?.Invoke();
}
protected async Task NotifyTrackSelected()
DeepDrftPublic.Client/Services/IPlayerService.cs
+10
View File
@@ -22,6 +22,16 @@ public interface IPlayerService
// Events for UI updates
EventCallback? OnStateChanged { get; set; }
EventCallback? OnTrackSelected { get; set; }
/// <summary>
/// Multicast side-channel for state changes. The provider owns the single
/// <see cref="OnStateChanged"/> EventCallback (it drives the provider re-render);
/// cascade consumers that read state directly off this service — and so are not
/// re-rendered by the provider's render when the cascade is <c>IsFixed</c> —
/// subscribe here to re-render themselves. Fires on the same cadence as
/// <see cref="OnStateChanged"/> (throttled to ~10/s during streaming).
/// </summary>
event Action? StateChanged;
// Control methods
Task InitializeAsync();