Update app_v2.js: multilingual voice selector grouped by country

static/app_v2.js

@@ -1,5 +1,5 @@
 // === VNEWS Frontend v2 - Full Functions ===
-// Updated: Voice selector + speed control + image gallery + auto voice detect
+// Updated: Video shorts on wall items + Tạo Video button, unified /api/wall endpoint
 
 // === LOAD HOME ===
 async function loadHome(){
@@ -20,14 +20,20 @@ async function loadHome(){
   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>`;
+  // WC2026 section
   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>`;
+  // Short AI — show posts that already have video
   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>';}
+  // Shorts
   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>';}
+  // Tường AI
   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>';}
+  // Highlights
   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>';}
+  // AI apps
   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();
@@ -96,14 +102,29 @@ async function makeShortVideo(postId, btn, voice, speed){
   }
 }
 
+// ===== VOICE SELECTOR =====
+function selectVoice(voiceKey){
+  document.querySelectorAll('.tts-voice-btn').forEach(b=>{
+    b.classList.toggle('active', b.dataset.voice === voiceKey);
+  });
+  const inp = document.getElementById('selected-voice');
+  if(inp) inp.value = voiceKey;
+}
+
 // Refresh Short AI slider after video generation
 function refreshShortAISlider(){
   const aiShorts = _wallPosts.filter(p=>p.video);
+  const wrap = document.querySelector('#view-home .slider-wrap'); // first slider-wrap
+  // Find existing Short AI section or create it
   let shortAISection = document.getElementById('short-ai-section');
   if(aiShorts.length === 0){
     if(shortAISection) shortAISection.remove();
     return;
   }
+  // Count how many slider-wrap elements exist
+  const existing = document.querySelectorAll('#view-home .slider-wrap');
+  // Short AI should be the first slider-wrap (after WC section if present)
+  // We'll re-render the Short AI section if it exists
   if(shortAISection){
     const track = shortAISection.querySelector('.slider-track');
     if(track){
@@ -122,6 +143,7 @@ function prependWallPost(post){
   const wrap=document.getElementById('ai-wall-wrap');
   const homeEl=document.getElementById('view-home');
   if(!track||!wrap){
+    // Wall section not in DOM — create it
     if(homeEl){
       let insertBefore=homeEl.querySelector('.slider-wrap');
       const newWrap=document.createElement('div');
@@ -138,6 +160,7 @@ function prependWallPost(post){
     }
     return;
   }
+  // Track exists — prepend with animation
   const div=document.createElement('div');
   div.className='wall-item wall-item-new';
   div.id='wall-item-'+(post.id||'new-'+Date.now());
@@ -152,6 +175,7 @@ function prependWallPost(post){
   div.innerHTML=`<div class="wall-thumb">${thumbContent}${videoBadge}</div><div class="wall-title">${esc(post.title)}</div><div class="wall-text">${esc((post.text||'').slice(0,180))}</div><div class="wall-actions"><button class="primary" onclick="readWallPost(0)">Xem</button>${videoBtn}</div>`;
   track.prepend(div);
   track.scrollTo({left:0,behavior:'smooth'});
+  // Also update Short AI slider if video exists
   if(hasVideo) refreshShortAISlider();
 }
 
@@ -163,7 +187,7 @@ function interleaveShorts(shorts){const dt=shorts.filter(s=>s.channel==='baodant
 let _htPage=0,_htTopic='';
 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;el.innerHTML=(j.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('');if(j.topics&&j.topics[0]){const firstTopic=j.topics[0].topic||j.topics[0].label.replace(/^#/,'');setTimeout(()=>searchTopic(firstTopic),800);}}
 function searchTopic(topic){if(!topic){topic=document.getElementById('topic-input')?.value.trim();if(!topic){alert('Nhập chủ đề');return;}}document.getElementById('topic-input').value='';_htTopic=topic;_htPage=0;showHashtagSources(topic,0);}
-async function showHashtagSources(topic,page){const box=document.getElementById('hashtag-box');if(!box)return;if(page===0)box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div class="hashtag-loading"><div class="hashtag-spinner"></div>Đang tìm...</div></div>`;try{const r=await fetch(`/api/hashtag/sources?topic=${encodeURIComponent(topic)}&page=${page}`);const j= await r.json();const sources=j.sources||[];if(!sources.length&&page===0){box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div style="color:#888;padding:8px">Không tìm được bài viết liên quan</div></div>`;return;}let h='';if(page===0)h=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)} <span style="font-size:10px;color:#888">(${j.total} bài từ 8 nguồn)</span></h3><div id="ht-list">`;sources.forEach((s,i)=>{const idx=page*8+i;h+=`<div class="hashtag-src-item" onclick="readArticle('${esc(s.url)}')"><div class="hashtag-src-img" id="ht-img-${idx}"></div><div class="hashtag-src-text"><div class="hashtag-src-title">${esc(s.title)}</div><div class="hashtag-src-via">${esc(s.via||'')}</div></div></div>`;});if(page===0){h+=`</div><button class="hashtag-rewrite-btn" onclick="rewriteHashtag('${esc(topic).replace(/'/g,"\\'")}')">🤖 Rewrite AI tổng hợp & đăng tường</button>`;if(j.has_more)h+=`<button class="hashtag-load-more" id="ht-more" onclick="loadMoreHashtag()">Tải thêm ▼</button>`;h+=`</div>`;box.innerHTML=h;}else{document.getElementById('ht-list')?.insertAdjacentHTML('beforeend',h);const btn=document.getElementById('ht-more');if(btn){if(!j.has_more)btn.remove();else{btn.disabled=false;btn.textContent='Tải thêm ��';}}}sources.forEach((s,i)=>{const idx=page*8+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-'+idx);if(el)el.innerHTML=`<img src="${esc(d.og_image||d.img)}" onerror="this.style.display='none'">`;}}).catch(()=>{});});}catch(e){box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div style="color:#e74c3c;padding:8px">Lỗi: ${esc(e.message)}</div></div>`;}}
+async function showHashtagSources(topic,page){const box=document.getElementById('hashtag-box');if(!box)return;if(page===0)box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div class="hashtag-loading"><div class="hashtag-spinner"></div>Đang tìm...</div></div>`;try{const r=await fetch(`/api/hashtag/sources?topic=${encodeURIComponent(topic)}&page=${page}`);const j=await r.json();const sources=j.sources||[];if(!sources.length&&page===0){box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div style="color:#888;padding:8px">Không tìm được bài viết liên quan</div></div>`;return;}let h='';if(page===0)h=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)} <span style="font-size:10px;color:#888">(${j.total} bài từ 8 nguồn)</span></h3><div id="ht-list">`;sources.forEach((s,i)=>{const idx=page*8+i;h+=`<div class="hashtag-src-item" onclick="readArticle('${esc(s.url)}')"><div class="hashtag-src-img" id="ht-img-${idx}"></div><div class="hashtag-src-text"><div class="hashtag-src-title">${esc(s.title)}</div><div class="hashtag-src-via">${esc(s.via||'')}</div></div></div>`;});if(page===0){h+=`</div><button class="hashtag-rewrite-btn" onclick="rewriteHashtag('${esc(topic).replace(/'/g,"\\'")}')">🤖 Rewrite AI tổng hợp & đăng tường</button>`;if(j.has_more)h+=`<button class="hashtag-load-more" id="ht-more" onclick="loadMoreHashtag()">Tải thêm ▼</button>`;h+=`</div>`;box.innerHTML=h;}else{document.getElementById('ht-list')?.insertAdjacentHTML('beforeend',h);const btn=document.getElementById('ht-more');if(btn){if(!j.has_more)btn.remove();else{btn.disabled=false;btn.textContent='Tải thêm ▼';}}}sources.forEach((s,i)=>{const idx=page*8+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-'+idx);if(el)el.innerHTML=`<img src="${esc(d.og_image||d.img)}" onerror="this.style.display='none'">`;}}).catch(()=>{});});}catch(e){box.innerHTML=`<div class="hashtag-sources"><h3>🔍 ${esc(topic)}</h3><div style="color:#e74c3c;padding:8px">Lỗi: ${esc(e.message)}</div></div>`;}}
 function loadMoreHashtag(){_htPage++;const btn=document.getElementById('ht-more');if(btn){btn.disabled=true;btn.textContent='Đang tải...';}showHashtagSources(_htTopic,_htPage);}
 async function rewriteHashtag(topic){const btn=event?.target;if(btn){btn.disabled=true;btn.textContent='Đang tổng hợp...';}try{const r=await fetch('/api/topic_post',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({topic})});const j=await r.json();if(!r.ok||j.error)throw new Error(j.error||'Lỗi');toast('✅ Đã đăng Tường AI!');if(btn)btn.textContent='✅ Đăng thành công!';if(j.post)prependWallPost(j.post);}catch(e){toast('❌ '+e.message);if(btn){btn.disabled=false;btn.textContent='🤖 Rewrite AI';}}}
 async function loadLivescore(tab){document.querySelectorAll('.ls-tab').forEach(t=>t.classList.remove('active'));document.querySelector(`.ls-tab[data-tab="${tab}"]`)?.classList.add('active');const el=document.getElementById('ls-content');if(!el)return;el.innerHTML='<div class="loading">Đang tải...</div>';let ep='/api/livescore/'+tab;if(tab.startsWith('bxh_'))ep='/api/livescore/standings/'+tab.replace('bxh_','');try{const r=await fetch(ep);const d=await r.json();el.innerHTML=d.html&&d.html.length>50?d.html:'<div class="loading">Không có dữ liệu</div>';bindMatchClicks(el);}catch(e){el.innerHTML='<div class="loading">Lỗi</div>';}}
@@ -209,23 +233,56 @@ async function readWallPost(i){const p=_wallPosts[i];if(!p)return;showView('view
     imgGallery += '</div>';
   }
   const hasVideo = p.video && p.video.length > 0;
-  const voiceOptions = [
-    {id:'hoaimy', label:'🎙️ Nữ — Hoài My'},
-    {id:'namminh', label:'🎙️ Nam — Nam Minh'},
+  const allVoices = [
+    {key:'hoaimy',   flag:'🇻🇳', country:'Việt Nam', name:'Hoài My', gender:'Nữ'},
+    {key:'namminh',  flag:'🇻🇳', country:'Việt Nam', name:'Nam Minh', gender:'Nam'},
+    {key:'en_us_f',  flag:'🇺🇸', country:'Mỹ',      name:'Ava',     gender:'Nữ'},
+    {key:'en_us_m',  flag:'🇺🇸', country:'Mỹ',      name:'Brian',   gender:'Nam'},
+    {key:'en_gb_f',  flag:'🇬🇧', country:'Anh',     name:'Sonia',   gender:'Nữ'},
+    {key:'en_gb_m',  flag:'🇬🇧', country:'Anh',     name:'Ryan',    gender:'Nam'},
+    {key:'zh_cn_f',  flag:'🇨🇳', country:'TQ',      name:'Xiaoxiao',gender:'Nữ'},
+    {key:'zh_cn_m',  flag:'🇨🇳', country:'TQ',      name:'Yunyang', gender:'Nam'},
+    {key:'zh_hk_f',  flag:'🇭🇰', country:'Hồng Kông',name:'HiuGaai',gender:'Nữ'},
+    {key:'ja_jp_f',  flag:'🇯🇵', country:'Nhật',    name:'Nanami',  gender:'Nữ'},
+    {key:'ja_jp_m',  flag:'🇯🇵', country:'Nhật',    name:'Keita',   gender:'Nam'},
+    {key:'ko_kr_f',  flag:'🇰🇷', country:'Hàn',     name:'Sun-Hi',  gender:'Nữ'},
+    {key:'ko_kr_m',  flag:'🇰🇷', country:'Hàn',     name:'InJoon',  gender:'Nam'},
+    {key:'fr_fr_f',  flag:'🇫🇷', country:'Pháp',    name:'Denise',  gender:'Nữ'},
+    {key:'fr_fr_m',  flag:'🇫🇷', country:'Pháp',    name:'Henri',   gender:'Nam'},
+    {key:'de_de_f',  flag:'🇩🇪', country:'Đức',     name:'Katja',   gender:'Nữ'},
+    {key:'de_de_m',  flag:'🇩🇪', country:'Đức',     name:'Killian', gender:'Nam'},
+    {key:'es_es_f',  flag:'🇪🇸', country:'TBN',     name:'Ximena',  gender:'Nữ'},
+    {key:'es_mx_m',  flag:'🇲🇽', country:'Mexico',  name:'Jorge',   gender:'Nam'},
+    {key:'th_th_f',  flag:'🇹🇭', country:'Thái',    name:'Premwadee',gender:'Nữ'},
+    {key:'th_th_m',  flag:'🇹🇭', country:'Thái',    name:'Niwat',   gender:'Nam'},
+    {key:'hi_in_f',  flag:'🇮🇳', country:'Ấn Độ',   name:'Swara',   gender:'Nữ'},
+    {key:'hi_in_m',  flag:'🇮🇳', country:'Ấn Độ',   name:'Madhur',  gender:'Nam'},
   ];
+  // Group voices by country for display
+  const voiceGroups = {};
+  allVoices.forEach(v=>{
+    const g = v.country;
+    if(!voiceGroups[g]) voiceGroups[g] = [];
+    voiceGroups[g].push(v);
+  });
   let voiceSelector = '';
   if(!hasVideo){
-    voiceSelector = `<div class="tts-selector"><div class="tts-selector-label">🎙️ Chọn giọng đọc:</div><div class="tts-voice-btns">`;
-    voiceOptions.forEach(v=>{
-      voiceSelector += `<button class="tts-voice-btn" onclick="document.querySelectorAll('.tts-voice-btn').forEach(b=>b.classList.remove('active'));this.classList.add('active');document.getElementById('selected-voice').value='${v.id}'">${v.label}</button>`;
-    });
-    voiceSelector += `</div><div class="tts-speed-row"><span>Tốc độ:</span><select id="selected-speed"><option value="1.0">1.0x — Bình thường</option><option value="1.2" selected>1.2x — Nhanh</option><option value="1.5">1.5x — Rất nhanh</option><option value="0.8">0.8x — Chậm</option></select></div>`;
+    voiceSelector = `<div class="tts-selector"><div class="tts-selector-label">🎙️ Chọn giọng đọc (đa ngôn ngữ):</div><div class="tts-voice-groups">`;
+    for(const [country, voices] of Object.entries(voiceGroups)){
+      voiceSelector += `<div class="tts-voice-group"><div class="tts-voice-group-label">${voices[0].flag} ${country}</div><div class="tts-voice-btns">`;
+      voices.forEach(v=>{
+        const label = `${v.flag} ${v.gender==='Nữ'?'👩':'👨'} ${v.name}`;
+        voiceSelector += `<button class="tts-voice-btn" data-voice="${v.key}" onclick="selectVoice('${v.key}')">${label}</button>`;
+      });
+      voiceSelector += `</div></div>`;
+    }
+    voiceSelector += `</div><div class="tts-speed-row"><span>⚡ Tốc độ:</span><select id="selected-speed"><option value="1.0">1.0x — Bình thường</option><option value="1.2" selected>1.2x — Nhanh</option><option value="1.5">1.5x — Rất nhanh</option><option value="0.8">0.8x — Chậm</option></select></div>`;
     voiceSelector += `<input type="hidden" id="selected-voice" value="hoaimy"></div>`;
   }
   document.getElementById('view-article').innerHTML=`<button class="back-btn" onclick="switchCat('home')">← Quay lại</button><div class="article-view"><span class="badge badge-ai">AI</span><h1 class="article-title">${esc(p.title)}</h1>${imgGallery}<p class="article-p" style="white-space:pre-wrap">${esc(p.text)}</p>${hasVideo?`<video class="article-img" src="${esc(p.video)}" controls playsinline style="max-height:400px"></video>`:''}<div class="article-actions">${hasVideo?`<button onclick="openShortAIFeed(${i})">🎬 Xem Short</button>${voiceSelector}<button class="primary" onclick="makeShortVideo('${esc(p.id)}',this,document.getElementById('selected-voice')?.value,parseFloat(document.getElementById('selected-speed')?.value)||1.2)">🔄 Tạo lại Short</button>`:`${voiceSelector}<button class="primary" onclick="makeShortVideo('${esc(p.id)}',this,document.getElementById('selected-voice')?.value,parseFloat(document.getElementById('selected-speed')?.value)||1.2)">🎬 Tạo Video Shorts</button>`}<button onclick="doShare('${esc(p.title)}','${SPACE}','${esc(p.img||'')}')">📤</button></div></div>`;
-  const firstVoiceBtn = document.querySelector('.tts-voice-btn');
-  if(firstVoiceBtn) firstVoiceBtn.classList.add('active');
+  // Auto-select default voice
+  selectVoice('hoaimy');
   window.scrollTo(0,0)}
 async function loadNewsTab(){const el=document.getElementById('view-cat');el.innerHTML='<div class="loading">Đang tải...</div>';try{const r=await fetch('/api/homepage');const news=await r.json();if(!news.length){el.innerHTML='<div class="loading">Không có tin</div>';return}const groups={};news.forEach(a=>{if(!groups[a.group])groups[a.group]=[];groups[a.group].push(a)});let h='';for(const[g,arts] of Object.entries(groups)){h+=`<div class="section-title">${g}</div><div class="grid">`;arts.slice(0,6).forEach(a=>{h+=`<div class="card" onclick="readArticle('${esc(a.link)}')"><div class="card-img">${a.img?`<img src="${a.img}">`:''}</div><div class="card-body"><span class="badge badge-vne">${esc(a.source||'VnE')}</span><div class="card-title">${esc(a.title)}</div></div></div>`});h+='</div>'}el.innerHTML=h}catch(e){el.innerHTML='<div class="loading">Lỗi</div>'}}
 async function loadCat(id){const el=document.getElementById('view-cat');el.innerHTML='<div class="loading">Đang tải...</div>';const arts=await fetch('/api/category/'+id).then(r=>r.json()).catch(()=>[]);if(!arts.length){el.innerHTML='<div class="loading">Không có tin</div>';return}let h='<div class="grid">';arts.forEach(a=>{h+=`<div class="card" onclick="readArticle('${esc(a.link)}')"><div class="card-img">${a.img?`<img src="${a.img}">`:''}</div><div class="card-body"><span class="badge badge-vne">${esc(a.source||'')}</span><div class="card-title">${esc(a.title)}</div></div></div>`});h+='</div>';el.innerHTML=h}
-fetch('/api/storage_status').then(r=>r.json()).then(j=>{if(!j.persistent){const home=document.getElementById('view-home');if(home){const w=document.createElement('div');w.className='storage-warn';w.innerHTML='⚠️ Persistent Storage chưa bật.';home.prepend(w)}}}).catch(()=>{});
+fetch('/api/storage_status').then(r=>r.json()).then(j=>{if(!j.persistent){const home=document.getElementById('view-home');if(home){const w=document.createElement('div');w.className='storage-warn';w.innerHTML='⚠️ Persistent Storage chưa bật.';home.prepend(w)}}}).catch(()=>{});