vndangkhoa/kv-music
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add more types to editor picks

Browse source
This commit is contained in:
Eduard Prigoana 2026-02-08 23:05:56 +00:00
parent 8bb3b285b1
commit 599b11cfc4
2 changed files with 61 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

71
js/ui.js
View file

@ -1519,6 +1519,27 @@ export class UIRenderer {
} }
} }
createTrackCardHTML(track) {
const explicitBadge = hasExplicitContent(track) ? this.createExplicitBadge() : '';
const qualityBadge = createQualityBadgeHTML(track);
const isCompact = cardSettings.isCompactAlbum();
return this.createBaseCardHTML({
type: 'track',
id: track.id,
href: `/track/${track.id}`,
title: `${escapeHtml(getTrackTitle(track))} ${explicitBadge} ${qualityBadge}`,
subtitle: escapeHtml(getTrackArtists(track)),
imageHTML: `<img src="${this.api.getCoverUrl(track.album?.cover)}" alt="${escapeHtml(track.title)}" class="card-image" loading="lazy">`,
actionButtonsHTML: `
<button class="like-btn card-like-btn" data-action="toggle-like" data-type="track" title="Add to Liked">
${this.createHeartIcon(false)}
</button>
`,
isCompact,
});
}
async renderHomeEditorsPicks(forceRefresh = false) { async renderHomeEditorsPicks(forceRefresh = false) {
const picksContainer = document.getElementById('home-editors-picks'); const picksContainer = document.getElementById('home-editors-picks');
const section = document.getElementById('home-editors-picks-section'); const section = document.getElementById('home-editors-picks-section');
@ -1538,32 +1559,52 @@ export class UIRenderer {
const response = await fetch('/editors-picks.json'); const response = await fetch('/editors-picks.json');
if (!response.ok) throw new Error("Failed to load editor's picks"); if (!response.ok) throw new Error("Failed to load editor's picks");
const data = await response.json(); const items = await response.json();
const albumIds = data.albums || [];
if (albumIds.length === 0) { if (!Array.isArray(items) || items.length === 0) {
picksContainer.innerHTML = createPlaceholder("No editor's picks available."); picksContainer.innerHTML = createPlaceholder("No editor's picks available.");
return; return;
} }
// Fetch album details // Fetch details for each item
const albums = []; const cardsHTML = [];
for (const albumId of albumIds.slice(0, 12)) { const itemsToStore = [];
for (const item of items.slice(0, 12)) {
try { try {
const result = await this.api.getAlbum(albumId); if (item.type === 'album') {
if (result && result.album) albums.push(result.album); const result = await this.api.getAlbum(item.id);
if (result && result.album) {
cardsHTML.push(this.createAlbumCardHTML(result.album));
itemsToStore.push({ el: null, data: result.album, type: 'album' });
}
} else if (item.type === 'artist') {
const artist = await this.api.getArtist(item.id);
if (artist) {
cardsHTML.push(this.createArtistCardHTML(artist));
itemsToStore.push({ el: null, data: artist, type: 'artist' });
}
} else if (item.type === 'track') {
const track = await this.api.getTrackMetadata(item.id);
if (track) {
cardsHTML.push(this.createTrackCardHTML(track));
itemsToStore.push({ el: null, data: track, type: 'track' });
}
}
} catch (e) { } catch (e) {
console.warn(`Failed to load album ${albumId}:`, e); console.warn(`Failed to load ${item.type} ${item.id}:`, e);
} }
} }
if (albums.length > 0) { if (cardsHTML.length > 0) {
picksContainer.innerHTML = albums.map((a) => this.createAlbumCardHTML(a)).join(''); picksContainer.innerHTML = cardsHTML.join('');
albums.forEach((a) => { itemsToStore.forEach((item, index) => {
const el = picksContainer.querySelector(`[data-album-id="${a.id}"]`); const type = item.type;
const id = item.data.id;
const el = picksContainer.querySelector(`[data-${type}-id="${id}"]`);
if (el) { if (el) {
trackDataStore.set(el, a); trackDataStore.set(el, item.data);
this.updateLikeState(el, 'album', a.id); this.updateLikeState(el, type, id);
} }
}); });
} else { } else {

10
public/editors-picks.json
View file

@ -1,5 +1,5 @@
{ [
"name": "Editor's Picks", { "type": "album", "id": "4527433" },
"description": "Curated selection of standout albums handpicked by the monochrome team", { "type": "album", "id": "90502209" },
"albums": ["4527433", "90502209"] { "type": "track", "id": "279082605" }
} ]