Restore VTV cluster: static/app_v2.js from cf2f9c7

static/app_v2.js

@@ -1,237 +1,37 @@
 // === VNEWS Frontend v2 - Full Functions ===
 // Updated: Voice selector + speed control + image gallery + auto voice detect
 
-// === FETCH WITH TIMEOUT (prevent homepage hang) ===
-function fetchWithTimeout(url, opts, ms){
-  const ctrl = new AbortController();
-  const tid = setTimeout(()=>ctrl.abort(), ms||10000);
-  return fetch(url, {...opts, signal: ctrl.signal}).then(r=>{clearTimeout(tid);return r}).catch(e=>{clearTimeout(tid);throw e});
-}
-
-// === LOAD HOME (progressive — show skeleton first, fill data as it arrives) ===
+// === LOAD HOME ===
 async function loadHome(){
-  // 1. Render skeleton immediately so page never hangs
-  const home = document.getElementById('view-home');
-  home.innerHTML = '<div class="loading" id="home-loading" style="padding:20px;text-align:center;color:#777">⚡ Đang tải nhanh...</div>'
-    + '<div id="home-featured"></div>'
-    + '<div id="home-ai-compose"></div>'
-    + '<div id="home-hashtag"></div>'
-    + '<div id="home-livescore"></div>'
-    + '<div id="home-wc-shorts"></div>'
-    + '<div id="home-wc2026"></div>'
-    + '<div id="home-short-ai"></div>'
-    + '<div id="home-shorts"></div>'
-    + '<div id="home-wall"></div>'
-    + '<div id="home-highlights"></div>'
-    + '<div id="home-ai"></div>';
-
-  // 2. Fire all fetches in parallel (non-blocking)
-  const promises = {
-    featured: fetchWithTimeout('/api/livescore/featured',null,8000).then(r=>r.json()).catch(()=>null),
-    shorts: fetchWithTimeout('/api/shorts',null,8000).then(r=>r.json()).catch(()=>[]),
-    wall: fetchWithTimeout('/api/wall',null,8000).then(r=>r.json()).catch(()=>({posts:[]})),
-    hlLeagues: fetchWithTimeout('/api/highlights/leagues',null,10000).then(r=>r.json()).catch(()=>({})),
-    ai: fetchWithTimeout('/api/genk_ai',null,8000).then(r=>r.json()).catch(()=>[]),
-    wcData: fetchWithTimeout('/api/wc2026',null,10000).then(r=>r.json()).catch(()=>null),
-    wcHighlights: fetchWithTimeout('/api/wc2026/highlights',null,10000).then(r=>r.json()).catch(()=>[]),
-    vtvShorts: fetchWithTimeout('/api/vtv_nambo_shorts',null,10000).then(r=>r.json()).catch(()=>[]),
-  };
-
-  // 3. Fill each section as soon as its data arrives (no waiting for others)
-  promises.featured.then(d => {
-    if(d && d.home){
-      const sc=d.status==='live'?'':'upcoming';
-      const st=d.status==='live'?`🔴 ${d.minute||'LIVE'}`:`⏰ ${d.time}`;
-      document.getElementById('home-featured').innerHTML =
-        `<div class="featured-match" onclick="openMatch('${d.event_id}')"><div class="fm-league">${d.league}</div><div class="fm-teams"><div class="fm-team"><img src="${d.home_logo}" onerror="this.style.display='none'"><span>${d.home}</span></div><div class="fm-score">${d.score||'VS'}</div><div class="fm-team"><img src="${d.away_logo}" onerror="this.style.display='none'"><span>${d.away}</span></div></div><div class="fm-status ${sc}">${st}</div></div>`;
-    }
-  });
-  document.getElementById('home-ai-compose').innerHTML =
-    `<div class="ai-compose"><div class="ai-compose-title">🤖 AI viết bài</div><div class="ai-compose-row"><input id="topic-input" placeholder="Nhập chủ đề..."><button onclick="searchTopic()">Tìm nguồn</button></div><div class="ai-compose-row"><input id="url-input" placeholder="Dán URL bài viết..."><button class="secondary" onclick="rewriteUrl()">Rewrite</button></div><div id="hot-topics" class="hot-topic-row"></div></div>`;
-  document.getElementById('home-hashtag').innerHTML = '<div id="hashtag-box"></div>';
-  document.getElementById('home-livescore').innerHTML =
-    `<div class="ls-section"><div class="ls-header"><h3>⚽ Livescore</h3></div><div class="ls-tabs"><span class="ls-tab active" data-tab="today" onclick="loadLivescore('today')">📅 Hôm nay</span><span class="ls-tab" data-tab="live" onclick="loadLivescore('live')">🔴 Live</span><span class="ls-tab" data-tab="incoming" onclick="loadLivescore('incoming')">⏰ Sắp tới</span><span class="ls-tab" data-tab="results" onclick="loadLivescore('results')">✅ Kết quả</span><span class="ls-tab" data-tab="bxh_nha" onclick="loadLivescore('bxh_nha')">🏆 NHA</span><span class="ls-tab" data-tab="bxh_laliga" onclick="loadLivescore('bxh_laliga')">🏆 La Liga</span></div><div class="ls-content" id="ls-content"><div class="loading">Đang tải...</div></div></div>`;
-
-  // VTV Nam Bộ shorts + WC highlights merged (auto-sliding)
-  Promise.all([promises.vtvShorts, promises.wcHighlights]).then(([vtv, wcHl]) => {
-    const shorts = Array.isArray(vtv) ? vtv : [];
-    const highlights = (wcHl && wcHl.data) ? wcHl.data : [];
-    // Merge: interleave shorts + highlights, mark source
-    const merged = [];
-    let si = 0, hi = 0;
-    while(si < shorts.length || hi < highlights.length){
-      if(si < shorts.length){
-        merged.push({...shorts[si], _src:'short'});
-        si++;
-      }
-      if(hi < highlights.length){
-        const h = highlights[hi];
-        merged.push({
-          id: h.video_url || h.id,
-          title: h.title || 'WC Highlight',
-          img: h.thumbnail_url || h.img || '',
-          link: h.video_url || h.link || '',
-          _src: 'hl',
-          _videoUrl: h.video_url || '',
-        });
-        hi++;
-      }
-    }
-    if(merged.length){
-      const arr = merged.slice(0, 30);
-      _vtvMerged = arr; // store for openVTVShort
-      let th = '<div class="slider-wrap" id="vtv-shorts-wrap"><div class="slider-header"><span class="slider-label">📺 Khoảnh khắc World Cup</span><span class="slider-note">VTV Nam Bộ · WC Highlights · Tự động</span></div><div class="slider-track" id="vtv-shorts-track">';
-      arr.forEach((v,i)=>{
-        const badge = v._src === 'hl' ? '🎬' : '📱';
-        th += `<div class="slider-item shorts-item" onclick="openVTVMerged(${i})"><div class="slider-thumb shorts-thumb">${v.img?`<img src="${esc(v.img)}" onerror="this.style.display='none'">`:''}<div class="card-play">▶</div><span style="position:absolute;top:2px;left:2px;font-size:10px;background:rgba(0,0,0,.6);padding:1px 3px;border-radius:3px">${badge}</span></div><div class="slider-title">${esc(v.title||'VTV Nam Bộ')}</div></div>`;
-      });
-      th += '</div></div>';
-      document.getElementById('home-wc-shorts').innerHTML = th;
-      setTimeout(()=>startAutoSlide('vtv-shorts-track'), 2000);
-    }
-  });
-
-  // World Cup 2026 section
-  promises.wcData.then(wcData => {
-    _wc2026Data = wcData;
-    document.getElementById('home-wc2026').innerHTML =
-      `<div id="wc2026-live-section" class="wc2026-section"><div class="wc-header"><h2>🏆 World Cup 2026</h2><span class="wc-live-badge">● LIVE</span></div><div class="wc-tabs"><span class="wc-tab active" onclick="switchWCTab('news')">📰 Tin tức</span><span class="wc-tab" onclick="switchWCTab('fixtures')">📅 Lịch thi đấu</span><span class="wc-tab" onclick="switchWCTab('standings')">🏆 BXH</span><span class="wc-tab" onclick="switchWCTab('highlights')">🎬 Highlight</span><span class="wc-tab" onclick="switchWCTab('stats')">📊 Thống kê</span></div><div class="wc-content" id="wc-content">${wcData?'<div class="loading">Đang tải...</div>':'<div class="loading">Chưa có dữ liệu</div>'}</div></div>`;
-    if(wcData) switchWCTab('news');
-  });
-
-  // Short AI
-  promises.wall.then(wall => {
-    _wallPosts = (wall && wall.posts) || [];
-    const aiShorts = _wallPosts.filter(p=>p.video);
-    if(aiShorts.length){
-      let h='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">🎬 Short AI</span></div><div class="slider-track">';
-      aiShorts.slice(0,20).forEach((p,i)=>{h+=`<div class="slider-item shorts-item" onclick="openShortAIFeed(${i})"><div class="slider-thumb shorts-thumb"><video src="${p.video}" muted preload="metadata"></video><div class="card-play">▶</div></div><div class="slider-title">${esc(p.title)}</div></div>`;});
-      h+='</div></div>';
-      document.getElementById('home-short-ai').innerHTML = h;
-    }
-  });
-
-  // Shorts Dân trí & SKĐS
-  promises.shorts.then(sh => {
-    _shortsData = interleaveShorts(Array.isArray(sh)?sh:[]);
-    if(_shortsData.length){
-      let h='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">📱 Shorts Dân trí & SKĐS</span><span class="slider-note">Mới nhất · xen kẽ</span></div><div class="slider-track" id="shorts-track">';
-      _shortsData.slice(0,30).forEach((a,i)=>{const badge=a.channel==='baosuckhoedoisongboyte'?'SKĐS':'Dân trí';h+=`<div class="slider-item shorts-item" onclick="openYTShortsFeed(${i})"><div class="slider-thumb shorts-thumb">${a.img?`<img src="${a.img}">`:''}<div class="card-play">▶</div></div><div class="slider-title"><span style="color:#f0c040;font-size:8px">${badge}</span> ${esc(a.title)}</div></div>`;});
-      h+='</div></div>';
-      document.getElementById('home-shorts').innerHTML = h;
-    }
-  });
-
-  // Wall posts
-  promises.wall.then(wall => {
-    const wp = (wall && wall.posts) || [];
-    if(wp.length){
-      let h=`<div class="slider-wrap" id="ai-wall-wrap"><div class="slider-header"><span class="slider-label">🧱 Tường AI</span></div><div class="slider-track" id="ai-wall-track">`;
-      wp.slice(0,20).forEach((p,i)=>{h+=makeWallItem(p,i);});
-      h+='</div></div>';
-      document.getElementById('home-wall').innerHTML = h;
-    }
-  });
-
-  // Highlights (including World Cup from xemlaibongda API)
-  promises.hlLeagues.then(hlLeagues => {
-    _hlLeagueData = hlLeagues;
-    const HL_CONFIG={"world-cup":{name:"World Cup 2026",emoji:"🌍"},"premier-league":{name:"Premier League",emoji:"🏴"},"champions-league":{name:"Champions League",emoji:"⭐"},"la-liga":{name:"La Liga",emoji:"🇪🇸"},"serie-a":{name:"Serie A",emoji:"🇮🇹"},"bundesliga":{name:"Bundesliga",emoji:"🇩🇪"},"friendly":{name:"Giao hữu",emoji:"🤝"}};
-    let h='';
-    for(const[key,cfg] of Object.entries(HL_CONFIG)){
-      const vids=hlLeagues[key];
-      if(!vids||!vids.length)continue;
-      h+=`<div class="slider-wrap"><div class="slider-header"><span class="slider-label">${cfg.emoji} ${cfg.name}</span></div><div class="slider-track">`;
-      vids.slice(0,8).forEach((a,i)=>{h+=`<div class="slider-item" onclick="openHighlightFeed('${key}',${i})"><div class="slider-thumb">${a.img?`<img src="${a.img}">`:''}<div class="card-play">▶</div></div><div class="slider-title">${esc(a.title)}</div></div>`;});
-      h+='</div></div>';
-    }
-    document.getElementById('home-highlights').innerHTML = h;
-  });
-
-  // AI apps
-  promises.ai.then(ai => {
-    if(ai && ai.length){
-      let h='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">🤖 Ứng dụng AI</span></div><div class="slider-track">';
-      ai.slice(0,12).forEach(a=>{h+=`<div class="slider-item" onclick="readArticle('${esc(a.link)}')"><div class="slider-thumb">${a.img?`<img src="${a.img}">`:''}</div><div class="slider-title">${esc(a.title)}</div></div>`;});
-      h+='</div></div>';
-      document.getElementById('home-ai').innerHTML = h;
-    }
-  });
-
-  // 4. Start background tasks
-  loadLivescore('today');
-  loadHotTopics();
-
-  // 5. Remove loading indicator
-  setTimeout(()=>{
-    const el = document.getElementById('home-loading');
-    if(el) el.remove();
-  }, 500);
-}
-
-// === AUTO-SLIDE for VTV shorts ===
-let _autoSlideTimer = null;
-function startAutoSlide(trackId){
-  const track = document.getElementById(trackId);
-  if(!track) return;
-  if(_autoSlideTimer) clearInterval(_autoSlideTimer);
-  let pos = 0;
-  const itemWidth = 120; // shorts item flex-basis + gap
-  _autoSlideTimer = setInterval(()=>{
-    const maxScroll = track.scrollWidth - track.clientWidth;
-    if(maxScroll <= 0) return;
-    pos += itemWidth;
-    if(pos > maxScroll){ pos = 0; }
-    track.scrollTo({left: pos, behavior: 'smooth'});
-  }, 2500);
-}
-
-// === OPEN MERGED SHORTS + HIGHLIGHTS (TikTok-style feed) ===
-function openVTVMerged(idx){
-  const arr = _vtvMerged || [];
-  if(!arr.length) return;
-  showView('view-tiktok');
-  const el = document.getElementById('view-tiktok');
-  const ordered = [...arr.slice(idx), ...arr.slice(0, idx)];
-  let h=`<button class="back-btn" onclick="switchCat('home')">← Khoảnh khắc WC</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;
-  ordered.forEach((vv,i)=>{
-    const id = vv.id||'';
-    const videoUrl = vv._videoUrl || '';
-    let vtag;
-    if(videoUrl && videoUrl.includes('.m3u8')){
-      // HLS highlight video — use native video player
-      vtag = `<video playsinline preload="none" poster="${esc(vv.img||'')}" data-hls="${esc(videoUrl)}" loop controls></video>`;
-    } else {
-      // YouTube short — use iframe
-      const src = `https://www.youtube.com/embed/${id}?autoplay=1&rel=0&playsinline=1`;
-      vtag = `<iframe data-yt-src="${src}" allowfullscreen allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture"></iframe>`;
-    }
-    const badge = vv._src === 'hl' ? '🎬 WC' : '📱 VTV';
-    h += buildTikTokSlide({vtag,title:vv.title||'',badge,badgeClass:'badge-fpt',videoId:'vtm-'+i,idx:i,total:ordered.length,shareUrl: 'https://youtube.com/watch?v='+id});
-  });
-  h+='</div></div>';
-  el.innerHTML=h;
-  initTikTokFeed();
-}
-function openVTVShort(idx){
-  fetchWithTimeout('/api/vtv_nambo_shorts').then(r=>r.json()).then(arr=>{
-    const v = (Array.isArray(arr)?arr:[])[idx];
-    if(!v) return;
-    showView('view-tiktok');
-    const el = document.getElementById('view-tiktok');
-    const all = Array.isArray(arr)?arr:[];
-    const ordered = [...all.slice(idx), ...all.slice(0, idx)];
-    let h=`<button class="back-btn" onclick="switchCat('home')">← VTV Nam Bộ</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;
-    ordered.forEach((vv,i)=>{
-      const id = vv.id||'';
-      const src = `https://www.youtube.com/embed/${id}?autoplay=1&rel=0&playsinline=1`;
-      const vtag = `<iframe data-yt-src="${src}" allowfullscreen allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture"></iframe>`;
-      h += buildTikTokSlide({vtag,title:vv.title||'VTV Nam Bộ',badge:'VTV',badgeClass:'badge-fpt',videoId:'vtv-'+id,idx:i,total:ordered.length,shareUrl:'https://youtube.com/watch?v='+id});
-    });
-    h+='</div></div>';
-    el.innerHTML=h;
-    initTikTokFeed();
-  }).catch(()=>{});
+  const[featured,sh,wall,hlLeagues,ai,wcData]=await Promise.all([
+    fetch('/api/livescore/featured').then(r=>r.json()).catch(()=>null),
+    fetch('/api/shorts').then(r=>r.json()).catch(()=>[]),
+    fetch('/api/wall').then(r=>r.json()).catch(()=>({posts:[]})),
+    fetch('/api/highlights/leagues').then(r=>r.json()).catch(()=>({})),
+    fetch('/api/genk_ai').then(r=>r.json()).catch(()=>[]),
+    fetch('/api/wc2026').then(r=>r.json()).catch(()=>null)
+  ]);
+  _hlLeagueData=hlLeagues;
+  _wc2026Data=wcData;
+  _shortsData=interleaveShorts(sh||[]);
+  _wallPosts=(wall&&wall.posts)||[];
+  let h='';
+  if(featured&&featured.home){const sc=featured.status==='live'?'':'upcoming';const st=featured.status==='live'?`🔴 ${featured.minute||'LIVE'}`:`⏰ ${featured.time}`;h+=`<div class="featured-match" onclick="openMatch('${featured.event_id}')"><div class="fm-league">${featured.league}</div><div class="fm-teams"><div class="fm-team"><img src="${featured.home_logo}" onerror="this.style.display='none'"><span>${featured.home}</span></div><div class="fm-score">${featured.score||'VS'}</div><div class="fm-team"><img src="${featured.away_logo}" onerror="this.style.display='none'"><span>${featured.away}</span></div></div><div class="fm-status ${sc}">${st}</div></div>`;}
+  h+=`<div class="ai-compose"><div class="ai-compose-title">🤖 AI viết bài</div><div class="ai-compose-row"><input id="topic-input" placeholder="Nhập chủ đề..."><button onclick="searchTopic()">Tìm nguồn</button></div><div class="ai-compose-row"><input id="url-input" placeholder="Dán URL bài viết..."><button class="secondary" onclick="rewriteUrl()">Rewrite</button></div><div id="hot-topics" class="hot-topic-row"></div></div>`;
+  h+='<div id="hashtag-box"></div>';
+  h+=`<div class="ls-section"><div class="ls-header"><h3>⚽ Livescore</h3></div><div class="ls-tabs"><span class="ls-tab active" data-tab="today" onclick="loadLivescore('today')">📅 Hôm nay</span><span class="ls-tab" data-tab="live" onclick="loadLivescore('live')">🔴 Live</span><span class="ls-tab" data-tab="incoming" onclick="loadLivescore('incoming')">⏰ Sắp tới</span><span class="ls-tab" data-tab="results" onclick="loadLivescore('results')">✅ Kết quả</span><span class="ls-tab" data-tab="bxh_nha" onclick="loadLivescore('bxh_nha')">🏆 NHA</span><span class="ls-tab" data-tab="bxh_laliga" onclick="loadLivescore('bxh_laliga')">🏆 La Liga</span></div><div class="ls-content" id="ls-content"><div class="loading">Đang tải...</div></div></div>`;
+  h+=`<div id="wc2026-live-section" class="wc2026-section"><div class="wc-header"><h2>🏆 World Cup 2026</h2><span class="wc-live-badge">● LIVE</span></div><div class="wc-tabs"><span class="wc-tab active" onclick="switchWCTab('news')">📰 Tin tức</span><span class="wc-tab" onclick="switchWCTab('fixtures')">📅 Lịch thi đấu</span><span class="wc-tab" onclick="switchWCTab('standings')">🏆 BXH</span><span class="wc-tab" onclick="switchWCTab('highlights')">🎬 Highlight</span><span class="wc-tab" onclick="switchWCTab('stats')">📊 Thống kê</span></div><div class="wc-content" id="wc-content"><div class="loading">Đang tải World Cup 2026...</div></div></div>`;
+  const wallPosts=_wallPosts;
+  const aiShorts=wallPosts.filter(p=>p.video);
+  if(aiShorts.length){h+='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">🎬 Short AI</span></div><div class="slider-track">';aiShorts.slice(0,20).forEach((p,i)=>{h+=`<div class="slider-item shorts-item" onclick="openShortAIFeed(${i})"><div class="slider-thumb shorts-thumb"><video src="${p.video}" muted preload="metadata"></video><div class="card-play">▶</div></div><div class="slider-title">${esc(p.title)}</div></div>`});h+='</div></div>';}
+  if(_shortsData.length){h+='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">📱 Shorts Dân trí & SKĐS</span><span class="slider-note">Mới nhất · xen kẽ</span></div><div class="slider-track">';_shortsData.slice(0,30).forEach((a,i)=>{const badge=a.channel==='baosuckhoedoisongboyte'?'SKĐS':'Dân trí';h+=`<div class="slider-item shorts-item" onclick="openYTShortsFeed(${i})"><div class="slider-thumb shorts-thumb">${a.img?`<img src="${a.img}">`:''}<div class="card-play">▶</div></div><div class="slider-title"><span style="color:#f0c040;font-size:8px">${badge}</span> ${esc(a.title)}</div></div>`});h+='</div></div>';}
+  if(wallPosts.length){h+=`<div class="slider-wrap" id="ai-wall-wrap"><div class="slider-header"><span class="slider-label">🧱 Tường AI</span></div><div class="slider-track" id="ai-wall-track">`;wallPosts.slice(0,20).forEach((p,i)=>{h+=makeWallItem(p,i)});h+='</div></div>';}
+  const HL_CONFIG={"world-cup":{name:"World Cup 2026",emoji:"🌍"},"premier-league":{name:"Premier League",emoji:"🏴"},"champions-league":{name:"Champions League",emoji:"⭐"},"la-liga":{name:"La Liga",emoji:"🇪🇸"},"serie-a":{name:"Serie A",emoji:"🇮🇹"},"bundesliga":{name:"Bundesliga",emoji:"🇩🇪"},"friendly":{name:"Giao hữu",emoji:"🤝"}};
+  for(const[key,cfg] of Object.entries(HL_CONFIG)){const vids=hlLeagues[key];if(!vids||!vids.length)continue;h+=`<div class="slider-wrap"><div class="slider-header"><span class="slider-label">${cfg.emoji} ${cfg.name}</span></div><div class="slider-track">`;vids.slice(0,8).forEach((a,i)=>{h+=`<div class="slider-item" onclick="openHighlightFeed('${key}',${i})"><div class="slider-thumb">${a.img?`<img src="${a.img}">`:''}<div class="card-play">▶</div></div><div class="slider-title">${esc(a.title)}</div></div>`});h+='</div></div>';}
+  if(ai&&ai.length){h+='<div class="slider-wrap"><div class="slider-header"><span class="slider-label">🤖 Ứng dụng AI</span></div><div class="slider-track">';ai.slice(0,12).forEach(a=>{h+=`<div class="slider-item" onclick="readArticle('${esc(a.link)}')"><div class="slider-thumb">${a.img?`<img src="${a.img}">`:''}</div><div class="slider-title">${esc(a.title)}</div></div>`});h+='</div></div>';}
+  document.getElementById('view-home').innerHTML=h;
+  loadLivescore('today');loadHotTopics();
+  if(_wc2026Data)switchWCTab('news');
 }
 
 // === WALL POST HELPERS ===
@@ -357,7 +157,6 @@ function prependWallPost(post){
 
 // === REST OF FUNCTIONS ===
 let _shortsData=[];
-let _vtvMerged=[];
 let _wallPosts=[];
 let _currentView='home';
 let _currentEventId=null;
@@ -411,46 +210,7 @@ async function toggleComments(videoId,idx){const panel=document.getElementById('
 function renderInlineComments(panel,videoId,idx,cmts){let h='<div class="inline-cmt-header"><span>💬 Bình luận</span><button onclick="document.getElementById(\'cmt-inline-'+idx+'\').style.display=\'none\'">✕</button></div><div class="inline-cmt-list">';if(cmts.length){cmts.slice(-30).forEach(c=>{h+=`<div class="inline-cmt-item"><span class="inline-cmt-time">${c.time||''}</span>${esc(c.text)}</div>`;});}else{h+='<div style="color:#777;font-size:11px;padding:4px">Chưa có bình luận</div>';}h+=`</div><div class="inline-cmt-input"><input id="cmt-input-${idx}" placeholder="Viết bình luận..." onkeydown="if(event.key==='Enter')submitInlineCmt('${esc(videoId)}',${idx})"><button onclick="submitInlineCmt('${esc(videoId)}',${idx})">Gửi</button></div>`;panel.innerHTML=h;const list=panel.querySelector('.inline-cmt-list');if(list)list.scrollTop=list.scrollHeight;}
 async function submitInlineCmt(videoId,idx){const inp=document.getElementById('cmt-input-'+idx);if(!inp)return;const text=inp.value.trim();if(!text)return;inp.value='';inp.disabled=true;const cmts=await postComment(videoId,text);inp.disabled=false;const panel=document.getElementById('cmt-inline-'+idx);if(panel)renderInlineComments(panel,videoId,idx,cmts);const cc=document.getElementById('cc-'+idx);if(cc)cc.textContent=fmtNum(cmts.length);}
 function initTikTokFeed(){const feed=document.getElementById('tiktok-feed');if(!feed)return;const slides=feed.querySelectorAll('.tiktok-slide');let cur=-1;function act(i){if(i===cur)return;slides.forEach((sl,idx)=>{const v=sl.querySelector('video');const fr=sl.querySelector('iframe');if(idx===i){if(v&&v.dataset.hls&&!v._hls&&typeof Hls!=='undefined'&&Hls.isSupported()){const hls=new Hls();hls.loadSource(v.dataset.hls);hls.attachMedia(v);hls.on(Hls.Events.MANIFEST_PARSED,()=>v.play().catch(()=>{}));v._hls=hls}else if(v)v.play().catch(()=>{});if(fr&&!fr.src&&fr.dataset.ytSrc)fr.src=fr.dataset.ytSrc;const vid=sl.dataset.vid;if(vid&&!sl._viewed){sl._viewed=true;doInteract(vid,'view').then(j=>{if(j){const vc=document.getElementById('vc-'+idx);if(vc)vc.textContent=fmtNum(j.views);}});}}else{if(v){v.pause();if(v._hls){v._hls.destroy();v._hls=null}}if(fr&&fr.src)fr.src=''}});cur=i}let sT;feed.addEventListener('scroll',()=>{clearTimeout(sT);sT=setTimeout(()=>{const rect=feed.getBoundingClientRect(),ctr=rect.top+rect.height/2;let best=-1,bestD=1e9;slides.forEach((sl,i)=>{const d=Math.abs(sl.getBoundingClientRect().top+sl.getBoundingClientRect().height/2-ctr);if(d<bestD){bestD=d;best=i}});if(best>=0)act(best)},150)});setTimeout(()=>act(0),400);slides.forEach(sl=>{const v=sl.querySelector('video');if(v)v.addEventListener('click',e=>{e.preventDefault();v.paused?v.play().catch(()=>{}):v.pause()})});const ids=[...slides].map(sl=>sl.dataset.vid||'');loadCounters(ids)}
-async function openHighlightFeed(league,idx,directUrl){
-  showView('view-tiktok');
-  const el=document.getElementById('view-tiktok');
-  el.innerHTML='<div class="loading">Đang tải...</div>';
-  let articles=(_hlLeagueData||{})[league]||[];
-  // For world-cup league, use the new WC highlights API data
-  if(!articles.length && league==='world-cup'){
-    try{
-      const wcRaw = await fetch('/api/wc2026/highlights').then(r=>r.json());
-      articles = Array.isArray(wcRaw)?wcRaw:(wcRaw && wcRaw.data ? wcRaw.data : []);
-    }catch(e){articles=[]}
-  }
-  if(!articles.length){try{articles=await fetch('/api/highlights/'+league).then(r=>r.json())}catch(e){articles=[]}}
-  if(!articles.length){el.innerHTML='<div class="loading">Không có video</div>';return}
-  const vids=[];
-  // If articles have direct src (from xemlaibongda API), use it without fetching /api/video_url
-  const hasDirectSrc = articles[0] && articles[0].src;
-  if(hasDirectSrc){
-    articles.forEach((a,i)=>{vids.push({...a,_idx:i})});
-  } else {
-    const results=await Promise.all(articles.map(async(a,i)=>{try{const r=await fetch('/api/video_url?url='+encodeURIComponent(a.link));const v=await r.json();if(v&&v.src)return{...a,...v,_idx:i}}catch(e){}return null}));
-    results.forEach(r=>{if(r)vids.push(r)});
-  }
-  vids.sort((a,b)=>a._idx-b._idx);
-  if(!vids.length){el.innerHTML='<div class="loading">Không tìm thấy video</div>';return}
-  let ti=vids.findIndex(v=>v._idx===idx);
-  if(ti<0)ti=0;
-  const ordered=ti>0?[...vids.slice(ti),...vids.slice(0,ti)]:vids;
-  let h=`<button class="back-btn" onclick="switchCat('home')">← Highlight</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;
-  ordered.forEach((v,i)=>{
-    const isYT=v.type==='youtube';
-    const isHLS=!isYT&&(v.src||v.link||'').includes('.m3u8');
-    const poster=v.poster?` poster="${v.poster}"`:'';
-    const vtag=isYT?`<iframe data-yt-src="${v.src}" allowfullscreen allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture"></iframe>`:isHLS?`<video playsinline preload="none"${poster} data-hls="${v.src}" loop controls></video>`:`<video playsinline preload="none"${poster} loop controls><source src="${v.src}" type="video/mp4"></video>`;
-    const videoId='hl-'+league+'-'+(v.id||v._idx);
-    const shareUrl=v.link||v.src||'';
-    h+=buildTikTokSlide({vtag,title:v.title,badge:'HL',badgeClass:'badge-fpt',videoId,idx:i,total:ordered.length,shareUrl,extraBtn:`<button class="tiktok-right-btn" onclick="event.stopPropagation();this.closest('.tiktok-slide').classList.toggle('ratio-wide')"><div class="icon">⬜</div><div class="count">16:9</div></button>`});
-  });
-  h+='</div></div>';el.innerHTML=h;initTikTokFeed();
-}
+async function openHighlightFeed(league,idx){showView('view-tiktok');const el=document.getElementById('view-tiktok');el.innerHTML='<div class="loading">Đang tải...</div>';let articles=(_hlLeagueData||{})[league]||[];if(!articles.length){try{articles=await fetch('/api/highlights/'+league).then(r=>r.json())}catch(e){articles=[]}}if(!articles.length){el.innerHTML='<div class="loading">Không có video</div>';return}const vids=[];const results=await Promise.all(articles.map(async(a,i)=>{try{const r=await fetch('/api/video_url?url='+encodeURIComponent(a.link));const v=await r.json();if(v&&v.src)return{...a,...v,_idx:i}}catch(e){}return null}));results.forEach(r=>{if(r)vids.push(r)});vids.sort((a,b)=>a._idx-b._idx);if(!vids.length){el.innerHTML='<div class="loading">Không tìm thấy video</div>';return}let ti=vids.findIndex(v=>v._idx===idx);if(ti<0)ti=0;const ordered=ti>0?[...vids.slice(ti),...vids.slice(0,ti)]:vids;let h=`<button class="back-btn" onclick="switchCat('home')">← Highlight</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;ordered.forEach((v,i)=>{const isYT=v.type==='youtube',isHLS=!isYT&&v.src?.includes('.m3u8'),poster=v.poster?` poster="${v.poster}"`:'';const vtag=isYT?`<iframe data-yt-src="${v.src}" allowfullscreen allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture"></iframe>`:isHLS?`<video playsinline preload="none"${poster} data-hls="${v.src}" loop controls></video>`:`<video playsinline preload="none"${poster} loop controls><source src="${v.src}" type="video/mp4"></video>`;const videoId='hl-'+league+'-'+(v.id||v._idx);h+=buildTikTokSlide({vtag,title:v.title,badge:'HL',badgeClass:'badge-fpt',videoId,idx:i,total:ordered.length,shareUrl:v.link||'',extraBtn:`<button class="tiktok-right-btn" onclick="event.stopPropagation();this.closest('.tiktok-slide').classList.toggle('ratio-wide')"><div class="icon">⬜</div><div class="count">16:9</div></button>`});});h+='</div></div>';el.innerHTML=h;initTikTokFeed();}
 async function openYTShortsFeed(startIdx){showView('view-tiktok');const el=document.getElementById('view-tiktok');el.innerHTML='<div class="loading">Đang tải...</div>';const arts=_shortsData.length?_shortsData:await fetch('/api/shorts').then(r=>r.json()).catch(()=>[]);if(!arts.length){el.innerHTML='<div class="loading">Không có shorts</div>';return}const ordered=startIdx>0?[...arts.slice(startIdx),...arts.slice(0,startIdx)]:arts;let h=`<button class="back-btn" onclick="switchCat('home')">← Shorts</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;ordered.forEach((v,i)=>{const id=v.id||'';const src=`https://www.youtube.com/embed/${id}?autoplay=1&rel=0&playsinline=1`;const vtag=`<iframe data-yt-src="${src}" allowfullscreen allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture"></iframe>`;const badge=v.channel==='baosuckhoedoisongboyte'?'SKĐS':'Dân trí';const videoId='yt-'+id;h+=buildTikTokSlide({vtag,title:v.title,badge,badgeClass:'badge-fpt',videoId,idx:i,total:ordered.length,shareUrl:'https://youtube.com/watch?v='+id});});h+='</div></div>';el.innerHTML=h;initTikTokFeed();}
 async function openShortAIFeed(startIdx){showView('view-tiktok');const el=document.getElementById('view-tiktok');el.innerHTML='<div class="loading">Đang tải...</div>';const wall=(await fetch('/api/wall').then(r=>r.json()).catch(()=>({posts:[]}))).posts||[];const vids=wall.filter(p=>p.video);if(!vids.length){el.innerHTML='<div class="loading">Chưa có Short AI</div>';return}const ordered=startIdx>0?[...vids.slice(startIdx),...vids.slice(0,startIdx)]:vids;let h=`<button class="back-btn" onclick="switchCat('home')">← Short AI</button><div class="tiktok-container"><div class="tiktok-feed" id="tiktok-feed">`;ordered.forEach((p,i)=>{const vtag=`<video src="${p.video}" playsinline loop controls></video>`;const videoId='ai-'+(p.id||i);h+=buildTikTokSlide({vtag,title:p.title,badge:'AI',badgeClass:'badge-ai',videoId,idx:i,total:ordered.length,shareUrl:SPACE});});h+='</div></div>';el.innerHTML=h;initTikTokFeed();}
 async function readArticle(url){showView('view-article');const el=document.getElementById('view-article');el.innerHTML='<div class="loading">Đang tải...</div>';try{const r=await fetch('/api/article?url='+encodeURIComponent(url));const data=await r.json();if(data&&!data.error&&data.body&&data.body.length){_currentArticle={url,data};let h=`<button class="back-btn" onclick="switchCat('home')">← Quay lại</button><div class="article-view"><h1 class="article-title">${esc(data.title)}</h1>`;if(data.summary)h+=`<div class="article-summary">${esc(data.summary)}</div>`;const seen={};data.body.forEach(b=>{if(b.type==='p')h+=`<p class="article-p">${b.text}</p>`;else if(b.type==='img'&&b.src&&!seen[b.src]){seen[b.src]=1;h+=`<img class="article-img" src="${esc(b.src)}" onerror="this.style.display='none'">`}else if(b.type==='heading')h+=`<h2 class="article-h2">${esc(b.text)}</h2>`});h+=`<div class="article-actions"><button class="primary" onclick="rewriteArticle()">🤖 Rewrite AI đăng tường</button><button onclick="doShare('${esc(data.title)}','${esc(url)}','${esc(data.og_image||'')}')">📤</button><button onclick="window.open('${esc(url)}','_blank')">🔗 Gốc</button></div><div class="article-ai-ask"><h3 style="font-size:14px;color:#5cb87a">🤖 Hỏi AI</h3><textarea id="ask-q" placeholder="Hỏi về bài viết..."></textarea><button onclick="askAI()">Hỏi</button><div id="ask-a" class="article-ai-answer"></div></div></div>`;el.innerHTML=h;window.scrollTo(0,0);return;}}catch(e){}el.innerHTML=`<button class="back-btn" onclick="switchCat('home')">← Quay lại</button><div class="loading"><p>Không đọc được.</p><a href="${esc(url)}" target="_blank" style="color:#5cb87a">Mở gốc →</a></div>`;}