Upload static/wc_shorts_inject.js

static/wc_shorts_inject.js

@@ -1,60 +1,76 @@
 /**
  * WC Shorts Inject — Chạy SAU app_v2.js
- * Tạo WC Shorts slide riêng nằm TRÊN World Cup section
- * Gắn vào #wc-shorts-slide-anchor
+ * Tự tạo anchor DIV rồi render WC Shorts slide TRÊN World Cup section
  */
 (function(){
   'use strict';
 
-  // Chờ đến khi loadHome chạy xong (WC section đã render)
-  function tryInject(){
-    const anchor = document.getElementById('wc-shorts-slide-anchor');
-    if(!anchor) return false;
+  function inject(){
+    // Tìm WC section
+    const wcSection = document.getElementById('wc2026-live-section');
+    const homeEl = document.getElementById('view-home');
+    if(!homeEl) return;
 
-    // Đã inject rồi
-    if(anchor.dataset.injected) return true;
-    anchor.dataset.injected = '1';
+    // Đã inject?
+    if(document.getElementById('wc-shorts-slide-section')) return;
 
-    // Gọi renderWCSSlideSection nếu đã load
-    if(typeof renderWCSSlideSection === 'function'){
-      renderWCSSlideSection(anchor);
+    // Đảm bảo renderWCSSlideSection đã load
+    if(typeof renderWCSSlideSection !== 'function'){
+      // Chờ rồi thử lại
+      setTimeout(inject, 500);
+      return;
+    }
+
+    // Tạo container rồi render vào
+    const div = document.createElement('div');
+    div.id = 'wc-shorts-slide-container-tmp';
+    div.style.display = 'none';
+
+    // Insert TRƯỚC WC section, hoặc vào đầu home
+    if(wcSection && wcSection.parentNode){
+      wcSection.parentNode.insertBefore(div, wcSection);
     } else {
-      // Chờ wc_shorts_slide.js load xong
-      let tries = 0;
-      const wait = setInterval(()=>{
-        tries++;
-        if(typeof renderWCSSlideSection === 'function'){
-          clearInterval(wait);
-          renderWCSSlideSection(anchor);
-        } else if(tries > 40){ // 8 seconds
-          clearInterval(wait);
-          anchor.innerHTML = '<div style="text-align:center;padding:10px;color:#666;font-size:11px">Shorts đang cập nhật...</div>';
-        }
-      }, 200);
+      homeEl.insertBefore(div, homeEl.firstChild);
+    }
+
+    // Render slide section vào div
+    renderWCSSlideSection(div);
+
+    // Bỏ wrapper thừa, di chuyển section ra đúng vị trí
+    const section = div.querySelector('.wc-shorts-slide-section');
+    if(section){
+      section.id = 'wc-shorts-slide-section';
+      if(wcSection && wcSection.parentNode){
+        wcSection.parentNode.insertBefore(section, wcSection);
+      }
+      div.remove();
     }
-    return true;
   }
 
-  // Thử ngay
-  if(!tryInject()){
-    // Chờ DOM ready
-    let attempts = 0;
-    const iv = setInterval(()=>{
-      attempts++;
-      if(tryInject() || attempts > 60) clearInterval(iv);
-    }, 500);
+  // Chạy khi DOM sẵn sàng
+  if(document.readyState === 'loading'){
+    document.addEventListener('DOMContentLoaded', ()=> setTimeout(inject, 800));
+  } else {
+    setTimeout(inject, 800);
   }
 
-  // Cũng chạy lại sau khi loadHome xong (vì loadHome rebuild DOM)
+  // Cũng chạy sau khi loadHome xong
   const origLoadHome = window.loadHome;
   if(origLoadHome){
     window.loadHome = function(){
       const result = origLoadHome.apply(this, arguments);
-      // Sau khi loadHome chạy, inject lại
-      setTimeout(tryInject, 100);
-      setTimeout(tryInject, 500);
-      setTimeout(tryInject, 1500);
+      setTimeout(inject, 200);
+      setTimeout(inject, 800);
+      setTimeout(inject, 2000);
       return result;
     };
   }
+
+  // Fallback: retry nhiều lần
+  let retries = 0;
+  const retryIv = setInterval(()=>{
+    retries++;
+    inject();
+    if(retries > 20) clearInterval(retryIv);
+  }, 1000);
 })();