Live sidebar badges for Watchlist/Wishlist, update Wishlist icon to star

Sidebar nav badges now update from HTTP polling (every 10s), WebSocket
pushes, and page init — counts stay current regardless of which page
the user is on. Wishlist icon changed from music note to star in both
sidebar and page title to distinguish from Artists page.
pull/305/head
Broque Thomas 4 weeks ago
parent 258fc39364
commit 7317bd7c55

@ -218,7 +218,7 @@
<span class="dl-nav-badge hidden" id="watchlist-nav-badge">0</span>
</button>
<button class="nav-button" data-page="wishlist">
<span class="nav-icon"><svg class="nav-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/><line x1="1" y1="1" x2="5" y2="5" stroke-width="0"/></svg></span>
<span class="nav-icon"><svg class="nav-svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg></span>
<span class="nav-text">Wishlist</span>
<span class="dl-nav-badge hidden" id="wishlist-nav-badge">0</span>
</button>
@ -6734,7 +6734,7 @@
<div class="wishlist-page-header">
<div class="wishlist-page-header-left">
<h2 class="wishlist-page-title">
<span class="wishlist-page-title-icon">&#127925;</span>
<span class="wishlist-page-title-icon">&#11088;</span>
Wishlist
</h2>
<div class="wishlist-page-meta">

@ -434,6 +434,12 @@ function _updateHeroBtnCount(buttonId, badgeId, count) {
function handleWatchlistCountUpdate(data) {
if (data.success) {
_updateHeroBtnCount('watchlist-button', 'watchlist-badge', data.count);
// Update sidebar nav badge
const wlNavBadge = document.getElementById('watchlist-nav-badge');
if (wlNavBadge) {
wlNavBadge.textContent = data.count;
wlNavBadge.classList.toggle('hidden', data.count === 0);
}
const watchlistButton = document.getElementById('watchlist-button');
if (watchlistButton) {
const countdownText = data.next_run_in_seconds ? formatCountdownTime(data.next_run_in_seconds) : '';
@ -520,6 +526,12 @@ function handleDashboardDbStats(stats) {
function handleDashboardWishlistCount(data) {
const count = data.count || 0;
_updateHeroBtnCount('wishlist-button', 'wishlist-badge', count);
// Update sidebar nav badge
const wlNavBadge = document.getElementById('wishlist-nav-badge');
if (wlNavBadge) {
wlNavBadge.textContent = count;
wlNavBadge.classList.toggle('hidden', count === 0);
}
const wishlistButton = document.getElementById('wishlist-button');
if (wishlistButton) {
if (count === 0) {
@ -25730,6 +25742,12 @@ async function updateWishlistCount() {
const count = data.count || 0;
_updateHeroBtnCount('wishlist-button', 'wishlist-badge', count);
// Update sidebar nav badge
const wlNavBadge = document.getElementById('wishlist-nav-badge');
if (wlNavBadge) {
wlNavBadge.textContent = count;
wlNavBadge.classList.toggle('hidden', count === 0);
}
const wishlistButton = document.getElementById('wishlist-button');
if (wishlistButton) {
if (count === 0) {
@ -40228,6 +40246,12 @@ async function updateWatchlistButtonCount() {
if (data.success) {
_updateHeroBtnCount('watchlist-button', 'watchlist-badge', data.count);
// Update sidebar nav badge
const wlNavBadge = document.getElementById('watchlist-nav-badge');
if (wlNavBadge) {
wlNavBadge.textContent = data.count;
wlNavBadge.classList.toggle('hidden', data.count === 0);
}
const watchlistButton = document.getElementById('watchlist-button');
if (watchlistButton) {
const countdownText = data.next_run_in_seconds ? formatCountdownTime(data.next_run_in_seconds) : '';

Loading…
Cancel
Save