static/hot_multi.js

// === OVERRIDE: loadHotTopics loads from MULTIPLE hashtags ===
// This file loaded AFTER app_v2.js, overrides the function

async function loadHotTopics(){
  const j=await fetch('/api/hot_topics').then(r=>r.json()).catch(()=>({topics:[]}));
  const el=document.getElementById('hot-topics');if(!el)return;
  const topics=j.topics||[];
  el.innerHTML=topics.slice(0,18).map(t=>{
    const topicText=t.topic||t.label.replace(/^#/,'');
    return`<button class="hot-chip" onclick="searchTopic('${topicText.replace(/'/g,"\\'")}')">${esc(t.label)}</button>`;
  }).join('');
  // Load tin HOT = tổng hợp từ TOP 3 hashtag nóng nhất
  if(topics.length>=2){
    loadMultiHashtag(topics.slice(0,3).map(t=>t.topic||t.label.replace(/^#/,'')));
  }else if(topics.length){
    searchTopic(topics[0].topic||topics[0].label.replace(/^#/,''));
  }
}

async function loadMultiHashtag(topicList){
  const box=document.getElementById('hashtag-box');if(!box)return;
  box.innerHTML=`<div class="hashtag-sources"><h3>🔥 Tin HOT tổng hợp</h3><div class="hashtag-loading"><div class="hashtag-spinner"></div>Tổng hợp từ ${topicList.length} chủ đề nóng nhất...</div></div>`;
  try{
    const results=await Promise.all(topicList.map(topic=>
      fetch(`/api/hashtag/sources?topic=${encodeURIComponent(topic)}&page=0`).then(r=>r.json()).catch(()=>({sources:[]}))
    ));
    // Interleave from all topics
    const all=[];const seen=new Set();
    const mx=Math.max(...results.map(r=>(r.sources||[]).length));
    for(let i=0;i<mx;i++){
      for(let j=0;j<results.length;j++){
        const src=(results[j].sources||[])[i];
        if(src&&src.url&&!seen.has(src.url)){seen.add(src.url);src._topic=topicList[j];all.push(src);}
      }
    }
    if(!all.length){box.innerHTML=`<div class="hashtag-sources"><h3>🔥 Tin HOT</h3><div style="color:#888;padding:8px">Đang cập nhật...</div></div>`;return;}
    let h=`<div class="hashtag-sources"><h3>🔥 Tin HOT tổng hợp <span style="font-size:10px;color:#888">(${all.length} bài · ${topicList.length} chủ đề)</span></h3><div id="ht-list">`;
    all.slice(0,12).forEach((s,i)=>{
      h+=`<div class="hashtag-src-item" onclick="readArticle('${esc(s.url)}')"><div class="hashtag-src-img" id="ht-img-${i}"></div><div class="hashtag-src-text"><div class="hashtag-src-title">${esc(s.title)}</div><div class="hashtag-src-via">${esc(s.via||'')} · <span style="color:#f0c040;font-size:9px">#${esc(s._topic||'')}</span></div></div></div>`;
    });
    h+=`</div><div style="display:flex;gap:4px;flex-wrap:wrap;margin-top:8px">`;
    topicList.forEach(t=>{h+=`<button class="hot-chip" onclick="searchTopic('${t.replace(/'/g,"\\'")}')" style="font-size:10px">🔍 #${esc(t)}</button>`;});
    h+=`</div></div>`;
    box.innerHTML=h;
    // Lazy load images
    all.slice(0,12).forEach((s,i)=>{if(!s.url)return;fetch('/api/article?url='+encodeURIComponent(s.url)).then(r=>r.json()).then(d=>{if(d&&(d.og_image||d.img)){const el=document.getElementById('ht-img-'+i);if(el)el.innerHTML=`<img src="${esc(d.og_image||d.img)}" onerror="this.style.display='none'">`;}}).catch(()=>{});});
    _htTopic=topicList[0];
  }catch(e){box.innerHTML=`<div class="hashtag-sources"><h3>🔥 Tin HOT</h3><div style="color:#e74c3c;padding:8px">Lỗi tải tin</div></div>`;}
}