danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

style youtube cards

Browse source
This commit is contained in:
Broque Thomas 2026-01-04 14:56:05 -08:00
parent 61e822bf6f
commit 58f7fdb005
2 changed files with 1500 additions and 1473 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
core/youtube_client.py
View file

@ -513,7 +513,7 @@ class YouTubeClient:
video_id = entry.get('id', '') video_id = entry.get('id', '')
filename = f"{video_id}||{title}" # Store video_id and title for later download filename = f"{video_id}||{title}" # Store video_id and title for later download
return TrackResult( track_result = TrackResult(
username="youtube", # YouTube doesn't have users - use constant username="youtube", # YouTube doesn't have users - use constant
filename=filename, filename=filename,
size=file_size, size=file_size,
@ -529,6 +529,11 @@ class YouTubeClient:
track_number=None track_number=None
) )
# Add thumbnail for frontend (surgical addition)
track_result.thumbnail = entry.get('thumbnail')
return track_result
async def search(self, query: str, timeout: int = None, progress_callback=None) -> tuple[List[TrackResult], List[AlbumResult]]: async def search(self, query: str, timeout: int = None, progress_callback=None) -> tuple[List[TrackResult], List[AlbumResult]]:
""" """
Search YouTube for tracks matching the query (async, Soulseek-compatible interface). Search YouTube for tracks matching the query (async, Soulseek-compatible interface).
@ -564,8 +569,8 @@ class YouTubeClient:
} }
with yt_dlp.YoutubeDL(ydl_opts) as ydl: with yt_dlp.YoutubeDL(ydl_opts) as ydl:
# Search YouTube (max 10 results) # Search YouTube (max 50 results)
search_results = ydl.extract_info(f"ytsearch10:{query}", download=False) search_results = ydl.extract_info(f"ytsearch50:{query}", download=False)
if not search_results or 'entries' not in search_results: if not search_results or 'entries' not in search_results:
return [] return []

24
webui/static/script.js
View file

@ -9073,8 +9073,30 @@ function displayDownloadsResults(results) {
let html = ''; let html = '';
results.forEach((result, index) => { results.forEach((result, index) => {
const isAlbum = result.result_type === 'album'; const isAlbum = result.result_type === 'album';
if (result.username === 'youtube') {
const thumbnail = result.thumbnail || '';
const durationText = result.duration ? formatDuration(result.duration) : '';
if (isAlbum) { html += `
<div class="youtube-result-card" style="display: flex; gap: 1rem; padding: 1rem; background: rgba(255, 0, 0, 0.05); border: 1px solid rgba(255, 0, 0, 0.1); border-radius: 8px; margin-bottom: 0.5rem; align-items: center;">
<div class="yt-thumb" style="width: 120px; height: 68px; flex-shrink: 0; border-radius: 4px; overflow: hidden; background: #000;">
<img src="${thumbnail}" style="width: 100%; height: 100%; object-fit: cover;" onerror="this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iNjgiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9IiMzMzMiLz48dGV4dCB4PSI1MCUiIHk9IjUwJSIgZmlsbD0iIzY2NiIgZm9udC1zaXplPSIxMiIgZGVtaW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+Tm8gSW1hZ2U8L3RleHQ+PC9zdmc+'">
</div>
<div class="yt-info" style="flex: 1;">
<div class="yt-title" style="font-weight: 600; margin-bottom: 4px;">${escapeHtml(result.title)}</div>
<div class="yt-channel" style="font-size: 0.9em; opacity: 0.8;">${escapeHtml(result.artist || result.username)} • ${durationText}</div>
</div>
<div class="yt-actions">
<button onclick="streamAlbumTrack(${index}, -1)" class="track-stream-btn">Stream ▶</button>
<button onclick="downloadAlbumTrack(${index}, -1)" class="track-download-btn">Download ⬇</button>
</div>
</div>
`;
return; // Skip standard rendering for YouTube result
}
if (isAlbum && result.username !== 'youtube') {
const trackCount = result.tracks ? result.tracks.length : 0; const trackCount = result.tracks ? result.tracks.length : 0;
const totalSize = result.total_size ? `${(result.total_size / 1024 / 1024).toFixed(1)} MB` : 'Unknown size'; const totalSize = result.total_size ? `${(result.total_size / 1024 / 1024).toFixed(1)} MB` : 'Unknown size';