]+>/g,'').replace(/<\/a>/g,'').replace(/<[^>]+>/g,'').trim();
const short = bio.length > 400 ? bio.slice(0,400)+'…' : bio;
if(short) {
window._artistBioFull = bio;
bioEl.innerHTML = `Über
${esc(short)}${bio.length > 400
? ` `
: ''}
`;
}
}
// ── Similar artists ──
const similar = info?.similarArtist || [];
if(similar.length && simEl) {
simEl.innerHTML = `Ähnliche Künstler
${similar.map(a =>
`
${esc(a.name)}`).join('')}
`;
}
// ── Top Songs ──
const ndAlbums = albumRes.status === 'fulfilled' ? (albumRes.value?.artist?.album || []) : [];
const topSongs = topRes.status === 'fulfilled' ? (topRes.value?.topSongs?.song || []) : [];
const iTracks = iTracksRes.status === 'fulfilled' ? (iTracksRes.value || []).filter(t => t.wrapperType === 'track') : [];
const iAlbums = iAlbumsRes.status === 'fulfilled' ? (iAlbumsRes.value || []) : [];
if((topSongs.length || iTracks.length) && tsEl) {
tsEl.innerHTML = '';
if(topSongs.length) {
const h = document.createElement('div');
h.className = 'section-title'; h.style.marginBottom = '10px'; h.textContent = 'Top Songs';
tsEl.appendChild(h);
const list = document.createElement('div'); list.style.marginBottom = '8px';
topSongs.forEach((s, i) => list.appendChild(_makeTopsongRow(s, i + 1, s.album || '', topSongs, i)));
tsEl.appendChild(list);
if(ndAlbums.length) {
const total = ndAlbums.reduce((n, a) => n + (a.songCount || 0), 0);
const btn = document.createElement('button');
btn.className = 'btn-outline'; btn.style.cssText = 'font-size:12px;padding:7px 14px;margin-bottom:16px;margin-top:4px';
btn.textContent = `Alle ${total} Songs in Library`;
btn.onclick = () => navigate('artist-all-songs', { albums: ndAlbums, artist });
tsEl.appendChild(btn);
}
}
if(iTracks.length) {
const heading = topSongs.length ? 'Weltweit populär (iTunes)' : 'Populäre Titel';
const sec = document.createElement('div');
sec.innerHTML = `${heading}
`;
const list = document.createElement('div'); list.className = 'song-list'; list.style.marginBottom = '20px';
iTracks.forEach((t, i) => list.appendChild(makeGlobalTrackItem(t, i, iTracks)));
sec.appendChild(list); tsEl.appendChild(sec);
}
}
// ── Action bar ──
const actionBar = document.getElementById('artist-action-bar');
if(actionBar) {
actionBar.innerHTML = '';
if(topSongs.length || ndAlbums.length) {
const playTopBtn = document.createElement('button');
playTopBtn.className = 'artist-action-btn';
playTopBtn.innerHTML = ` Top Songs`;
playTopBtn.onclick = () => topSongs.length ? playQueue(topSongs, 0) : quickPlayArtist(artist);
const shuffleBtn = document.createElement('button');
shuffleBtn.className = 'artist-action-btn';
shuffleBtn.innerHTML = ` Shuffle`;
shuffleBtn.onclick = async () => {
S.shuffle = true;
localStorage.setItem('ns_shuffle', '1');
import('./player.js').then(({ _applyShuffleRepeat }) => _applyShuffleRepeat());
await quickPlayArtist(artist);
};
actionBar.appendChild(playTopBtn);
actionBar.appendChild(shuffleBtn);
}
}
// ── Albums ──
if(albEl) { albEl.innerHTML = ''; _renderArtistAlbums(albEl, ndAlbums, iAlbums, artist); }
}
function _normAlbum(s) {
return (s || '').toLowerCase().replace(/[^a-z0-9\s]/g, ' ').replace(/\s+/g, ' ').trim();
}
function _renderArtistAlbums(el, ndAlbums, iAlbums, artist) {
const downloaded = [], partial = [], notDl = [];
const usedNdIds = new Set();
for(const ia of iAlbums) {
const iName = _normAlbum(ia.collectionName);
const iCount = ia.trackCount || 0;
const match = ndAlbums.find(a => {
const n = _normAlbum(a.name);
return n === iName || (n.length > 3 && iName.startsWith(n)) || (iName.length > 3 && n.startsWith(iName));
});
if(!match) {
notDl.push(ia);
} else if(iCount > 0 && match.songCount >= iCount) {
downloaded.push({ nd: match, itunes: ia }); usedNdIds.add(match.id);
} else {
partial.push({ nd: match, itunes: ia, have: match.songCount || 0, total: iCount }); usedNdIds.add(match.id);
}
}
// Navidrome albums with no iTunes match go to downloaded
for(const na of ndAlbums) {
if(!usedNdIds.has(na.id)) downloaded.push({ nd: na, itunes: null });
}
downloaded.sort((a, b) => (b.nd.year||0) - (a.nd.year||0));
partial.sort((a, b) => (b.nd.year||0) - (a.nd.year||0));
notDl.sort((a, b) => new Date(b.releaseDate||0) - new Date(a.releaseDate||0));
function addGrid(title, count) {
const h = document.createElement('div');
h.className = 'section-title';
h.style.cssText = 'margin-bottom:12px;margin-top:20px;display:flex;align-items:center;gap:8px';
h.innerHTML = `${title}${count}`;
el.appendChild(h);
const g = document.createElement('div'); g.className = 'grid grid-4'; el.appendChild(g);
return g;
}
if(downloaded.length) {
const g = addGrid('In Library', downloaded.length);
downloaded.forEach(({ nd, itunes }) => g.appendChild(makeAlbumCard({ ...nd, _fromArtist: artist })));
}
if(partial.length) {
const g = addGrid('Unvollständig', partial.length);
partial.forEach(({ nd, itunes, have, total }) => {
const art = itunes?.artworkUrl100?.replace('100x100','512x512') || coverUrl(nd.coverArt, 512);
const c = makeCard(nd.name, `${have} / ${total} Tracks`, art, '💿');
c.querySelector('.card-art').onclick = (e) => { e.stopPropagation(); quickPlayAlbum(nd); };
c.querySelector('.card-info').onclick = () => itunes ? navigate('itunes-album-detail', itunes) : navigate('album-detail', { ...nd, _fromArtist: artist });
const artEl = c.querySelector('.card-art');
const badge = document.createElement('div');
badge.className = 'album-partial-badge'; badge.textContent = `${have}/${total}`;
artEl.appendChild(badge);
if(itunes) {
const btn = document.createElement('button');
btn.className = 'card-dl-btn'; btn.title = 'Fehlende Tracks laden';
btn.innerHTML = ``;
btn.onclick = (e) => { e.stopPropagation(); openDlModal({ artistName: artist.name, trackName: nd.name, collectionName: nd.name, artworkUrl100: itunes.artworkUrl100||'', isAlbum: true, itunesData: itunes, collectionId: itunes.collectionId }); };
artEl.appendChild(btn);
}
g.appendChild(c);
});
}
if(notDl.length) {
const g = addGrid('Noch nicht heruntergeladen', notDl.length);
notDl.forEach(ia => {
const art = ia.artworkUrl100?.replace('100x100','300x300');
const c = makeCard(ia.collectionName, ia.releaseDate?.slice(0,4)||'', art, '💿');
c.onclick = () => navigate('itunes-album-detail', ia);
const artEl = c.querySelector('.card-art');
const btn = document.createElement('button');
btn.className = 'card-dl-btn'; btn.title = 'Album laden';
btn.innerHTML = ``;
btn.onclick = (e) => { e.stopPropagation(); openDlModal({ artistName: ia.artistName, trackName: ia.collectionName, collectionName: ia.collectionName, artworkUrl100: ia.artworkUrl100||'', isAlbum: true, itunesData: ia, collectionId: ia.collectionId }); };
artEl.appendChild(btn);
g.appendChild(c);
});
}
// No iTunes data at all — show Navidrome albums plainly
if(!downloaded.length && !partial.length && !notDl.length && ndAlbums.length) {
const g = addGrid('Alben', ndAlbums.length);
ndAlbums.forEach(a => g.appendChild(makeAlbumCard({ ...a, _fromArtist: artist })));
}
}
export async function loadArtistAllSongs({ albums, artist }) {
document.getElementById('artist-songs-title').textContent = `Alle Songs · ${artist.name}`;
document.getElementById('artist-songs-back-btn').onclick = () => _navGoBack();
const el = document.getElementById('artist-songs-list');
el.innerHTML = '';
const results = await Promise.allSettled(albums.map(a => api('getAlbum', `&id=${a.id}`)));
el.innerHTML = '';
const allSongs = results
.filter(r => r.status === 'fulfilled')
.flatMap(r => { const alb = r.value?.album; return (alb?.song || []).map(s => ({ ...s, _alb: alb })); })
.sort((a, b) => {
if(a._alb?.year !== b._alb?.year) return (b._alb?.year||0) - (a._alb?.year||0);
if(a._alb?.id !== b._alb?.id) return (a._alb?.name||'').localeCompare(b._alb?.name||'');
return (a.trackNumber||0) - (b.trackNumber||0);
});
let curId = '';
allSongs.forEach((s, i) => {
if(s._alb?.id !== curId) {
curId = s._alb?.id || '';
const h = document.createElement('div');
h.style.cssText = 'font-size:12px;font-weight:700;color:var(--text2);padding:12px 0 4px;border-top:1px solid var(--border);margin-top:4px';
h.textContent = s._alb?.name || '';
el.appendChild(h);
}
el.appendChild(_makeTopsongRow(s, s.trackNumber || '', null, allSongs, i));
});
}
export async function loadItunesAlbumDetail(album) {
document.getElementById('itunes-album-back-btn').onclick = () => _navGoBack();
document.getElementById('itunes-album-detail-name').textContent = album.collectionName || '—';
document.getElementById('itunes-album-detail-artist').textContent = album.artistName || '';
const cw = document.getElementById('itunes-album-cover-wrap');
const art = (album.artworkUrl100 || '').replace('100x100bb','600x600bb').replace('100x100','600x600');
cw.innerHTML = art ? `
` : '💿
';
const dlBtn = document.getElementById('itunes-album-dl-btn');
dlBtn.onclick = () => openDlModal({ artistName: album.artistName, trackName: album.collectionName, collectionName: album.collectionName, artworkUrl100: album.artworkUrl100||'', isAlbum: true, itunesData: album, collectionId: album.collectionId });
const sl = document.getElementById('itunes-album-songs');
sl.innerHTML = '';
try {
const tracks = await itunesLookupAlbum(album.collectionId);
const year = album.releaseDate ? new Date(album.releaseDate).getFullYear() : '';
document.getElementById('itunes-album-detail-stats').textContent = `${tracks.length} Titel${year ? ' · ' + year : ''}`;
sl.innerHTML = '';
if(!tracks.length) { sl.innerHTML = 'Keine Tracks gefunden
'; return; }
tracks.forEach((t, i) => sl.appendChild(makeGlobalTrackItem(t, i, tracks)));
} catch(e) { sl.innerHTML = `${e.message}
`; }
}
// ─── ALBUM DETAIL ───
export async function loadAlbumDetail(album) {
document.getElementById('album-back-btn').onclick = () =>
album._fromArtist ? navigate('artist-detail', album._fromArtist) : navigate('albums');
document.getElementById('album-detail-name').textContent = dispAlbumName(album.name);
const artistEl = document.getElementById('album-detail-artist');
artistEl.innerHTML = parseArtists(album)
.map(a => `${esc(dispArtistById(a.id, a.name))}`)
.join(' • ') || '';
const cw = document.getElementById('album-cover-wrap');
const cv = coverUrl(album.coverArt, 512);
cw.innerHTML = cv ? `
` : '💿
';
const sl = document.getElementById('album-songs');
sl.innerHTML = '';
try {
const r = await api('getAlbum', `&id=${album.id}`);
const songs = r.album?.song || [];
const totalMin = Math.round(songs.reduce((s,t) => s+(t.duration||0), 0) / 60);
document.getElementById('album-detail-stats').textContent = `${songs.length} Titel · ${r.album.year||''} · ${totalMin} Min.`;
// Re-render header after songs load — by now overrides cache is ready and songs carry sortAlbum/sortArtist
if (songs[0]) {
document.getElementById('album-detail-name').textContent = dispAlbum(songs[0]) || dispAlbumName(album.name);
artistEl.innerHTML = parseArtists(songs[0])
.map(a => `${esc(dispArtistById(a.id, a.name))}`)
.join(' • ') || '';
}
document.getElementById('btn-play-album').onclick = () => playQueue(songs, 0);
document.getElementById('btn-dl-album').onclick = () => {
songs.forEach((s,i) => setTimeout(() => dlSongLocal(s), i*400));
toast(`⬇ ${songs.length} Titel Download gestartet`);
};
sl.innerHTML = '';
songs.forEach((s,i) => sl.appendChild(makeSongItem(s, i, songs)));
} catch(e) { sl.innerHTML = `${e.message}
`; }
}
// ─── PLAYLISTS ───
export async function loadPlaylists() {
const g = document.getElementById('playlists-grid');
if (!apiIsCached('getPlaylists')) g.innerHTML = '';
try {
const r = await apiCached('getPlaylists', '', 3 * 60 * 1000);
const lists = r.playlists?.playlist || [];
g.innerHTML = '';
if(!lists.length) { g.innerHTML = '🎶
Keine Playlists vorhanden
${e.message}
`; }
}
export async function quickPlayPlaylist(pl) {
try { const r = await api('getPlaylist', `&id=${pl.id}`); playQueue(r.playlist?.entry || [], 0); }
catch(e) { toast('Fehler: ' + e.message); }
}
export async function quickPlayArtist(a) {
try {
toast('Lade Songs…');
const r = await api('getArtist', `&id=${a.id}`);
const albums = r.artist?.album || [];
if (!albums.length) { toast('Keine Alben gefunden'); return; }
const results = await Promise.all(albums.map(al => api('getAlbum', `&id=${al.id}`)));
const songs = results.flatMap(ar => ar.album?.song || []);
if (songs.length) playQueue(songs, 0);
else toast('Keine Songs gefunden');
} catch(e) { toast('Fehler: ' + e.message); }
}
export async function loadPlaylistDetail(pl) {
S._currentPlaylist = {...pl};
document.getElementById('playlist-detail-name').textContent = pl.name;
const cw = document.getElementById('playlist-cover');
const cv = coverUrl(pl.coverArt, 512);
cw.innerHTML = cv ? `` : '🎶
';
document.getElementById('btn-edit-playlist').onclick = () => openEditPlModal(S._currentPlaylist);
const sl = document.getElementById('playlist-songs');
sl.innerHTML = '';
try {
const r = await api('getPlaylist', `&id=${pl.id}`);
const full = r.playlist || {};
S._currentPlaylist = {...pl, ...full, id: pl.id};
const songs = full.entry || [];
const totalMin = Math.round(songs.reduce((s,t) => s+(t.duration||0), 0) / 60);
document.getElementById('playlist-detail-stats').textContent = `${songs.length} Titel · ${totalMin} Min.`;
// Navidrome's getPlaylists can return a stale songCount — backpatch the overview card
// with the real count we just got from getPlaylist so the grid always shows truth.
const overviewCard = document.querySelector(`#playlists-grid [data-pl-id="${pl.id}"]`);
if (overviewCard) overviewCard.querySelector('.card-sub').textContent = songs.length + ' Titel';
const descEl = document.getElementById('playlist-detail-desc');
if(descEl) { descEl.textContent = full.comment||''; descEl.style.display = full.comment ? '' : 'none'; }
document.getElementById('btn-play-playlist').onclick = () => playQueue(songs, 0);
document.getElementById('btn-shuffle-playlist').onclick = () => {
const shuffled = [...songs].sort(() => Math.random()-.5);
playQueue(shuffled, 0);
};
sl.innerHTML = '';
const plSearch = document.getElementById('playlist-search');
if (plSearch) plSearch.value = '';
songs.forEach((s,i) => sl.appendChild(makeSongItem(s, i, songs, { noArtistLink: true })));
_setupReorderMode(sl, songs, S._currentPlaylist);
} catch(e) { sl.innerHTML = `${e.message}
`; }
}
export function filterPlaylist(val) {
const q = val.trim().toLowerCase();
document.querySelectorAll('#playlist-songs .song-item').forEach(item => {
const title = (item.querySelector('.song-title')?.textContent || '').toLowerCase();
const artist = (item.querySelector('.song-artist')?.textContent || '').toLowerCase();
if (!q || title.includes(q) || artist.includes(q)) { item.style.display = ''; return; }
const rm = romajiLookup(item.dataset.songId);
item.style.display = ((rm?.titleRomaji||'').toLowerCase().includes(q) || (rm?.artistRomaji||'').toLowerCase().includes(q)) ? '' : 'none';
});
}
// ─── PLAYLIST REORDER MODE ───────────────────────────────────────────────
let _reorderCtx = null;
function _setupReorderMode(container, songs, pl) {
// Exit any previous reorder mode silently when loading a new playlist.
if (_reorderCtx) _exitReorderMode(false);
_reorderCtx = { container, songs, pl };
const btn = document.getElementById('btn-reorder-playlist');
if (btn) btn.onclick = plReorderEnter;
const bar = document.getElementById('pl-reorder-bar');
if (bar) bar.style.display = 'none';
}
export function plReorderEnter() {
if (!_reorderCtx || _reorderCtx.active) return;
_reorderCtx.active = true;
const { container, songs } = _reorderCtx;
container.classList.add('pl-draggable');
// Block context-menu (long-press) on all items while reordering.
container.addEventListener('contextmenu', _blockCtxMenu, true);
let dragSrc = null;
let touchDragSrc = null;
Array.from(container.children).forEach((item, i) => {
const handle = document.createElement('div');
handle.className = 'pl-drag-handle';
handle.innerHTML = '';
item.insertBefore(handle, item.firstChild);
item._songRef = songs[i];
// ── Desktop drag ──
let fromHandle = false;
handle.addEventListener('mousedown', () => { fromHandle = true; item.draggable = true; });
item.addEventListener('dragstart', e => {
if (!fromHandle) { e.preventDefault(); item.draggable = false; return; }
fromHandle = false; dragSrc = item;
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('text/plain', '');
setTimeout(() => item.classList.add('dragging'), 0);
});
item.addEventListener('dragend', () => {
fromHandle = false; item.draggable = false; dragSrc = null;
item.classList.remove('dragging');
container.querySelectorAll('.drag-over').forEach(el => el.classList.remove('drag-over'));
});
item.addEventListener('dragover', e => {
e.preventDefault(); e.dataTransfer.dropEffect = 'move';
if (item === dragSrc) return;
container.querySelectorAll('.drag-over').forEach(el => el.classList.remove('drag-over'));
item.classList.add('drag-over');
});
item.addEventListener('dragleave', e => { if (!item.contains(e.relatedTarget)) item.classList.remove('drag-over'); });
item.addEventListener('drop', e => {
e.preventDefault(); e.stopPropagation();
if (!dragSrc || item === dragSrc) return;
item.classList.remove('drag-over');
_doReorder(container, songs, dragSrc, item);
});
// ── Touch drag ──
handle.addEventListener('touchstart', e => {
e.preventDefault(); e.stopPropagation();
touchDragSrc = item; item.classList.add('dragging');
}, { passive: false });
handle.addEventListener('touchmove', e => {
if (!touchDragSrc) return;
e.preventDefault();
const t = e.touches[0];
container.querySelectorAll('.drag-over').forEach(el => el.classList.remove('drag-over'));
const over = _itemAtPoint(container, t.clientX, t.clientY, touchDragSrc);
if (over) over.classList.add('drag-over');
}, { passive: false });
handle.addEventListener('touchend', e => {
if (!touchDragSrc) return;
const t = e.changedTouches[0];
touchDragSrc.classList.remove('dragging');
container.querySelectorAll('.drag-over').forEach(el => el.classList.remove('drag-over'));
const over = _itemAtPoint(container, t.clientX, t.clientY, touchDragSrc);
if (over) _doReorder(container, songs, touchDragSrc, over);
touchDragSrc = null;
}, { passive: false });
});
const bar = document.getElementById('pl-reorder-bar');
if (bar) bar.style.display = 'flex';
}
function _blockCtxMenu(e) { e.preventDefault(); e.stopPropagation(); }
function _itemAtPoint(container, x, y, exclude) {
return (document.elementsFromPoint(x, y) || [])
.find(el => el.classList?.contains('song-item') && el !== exclude && container.contains(el)) || null;
}
function _doReorder(container, songs, src, target) {
const all = Array.from(container.children);
const from = all.indexOf(src), to = all.indexOf(target);
container.insertBefore(src, from < to ? target.nextSibling : target);
const newOrder = Array.from(container.children).map(el => el._songRef);
songs.splice(0, songs.length, ...newOrder);
Array.from(container.children).forEach((el, i) => {
const n = el.querySelector('.song-num'); if (n) n.textContent = i + 1;
});
}
export function plReorderSave() { _exitReorderMode(true); }
export function plReorderCancel() { _exitReorderMode(false); }
function _exitReorderMode(save) {
if (!_reorderCtx) return;
const { container, songs, pl } = _reorderCtx;
_reorderCtx.active = false;
container.classList.remove('pl-draggable');
container.removeEventListener('contextmenu', _blockCtxMenu, true);
container.querySelectorAll('.pl-drag-handle').forEach(h => h.remove());
const bar = document.getElementById('pl-reorder-bar');
if (bar) bar.style.display = 'none';
if (save) _savePlaylistOrder(pl, songs);
}
async function _savePlaylistOrder(pl, songs) {
try {
const songIds = songs.map(s => `&songId=${s.id}`).join('');
await api('createPlaylist', `&playlistId=${pl.id}&name=${encodeURIComponent(pl.name)}${songIds}`);
toast('✅ Reihenfolge gespeichert');
} catch(e) { toast('Fehler beim Speichern: ' + e.message); }
}
export async function quickPlayAlbum(a) {
try { const r = await api('getAlbum', `&id=${a.id}`); playQueue(r.album?.song || [], 0); }
catch(e) { toast('Fehler: ' + e.message); }
}
// ─── STARRED / RANDOM ───
let _starredSort = 'newest';
export async function loadStarred(sort = _starredSort) {
_starredSort = sort;
document.querySelectorAll('#starred-sort-chips .sort-chip').forEach(c =>
c.classList.toggle('active', c.dataset.sort === sort));
const el = document.getElementById('starred-songs');
el.innerHTML = '';
const searchEl = document.getElementById('starred-search');
if (searchEl) searchEl.value = '';
try {
const r = await api('getStarred2');
let songs = (r.starred2?.song || []).map(s => ({...s, _starred: true}));
if (sort === 'newest') songs.sort((a, b) => new Date(b.starred||0) - new Date(a.starred||0));
else if (sort === 'oldest') songs.sort((a, b) => new Date(a.starred||0) - new Date(b.starred||0));
else if (sort === 'az') songs.sort((a, b) => (a.title||'').localeCompare(b.title||''));
else if (sort === 'artist') songs.sort((a, b) => (a.artist||'').localeCompare(b.artist||''));
else if (sort === 'plays') songs.sort((a, b) => (b.playCount||0) - (a.playCount||0));
el.innerHTML = '';
if(!songs.length) { el.innerHTML = ''; return; }
songs.forEach((s,i) => el.appendChild(makeSongItem(s, i, songs, { noArtistLink: true })));
} catch(e) { el.innerHTML = `${e.message}
`; }
}
export function filterStarred(val) {
const q = val.trim().toLowerCase();
document.querySelectorAll('#starred-songs .song-item').forEach(item => {
const title = (item.querySelector('.song-title')?.textContent || '').toLowerCase();
const artist = (item.querySelector('.song-artist')?.textContent || '').toLowerCase();
if (!q || title.includes(q) || artist.includes(q)) { item.style.display = ''; return; }
const rm = romajiLookup(item.dataset.songId);
item.style.display = ((rm?.titleRomaji||'').toLowerCase().includes(q) || (rm?.artistRomaji||'').toLowerCase().includes(q)) ? '' : 'none';
});
}
export async function loadRandom() {
const el = document.getElementById('random-songs');
el.innerHTML = '';
try {
const r = await api('getRandomSongs', '&size=50');
const songs = r.randomSongs?.song || [];
el.innerHTML = '';
songs.forEach((s,i) => el.appendChild(makeSongItem(s, i, songs)));
} catch(e) { el.innerHTML = `${e.message}
`; }
}
// ─── ROMAJI → HIRAGANA (lazy-loaded) ───
let _wanakana = null;
async function _romajiToHiragana(q) {
// Only attempt conversion if query is pure ASCII (likely romaji)
if (!/^[a-z\s'-]+$/i.test(q.trim())) return null;
try {
if (!_wanakana) _wanakana = await import('https://cdn.jsdelivr.net/npm/wanakana@5/esm/wanakana.js');
const h = _wanakana.toHiragana(q.trim(), { passRomaji: false });
// If conversion produced actual hiragana (not just the same ASCII), use it
return /[-ゟ]/.test(h) ? h : null;
} catch { return null; }
}
function _mergeUniq(a, b) {
const seen = new Set(a.map(x => x.id));
return [...a, ...(b || []).filter(x => !seen.has(x.id))];
}
// ─── LOCAL SEARCH ───
export function onLocalSearch(val) {
clearTimeout(S.searchTimer);
if(!val.trim()) { navigate('home'); return; }
navigate('search');
S.searchTimer = setTimeout(() => doLocalSearch(val), 350);
}
export async function doLocalSearch(q, el) {
if (!el) el = document.getElementById('search-results');
el.innerHTML = '';
try {
const hiragana = await _romajiToHiragana(q);
const isRomaji = /^[a-z\s'-]+$/i.test(q.trim());
const [r, r2, romajiIdx] = await Promise.all([
api('search3', `&query=${encodeURIComponent(q)}&songCount=30&albumCount=10&artistCount=6`),
hiragana ? api('search3', `&query=${encodeURIComponent(hiragana)}&songCount=20&albumCount=6&artistCount=4`) : Promise.resolve(null),
isRomaji ? fetchRomajiIndex() : Promise.resolve(null),
]);
const res = r.searchResult3 || {};
const res2 = r2?.searchResult3 || {};
el.innerHTML = '';
const artists = _mergeUniq(res.artist||[], res2.artist);
const albums = _mergeUniq(res.album ||[], res2.album);
// Merge Navidrome results with romaji index matches
const qLow = q.trim().toLowerCase();
const romajiHits = romajiIdx
? romajiIdx.filter(e => e.r.includes(qLow))
: [];
const songs = _mergeUniq(_mergeUniq(res.song||[], res2.song), romajiHits);
if(!artists.length && !albums.length && !songs.length) {
el.innerHTML = ''; return;
}
if(artists.length) {
const s = mkSection('Künstler');
const g = document.createElement('div'); g.className = 'scroll-row';
artists.forEach(a => {
const c = makeCard(dispArtistById(a.id, a.name), a.albumCount+' Alben', null, '🎤');
c.classList.add('artist-card');
c.onclick = () => navigate('artist-detail', a);
g.appendChild(c);
getArtistImage(a.id).then(img => {
if(!img) return;
const artEl = c.querySelector('.card-art');
if(!artEl) return;
artEl.innerHTML = `
`;
});
});
s.appendChild(g); el.appendChild(s);
}
if(albums.length) {
const s = mkSection('Alben');
const g = document.createElement('div'); g.className = 'scroll-row';
albums.forEach(a => g.appendChild(makeAlbumCard(a)));
s.appendChild(g); el.appendChild(s);
}
if(songs.length) {
const sec = mkSection('Titel');
const list = document.createElement('div'); list.className = 'song-list';
songs.forEach((so,i) => list.appendChild(makeSongItem(so, i, songs)));
sec.appendChild(list); el.appendChild(sec);
}
} catch(e) { el.innerHTML = `${e.message}
`; }
}
// ─── HEADER SEARCH (persistent inline bar) ───
export function onHeaderSearch(val) {
const overlay = document.getElementById('header-search-overlay');
const clearBtn = document.getElementById('header-search-clear');
if (clearBtn) clearBtn.style.display = val ? 'block' : 'none';
clearTimeout(S._headerSearchTimer);
if (!val.trim()) { if (overlay) overlay.style.display = 'none'; return; }
if (overlay) {
// position:fixed — anchor top to actual header bottom so it works with any header height
const header = document.getElementById('mobile-header');
if (header) overlay.style.top = header.offsetHeight + 'px';
overlay.style.display = 'block';
}
const el = document.getElementById('header-search-results');
S._headerSearchTimer = setTimeout(() => doLocalSearch(val, el), 300);
}
// ─── MOBILE SEARCH (legacy no-op — replaced by inline header search) ───
export function onMobileSearch(val) { onHeaderSearch(val); }
// ─── GLOBAL (ITUNES) SEARCH ───
export function onGlobalSearch(val) {
clearTimeout(S.globalSearchTimer);
const el = document.getElementById('global-search-results');
if(!val.trim()) { el.innerHTML = '🔍
Gib einen Suchbegriff ein
🎤
'; if(overlay) artEl.appendChild(overlay); };
c.addEventListener('mouseenter', () => img.style.transform = 'scale(1.05)');
c.addEventListener('mouseleave', () => img.style.transform = 'scale(1)');
}).catch(() => {});
});
s.appendChild(row); el.appendChild(s);
}
if(albumResults.length) {
const s = mkSection('Alben');
const row = document.createElement('div'); row.className = 'scroll-row';
albumResults.forEach(a => {
const art = a.artworkUrl100?.replace('100x100','300x300');
const c = makeCard(a.collectionName, a.artistName, art, '💿');
c.querySelector('.play-btn').onclick = (e) => { e.stopPropagation(); loadItunesAlbum(a); };
c.querySelector('.dl-btn-overlay')?.remove();
const dlOverlay = document.createElement('button');
dlOverlay.className = 'dl-btn-overlay';
dlOverlay.title = 'Auf Server laden';
dlOverlay.innerHTML = ``;
dlOverlay.onclick = (e) => { e.stopPropagation(); openDlModal({artistName:a.artistName,trackName:a.collectionName,artworkUrl100:a.artworkUrl100,collectionName:a.collectionName,isAlbum:true,itunesData:a}); };
c.querySelector('.play-overlay').appendChild(dlOverlay);
c.onclick = () => loadItunesAlbum(a);
row.appendChild(c);
});
s.appendChild(row); el.appendChild(s);
}
if(trackResults.length) {
const s = mkSection('Titel');
const list = document.createElement('div'); list.className = 'song-list';
trackResults.forEach((t,i) => list.appendChild(makeGlobalTrackItem(t, i, trackResults)));
s.appendChild(list); el.appendChild(s);
}
if(!artists.length && !albumResults.length && !trackResults.length) {
el.innerHTML = '🔍
Keine Ergebnisse gefunden
Suche fehlgeschlagen: ${e.message}
`; }
}
export async function loadItunesAlbum(album) {
try {
const tracks = await itunesLookupAlbum(album.collectionId);
if(!tracks.length) { toast('Keine Tracks gefunden'); return; }
const el = document.getElementById('global-search-results');
const s = document.createElement('div'); s.className = 'search-section';
s.innerHTML = `
${esc(album.collectionName)}
${esc(album.artistName)}
Tracks
`;
const list = document.createElement('div'); list.className = 'song-list';
tracks.forEach((t,i) => list.appendChild(makeGlobalTrackItem(t, i, tracks)));
s.appendChild(list);
el.innerHTML = ''; el.appendChild(s);
} catch(e) { toast('Fehler: ' + e.message); }
}
export function loadItunesArtistResults(artistId, artistName) {
navigate('artist-detail', { id: null, name: artistName, itunesArtistId: artistId });
}
// ─── NEW RELEASES ───
export async function loadNewReleases() {
const albumEl = document.getElementById('nr-albums');
const songEl = document.getElementById('nr-songs');
albumEl.innerHTML = ''; songEl.innerHTML = '';
try {
const [albums, songs] = await Promise.all([itunesTopCharts(), itunesTopSongs()]);
albumEl.innerHTML = '';
albums.slice(0,30).forEach(a => {
const art = a.artworkUrl100?.replace('100x100','300x300') || a.artworkUrl;
const c = makeCard(a.name, a.artistName, art, '💿');
c.onclick = () => itunesSearch(a.name+' '+a.artistName,'album',5).then(res => { if(res[0]) loadItunesAlbum(res[0]); });
albumEl.appendChild(c);
});
songs.slice(0,40).forEach((s, i) => {
const el = document.createElement('div'); el.className = 'gtrack-item';
const art = s.artworkUrl?.replace('100x100','60x60');
el.innerHTML = `
${art ? `
` : `
🎵
`}
${esc(s.name)}
${esc(s.artistName||'')}
`;
el.onclick = () => { itunesSearch(s.name+' '+s.artistName,'musicTrack',1).then(res => { if(res[0]?.previewUrl) playPreview(res[0]); }); };
songEl.appendChild(el);
});
} catch(e) { albumEl.innerHTML = `${e.message}
`; }
}
// ─── RECOMMENDATIONS ───
export async function loadRecommendations() {
const el = document.getElementById('reco-content');
const currentSong = S.queue[S.qIdx];
if(!currentSong) {
el.innerHTML = '🎵
Spiele zuerst Musik in deiner Bibliothek
🎧
Basierend auf
${esc(title)}
${esc(artist)}
`;
el.innerHTML = html + '';
if(S.cfg.lastfmKey) {
await loadLastfmRecommendations(el, artist, title, html);
} else {
await loadItunesFallbackRecommendations(el, artist, title, html);
const note = document.createElement('div');
note.style.cssText = 'margin-top:16px;padding:12px;background:var(--bg2);border:1px solid var(--border);border-radius:8px;font-size:12px;color:var(--text3)';
note.innerHTML = '💡 Tipp: Füge einen Last.fm API Key in den Einstellungen hinzu für bessere Empfehlungen & Similar Artists.';
el.appendChild(note);
}
} catch(e) { el.innerHTML = `${e.message}
`; }
}
async function loadLastfmRecommendations(el, artist, title, html) {
const BASE = 'https://ws.audioscrobbler.com/2.0';
const key = S.cfg.lastfmKey;
try {
const [simArtists, topTracks, simTracks] = await Promise.all([
fetch(`${BASE}/?method=artist.getSimilar&artist=${encodeURIComponent(artist)}&api_key=${key}&format=json&limit=12`).then(r=>r.json()),
fetch(`${BASE}/?method=artist.getTopTracks&artist=${encodeURIComponent(artist)}&api_key=${key}&format=json&limit=15`).then(r=>r.json()),
fetch(`${BASE}/?method=track.getSimilar&artist=${encodeURIComponent(artist)}&track=${encodeURIComponent(title)}&api_key=${key}&format=json&limit=15`).then(r=>r.json()),
]);
el.innerHTML = html;
const simArtistList = simArtists.similarartists?.artist || [];
const topTrackList = topTracks.toptracks?.track || [];
const simTrackList = simTracks.similartracks?.track || [];
if(simArtistList.length) {
el.innerHTML += `Ähnliche Künstler
`;
el.innerHTML += simArtistList.map(a => ``).join('');
el.innerHTML += '
';
}
if(simTrackList.length) {
const sec = document.createElement('div');
sec.innerHTML = `Ähnliche Tracks
`;
const list = document.createElement('div'); list.className = 'song-list';
simTrackList.slice(0,15).forEach(t => {
const row = document.createElement('div'); row.className = 'gtrack-item';
row.innerHTML = `
${esc(t.name)}
${esc(t.artist?.name||'')}
Top Tracks von ${esc(artist)}
`;
const list = document.createElement('div'); list.className = 'song-list';
topTrackList.slice(0,10).forEach(t => {
const row = document.createElement('div'); row.className = 'gtrack-item';
row.innerHTML = `
${esc(t.name)}
${esc(t.artist?.name||artist)}
Mehr von ${esc(artist)}
`;
const list = document.createElement('div'); list.className = 'song-list';
results.filter(t => t.artistName===artist).slice(0,15).forEach(t => list.appendChild(makeGlobalTrackItem(t, 0, [t])));
if(!list.children.length) results.slice(0,15).forEach(t => list.appendChild(makeGlobalTrackItem(t, 0, [t])));
sec.appendChild(list); el.appendChild(sec);
}
// ─── HELPERS ───
export function expandArtistBio() {
const el = document.getElementById('artist-bio-text');
if(el && window._artistBioFull) el.textContent = window._artistBioFull;
}
export function searchSimilarArtist(artistName) {
navigate('discover');
document.getElementById('global-search-input').value = artistName;
onGlobalSearch(artistName);
}
export async function searchAndPreview(trackName, artistName) {
try {
const res = await itunesSearch(trackName+' '+artistName, 'musicTrack', 1);
if(res[0]?.previewUrl) playPreview(res[0]); else toast('Kein Preview verfügbar');
} catch { toast('Suche fehlgeschlagen'); }
}
export async function s_goArtist(e, name, id) {
if(!name) return;
if(id) { navigate('artist-detail', {id, name}); return; }
try {
const r = await api('search3', `&query=${encodeURIComponent(name)}&artistCount=5&albumCount=0&songCount=0`);
const artists = r.searchResult3?.artist || [];
const match = artists.find(a => a.name.toLowerCase() === name.toLowerCase()) || artists[0];
if(match) navigate('artist-detail', {id: match.id, name: match.name});
else toast('Künstler nicht gefunden');
} catch { toast('Suche fehlgeschlagen'); }
}
export function s_goAlbum(e, albumId, albumName, artist, artistId) {
if(albumId) navigate('album-detail', {id:albumId, name:albumName, artist, artistId:artistId||'', coverArt:''});
}
export function playerBarGoAlbum() {
const s = S.queue[S.qIdx];
if(!s) return;
if(S.npOpen) closeNowPlaying();
if(s.albumId) navigate('album-detail', {id:s.albumId, name:s.album||'', artist:s.artist||'', artistId:s.artistId||'', coverArt:s.coverArt||''});
}
export function playerBarGoArtist() {
const s = S.queue[S.qIdx];
if(!s || !s.artist) return;
if(S.npOpen) closeNowPlaying();
navigate('artist-detail', {id: s.artistId||s.artist, name: s.artist});
}