(function(){
  const name = window.__STREAM_NAME__; // oder: document.body.dataset.name
  const v = document.getElementById('v');
  const liveEl = document.getElementById('live');
  const viewersEl = document.getElementById('viewers');
  const srcEl = document.getElementById('hlssrc');

  function updateLive(live){ 
    liveEl.className = 'pill ' + (live ? 'live' : 'off');
    liveEl.textContent = live ? 'LIVE' : 'Offline';
  }

  async function refresh(){
    const r = await fetch('/api/streams');
    const d = await r.json();
    const it = d.items.find(x=>x.name===name);
    const live = !!(it && it.live);
    updateLive(live);
    viewersEl.textContent = 'Zuschauer: ' + (it ? it.viewers : 0);
    if(live){
      const src = '/hls/'+encodeURIComponent(name);
      srcEl.textContent = src;
      if (window.Hls && Hls.isSupported()){
        if(!window._hls){ window._hls = new Hls(); window._hls.attachMedia(v); }
        window._hls.loadSource(src);
      } else if (v.canPlayType('application/vnd.apple.mpegurl')) {
        v.src = src;
      }
    }
  }

  refresh(); setInterval(refresh, 2500);
})();