(function () {
  var line = document.getElementById('radio-nowplaying');
  var el = document.getElementById('radio-nowplaying-title');
  if (!line || !el) return;
  var pollMs = 30000;
  var backoffMs = pollMs;

  // childNodes[0] is the "Now playing: " text node before the <span>.
  function setLabel(text) {
    if (line.childNodes[0] && line.childNodes[0].nodeType === 3) {
      line.childNodes[0].textContent = text;
    }
  }
  function setOffline() {
    setLabel('Radio: ');
    el.textContent = 'currently offline';
  }
  function setPlaying(title) {
    setLabel('Now playing: ');
    el.textContent = title;
  }

  function tick() {
    fetch('/api/nowplaying.php', { cache: 'no-store' })
      .then(function (r) { return r.ok ? r.json() : Promise.reject(r.status); })
      .then(function (j) {
        var title = j && j.title ? String(j.title).trim() : '';
        if (title) { setPlaying(title); } else { setOffline(); }
        backoffMs = pollMs;
      })
      .catch(function () {
        setOffline();
        backoffMs = Math.min(backoffMs * 2, 5 * 60 * 1000);
      })
      .finally(function () { setTimeout(tick, backoffMs); });
  }
  if (document.visibilityState !== 'hidden') tick();
  document.addEventListener('visibilitychange', function () {
    if (document.visibilityState === 'visible') tick();
  });
})();