Upload static/shorts_fresh.js

static/shorts_fresh.js

@@ -1,11 +1,10 @@
 /**
- * VNEWS Fresh Shorts Fetcher v8 - 24h filter
- * Only shows posts from last 24h
+ * VNEWS Fresh Shorts Fetcher v8 - 24h filter for both shorts and wall
  */
 (function() {
   'use strict';
   
-  const MAX_AGE = 86400000; // 24h in ms
+  const MAX_AGE_MS = 86400000; // 24h in ms
   
   function toast(msg) {
     let t = document.getElementById('short-progress-toast');
@@ -31,30 +30,28 @@
     return url;
   }
   
-  // Filter items to only 24h
-  function filter24h(items) {
+  // Filter items by 24h
+  function filter24h(items, timeField = 'created') {
     const now = Date.now();
     return items.filter(item => {
-      // Check if item has created timestamp
-      if (item.created) {
-        return (now - item.created) <= MAX_AGE;
+      const created = item[timeField] || (typeof item.created === 'number' ? item.created * 1000 : item.created);
+      if (created) {
+        // Handle both timestamp (ms) and Unix timestamp (s)
+        const ts = created > 1000000000000 ? created : created * 1000;
+        return (now - ts) <= MAX_AGE_MS;
       }
-      // Default: keep (server-side will filter)
-      return true;
+      return true; // Keep if no timestamp
     });
   }
   
-  // Fetch via server-side API
+  // Fetch shorts from server API
   async function fetchShorts() {
     try {
       const r = await fetch('/api/shorts?t=' + Date.now());
       if (r.ok) {
         let data = await r.json();
-        // Filter 24h if items have timestamps
         if (Array.isArray(data)) {
           data = filter24h(data);
-        }
-        if (Array.isArray(data) && data.length > 0) {
           return data.map(item => ({
             id: item.id,
             title: item.title || 'YouTube Short',
@@ -65,26 +62,21 @@
           }));
         }
       }
-    } catch(e) {
-      console.warn('Server API failed:', e);
-    }
+    } catch(e) {}
     return [];
   }
   
-  // Fetch from YouTube RSS
+  // Fetch shorts from YouTube RSS (fresh)
   async function fetchFromRSS() {
     try {
       const r = await fetch('/api/shorts/rss?t=' + Date.now());
       if (r.ok) {
         const data = await r.json();
         if (data.shorts && data.shorts.length > 0) {
-          // RSS already filtered by server
-          return data.shorts;
+          return data.shorts; // Server already filtered
         }
       }
-    } catch(e) {
-      console.warn('RSS fetch failed:', e);
-    }
+    } catch(e) {}
     return [];
   }
   
@@ -101,16 +93,10 @@
   }
   
   function rerenderShortsSlide(shorts) {
-    let existingSlide = document.getElementById('shorts-live-slide');
-    if (!existingSlide) {
-      const labels = document.querySelectorAll('.slider-wrap .slider-label');
-      for (const label of labels) {
-        if ((label.textContent || '').includes('Shorts')) {
-          existingSlide = label.closest('.slider-wrap');
-          break;
-        }
-      }
-    }
+    const existingSlide = document.getElementById('shorts-live-slide') || 
+      Array.from(document.querySelectorAll('.slider-wrap')).find(el => 
+        (el.querySelector('.slider-label')?.textContent || '').includes('Shorts')
+      );
     
     const mixed = interleaveShorts(shorts);
     if (!mixed.length) return;
@@ -118,71 +104,98 @@
     let h = '<div class="slider-header"><span class="slider-label">📱 Shorts Dân trí & SKĐS (24h)</span><span class="slider-note">🟢 vừa cập nhật</span></div><div class="slider-track">';
     mixed.slice(0, 25).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="' + esc(proxyImg(a.img)) + '" loading="lazy" onerror="this.src=\'https://i.ytimg.com/vi/' + a.id + '/hqdefault.jpg\'">' : '') + '<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 class="slider-item shorts-item" onclick="openYTShortsFeed(' + i + ')"><div class="slider-thumb shorts-thumb">' + 
+        (a.img ? '<img src="' + esc(proxyImg(a.img)) + '" loading="lazy" onerror="this.src=\'https://i.ytimg.com/vi/' + a.id + '/hqdefault.jpg\'">' : '') + 
+        '<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>';
     
     if (existingSlide) {
       existingSlide.innerHTML = h;
       existingSlide.id = 'shorts-live-slide';
-      existingSlide.style.boxShadow = '0 0 8px #5cb87a';
-      setTimeout(() => { existingSlide.style.boxShadow = 'none'; }, 2000);
     }
   }
   
   window.refreshShorts = async function() {
-    try {
-      toast('🔄 Đang tải shorts mới...');
-      
-      // Try RSS first (freshest)
-      let all = await fetchFromRSS();
-      
-      // Fallback to server API
-      if (all.length === 0) {
-        console.log('[Shorts] RSS empty, trying server API...');
-        all = await fetchShorts();
-      }
-      
-      // Deduplicate
-      const seen = new Set();
-      const fresh = all.filter(s => seen.has(s.id) ? false : (seen.add(s.id), true));
-      
-      if (fresh.length > 0) {
-        window._shortsData = fresh;
-        rerenderShortsSlide(fresh);
-        localStorage.setItem('vnews_shorts', JSON.stringify({ ts: Date.now(), data: fresh }));
-        toast('✓ Đã cập nhật ' + fresh.length + ' shorts (24h)!');
-        return fresh;
-      } else {
-        toast('⚠️ Không có shorts mới trong 24h');
-        return window._shortsData || [];
-      }
-    } catch(e) {
-      console.error('Shorts refresh error:', e);
-      toast('⚠️ Lỗi tải shorts');
-      return window._shortsData || [];
+    let all = await fetchFromRSS();
+    if (all.length === 0) all = await fetchShorts();
+    
+    const seen = new Set();
+    const fresh = all.filter(s => seen.has(s.id) ? false : (seen.add(s.id), true));
+    
+    if (fresh.length > 0) {
+      window._shortsData = fresh;
+      rerenderShortsSlide(fresh);
+      localStorage.setItem('vnews_shorts', JSON.stringify({ ts: Date.now(), data: fresh }));
+      toast('✓ ' + fresh.length + ' shorts (24h)!');
     }
   };
   
-  function loadCache() {
-    try {
-      const c = JSON.parse(localStorage.getItem('vnews_shorts') || '{}');
-      if (c.data && c.data.length > 0 && (Date.now() - c.ts) < 7200000) {
-        return filter24h(c.data);
+  // Patch _renderWallIn to filter 24h
+  const origRenderWallIn = window._renderWallIn;
+  window._renderWallIn = function(afterEl) {
+    if (!window._wallPosts || !window._wallPosts.length || !afterEl) return;
+    
+    // Filter to 24h
+    const now = Date.now();
+    const posts = window._wallPosts.filter(p => {
+      const created = p.created || 0;
+      const ts = created > 1000000000000 ? created : created * 1000;
+      return (now - ts) <= MAX_AGE_MS;
+    }).slice(0, 20);
+    
+    if (!posts.length) return;
+    
+    // Render Short AI slide (videos only)
+    const aiShorts = posts.filter(p => p.video);
+    if (aiShorts.length) {
+      let wrap = document.getElementById('short-ai-section');
+      if (!wrap) {
+        wrap = document.createElement('div');
+        wrap.className = 'slider-wrap';
+        wrap.id = 'short-ai-section';
+        afterEl.parentNode.insertBefore(wrap, afterEl);
       }
-    } catch(e) {}
-    return null;
-  }
+      let h = '<div class="slider-header"><span class="slider-label">🎬 Short AI (24h)</span></div><div class="slider-track">';
+      aiShorts.forEach((p, i) => {
+        h += '<div class="slider-item shorts-item" onclick="openShortAIFeed(' + i + ')"><div class="slider-thumb shorts-thumb"><video src="' + esc(p.video) + '" muted preload="metadata"></video><div class="card-play">▶</div></div><div class="slider-title">' + esc(p.title) + '</div></div>';
+      });
+      h += '</div>';
+      wrap.innerHTML = h;
+    }
+    
+    // Render AI Wall
+    wrap = document.createElement('div');
+    wrap.className = 'slider-wrap';
+    wrap.id = 'ai-wall-wrap';
+    let h = '<div class="slider-header"><span class="slider-label">🧱 Tường AI (24h)</span></div><div class="slider-track" id="ai-wall-track">';
+    posts.forEach((p, i) => {
+      h += '<div class="wall-item" id="wall-item-' + esc(p.id) + '"><div class="wall-thumb">' + 
+        (p.img ? '<img src="' + proxyImg(p.img) + '">' : (p.video ? '<video src="' + esc(p.video) + '" muted></video>' : '')) + 
+        '</div><div class="wall-title">' + esc(p.title) + '</div></div>';
+    });
+    h += '</div>';
+    wrap.innerHTML = h;
+    afterEl.parentNode.insertBefore(wrap, afterEl);
+  };
   
-  // Load cache first
-  const cached = loadCache();
-  if (cached && cached.length > 0) {
-    window._shortsData = cached;
-    setTimeout(() => rerenderShortsSlide(cached), 2000);
-  }
+  // Load cache
+  try {
+    const c = JSON.parse(localStorage.getItem('vnews_shorts') || '{}');
+    if (c.data && c.data.length > 0 && (Date.now() - c.ts) < 7200000) {
+      window._shortsData = c.data.filter((item, i, arr) => {
+        const created = item.created || c.ts;
+        const ts = created > 1000000000000 ? created : created * 1000;
+        return (Date.now() - ts) <= MAX_AGE_MS;
+      });
+      if (window._shortsData.length > 0) {
+        setTimeout(() => rerenderShortsSlide(window._shortsData), 2000);
+      }
+    }
+  } catch(e) {}
   
-  // Fetch fresh after delay
+  // Fetch fresh
   setTimeout(() => { window.refreshShorts().catch(() => {}); }, 3000);
   
-  console.log('[Shorts] Fetcher v8 - 24h filter enabled');
+  console.log('[Shorts] Fetcher v8 - 24h filter active');
 })();