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 18:53:14 +03:00
parent 5a8ae3d680
commit 280c164626
12 changed files with 203 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -12,7 +12,7 @@
@if (CanPlay && (_isHovered || IsCurrentTrackPlaying))
{
<MudItem class="play-overlay"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; border-radius: 4px;">
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; border-radius: 4px; transition: opacity 0.2s ease; cursor: pointer;">
<MudIconButton Icon="@(IsCurrentTrackPlaying? Icons.Material.Filled.Pause : Icons.Material.Filled.PlayArrow)"
Color="Color.Inherit"
Size="Size.Large"

48
PlaylistShared.Pwa/Components/SharedPlaylist/AddTrackSection.razor
View File

@@ -40,14 +40,14 @@
{
<MudExpansionPanels>
@* Секция исполнителей *@
@if (ShouldShowSection(TrackSearchType.Artist))
@if (_searchResult?.Artists != null)
{
<MudExpansionPanel Text="Исполнители" Expanded="true">
<MudGrid>
@foreach (var artist in _searchResult.Artists!)
@foreach (var artist in _searchResult.Artists)
{
<MudItem xs="12" sm="6" md="4" lg="3">
<ArtistCard Item="artist" OnClick="() => SearchTracksByEntity(artist.Id, TrackSearchType.Artist)" />
<MudItem xs="12" sm="6" md="3" lg="2">
<ArtistCard Item="artist" OnClick="() => SearchTracksByEntity(artist.Id, artist.Name, TrackSearchType.Artist)" />
</MudItem>
}
</MudGrid>
@@ -55,14 +55,14 @@
}
@* Секция альбомов *@
@if (ShouldShowSection(TrackSearchType.Album))
@if (_searchResult?.Albums != null)
{
<MudExpansionPanel Text="Альбомы" Expanded="true">
<MudGrid>
@foreach (var album in _searchResult.Albums!)
@foreach (var album in _searchResult.Albums)
{
<MudItem xs="12" sm="6" md="4" lg="3">
<AddTrackSection Item="album" OnClick="() => SearchTracksByEntity(album.Id, TrackSearchType.Album)" />
<MudItem xs="12" sm="6" md="3" lg="2">
<AlbumCard Item="album" OnClick="() => SearchTracksByEntity(album.Id, album.Title, TrackSearchType.Album)" />
</MudItem>
}
</MudGrid>
@@ -70,14 +70,14 @@
}
@* Секция плейлистов *@
@if (ShouldShowSection(TrackSearchType.Playlist))
@if (_searchResult?.Playlists != null)
{
<MudExpansionPanel Text="Плейлисты" Expanded="true">
<MudGrid>
@foreach (var playlist in _searchResult.Playlists!)
@foreach (var playlist in _searchResult.Playlists)
{
<MudItem xs="12" sm="6" md="4" lg="3">
<PlaylistCard Item="playlist" OnClick="() => SearchTracksByEntity(playlist.Kind, TrackSearchType.Playlist)" />
<MudItem xs="12" sm="6" md="3" lg="2">
<PlaylistCard Item="playlist" OnClick="() => SearchTracksByEntity(playlist.Uuid, playlist.Title, TrackSearchType.Playlist)" />
</MudItem>
}
</MudGrid>
@@ -85,7 +85,7 @@
}
@* Секция треков *@
@if (ShouldShowSection(TrackSearchType.Track))
@if (_searchResult?.Tracks != null)
{
<MudExpansionPanel Text="Треки" Expanded="true">
<MudTable Items="@_searchResult.Tracks"
@@ -123,22 +123,9 @@
private string _searchQuery = "";
private bool _isSearching = false;
private bool _isFirstSearch = true;
private TrackSearchType _searchType = TrackSearchType.All;
private YandexSearchResult? _searchResult = null;
private bool ShouldShowSection(TrackSearchType sectionType)
{
return sectionType switch
{
TrackSearchType.Track => _searchResult?.Tracks?.Any() == true,
TrackSearchType.Album => _searchResult?.Albums?.Any() == true,
TrackSearchType.Playlist => _searchResult?.Playlists?.Any() == true,
TrackSearchType.Artist => _searchResult?.Artists?.Any() == true,
_ => false
};
}
private async Task OnSearchQueryChanged()
{
await SearchTracks(byId: false);
@@ -155,7 +142,6 @@
if (string.IsNullOrWhiteSpace(query))
{
_searchResult = null;
_isFirstSearch = true;
return;
}
@@ -176,7 +162,6 @@
}
}
_isFirstSearch = false;
_isSearching = true;
_searchResult = null;
StateHasChanged();
@@ -212,10 +197,11 @@
}
}
private async Task SearchTracksByEntity(string entityId, TrackSearchType entityType)
private async Task SearchTracksByEntity(string entityId, string title, TrackSearchType entityType)
{
// Переключаем тип на треки и ищем по ID
_searchType = TrackSearchType.Track;
// Переключаем тип и ищем по ID
_searchType = entityType;
_searchQuery = title;
await SearchTracks(byId: true, forcedQuery: entityId);
}

16
PlaylistShared.Pwa/Components/SharedPlaylist/Cards/AlbumCard.razor
View File

@@ -1,9 +1,11 @@
@using PlaylistShared.Shared.Yandex
<MudPaper Class="d-flex flex-column align-center pa-2 cursor-pointer" Elevation="0" OnClick="OnClick.InvokeAsync">
<MudItem Class="d-flex flex-column align-center pa-2 cursor-pointer" Elevation="0" @onclick="HandleClick">
@if (!string.IsNullOrEmpty(Item.CoverUrl))
{
<MudAvatar Image="@Item.CoverUrl.FormatCoverUrl(Size, Size)" Size="MudBlazor.Size.Large" />
<MudAvatar Size="MudBlazor.Size.Large">
<MudImage Src="@Item.CoverUrl.FormatCoverUrl(Size, Size)" />
</MudAvatar>
}
else
{
@@ -15,10 +17,18 @@
<MudText Typo="Typo.caption" Align="Align.Center" Color="Color.Secondary">
@string.Join(", ", Item.Artists.Select(a => a.Name))
</MudText>
</MudPaper>
</MudItem>
@code {
[Parameter] public YandexAlbum Item { get; set; } = null!;
[Parameter] public EventCallback OnClick { get; set; }
[Parameter] public int Size { get; set; } = 50;
private async Task HandleClick()
{
if (OnClick.HasDelegate)
{
await OnClick.InvokeAsync();
}
}
}

16
PlaylistShared.Pwa/Components/SharedPlaylist/Cards/ArtistCard.razor
View File

@@ -1,9 +1,11 @@
@using PlaylistShared.Shared.Yandex
<MudPaper Class="d-flex flex-column align-center pa-2 cursor-pointer" Elevation="0" OnClick="OnClick.InvokeAsync">
<MudItem Class="d-flex flex-column align-center pa-2 cursor-pointer" @onclick="HandleClick">
@if (!string.IsNullOrEmpty(Item.CoverUrl))
{
<MudAvatar Image="@Item.CoverUrl.FormatCoverUrl(Size, Size)" Size="MudBlazor.Size.Large" />
<MudAvatar Size="MudBlazor.Size.Large">
<MudImage Src="@Item.CoverUrl.FormatCoverUrl(Size, Size)" />
</MudAvatar>
}
else
{
@@ -12,10 +14,18 @@
</MudAvatar>
}
<MudText Typo="Typo.body2" Align="Align.Center" Class="mt-2">@Item.Name</MudText>
</MudPaper>
</MudItem>
@code {
[Parameter] public YandexArtist Item { get; set; } = null!;
[Parameter] public EventCallback OnClick { get; set; }
[Parameter] public int Size { get; set; } = 50;
private async Task HandleClick()
{
if (OnClick.HasDelegate)
{
await OnClick.InvokeAsync();
}
}
}

16
PlaylistShared.Pwa/Components/SharedPlaylist/Cards/PlaylistCard.razor
View File

@@ -1,9 +1,11 @@
@using PlaylistShared.Shared.Yandex
<MudPaper Class="d-flex flex-column align-center pa-2 cursor-pointer" Elevation="0" OnClick="OnClick.InvokeAsync">
<MudItem Class="d-flex flex-column align-center pa-2 cursor-pointer" Elevation="0" onclick="HandleClick">
@if (!string.IsNullOrEmpty(Item.CoverUrl))
{
<MudAvatar Image="@Item.CoverUrl.FormatCoverUrl(Size, Size)" Size="MudBlazor.Size.Large" />
<MudAvatar Size="MudBlazor.Size.Large">
<MudImage Src="@Item.CoverUrl.FormatCoverUrl(Size, Size)" />
</MudAvatar>
}
else
{
@@ -12,10 +14,18 @@
</MudAvatar>
}
<MudText Typo="Typo.body2" Align="Align.Center" Class="mt-2">@Item.Title</MudText>
</MudPaper>
</MudItem>
@code {
[Parameter] public YandexPlaylist Item { get; set; } = null!;
[Parameter] public EventCallback OnClick { get; set; }
[Parameter] public int Size { get; set; } = 50;
private async Task HandleClick()
{
if (OnClick.HasDelegate)
{
await OnClick.InvokeAsync();
}
}
}

46
PlaylistShared.Pwa/wwwroot/css/app.css
View File

@@ -109,41 +109,19 @@ code {
text-align: start;
}
.track-cover-container {
border-radius: 4px;
overflow: hidden;
transition: transform 0.2s ease;
/* Горизонтальный скролинг */
.horizontal-scroll {
overflow-x: auto;
scroll-snap-type: x mandatory;
overflow-y: hidden; /* отключаем вертикальный скролл */
cursor: grab;
}
.track-cover-container:hover {
transform: scale(1.05);
}
.play-overlay {
transition: opacity 0.2s ease;
cursor: pointer;
}
/* Фиксированный плеер внизу */
.fixed-player {
position: sticky;
display: flex;
bottom: 0;
width: 100%;
right: 0;
justify-content: center;
background-color: var(--mud-palette-background);
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
}
/* Отступ снизу, когда плеер виден */
.page-with-player {
padding-bottom: 80px; /* Высота плеера (подберите под свою тему) */
}
/* На мобильных устройствах можно уменьшить отступ */
@media (max-width: 600px) {
.page-with-player {
padding-bottom: 100px; /* если плеер выше на мобильных */
.horizontal-scroll:active {
cursor: grabbing;
}
/* Для WebKit (Chrome, Edge, Safari) можно включить горизонтальный скролл мышью */
.horizontal-scroll {
scrollbar-width: thin;
-webkit-overflow-scrolling: touch;
}