Rock Band Song Library

`; html += ``; html += ``; html += ``; html += ``; html += ``; html += ``; } spacerEl.innerHTML = html; // Attach click and keyboard handlers for detail sheet spacerEl.querySelectorAll('.row').forEach(row => { const handleOpen = () => { const idx = parseInt(row.dataset.index); openSheet(filtered[idx]); }; row.addEventListener('click', handleOpen); row.addEventListener('keydown', (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); handleOpen(); } }); }); }); } // Throttled scroll handler let scrollFrame; scrollEl.addEventListener('scroll', () => { cancelAnimationFrame(scrollFrame); scrollFrame = requestAnimationFrame(render); }); // Detail bottom sheet const sheetBackdrop = document.getElementById('sheet-backdrop'); const sheet = document.getElementById('sheet'); function diffTierHtml(ch) { if (ch === '?') { return `Unknown`; } const n = parseInt(ch, 36); if (isNaN(n)) { return `Unknown`; } // Color: normal text for 0-4, orange for 5, red for 6+ let color = 'var(--text)'; if (n === 5) color = 'var(--tier-orange)'; else if (n >= 6) color = 'var(--tier-red)'; // Label: "N Name" for tiers 0-6, "Tier N" for 7+ const label = n < DIFF_NAMES.length ? `${n} ${DIFF_NAMES[n]}` : `Tier ${n}`; return `${label}`; } function openSheet(r) { document.getElementById('sheet-title').textContent = r.t; document.getElementById('sheet-artist').textContent = r.a; document.getElementById('sheet-album').textContent = r.al || '—'; document.getElementById('sheet-year').textContent = r.y || '—'; document.getElementById('sheet-length').textContent = fmtLen(r.l); document.getElementById('sheet-genre').textContent = r.g !== null && r.g !== undefined ? GENRES[r.g] : '—'; document.getElementById('sheet-vocals').textContent = r.vp >= 2 ? `${r.vp} Harmony Parts` : (r.vp === 1 ? 'Solo Vocals' : 'None'); // Decode difficulties let diffHtml = ''; for (let i = 0; i < PART_ORDER.length; i++) { const part = PART_ORDER[i]; const ch = r.d ? r.d[i] : '.'; if (ch === '.') { continue; // Part absent, skip } const partLabel = PART_LABELS[part]; const tierHtml = diffTierHtml(ch); diffHtml += ``; } document.getElementById('sheet-diffs').innerHTML = diffHtml; sheetBackdrop.classList.add('open'); sheet.classList.add('open'); } function closeSheet() { sheetBackdrop.classList.remove('open'); sheet.classList.remove('open'); } sheetBackdrop.addEventListener('click', (e) => { if (e.target === sheetBackdrop) { closeSheet(); } }); document.addEventListener('keydown', (e) => { if (e.key === 'Escape') { closeSheet(); } }); // Swipe-down gesture to close let sheetTouchStart; let sheetTouchStartY; sheet.addEventListener('touchstart', (e) => { sheetTouchStart = true; sheetTouchStartY = e.touches[0].clientY; }, {passive: true}); sheet.addEventListener('touchmove', (e) => { if (!sheetTouchStart) return; const currentY = e.touches[0].clientY; const diff = currentY - sheetTouchStartY; if (diff > 50) { closeSheet(); sheetTouchStart = false; } }, {passive: true}); sheet.addEventListener('touchend', () => { sheetTouchStart = false; }); // Populate footer with metadata const footerMeta = document.getElementById('footer-meta'); if (footerMeta && META && META.generated) { let footerText = `Generated ${META.generated}`; if (META.source) { footerText += ` from ${META.source}`; } footerMeta.textContent = footerText; } // Initial render updateSortIndicators(); filter();