static/vtv_init.js

// ===== VNEWS VTV Player v11 + FPT Play — Simple toggle like VTV6 =====
(function() {
  if (window._vtvInitLoaded) return;
  window._vtvInitLoaded = true;

  var CHANNELS = [
    {id:'vtv1',name:'VTV1',badge:'Tin tức'},{id:'vtv2',name:'VTV2',badge:'Khoa học'},
    {id:'vtv3',name:'VTV3',badge:'Giải trí'},{id:'vtv4',name:'VTV4',badge:'Quốc Tế'},
    {id:'vtv5',name:'VTV5',badge:'Miền Nam'},{id:'vtv6',name:'VTV6',badge:'Thanh Niên'},
    {id:'vtv7',name:'VTV7',badge:'Giáo Dục'},{id:'vtv8',name:'VTV8',badge:'Miền Trung'},
    {id:'vtv9',name:'VTV9',badge:'Miền Bắc'},{id:'vtv10',name:'VTV10',badge:'Cần Thơ'},
    {id:'vtvprime',name:'VTVPrime',badge:'Prime'},
    {id:'fpt-the-thao',name:'FPT',badge:'Thể Thao'},
  ];

  // FPT Play iframe source — lấy từ iframe #1 của https://hd1.xemtv.net/kenh-fptplay-truc-tuyen-the-thao.html
  // Trang đó có 3 iframe: ads/below1.php (quảng cáo), ads/below.php (quảng cáo), kenh/fptplay.php (stream chính)
  var _fptIfUrl = 'https://hd1.xemtv.net/kenh/fptplay.php';

  var _currentCh = null;
  var _epgTimer = null;
  var _epgData = [];
  var _timeTimer = null;
  var _serverDate = '';
  var _nativeMode = false;
  var _hls = null;

  // ===== CSS =====
  (function injectCSS() {
    if (document.getElementById('vtv-pro-css')) return;
    var s = document.createElement('style');
    s.id = 'vtv-pro-css';
    s.textContent = [
      '#vtv-player-section{display:block!important;margin:8px 0 10px;background:linear-gradient(180deg,#0a0e17,#111622);border:1px solid rgba(0,150,255,.15);border-radius:14px;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}',
      '#vtv-player-section .vtv-pro-head{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(90deg,#0a1628,rgba(0,102,204,.08))}',
      '#vtv-player-section .vtv-pro-logo{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#0066cc,#00ccff);display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;font-weight:800;flex-shrink:0}',
      '#vtv-player-section .vtv-pro-title{font-size:13px;font-weight:700;color:#e8eaed;letter-spacing:.3px}',
      '#vtv-player-section .vtv-pro-live{font-size:9px;font-weight:700;color:#00cc88;background:rgba(0,204,136,.12);padding:2px 8px;border-radius:10px;display:flex;align-items:center;gap:4px;margin-left:auto}',
      '#vtv-player-section .vtv-pro-live-dot{width:5px;height:5px;border-radius:50%;background:#00cc88;animation:vtv-pro-pulse 1.2s infinite}',
      '@keyframes vtv-pro-pulse{0%,100%{opacity:1}50%{opacity:.3}}',
      '#vtv-player-section .vtv-pro-tabs{display:flex;flex-wrap:wrap;gap:2px;padding:6px 10px 8px;overflow-x:auto;scrollbar-width:none}',
      '#vtv-player-section .vtv-pro-tabs::-webkit-scrollbar{display:none}',
      '#vtv-player-section .vtv-pro-tab{padding:5px 10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:8px;color:#9aa0a6;font-size:10px;font-weight:500;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:all .2s ease}',
      '#vtv-player-section .vtv-pro-tab:hover{background:rgba(0,102,204,.1);border-color:rgba(0,102,204,.3);color:#e8eaed}',
      '#vtv-player-section .vtv-pro-tab.on{background:rgba(0,102,204,.2);border-color:#0066cc;color:#fff;font-weight:600}',
      '#vtv-player-section .vtv-pro-tab.fpt{background:rgba(255,100,0,.04);border-color:rgba(255,120,0,.08);color:#ffa866}',
      '#vtv-player-section .vtv-pro-tab.fpt.on{background:rgba(255,100,0,.2);border-color:#ff6400;color:#fff}',
      '#vtv-player-section .vtv-pro-tab .b{font-size:7px;opacity:.5;display:block;margin-top:1px}',
      '#vtv-player-section .vtv-pro-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;min-height:200px;border-top:1px solid rgba(255,255,255,.04)}',
      '#vtv-player-section .vtv-pro-frame iframe{position:absolute;inset:0;width:100%!important;height:100%!important;border:none;background:#000}',
      '#vtv-player-section .vtv-pro-frame video{position:absolute;inset:0;width:100%;height:100%;background:#000}',
      '#vtv-player-section .vtv-pro-load{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:200px;gap:12px;color:#9aa0a6;font-size:12px}',
      '#vtv-player-section .vtv-pro-spinner{width:28px;height:28px;border:2px solid rgba(255,255,255,.06);border-top-color:#0066cc;border-radius:50%;animation:vtv-pro-spin .7s linear infinite}',
      '@keyframes vtv-pro-spin{to{transform:rotate(360deg)}}',
      '#vtv-player-section .vtv-pro-err{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:200px;gap:10px;color:#9aa0a6;font-size:12px;text-align:center;padding:20px}',
      '#vtv-player-section .vtv-pro-err .icon{font-size:28px;opacity:.5}',
      '#vtv-player-section .vtv-pro-err .msg{color:#9aa0a6}',
      '#vtv-player-section .vtv-pro-err button{background:rgba(0,102,204,.15);border:1px solid rgba(0,102,204,.3);color:#8ab4f8;padding:7px 16px;border-radius:8px;font-size:11px;cursor:pointer;transition:all .15s}',
      '#vtv-player-section .vtv-pro-err button:hover{background:rgba(0,102,204,.25)}',
      '#vtv-player-section .vtv-pro-controls{display:flex;align-items:center;gap:6px;padding:6px 12px;background:rgba(0,0,0,.3);border-top:1px solid rgba(255,255,255,.04)}',
      '#vtv-player-section .vtv-pro-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#9aa0a6;font-size:10px;padding:4px 10px;border-radius:6px;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:4px}',
      '#vtv-player-section .vtv-pro-btn:hover{background:rgba(0,102,204,.12);color:#e8eaed}',
      '#vtv-player-section .vtv-pro-switch{font-size:9px;padding:3px 8px;background:rgba(0,150,255,.08);border:1px solid rgba(0,150,255,.2);color:#8ab4f8;border-radius:6px;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:3px;white-space:nowrap}',
      '#vtv-player-section .vtv-pro-switch:hover{background:rgba(0,150,255,.2)}',
      '#vtv-player-section .vtv-pro-switch.active{background:rgba(0,204,136,.12);border-color:rgba(0,204,136,.3);color:#00cc88}',
      '#vtv-player-section .vtv-pro-epg{border-top:1px solid rgba(255,255,255,.04);background:rgba(0,0,0,.15)}',
      '#vtv-player-section .vtv-pro-epg-hdr{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 4px}',
      '#vtv-player-section .vtv-pro-epg-title{font-size:10px;font-weight:600;color:#9aa0a6;letter-spacing:.5px;text-transform:uppercase}',
      '#vtv-player-section .vtv-pro-epg-time{font-size:9px;color:#5f6368;font-variant-numeric:tabular-nums}',
      '#vtv-player-section .vtv-pro-epg-list{padding:2px 8px 10px;display:flex;flex-direction:column;gap:2px;max-height:200px;overflow-y:auto;scrollbar-width:thin}',
      '#vtv-player-section .vtv-pro-epg-list::-webkit-scrollbar{width:3px}',
      '#vtv-player-section .vtv-pro-epg-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}',
      '#vtv-player-section .vtv-pro-epg-row{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:6px;transition:all .2s;border-left:2px solid transparent;font-size:11px}',
      '#vtv-player-section .vtv-pro-epg-row:hover{background:rgba(255,255,255,.03)}',
      '#vtv-player-section .vtv-pro-epg-row.now{border-left-color:#00cc88;background:rgba(0,204,136,.06)}',
      '#vtv-player-section .vtv-pro-epg-row.passed{opacity:.35}',
      '#vtv-player-section .vtv-pro-epg-row .t{font-size:10px;color:#5f6368;min-width:38px;font-variant-numeric:tabular-nums}',
      '#vtv-player-section .vtv-pro-epg-row.now .t{color:#00cc88;font-weight:600}',
      '#vtv-player-section .vtv-pro-epg-row .n{color:#e8eaed;line-height:1.3}',
      '#vtv-player-section .vtv-pro-epg-row.now .n{color:#fff;font-weight:500}',
      '#vtv-player-section .vtv-pro-epg-row .bar{flex:0 0 2px;height:12px;border-radius:1px;background:rgba(255,255,255,.08)}',
      '#vtv-player-section .vtv-pro-epg-row.now .bar{background:#00cc88}',
      '#vtv-player-section .vtv-pro-epg-row .d{font-size:8px;color:#5f6368;min-width:30px;text-align:right}',
      '#vtv-player-section .vtv-pro-epg-empty{color:#5f6368;font-size:11px;padding:12px 14px;text-align:center}',
      '#vtv-player-section .vtv-pro-epg-load{color:#5f6368;font-size:11px;padding:12px 14px;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}',
    ].join('');
    document.head.appendChild(s);
  })();

  function formatTime(d) {
    var h = d.getHours(), m = d.getMinutes();
    return (h < 10 ? '0' : '') + h + ':' + (m < 10 ? '0' : '') + m;
  }

  function getVNTime() {
    var now = new Date();
    try {
      var opts = { timeZone: 'Asia/Ho_Chi_Minh', hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false, year: 'numeric', month: '2-digit', day: '2-digit' };
      var parts = new Intl.DateTimeFormat('en-CA', opts).formatToParts(now);
      var hh=0,mm=0,ss=0,yy=2026,mo=1,dd=1;
      for (var i = 0; i < parts.length; i++) {
        var p = parts[i];
        if (p.type === 'hour') hh = parseInt(p.value);
        else if (p.type === 'minute') mm = parseInt(p.value);
        else if (p.type === 'second') ss = parseInt(p.value);
        else if (p.type === 'year') yy = parseInt(p.value);
        else if (p.type === 'month') mo = parseInt(p.value);
        else if (p.type === 'day') dd = parseInt(p.value);
      }
      return new Date(yy, mo - 1, dd, hh, mm, ss);
    } catch(e) {
      var utc = new Date(now.getTime() + now.getTimezoneOffset() * 60000);
      return new Date(utc.getTime() + 7 * 3600000);
    }
  }

  // ===== EPG =====
  function loadEPG(chId) {
    if (chId.indexOf('fpt') >= 0) return; // FPT ko có EPG
    var epgEl = document.getElementById('vtv-pro-epg-body');
    if (!epgEl) return;
    epgEl.innerHTML = '<div class="vtv-pro-epg-load"><div class="vtv-pro-spinner" style="width:12px;height:12px;border-width:1.5px;flex-shrink:0"></div>Đang tải lịch...</div>';
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/api/vtv/epg/' + chId, true);
    xhr.timeout = 15000;
    xhr.onload = function() {
      try {
        var data = JSON.parse(xhr.responseText);
        _serverDate = data.date || '';
        _epgData = data.programs || [];
        renderEPG();
      } catch(e) { epgEl.innerHTML = '<div class="vtv-pro-epg-empty">Không có lịch phát sóng</div>'; }
    };
    xhr.onerror = xhr.ontimeout = function() {
      epgEl.innerHTML = '<div class="vtv-pro-epg-empty">Không tải được lịch phát sóng</div>';
    };
    xhr.send();
  }

  function renderEPG() {
    var epgEl = document.getElementById('vtv-pro-epg-body');
    if (!epgEl || !_epgData || !_epgData.length) {
      if (epgEl) epgEl.innerHTML = '<div class="vtv-pro-epg-empty">Chưa có lịch phát sóng</div>';
      return;
    }
    var vnNow = getVNTime();
    var nowStr = formatTime(vnNow);
    _epgData.sort(function(a, b) { return a.time.localeCompare(b.time); });
    for (var i = 0; i < _epgData.length; i++) {
      _epgData[i].now = false;
      var p = _epgData[i], nxt = _epgData[i + 1];
      if (p.time <= nowStr && (!nxt || nxt.time > nowStr)) { p.now = true; p.end_time = nxt ? nxt.time : ''; }
    }
    var html = '', prevDate = '';
    for (var i = 0; i < _epgData.length; i++) {
      var p = _epgData[i];
      var cls = 'vtv-pro-epg-row';
      if (p.now) cls += ' now';
      else if (p.time < nowStr) cls += ' passed';
      var xt = p.end_time ? ' -> ' + p.end_time : (i < _epgData.length - 1 ? ' -> ' + _epgData[i+1].time : '');
      var db = '';
      if (p.date && p.date !== prevDate) { db = '<span class="d">' + p.date + '</span>'; prevDate = p.date; }
      html += '<div class="' + cls + '"><span class="t">' + p.time + xt + '</span><span class="bar"></span><span class="n">' + p.title + '</span>' + db + '</div>';
    }
    epgEl.innerHTML = html;
    var nowEl = epgEl.querySelector('.now');
    if (nowEl) nowEl.scrollIntoView({ block: 'center', behavior: 'smooth' });
  }

  function startEpgRefresh() {
    if (_epgTimer) clearInterval(_epgTimer);
    _epgTimer = setInterval(function() { if (_currentCh && _currentCh.indexOf('fpt') < 0) loadEPG(_currentCh); }, 60000);
  }

  function updateClock() {
    var timeEl = document.getElementById('vtv-pro-time');
    if (timeEl) {
      var vn = getVNTime();
      timeEl.textContent = formatTime(vn) + ' GMT+7' + (_serverDate ? ' - ' + _serverDate : '');
    }
  }

  // ===== Destroy HLS player =====
  function destroyHLS() {
    if (_hls) {
      try { _hls.destroy(); } catch(e) {}
      _hls = null;
    }
  }

  // ===== Play native HLS via proxy =====
  function playNativeHLS(m3u8Url) {
    destroyHLS();
    var frame = document.getElementById('vtv-pro-frame');
    if (!frame) return;
    frame.innerHTML = '<video id="vtv-native-video" controls autoplay playsinline webkit-playsinline style="position:absolute;inset:0;width:100%;height:100%;background:#000"></video>';
    var video = document.getElementById('vtv-native-video');
    if (!video) return;
    if (typeof Hls !== 'undefined' && Hls.isSupported()) {
      _hls = new Hls({ enableWorker: false });
      _hls.loadSource(m3u8Url);
      _hls.attachMedia(video);
      _hls.on(Hls.Events.MANIFEST_PARSED, function() {
        video.play().catch(function(){});
      });
      _hls.on(Hls.Events.ERROR, function(evt, data) {
        if (data.fatal) {
          destroyHLS();
          video.src = m3u8Url;
          video.play().catch(function(){});
        }
      });
    } else {
      video.src = m3u8Url;
    }
  }

  // ===== Load iframe into frame =====
  function loadIframe(iframeUrl) {
    destroyHLS();
    var frame = document.getElementById('vtv-pro-frame');
    if (!frame) return;
    var iframe = document.createElement('iframe');
    iframe.src = iframeUrl;
    iframe.setAttribute('allowfullscreen', 'true');
    iframe.setAttribute('allow', 'autoplay; encrypted-media; fullscreen');
    iframe.style.cssText = 'position:absolute;inset:0;width:100%;height:100%;border:none;background:#000';
    frame.innerHTML = '';
    frame.appendChild(iframe);
  }

  // ===== Fetch stream data for any channel including FPT =====
  function fetchStreamData(chId, callback) {
    if (chId.indexOf('fpt') >= 0) {
      // FPT Play: use iframe #1 from hd1.xemtv.net page (kenh/fptplay.php)
      callback({ iframe_url: _fptIfUrl });
      return;
    }
    // All other channels: use server API
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/api/vtv/stream/' + chId, true);
    xhr.timeout = 15000;
    xhr.onload = function() {
      try {
        callback(JSON.parse(xhr.responseText));
      } catch(e) { callback(null); }
    };
    xhr.onerror = xhr.ontimeout = function() { callback(null); };
    xhr.send();
  }

  // ===== Switch channel =====
  window._vtvProSwitch = function(chId) {
    _currentCh = chId;
    _nativeMode = false;

    // Update tabs
    var tabs = document.querySelectorAll('#vtv-player-section .vtv-pro-tab');
    for (var i = 0; i < tabs.length; i++) {
      var t = tabs[i];
      var isActive = (t.getAttribute('data-ch') === chId);
      t.className = 'vtv-pro-tab' + (isActive ? ' on' : '') + (isActive && chId.indexOf('fpt') >= 0 ? ' fpt on' : '');
    }

    var toggleBtn = document.getElementById('vtv-pro-toggle-btn');

    // Show/hide toggle button (same for all channels including FPT)
    if (toggleBtn) {
      toggleBtn.style.display = '';
      toggleBtn.classList.remove('active');
      toggleBtn.innerHTML = '\ud83d\udd0c JWPlayer';
    }

    // Loading state
    var frame = document.getElementById('vtv-pro-frame');
    if (frame) frame.innerHTML = '<div class="vtv-pro-load"><div class="vtv-pro-spinner"></div><span>Đang kết nối ' + chId.toUpperCase() + '...</span></div>';
    destroyHLS();
    updateClock();
    loadEPG(chId);
    startEpgRefresh();

    // Fetch stream and load
    fetchStreamData(chId, function(data) {
      if (!data || !data.iframe_url) {
        frame.innerHTML = '<div class="vtv-pro-err"><div class="icon">\ud83d\udce1</div><div class="msg">Kênh không khả dụng</div><button onclick="_vtvProSwitch(\''+chId+'\')">Thử lại</button></div>';
        return;
      }
      loadIframe(data.iframe_url);
    });
  };

  // ===== Toggle iframe / native HLS (for all channels including FPT) =====
  window._vtvToggleNative = function(btn) {
    if (!_currentCh) return;
    _nativeMode = !_nativeMode;
    btn.classList.toggle('active', _nativeMode);
    btn.innerHTML = _nativeMode ? '\ud83d\udce1 HLS' : '\ud83d\udd0c JWPlayer';

    var frame = document.getElementById('vtv-pro-frame');
    if (!frame) return;

    if (_currentCh.indexOf('fpt') >= 0) {
      // FPT mode: toggle between iframe and HLS
      if (_nativeMode) {
        // Switch to HLS
        destroyHLS();
        playNativeHLS('/api/proxy/m3u8?url=https://live.fptplay53.net/epzhd1/htvcthethao_vhls.smil/chunklist.m3u8');
      } else {
        // Switch back to iframe
        loadIframe(_fptIfUrl);
      }
    } else {
      // VTV mode: toggle via server
      var xhr = new XMLHttpRequest();
      xhr.open('GET', '/api/vtv/stream/' + _currentCh, true);
      xhr.timeout = 15000;
      xhr.onload = function() {
        try {
          var data = JSON.parse(xhr.responseText);
          if (_nativeMode) {
            var m3u8Url = data.m3u8_proxy_url || data.proxy_url_hls || data.stream_url;
            if (m3u8Url) {
              playNativeHLS(m3u8Url);
            } else {
              frame.innerHTML = '<div class="vtv-pro-err"><div class="icon">\ud83d\udce1</div><div class="msg">Kênh không hỗ trợ HLS</div></div>';
              _nativeMode = false;
              btn.classList.remove('active');
              btn.innerHTML = '\ud83d\udd0c JWPlayer';
            }
          } else {
            if (data.iframe_url) loadIframe(data.iframe_url);
          }
        } catch(e) { frame.innerHTML = '<div class="vtv-pro-err"><div class="icon">\u26a0\ufe0f</div></div>'; }
      };
      xhr.onerror = function() { frame.innerHTML = '<div class="vtv-pro-err"><div class="icon">\ud83d\udd0c</div><div class="msg">Lỗi kết nối</div></div>'; };
      xhr.send();
    }
  };

  // ===== HTML builder =====
  function buildHTML() {
    var tabs = '';
    for (var i = 0; i < CHANNELS.length; i++) {
      var ch = CHANNELS[i];
      var isFpt = ch.id.indexOf('fpt') >= 0;
      tabs += '<span class="vtv-pro-tab' + (isFpt ? ' fpt' : '') + '" data-ch="'+ch.id+'" onclick="_vtvProSwitch(\''+ch.id+'\')" ' + (isFpt ? 'data-fpt="true"' : '') + '>' +
        ch.name + '<span class="b">'+ch.badge+'</span></span>';
    }
    return '<div id="vtv-player-section">' +
      '<div class="vtv-pro-head">' +
      '<div class="vtv-pro-logo">V</div>' +
      '<span class="vtv-pro-title">VTV Player</span>' +
      '<span class="vtv-pro-live"><span class="vtv-pro-live-dot"></span>TRỰC TIẾP</span>' +
      '</div>' +
      '<div class="vtv-pro-tabs">'+tabs+'</div>' +
      '<div class="vtv-pro-frame" id="vtv-pro-frame">' +
      '<div class="vtv-pro-load"><div class="vtv-pro-spinner"></div><span>Chọn kênh để xem trực tiếp</span></div>' +
      '</div>' +
      '<div class="vtv-pro-controls">' +
      '<span id="vtv-pro-time" class="vtv-pro-btn" style="background:none;border:none;font-size:10px;color:#5f6368;margin-right:auto"></span>' +
      '<span class="vtv-pro-switch" id="vtv-pro-toggle-btn" onclick="_vtvToggleNative(this)">\ud83d\udd0c JWPlayer</span>' +
      '</div>' +
      '<div class="vtv-pro-epg">' +
      '<div class="vtv-pro-epg-hdr"><span class="vtv-pro-epg-title">Lịch phát sóng \u2014 nguồn VTV.vn</span></div>' +
      '<div class="vtv-pro-epg-list" id="vtv-pro-epg-body"><div class="vtv-pro-epg-empty">Chọn kênh để xem lịch phát sóng</div></div>' +
      '</div>' +
      '</div>';
  }

  function inject() {
    var homeEl = document.getElementById('view-home');
    if (!homeEl || document.getElementById('vtv-player-section')) return;
    var featured = document.getElementById('home-featured-area') || homeEl.querySelector('.featured-match, .fm-section, .slider-wrap');
    if (featured && featured.parentNode) featured.insertAdjacentHTML('afterend', buildHTML());
    else if (homeEl.firstChild) homeEl.insertAdjacentHTML('afterbegin', buildHTML());
    setTimeout(function() { if (window._vtvProSwitch) window._vtvProSwitch('vtv6'); }, 500);
  }

  var orig = window.loadHome;
  if (typeof orig === 'function') {
    window.loadHome = function() {
      var r = orig.apply(this, arguments);
      if (r && typeof r.then === 'function') return r.then(function(v) { setTimeout(inject, 2000); return v; });
      else { setTimeout(inject, 2000); return r; }
    };
  } else {
    (function waitAndInject() {
      if (document.getElementById('view-home') && !document.getElementById('vtv-player-section')) inject();
      else if (!document.getElementById('vtv-player-section')) setTimeout(waitAndInject, 1000);
    })();
  }
})();