- {title}
+ {title}
{#if explicit}
{/if}
@@ -491,6 +499,11 @@
border-radius: 9999px;
transform-origin: bottom;
animation: equalize 1s ease-in-out infinite;
+ animation-play-state: running;
+ }
+
+ .playing-indicator.paused .bar {
+ animation-play-state: paused;
}
.playing-indicator .bar:nth-child(1) {
diff --git a/src/lib/components/VirtualizedTrackList.svelte b/src/lib/components/VirtualizedTrackList.svelte
index 2308fc687..9655326b4 100644
--- a/src/lib/components/VirtualizedTrackList.svelte
+++ b/src/lib/components/VirtualizedTrackList.svelte
@@ -345,6 +345,7 @@
duration={formatDuration(getTrackDuration(item.track))}
quality={getQualityBadge(item.track)}
isPlaying={isPlaybackActive && activeTrackId === trackId}
+ isActiveTrack={activeTrackId === trackId}
isBlacklisted={trackBlacklisted}
selectable={selectable}
selected={selectedIds?.has(trackId) ?? false}
diff --git a/src/lib/components/views/AlbumDetailView.svelte b/src/lib/components/views/AlbumDetailView.svelte
index f9c36faae..5792f336b 100644
--- a/src/lib/components/views/AlbumDetailView.svelte
+++ b/src/lib/components/views/AlbumDetailView.svelte
@@ -643,7 +643,8 @@
duration={track.duration}
quality={track.quality}
explicit={track.parental_warning === true}
- isPlaying={activeTrackId === track.id}
+ isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isBlacklisted={trackBlacklisted}
selectable={multiSelectMode}
selected={multiSelectedIds.has(track.id)}
diff --git a/src/lib/components/views/DynamicSuggestView.svelte b/src/lib/components/views/DynamicSuggestView.svelte
index 5ca58360c..f5ed0fdab 100644
--- a/src/lib/components/views/DynamicSuggestView.svelte
+++ b/src/lib/components/views/DynamicSuggestView.svelte
@@ -546,6 +546,7 @@
showArtwork={true}
artworkUrl={getQobuzImage(track.album?.image)}
isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isBlacklisted={trackBlacklisted}
selectable={multiSelectMode}
selected={multiSelectedIds.has(track.id)}
diff --git a/src/lib/components/views/FavQView.svelte b/src/lib/components/views/FavQView.svelte
index a2560c381..e374280a5 100644
--- a/src/lib/components/views/FavQView.svelte
+++ b/src/lib/components/views/FavQView.svelte
@@ -498,6 +498,7 @@
showArtwork={true}
artworkUrl={getQobuzImage(track.album?.image)}
isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isBlacklisted={trackBlacklisted}
selectable={multiSelectMode}
selected={multiSelectedIds.has(track.id)}
diff --git a/src/lib/components/views/HomeView.svelte b/src/lib/components/views/HomeView.svelte
index da236af55..3f4b8c270 100644
--- a/src/lib/components/views/HomeView.svelte
+++ b/src/lib/components/views/HomeView.svelte
@@ -1327,7 +1327,7 @@
{#each continueTracks as track, index (track.id)}
- {@const isActiveTrack = isPlaybackActive && activeTrackId === track.id}
+ {@const isThisActiveTrack = activeTrackId === track.id}
{@const cacheStatus = getTrackOfflineCacheStatus?.(track.id) ?? { status: 'none' as const, progress: 0 }}
{@const isTrackDownloaded = cacheStatus.status === 'ready'}
{@const trackBlacklisted = track.artistId ? isArtistBlacklisted(track.artistId) : false}
@@ -1339,7 +1339,8 @@
album={track.album}
duration={track.duration}
quality={getTrackQuality(track)}
- isPlaying={isActiveTrack}
+ isPlaying={isPlaybackActive && isThisActiveTrack}
+ isActiveTrack={isThisActiveTrack}
isBlacklisted={trackBlacklisted}
compact={true}
hideDownload={trackBlacklisted}
diff --git a/src/lib/components/views/LocalLibraryView.svelte b/src/lib/components/views/LocalLibraryView.svelte
index 78aca208a..3ca6ed1e1 100644
--- a/src/lib/components/views/LocalLibraryView.svelte
+++ b/src/lib/components/views/LocalLibraryView.svelte
@@ -3256,6 +3256,7 @@
duration={formatDuration(track.duration_secs)}
quality={getQualityBadge(track)}
isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isLocal={true}
localSource={track.source === 'plex' ? 'plex' : 'local'}
hideDownload={true}
diff --git a/src/lib/components/views/PlaylistDetailView.svelte b/src/lib/components/views/PlaylistDetailView.svelte
index bc983b732..34667c6cf 100644
--- a/src/lib/components/views/PlaylistDetailView.svelte
+++ b/src/lib/components/views/PlaylistDetailView.svelte
@@ -2347,6 +2347,7 @@
? 'Hi-Res'
: '-'}
isPlaying={isTrackPlaying}
+ isActiveTrack={isActiveTrack}
isLocal={track.isLocal}
isUnavailable={removedFromQobuz && isOwnPlaylist}
unavailableTooltip={removedFromQobuz ? $t('player.trackUnavailable') : undefined}
diff --git a/src/lib/components/views/TopQView.svelte b/src/lib/components/views/TopQView.svelte
index b2f62cf4d..cffac2718 100644
--- a/src/lib/components/views/TopQView.svelte
+++ b/src/lib/components/views/TopQView.svelte
@@ -611,6 +611,7 @@
showArtwork={true}
artworkUrl={getQobuzImage(track.album?.image)}
isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isBlacklisted={trackBlacklisted}
selectable={multiSelectMode}
selected={multiSelectedIds.has(track.id)}
diff --git a/src/lib/components/views/WeeklySuggestView.svelte b/src/lib/components/views/WeeklySuggestView.svelte
index d7572b34c..225222159 100644
--- a/src/lib/components/views/WeeklySuggestView.svelte
+++ b/src/lib/components/views/WeeklySuggestView.svelte
@@ -541,6 +541,7 @@
showArtwork={true}
artworkUrl={getQobuzImage(track.album?.image)}
isPlaying={isPlaybackActive && activeTrackId === track.id}
+ isActiveTrack={activeTrackId === track.id}
isBlacklisted={trackBlacklisted}
selectable={multiSelectMode}
selected={multiSelectedIds.has(track.id)}