===== QUICKPLAY =====
831:function quickPlay(row){

===== LLAMADAS QUICKPLAY =====
753:        quickPlay(el);
831:function quickPlay(row){
871:        quickPlay(row);
933:            if(typeof quickPlay === 'function') quickPlay(el);
946:        if(typeof quickPlay === 'function') quickPlay(row);

===== SETINTERVAL =====
1010:  setInterval(updateTopEpgProgress, 1000);

===== TOP DERECHO =====
295:.epgProgramNow{font-size:16px;font-weight:900;color:white;margin:2px 0 5px 0;line-height:1.08;max-width:620px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
302:.epgProgramNext{font-size:14px;font-weight:800;color:white;margin:2px 0;line-height:1.08;max-width:620px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
492:#epgRemainLive{
521:#epgRemainLive{
624:            <h2 id="channelTitle"><?=htmlspecialchars($selected["name"] ?? "Sin canal")?></h2>
629:              <div class="epgProgramNow"><?=htmlspecialchars($nowTitle)?></div>
634:                <div class="epgBarMini"><div id="epgBarFillLive" class="epgBarFill" style="width:<?=$progress?>%"></div></div>
635:                <span id="epgRemainLive"><?=$remainMin?> min</span>
639:              <div class="epgProgramNext"><?=htmlspecialchars($nextTitle)?></div>
833:    const title=document.getElementById('channelTitle');
994:    const fill = document.getElementById('epgBarFillLive');
995:    const remain = document.getElementById('epgRemainLive');

===== BLOQUE 820-1040 =====
    if(k === 'Enter'){
        e.preventDefault();
        enterItem();
        return;
    }
}, true);

setTimeout(setFocus, 500);
</script>

<script>
function quickPlay(row){
    const video=document.getElementById('mainVideo');
    const title=document.getElementById('channelTitle');
    if(!row || !video) return false;

    const url=row.getAttribute('data-play');
    const name=row.getAttribute('data-name') || 'Canal';

    if(!url) return false;

    document.querySelectorAll('.row').forEach(r=>r.classList.remove('active'));
    row.classList.add('active');

    if(title) title.textContent=name;

/* FOCO_PLAYER_AUTOMATICO_FINAL */
setTimeout(function(){
    document.querySelectorAll('.focus').forEach(function(x){x.classList.remove('focus');});
    var box=document.querySelector('.videoBox');
    if(box){
        box.classList.add('focus');
        box.setAttribute('tabindex','0');
        box.focus();
    }
},250);

    video.muted = false;
    video.volume = 1.0;
    if(video.src !== url){
        video.src = url;
    }
    video.play().catch(()=>{});

    return true;
}

document.addEventListener('click',function(e){
    const row=e.target.closest('.row');
    if(row){
        e.preventDefault();
        quickPlay(row);
    }
},true);
</script>

<script>
document.addEventListener('DOMContentLoaded',function(){
    const v=document.getElementById('mainVideo');
    if(v){
        v.muted=false;
        v.volume=1.0;
        v.addEventListener('dblclick',function(){
            if(v.requestFullscreen) v.requestFullscreen();
            else if(v.webkitRequestFullscreen) v.webkitRequestFullscreen();
        });
    }
});
</script>

<script>
let lastRow = null;
let lastTime = 0;

function abrirFullscreenActual(){
    const v=document.getElementById('mainVideo');
    const focused=document.querySelector('.focus.row');
    const active=document.querySelector('.row.active');

    let url = "";

    if(focused && focused.getAttribute('data-play')) url = focused.getAttribute('data-play');
    else if(active && active.getAttribute('data-play')) url = active.getAttribute('data-play');
    else if(v && v.currentSrc) url = v.currentSrc;
    else if(v && v.src) url = v.src;

    if(!url) return;

    if(window.PuntozAndroid && PuntozAndroid.abrirFullscreen){
        PuntozAndroid.abrirFullscreen(url);
        return;
    }

    if(v.requestFullscreen) v.requestFullscreen();
    else if(v.webkitRequestFullscreen) v.webkitRequestFullscreen();
}

document.addEventListener('keydown',function(e){
    if(e.key !== 'Enter') return;

    const el=document.querySelector('.focus');

    if(el && el.classList.contains('videoBox')){
        e.preventDefault();
        abrirFullscreenActual();
        return;
    }

    if(el && el.classList.contains('row')){
        const now=Date.now();

        if(lastRow === el && (now-lastTime) < 700){
            e.preventDefault();
            if(typeof quickPlay === 'function') quickPlay(el);
            setTimeout(abrirFullscreenActual,250);
            return;
        }

        lastRow = el;
        lastTime = now;
    }
},true);

document.addEventListener('dblclick',function(e){
    const row=e.target.closest('.row');
    if(row){
        if(typeof quickPlay === 'function') quickPlay(row);
        setTimeout(abrirFullscreenActual,250);
    }
},true);
</script>





<script>
/* GLOW PROGRAMA SIGUE AL CANAL NAVEGADO */
(function(){
  function syncProgGlow(){
    document.querySelectorAll('.prog36.focusProg').forEach(function(x){
      x.classList.remove('focusProg');
    });

    var row = document.querySelector('.row36.focus');
    if(!row) return;

    var prog = row.querySelector('.prog36.nowProg');
    if(!prog) prog = row.querySelector('.prog36');

    if(prog) prog.classList.add('focusProg');
  }

  document.addEventListener('keydown', function(){
    setTimeout(syncProgGlow, 60);
  }, true);

  document.addEventListener('click', function(){
    setTimeout(syncProgGlow, 60);
  }, true);

  setTimeout(syncProgGlow, 600);
})();
</script>



<script>
/* BARRA EPG TIEMPO REAL */
(function(){
  const startTs = <?=intval($startTs)?>;
  const endTs = <?=intval($endTs)?>;

  function updateTopEpgProgress(){
    const fill = document.getElementById('epgBarFillLive');
    const remain = document.getElementById('epgRemainLive');

    if(!fill || !remain || !startTs || !endTs || endTs <= startTs) return;

    const now = Math.floor(Date.now() / 1000);
    const total = endTs - startTs;
    const elapsed = Math.max(0, Math.min(total, now - startTs));
    const progress = Math.max(0, Math.min(100, Math.round((elapsed / total) * 100)));
    const mins = Math.max(0, Math.ceil((endTs - now) / 60));

    fill.style.width = progress + '%';
    remain.textContent = mins + ' min';
  }

  updateTopEpgProgress();
  setInterval(updateTopEpgProgress, 1000);
})();
</script>

</body>
</html>

<style>
/* SUBIR SOLO PANEL SUPERIOR DERECHO */
.info{
  padding-top:22px!important;
}
.info h2{
  margin-top:-4px!important;
  margin-bottom:8px!important;
}
.epgDetail{
  margin-top:-2px!important;
}
</style>
