From 2d97d5c7d2031aa6ecae63351cd6285e2e96400a Mon Sep 17 00:00:00 2001 From: Broque Thomas Date: Thu, 5 Feb 2026 07:34:47 -0800 Subject: [PATCH] refactor musicbrainz badge --- webui/static/script.js | 49 ++++++------------------------------------ webui/static/style.css | 2 +- 2 files changed, 8 insertions(+), 43 deletions(-) diff --git a/webui/static/script.js b/webui/static/script.js index 205ed88..ece3fb8 100644 --- a/webui/static/script.js +++ b/webui/static/script.js @@ -91,6 +91,9 @@ let artistsSearchController = null; let artistCompletionController = null; // Track ongoing completion check to cancel when navigating away let similarArtistsController = null; // Track ongoing similar artists stream to cancel when navigating away +// --- MusicBrainz Integration Constants --- +const MUSICBRAINZ_LOGO_URL = 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/MusicBrainz_Logo_%282016%29.svg/500px-MusicBrainz_Logo_%282016%29.svg.png'; + // --- Wishlist Modal Persistence State Management --- const WishlistModalState = { // Track if wishlist modal was visible before page refresh @@ -20014,10 +20017,9 @@ function createArtistCardHTML(artist) { // Check for MusicBrainz ID let mbIconHTML = ''; if (artist.musicbrainz_id) { - const mbLogoUrl = 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/MusicBrainz_Logo_%282016%29.svg/500px-MusicBrainz_Logo_%282016%29.svg.png'; // Use official SVG logo mbIconHTML = `
- +
`; } @@ -21144,13 +21146,8 @@ function updateArtistDetailHeader(artist) { if (nameElement) { nameElement.textContent = artist.name; - // DEBUG: Log the artist object to check for MBID - console.log(`🔍 [DEBUG] Updating header for ${artist.name}`, artist); - console.log(`🔍 [DEBUG] MBID present?`, artist.musicbrainz_id); - // Add MusicBrainz link if available if (artist.musicbrainz_id) { - console.log('✅ [DEBUG] Adding MusicBrainz link to header'); // Remove existing MB link if any const existingMb = nameElement.parentNode.querySelector('.mb-link-btn'); if (existingMb) existingMb.remove(); @@ -25178,10 +25175,7 @@ function createLibraryArtistCard(artist) { const mbIcon = document.createElement('div'); mbIcon.className = 'mb-card-icon'; mbIcon.title = 'View on MusicBrainz'; - - // Use official SVG logo - const mbLogoUrl = 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/MusicBrainz_Logo_%282016%29.svg/500px-MusicBrainz_Logo_%282016%29.svg.png'; - mbIcon.innerHTML = ``; + mbIcon.innerHTML = ``; mbIcon.onclick = (e) => { e.stopPropagation(); @@ -25430,15 +25424,6 @@ function updateArtistDetailPageHeader(artistName) { const mainTitle = document.getElementById("artist-info-name"); if (mainTitle) { mainTitle.textContent = artistName; - - // Try to find the artist object in memory to get the MBID - // We can look at the data passed to populateArtistDetailPage if this function accepted the full object - // Or access the state if it was saved - - // Actually, let's look at how this is invoked. It's called from loadArtistDetailData which has the full 'data' object. - // But this function only accepts 'artistName'. - // We should query the state or modify the function signature. - // For now, let's try to find the MB link element and update it if we can find the artist in data. } } @@ -25447,18 +25432,9 @@ function updateArtistDetailPageHeaderWithData(artist) { const mainTitle = document.getElementById("artist-detail-name"); if (mainTitle) { - console.log('✅ [DEBUG] Updating header for:', artist.name); - // We assume textContent is set by updateArtistHeroSection, so we just APPEND the link - // But to be safe, we can ensure name is there. - // If we run AFTER populateArtistDetailPage, textContent is already set. - - // If we reset textContent here, we might lose other formatting? - // artist-detail-name usually just contains text. mainTitle.textContent = artist.name; if (artist.musicbrainz_id) { - console.log('✅ [DEBUG] Adding MusicBrainz link to DETAIL page header for', artist.name); - // Remove existing link if any (to prevent duplicates) const existingMb = mainTitle.querySelector('.mb-link-btn'); if (existingMb) existingMb.remove(); @@ -25468,11 +25444,9 @@ function updateArtistDetailPageHeaderWithData(artist) { mbLink.href = `https://musicbrainz.org/artist/${artist.musicbrainz_id}`; mbLink.target = '_blank'; mbLink.title = 'View on MusicBrainz'; - // Use the specific logo requested by user - const mbLogoUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/MusicBrainz_Logo_%282016%29.svg/500px-MusicBrainz_Logo_%282016%29.svg.png"; mbLink.innerHTML = ` - + View on MusicBrainz `; mbLink.style.padding = '5px 14px'; @@ -25731,28 +25705,19 @@ function createReleaseCard(release) { card.setAttribute("data-release-id", release.id || ""); card.setAttribute("data-spotify-id", release.spotify_id || ""); - // DEBUG: Log release to check for MBID - // console.log(`🔍 [DEBUG] Release: ${release.title}`, release); - // Add MusicBrainz icon if available let mbIcon = null; if (release.musicbrainz_release_id) { - console.log(`✅ [DEBUG] Adding MB icon for release: ${release.title}`); - const mbLogoUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/MusicBrainz_Logo_%282016%29.svg/500px-MusicBrainz_Logo_%282016%29.svg.png"; mbIcon = document.createElement("div"); mbIcon.className = "mb-card-icon"; mbIcon.title = "View on MusicBrainz"; - // Use image instead of text - mbIcon.innerHTML = ``; + mbIcon.innerHTML = ``; mbIcon.onclick = (e) => { e.stopPropagation(); window.open(`https://musicbrainz.org/release/${release.musicbrainz_release_id}`, '_blank'); }; - // Will append last } - - // Create image const imageContainer = document.createElement("div"); if (release.image_url && release.image_url.trim() !== "") { diff --git a/webui/static/style.css b/webui/static/style.css index b6d3aa0..498a060 100644 --- a/webui/static/style.css +++ b/webui/static/style.css @@ -21785,4 +21785,4 @@ body { transform: scale(1.1); background: #d466a9; opacity: 1 !important; -} \ No newline at end of file +}