/* global React */
/* Album cover loader — fetches real artwork from iTunes Search API at runtime, persisted to localStorage. */

const LS_KEY = 'disco_album_cache_v1';
const LS_TTL_MS = 1000 * 60 * 60 * 24 * 30; // 30 days

const SEED_CACHE = {
  'Starfucker Slayyyter': 'https://is1-ssl.mzstatic.com/image/thumb/Music211/v4/e7/41/d8/e741d8f3-f8db-d401-5d93-fdfd69d8f17e/196873835891.jpg/600x600bb.jpg',
  'My 21st Century Blues RAYE': 'https://is1-ssl.mzstatic.com/image/thumb/Music221/v4/50/05/10/5005106d-bb8a-32db-1172-f18405cf4a46/820200038890.jpg/600x600bb.jpg',
  'Born to Die Lana Del Rey': 'https://is1-ssl.mzstatic.com/image/thumb/Music114/v4/5e/30/32/5e30329b-2765-60a6-96b8-8151c4b15a01/12UMGIM54175.rgb.jpg/600x600bb.jpg',
  'Channel Orange Frank Ocean': 'https://is1-ssl.mzstatic.com/image/thumb/Music125/v4/04/f8/63/04f863fc-2852-604f-c910-a97ac069506b/12UMGIM40339.rgb.jpg/600x600bb.jpg',
};

function loadPersistedCache() {
  try {
    const raw = localStorage.getItem(LS_KEY);
    if (!raw) return {};
    const parsed = JSON.parse(raw);
    const now = Date.now();
    const fresh = {};
    Object.keys(parsed).forEach(k => {
      if (parsed[k] && (now - parsed[k].t) < LS_TTL_MS) fresh[k] = parsed[k].u;
    });
    return fresh;
  } catch { return {}; }
}
function persistCache() {
  try {
    const out = {};
    const now = Date.now();
    Object.keys(ALBUM_CACHE).forEach(k => {
      out[k] = { u: ALBUM_CACHE[k], t: now };
    });
    localStorage.setItem(LS_KEY, JSON.stringify(out));
  } catch {}
}

const ALBUM_CACHE = Object.assign({}, SEED_CACHE, loadPersistedCache());
const ALBUM_LISTENERS = {};

function fetchAlbumArt(query, callback) {
  if (query in ALBUM_CACHE) { callback(ALBUM_CACHE[query]); return; }
  if (ALBUM_LISTENERS[query]) { ALBUM_LISTENERS[query].push(callback); return; }
  ALBUM_LISTENERS[query] = [callback];

  const cbName = 'itcb_' + Math.random().toString(36).slice(2);
  window[cbName] = function(data) {
    delete window[cbName];
    const url = data.results && data.results[0] && data.results[0].artworkUrl100;
    const hi = url ? url.replace('100x100bb', '600x600bb') : null;
    ALBUM_CACHE[query] = hi;
    persistCache();
    (ALBUM_LISTENERS[query] || []).forEach(fn => fn(hi));
    delete ALBUM_LISTENERS[query];
  };
  const s = document.createElement('script');
  s.src = `https://itunes.apple.com/search?term=${encodeURIComponent(query)}&entity=album&limit=1&callback=${cbName}`;
  document.head.appendChild(s);
  s.onload = () => s.remove();
  s.onerror = () => { ALBUM_CACHE[query] = null; persistCache(); (ALBUM_LISTENERS[query]||[]).forEach(fn=>fn(null)); delete ALBUM_LISTENERS[query]; s.remove(); };
}

function useAlbumArt(query) {
  const [url, setUrl] = React.useState(ALBUM_CACHE[query] || null);
  React.useEffect(() => {
    if (!query) return;
    fetchAlbumArt(query, (u) => setUrl(u));
  }, [query]);
  return url;
}

/* A component that renders a real album cover image */
function RealCover({ query, size = 110, fallbackPalette = 'pal-pink-violet', radius = 6, children }) {
  const url = useAlbumArt(query);
  const baseStyle = {
    width: size, height: size, borderRadius: radius, overflow: 'hidden',
    position: 'relative', display: 'block', flexShrink: 0,
    background: '#1C1A2E',
  };
  if (url) {
    return (
      <div style={baseStyle}>
        <img src={url} alt={query} style={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }} crossOrigin="anonymous" />
        {children}
      </div>
    );
  }
  return (
    <div className={fallbackPalette} style={baseStyle}>
      {children}
    </div>
  );
}

Object.assign(window, { useAlbumArt, RealCover, fetchAlbumArt });
