FrigaT/PlaylistShared
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Новый плеер

Browse Source
This commit is contained in:
FrigaT
2026-04-16 15:37:02 +03:00
parent a634986ac0
commit 974fb0f538
5 changed files with 62 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
PlaylistShared.Pwa/Components/Common/TrackCoverWithPlay.razor
View File

@@ -1,11 +1,12 @@
@using Microsoft.AspNetCore.Components.Web
@using PlaylistShared.Shared.DTO
@inject IAudioPlayerService AudioPlayerService
<MudItem @onmouseenter="HandleMouseEnter"
@onmouseleave="HandleMouseLeave"
style="position: relative; display: inline-block; cursor: pointer; border-radius: 4px; overflow: hidden;">
<MudImage Src="@CoverUrl.FormatCoverUrl(Width, Height)" Height="@Height" Width="@Width" Class="rounded" Style="display: block;" />
<MudImage Src="@Track?.CoverUri.FormatCoverUrl(Width, Height)" Height="@Height" Width="@Width" Class="rounded" Style="display: block;" />
@if (CanPlay && (_isHovered || IsCurrentTrackPlaying))
{
@@ -20,8 +21,7 @@
</MudItem>
@code {
[Parameter] public string CoverUrl { get; set; } = string.Empty;
[Parameter] public string TrackTitle { get; set; } = string.Empty;
[Parameter] public YandexTrack? Track { get; set; } = null;
[Parameter] public string TrackId { get; set; } = string.Empty;
[Parameter] public int Height { get; set; } = 50;
[Parameter] public int Width { get; set; } = 50;
@@ -53,8 +53,7 @@
await AudioPlayerService.LoadAndPlayAsync(
trackId: TrackId,
playlistShareToken: playlistShareToken,
title: TrackTitle,
coverUrl: CoverUrl);
track: Track);
}
}

5
PlaylistShared.Pwa/Components/Common/TrackItem.razor
View File

@@ -5,9 +5,8 @@
<MudStack Row AlignItems="AlignItems.Center">
<!-- Обложка с фиксированной шириной -->
<MudItem>
<TrackCoverWithPlay CoverUrl="@Track.CoverUri"
TrackId="@Track.TrackId"
TrackTitle="@Track.Title"
<TrackCoverWithPlay TrackId="@Track.TrackId"
Track="@Track"
PlaylistShareToken="@PlaylistShareToken"
CanPlay="@CanPlay"
Width="40" Height="40" />

63
PlaylistShared.Pwa/Components/Global/AudioPlayer.razor
View File

@@ -7,20 +7,21 @@
@inject ISnackbar Snackbar
@inject HttpClient Http
<MudPaper Class="pa-2" Elevation="0" Width="100%" Style="background-color: rgba(0,0,0,0.05); border-radius: 8px;">
<MudPaper Class="pa-2 rounded" Elevation="0" Width="100%" Style="background-color: rgba(0,0,0,0.05);">
<MudStack Row AlignItems="AlignItems.Center" Wrap="Wrap.Wrap">
<!-- Кнопки управления -->
<MudItem @onmouseenter="() => { _isPlayHovered = true; }"
@onmouseleave="() => { _isPlayHovered = false; }"
style="position: relative; display: inline-block; cursor: pointer; border-radius: 4px; overflow: hidden; width: 50px; height: 50px;">
Class="relative d-inline-block rounded-sm overflow-hidden"
style="cursor: pointer; width: 50px; height: 50px;">
@if (!string.IsNullOrEmpty(AudioPlayerService.CurrentTrackCoverUrl))
@if (!string.IsNullOrEmpty(AudioPlayerService.CurrentTrack?.CoverUri))
{
<MudImage Src="@AudioPlayerService.CurrentTrackCoverUrl.FormatCoverUrl(50, 50)" Height="50" Width="50" Class="rounded" Style="display: block;" />
<MudImage Src="@AudioPlayerService.CurrentTrack.CoverUri.FormatCoverUrl(50, 50)" Height="50" Width="50" Class="rounded d-block" />
}
<MudItem class="play-overlay"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: transparent; display: flex; align-items: center; justify-content: center; border-radius: 4px;">
<MudItem class="absolute d-flex align-center justify-center rounded"
style="top: 0; left: 0; right: 0; bottom: 0; background: transparent;">
<MudToggleIconButton Toggled="@AudioPlayerService.IsPlaying"
Icon="@Icons.Material.Filled.PlayArrow"
Color="@Color.Primary"
@@ -32,11 +33,11 @@
<!-- Название и прогресс -->
<MudStack AlignItems="AlignItems.Stretch" Class="d-flex flex-grow-1 relative overflow-hidden align-center rounded-sm" Style="height: 50px;">
<MudItem Class="absolute " style="top: 0; left: 0; right: 0; bottom: 0; z-index: 1;">
<TrackProgress Value="@AudioPlayerService.CurrentProgress"
Min="0" Max="100"
<MudItem Class="absolute" style="top: 0; left: 0; right: 0; bottom: 0; z-index: 1;">
<TrackProgress Value="@AudioPlayerService.CurrentTime"
Min="0" Max="@AudioPlayerService.TotalTime"
Height="50"
BufferValue="@_bufferValue"
BufferValue="@_bufferSecond"
Color="Color.Primary"
Icon=""
Step="0.1"
@@ -45,11 +46,19 @@
ValueChanged="SeekTo" />
</MudItem>
<MudStack Row AlignItems="AlignItems.Center" Class="px-3 relative pointer-events-none" Style="z-index: 2; width: 100%;">
<MudText Typo="Typo.body2" Style="font-weight: 600; text-shadow: 0px 0px 4px rgba(255,255,255,0.8);">
@AudioPlayerService.CurrentTrackTitle
<MudStack Row AlignItems="AlignItems.Center" Class="px-3 relative pointer-events-none" Style="z-index: 2; width: 100%; height: 100%;">
<MudStack AlignItems="AlignItems.Start" Spacing="0">
<MudText Typo="Typo.body2" Color="Color.Default" Style="font-weight: 600;">
@AudioPlayerService.CurrentTrack?.Title
</MudText>
<MudText Typo="Typo.body2" Style="font-weight: 600;">
@if (AudioPlayerService.CurrentTrack != null) @string.Join(", ", AudioPlayerService.CurrentTrack.Artists)
</MudText>
</MudStack>
<MudSpacer />
<MudText Typo="Typo.body2" Style="font-family: monospace; font-weight: 600;">
@AudioPlayerService.CurrentTimeString / @AudioPlayerService.TotalTimeString
</MudText>
@@ -93,7 +102,7 @@
// Громкость
private bool _volumeIsOpen;
private double _volumeBeforeMute;
private double _bufferValue;
private double _bufferSecond;
private bool _isPlayHovered;
@@ -123,6 +132,7 @@
_audioElement = await _audioModule.InvokeAsync<IJSObjectReference>("init", _audioId, DotNetObjectReference.Create(this));
}
#region Обработка JS
[JSInvokable]
public async Task OnAudioEnded()
{
@@ -141,19 +151,9 @@
[JSInvokable]
public async Task OnDownloadProgress(double second)
{
_bufferValue = second / AudioPlayerService.TotalTime * 100;
}
private async Task<bool> CheckAuthAsync()
{
var authState = await AuthProvider.GetAuthenticationStateAsync();
if (!authState.User.Identity?.IsAuthenticated == true)
{
Snackbar.Add("Воспроизведение доступно только авторизованным пользователям", Severity.Warning);
return false;
}
return true;
_bufferSecond = second;
}
#endregion
#region Обработка сервиса
private async Task OnServiceLoadAndPlay(string trackId, string? accessToken, string? sharedPlaylistId)
@@ -222,6 +222,17 @@
}
#endregion
private async Task<bool> CheckAuthAsync()
{
var authState = await AuthProvider.GetAuthenticationStateAsync();
if (!authState.User.Identity?.IsAuthenticated == true)
{
Snackbar.Add("Воспроизведение доступно только авторизованным пользователям", Severity.Warning);
return false;
}
return true;
}
private async Task OnVolumeHandleWheel(WheelEventArgs e)
{
// Изменяем громкость на 5 единиц за один тик колесика

27
PlaylistShared.Pwa/Services/AudioPlayerService.cs
View File

@@ -13,8 +13,7 @@ public class AudioPlayerService : IAudioPlayerService
private readonly PlayerStorage _playerStorage;
private string? _currentTrackId;
private string? _currentTrackTitle;
private string? _currentTrackCoverUrl;
private YandexTrack? _currentTrack;
private bool _isPlaying;
private double _currentVolume = 50;
private double _currentProgress;
@@ -24,8 +23,7 @@ public class AudioPlayerService : IAudioPlayerService
private string _totalTimeString = "0:00";
public string? CurrentTrackId => _currentTrackId;
public string? CurrentTrackTitle => _currentTrackTitle;
public string? CurrentTrackCoverUrl => _currentTrackCoverUrl;
public YandexTrack? CurrentTrack => _currentTrack;
public bool IsPlaying => _isPlaying;
public double CurrentVolume
{
@@ -65,7 +63,7 @@ public class AudioPlayerService : IAudioPlayerService
}
// Внешние команды (вызываются из компонентов)
public async Task LoadAndPlayAsync(string trackId, string? accessToken = null, string? playlistShareToken = null, string? title = null, string? coverUrl = null)
public async Task LoadAndPlayAsync(string trackId, string? accessToken = null, string? playlistShareToken = null, YandexTrack? track = null)
{
if (_currentTrackId == trackId)
{
@@ -88,13 +86,11 @@ public class AudioPlayerService : IAudioPlayerService
}
// Если title и coverUrl не переданы, нужно запросить через API
if (string.IsNullOrEmpty(title) || string.IsNullOrEmpty(coverUrl))
if (track is null)
{
try
{
var trackInfo = await GetTrackInfo(trackId, accessToken, playlistShareToken);
title = trackInfo?.Title;
coverUrl = trackInfo?.CoverUri;
track = await GetTrackInfo(trackId, accessToken, playlistShareToken);
}
catch (Exception ex)
{
@@ -103,9 +99,7 @@ public class AudioPlayerService : IAudioPlayerService
}
}
_currentTrackId = trackId;
_currentTrackTitle = title ?? "Неизвестный трек";
_currentTrackCoverUrl = coverUrl;
_currentTrack = track;
_isPlaying = true;
OnStateChanged?.Invoke();
OnLoadAndPlayRequested?.Invoke(trackId, accessToken, playlistShareToken);
@@ -125,10 +119,9 @@ public class AudioPlayerService : IAudioPlayerService
OnPauseRequested?.Invoke();
}
public async Task SeekToAsync(double percent)
public async Task SeekToAsync(double second)
{
var newTime = (percent / 100) * _totalTime;
OnSeekRequested?.Invoke(newTime);
OnSeekRequested?.Invoke(second);
}
public async Task SetVolumeAsync(double volume)
@@ -189,7 +182,7 @@ public class AudioPlayerService : IAudioPlayerService
/// <param name="accessToken"></param>
/// <param name="sharedPlaylistId"></param>
/// <returns></returns>
private async Task<(string? Title, string? CoverUri)?> GetTrackInfo(string trackId, string? accessToken, string? sharedPlaylistId)
private async Task<YandexTrack?> GetTrackInfo(string trackId, string? accessToken, string? sharedPlaylistId)
{
var url = $"/api/audio/track-info/{trackId}";
if (!string.IsNullOrEmpty(accessToken))
@@ -200,7 +193,7 @@ public class AudioPlayerService : IAudioPlayerService
var response = await _http.GetFromJsonAsync<ApiResponse<YandexTrack>>(url);
if (response?.Success == true)
{
return (response.Data.Title, response.Data.CoverUri);
return response.Data;
}
return null;
}

17
PlaylistShared.Pwa/Services/IAudioPlayerService.cs
View File

@@ -1,4 +1,6 @@
namespace PlaylistShared.Pwa.Services;
using PlaylistShared.Shared.DTO;
namespace PlaylistShared.Pwa.Services;
/// <summary>
/// Глобальный сервис управления аудиоплеером.
@@ -31,11 +33,8 @@ public interface IAudioPlayerService
/// <summary>Отформатированная общая длительность (мм:сс).</summary>
string TotalTimeString { get; }
/// <summary>Отформатированное название текущего трека.</summary>
string? CurrentTrackTitle { get; }
/// <summary>URL обложки текущего трека.</summary>
string? CurrentTrackCoverUrl { get; }
/// <summary>Текущий трек.</summary>
YandexTrack? CurrentTrack { get; }
#endregion
#region Команды управления (вызываются из компонентов)
@@ -45,7 +44,7 @@ public interface IAudioPlayerService
/// <param name="sharedPlaylistId">ID расшаренного плейлиста (для неавторизованного доступа).</param>
/// <param name="title">Название трека. (Если не передано, вызывает api для получения)</param>
/// <param name="coverUrl">URL обложки трека. (Если не передано, вызывает api для получения)</param>
Task LoadAndPlayAsync(string trackId, string? accessToken = null, string? playlistShareToken = null, string? title = null, string? coverUrl = null);
Task LoadAndPlayAsync(string trackId, string? accessToken = null, string? playlistShareToken = null, YandexTrack? track = null);
/// <summary>Воспроизвести (если трек загружен и на паузе).</summary>
Task PlayAsync();
@@ -53,8 +52,8 @@ public interface IAudioPlayerService
/// <summary>Поставить на паузу.</summary>
Task PauseAsync();
/// <summary>Перемотать на указанный процент (0–100).</summary>
Task SeekToAsync(double percent);
/// <summary>Перемотать на секунды.</summary>
Task SeekToAsync(double second);
/// <summary>Установить громкость (0–100).</summary>
Task SetVolumeAsync(double volume);