Fix search to use SquidWTF HiFi API with round-robin base URLs, capitalize provider names in UI, and widen tracks modal to 90%

This commit is contained in:
2026-02-05 12:35:33 -05:00
parent 349fb740a2
commit 9abb53de1a
2 changed files with 80 additions and 15 deletions

View File

@@ -879,7 +879,7 @@
<!-- Track List Modal -->
<div class="modal" id="tracks-modal">
<div class="modal-content" style="max-width: 700px;">
<div class="modal-content" style="max-width: 90%; width: 90%;">
<h3 id="tracks-modal-title">Playlist Tracks</h3>
<div class="tracks-list" id="tracks-list">
<div class="loading">
@@ -1586,17 +1586,33 @@
}
}
function searchProvider(query, provider) {
// Provider-specific search URLs
const searchUrls = {
'Deezer': `https://www.deezer.com/search/${encodeURIComponent(query)}`,
'Qobuz': `https://www.qobuz.com/us-en/search?q=${encodeURIComponent(query)}`,
'SquidWTF': `https://triton.squid.wtf/search/?s=${encodeURIComponent(query)}`,
'default': `https://www.google.com/search?q=${encodeURIComponent(query + ' music')}`
async function searchProvider(query, provider) {
// Use SquidWTF HiFi API with round-robin base URLs for all searches
// Get a random base URL from the backend
try {
const response = await fetch('/api/admin/squidwtf-base-url');
const data = await response.json();
if (data.baseUrl) {
// Use the HiFi API search endpoint: /search/?s=query
const searchUrl = `${data.baseUrl}/search/?s=${encodeURIComponent(query)}`;
window.open(searchUrl, '_blank');
} else {
showToast('Failed to get search URL', 'error');
}
} catch (error) {
showToast('Failed to get search URL', 'error');
}
}
function capitalizeProvider(provider) {
// Capitalize provider names for display
const providerMap = {
'squidwtf': 'SquidWTF',
'deezer': 'Deezer',
'qobuz': 'Qobuz'
};
const url = searchUrls[provider] || searchUrls['default'];
window.open(url, '_blank');
return providerMap[provider?.toLowerCase()] || provider;
}
async function clearCache() {
@@ -1811,7 +1827,7 @@
statusBadge += '<span class="status-badge" style="font-size:0.75rem;padding:2px 8px;margin-left:4px;background:var(--info);color:white;"><span class="status-dot" style="background:white;"></span>Manual</span>';
}
} else if (t.isLocal === false) {
const provider = t.externalProvider || 'External';
const provider = capitalizeProvider(t.externalProvider) || 'External';
statusBadge = `<span class="status-badge warning" style="font-size:0.75rem;padding:2px 8px;margin-left:8px;"><span class="status-dot"></span>${escapeHtml(provider)}</span>`;
// Add manual mapping indicator for external tracks
if (t.isManualMapping && t.manualMappingType === 'external') {
@@ -1864,8 +1880,8 @@
<div class="track-meta">
${t.album ? escapeHtml(t.album) : ''}
${t.isrc ? '<br><small>ISRC: ' + t.isrc + '</small>' : ''}
${t.isLocal === false && t.searchQuery && t.externalProvider ? '<br><small style="color:var(--accent)"><a href="#" onclick="searchProvider(\'' + escapeJs(t.searchQuery) + '\', \'' + escapeJs(t.externalProvider) + '\'); return false;" style="color:var(--accent);text-decoration:underline;">🔍 Search: ' + escapeHtml(t.searchQuery) + '</a></small>' : ''}
${t.isLocal === null && t.searchQuery ? '<br><small style="color:var(--text-secondary)"><a href="#" onclick="searchProvider(\'' + escapeJs(t.title + ' ' + (t.artists && t.artists.length > 0 ? t.artists[0] : '')) + '\', \'SquidWTF\'); return false;" style="color:var(--text-secondary);text-decoration:underline;">🔍 Search: ' + escapeHtml(t.title + ' ' + (t.artists && t.artists.length > 0 ? t.artists[0] : '')) + '</a></small>' : ''}
${t.isLocal === false && t.searchQuery && t.externalProvider ? '<br><small style="color:var(--accent)"><a href="#" onclick="searchProvider(\'' + escapeJs(t.searchQuery) + '\', \'' + escapeJs(t.externalProvider) + '\'); return false;" style="color:var(--accent);text-decoration:underline;">🔍 Search</a></small>' : ''}
${t.isLocal === null && t.searchQuery ? '<br><small style="color:var(--text-secondary)"><a href="#" onclick="searchProvider(\'' + escapeJs(t.searchQuery) + '\', \'squidwtf\'); return false;" style="color:var(--text-secondary);text-decoration:underline;">🔍 Search</a></small>' : ''}
</div>
</div>
`;
@@ -2277,7 +2293,8 @@
} else if (titleEl && mappingType === 'external') {
// For external mappings, update status badge to show provider
const currentTitle = titleEl.textContent.split(' - ')[0]; // Remove old status
const newStatusBadge = `<span class="status-badge warning" style="font-size:0.75rem;padding:2px 8px;margin-left:8px;"><span class="status-dot"></span>${escapeHtml(requestBody.externalProvider)}</span>`;
const capitalizedProvider = capitalizeProvider(requestBody.externalProvider);
const newStatusBadge = `<span class="status-badge warning" style="font-size:0.75rem;padding:2px 8px;margin-left:8px;"><span class="status-dot"></span>${escapeHtml(capitalizedProvider)}</span>`;
titleEl.innerHTML = escapeHtml(currentTitle) + newStatusBadge;
}