wishlist button

web_server.py

@@ -3453,6 +3453,18 @@ def get_database_stats():
         print(f"Error getting database stats: {e}")
         return jsonify({"error": str(e)}), 500
 
+@app.route('/api/wishlist/count', methods=['GET'])
+def get_wishlist_count():
+    """Endpoint to get current wishlist count."""
+    try:
+        from core.wishlist_service import get_wishlist_service
+        wishlist_service = get_wishlist_service()
+        count = wishlist_service.get_wishlist_count()
+        return jsonify({"count": count})
+    except Exception as e:
+        print(f"Error getting wishlist count: {e}")
+        return jsonify({"error": str(e)}), 500
+
 @app.route('/api/database/update', methods=['POST'])
 def start_database_update():
     """Endpoint to start the database update process."""

webui/static/script.js

@@ -27,6 +27,7 @@ let isSortReversed = false;
 let searchAbortController = null;
 let dbStatsInterval = null;
 let dbUpdateStatusInterval = null;
+let wishlistCountInterval = null;
 
 // --- Add these globals for the Sync Page ---
 let spotifyPlaylists = [];
@@ -273,6 +274,7 @@ async function loadPageData(pageId) {
         // Stop any active polling when navigating away
         stopDbStatsPolling();
         stopDbUpdatePolling();
+        stopWishlistCountPolling();
         switch (pageId) {
             case 'dashboard':
                 stopDownloadPolling();
@@ -1733,6 +1735,14 @@ async function loadDashboardData() {
                 </div>
             `).join('');
         }
+        
+        // Initialize wishlist count when dashboard loads
+        await updateWishlistCount();
+        
+        // Start periodic refresh of wishlist count (every 30 seconds, matching GUI behavior)
+        stopWishlistCountPolling(); // Ensure no duplicates
+        wishlistCountInterval = setInterval(updateWishlistCount, 30000);
+        
     } catch (error) {
         console.error('Error loading dashboard data:', error);
     }
@@ -4946,6 +4956,13 @@ function stopDbUpdatePolling() {
     }
 }
 
+function stopWishlistCountPolling() {
+    if (wishlistCountInterval) {
+        clearInterval(wishlistCountInterval);
+        wishlistCountInterval = null;
+    }
+}
+
 async function loadDashboardData() {
     // Attach event listeners for the DB updater tool
     const updateButton = document.getElementById('db-update-button');
@@ -4960,6 +4977,13 @@ async function loadDashboardData() {
     stopDbStatsPolling(); // Ensure no duplicates
     dbStatsInterval = setInterval(fetchAndUpdateDbStats, 30000);
 
+    // Initial load of wishlist count
+    await updateWishlistCount();
+    
+    // Start periodic refresh of wishlist count (every 30 seconds, matching GUI behavior)
+    stopWishlistCountPolling(); // Ensure no duplicates
+    wishlistCountInterval = setInterval(updateWishlistCount, 30000);
+
     // Also check the status of any ongoing update when the page loads
     await checkAndUpdateDbProgress();
 }
@@ -5021,6 +5045,35 @@ function updateDbUpdaterCardInfo(stats) {
     }
 }
 
+// --- Wishlist Count Functions ---
+
+async function updateWishlistCount() {
+    try {
+        const response = await fetch('/api/wishlist/count');
+        if (!response.ok) return;
+        
+        const data = await response.json();
+        const count = data.count || 0;
+        
+        const wishlistButton = document.getElementById('wishlist-button');
+        if (wishlistButton) {
+            wishlistButton.textContent = `🎵 Wishlist (${count})`;
+            
+            // Update button styling based on count (matching GUI behavior)
+            if (count === 0) {
+                wishlistButton.classList.remove('wishlist-active');
+                wishlistButton.classList.add('wishlist-inactive');
+            } else {
+                wishlistButton.classList.remove('wishlist-inactive');
+                wishlistButton.classList.add('wishlist-active');
+            }
+        }
+        
+    } catch (error) {
+        console.warn('Could not fetch wishlist count:', error);
+    }
+}
+
 async function checkAndUpdateDbProgress() {
     try {
         const response = await fetch('/api/database/update/status');

webui/static/style.css

@@ -3411,6 +3411,23 @@ body {
     background: linear-gradient(135deg, #1ed760 0%, #22ff6b 100%);
 }
 
+/* Wishlist button states based on count */
+.wishlist-button.wishlist-inactive {
+    background: linear-gradient(135deg, #404040 0%, #505050 100%);
+    color: #888888;
+}
+.wishlist-button.wishlist-inactive:hover {
+    background: linear-gradient(135deg, #505050 0%, #666666 100%);
+    color: #999999;
+}
+.wishlist-button.wishlist-active {
+    background: linear-gradient(135deg, #1db954 0%, #1ed760 100%);
+    color: #000000;
+}
+.wishlist-button.wishlist-active:hover {
+    background: linear-gradient(135deg, #1ed760 0%, #22ff6b 100%);
+}
+
 .watchlist-button {
     background: linear-gradient(135deg, #ffc107 0%, #ffca28 100%);
 }