Add big_sale.js with BIG SALE floating promotion module (23 products)

big_sale.js

@@ -1,215 +1,264 @@
-// BIG SALE Floating Promotion for V.AI AVATAR2
-// Space: bep40/vai-avatar2
+// BIG SALE Floating Promotion Module v1.0
+// Integrates BIG SALE promotion button with product detail modal
+// Compatible with bep40/vai-avatar2 space architecture
 
-// Product data for BIG SALE
-// Format: [STT, Mã sản phẩm, Tên sản phẩm, SL, Giá bán lẻ (VNĐ), Chiết khấu (%), Giá Bigsale (VNĐ), Tình trạng]
+console.log('[BIG SALE] Module loaded (v1.0)');
+
+// BIG SALE Product Data — 23 products with discount info
 const BIG_SALE_PRODUCTS = [
-  [1, "MC-7086HS", "MÁY HÚT", 3, 11389000, 55, 5125050, "HÀNG MỚI"],
-  [2, "MH-70SMC", "MÁY HÚT ECO", 2, 4620000, 60, 1848000, "HÀNG MỚI"],
-  [3, "MH-90SMC", "MÁY HÚT ECO", 4, 5060000, 60, 2024000, "HÀNG MỚI"],
-  [4, "MH-600GT", "MÁY HÚT", 5, 8208000, 50, 4104000, "HÀNG MỚI"],
-  [5, "AS-9602DG", "BẾP 2 GAS", 2, 7815000, 50, 3907500, "HÀNG MỚI"],
-  [6, "SMART K-450", "CHẬU ĐÁ", 1, 21109000, 55, 9499050, "HÀNG MỚI"],
-  [7, "MS-1022D", "CHẊU RỦA", 4, 5852000, 50, 2926000, "HÀNG MỚI"],
-  [8, "MS-2025", "CHẊU RỦA", 1, 5700000, 55, 2565000, "HÀNG MỚI"],
-  [9, "MS-6070", "CHẊU RỦA", 11, 6464000, 50, 3232000, "HÀNG MỚI"],
-  [10, "MS-5066W", "CHẊU RỦA", 8, 4385000, 50, 2192500, "HÀNG MỚI"],
-  [11, "MS-5082W", "CHẊU RỦA", 3, 6350000, 50, 3175000, "HÀNG MỚI"],
-  [12, "MS-862", "CHẊU RỦA", 3, 12960000, 55, 5832000, "HÀNG MỚI"],
-  [13, "MPC-5KCB", "BỘ LỌC NƯỚC", 1, 10702000, 50, 5351000, "HÀNG MỚI"],
-  [14, "K061S", "VÒI", 10, 3056000, 50, 1528000, "HÀNG MỚI"],
-  [15, "K569SN", "VÒI ECO", 2, 3520000, 55, 1584000, "HÀNG MỚI"],
-  [16, "K525B", "VÒI", 2, 2916000, 55, 1312200, "HÀNG MỚI"],
-  [17, "K130S", "VÒI", 4, 4104000, 55, 1846800, "HÀNG MỚI"],
-  [18, "K136A", "VÒI", 2, 2430000, 55, 1093500, "HÀNG MỚI"],
-  [19, "K501B", "VÒI", 2, 5076000, 55, 2284200, "HÀNG MỚI"],
-  [20, "MST-6667", "LÓT NỒI", 25, 255000, 70, 76500, "HÀNG MỚI"],
-  [21, "MMPM-657A", "XAY TIÊU", 34, 295000, 70, 88500, "HÀNG MỚI"],
-  [22, "MOVS-10128", "BỘ ĐỰNG DẦU", 2, 491000, 70, 147300, "HÀNG MỚI"],
-  [23, "BỘ LÀM SẠCH NHÀ BẾP", "BỘ LÀM SẠCH NHÀ BẾP", 8, 720000, 70, 216000, "HÀNG MỚI"]
+  { stt: 1, code: "MC-7086HS",  name: "MÁY HÚT",         category: "MÁY HÚT",        qty: 3,  price: "11.389.000", discount: "55%", bigsale: "5.125.050", status: "HÀNG MỚI" },
+  { stt: 2, code: "MH-70SMC",   name: "MÁY HÚT ECO",    category: "MÁY HÚT",        qty: 2,  price: "4.620.000",  discount: "60%", bigsale: "1.848.000", status: "HÀNG MỚI" },
+  { stt: 3, code: "MH-90SMC",   name: "MÁY HÚT ECO",    category: "MÁY HÚT",        qty: 4,  price: "5.060.000",  discount: "60%", bigsale: "2.024.000", status: "HÀNG MỚI" },
+  { stt: 4, code: "MH-600GT",   name: "MÁY HÚT",        category: "MÁY HÚT",        qty: 5,  price: "8.208.000",  discount: "50%", bigsale: "4.104.000", status: "HÀNG MỚI" },
+  { stt: 5, code: "AS-9602DG",  name: "BẾP 2 GAS",      category: "BẾP GAS",        qty: 2,  price: "7.815.000",  discount: "50%", bigsale: "3.907.500", status: "HÀNG MỚI" },
+  { stt: 6, code: "SMART K-450",name: "CHẬU ĐÁ",        category: "CHẬU ĐÁ",        qty: 1,  price: "21.109.000", discount: "55%", bigsale: "9.499.050", status: "HÀNG MỚI" },
+  { stt: 7, code: "MS-1022D",   name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 4,  price: "5.852.000",  discount: "50%", bigsale: "2.926.000", status: "HÀNG MỚI" },
+  { stt: 8, code: "MS-2025",    name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 1,  price: "5.700.000",  discount: "55%", bigsale: "2.565.000", status: "HÀNG MỚI" },
+  { stt: 9, code: "MS-6070",    name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 11, price: "6.464.000",  discount: "50%", bigsale: "3.232.000", status: "HÀNG MỚI" },
+  { stt: 10, code: "MS-5066W",  name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 8,  price: "4.385.000",  discount: "50%", bigsale: "2.192.500", status: "HÀNG MỚI" },
+  { stt: 11, code: "MS-5082W",  name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 3,  price: "6.350.000",  discount: "50%", bigsale: "3.175.000", status: "HÀNG MỚI" },
+  { stt: 12, code: "MS-862",    name: "CHẬU RỰA",       category: "CHẬU RỰA",       qty: 3,  price: "12.960.000", discount: "55%", bigsale: "5.832.000", status: "HÀNG MỚI" },
+  { stt: 13, code: "MPC-5KCB",  name: "BỘ LỌC NƯỚC",    category: "LỌC NƯỚC",      qty: 1,  price: "10.702.000", discount: "50%", bigsale: "5.351.000", status: "HÀNG MỚI" },
+  { stt: 14, code: "K061S",     name: "VÒI",           category: "VÒI",            qty: 10, price: "3.056.000",  discount: "50%", bigsale: "1.528.000", status: "HÀNG MỚI" },
+  { stt: 15, code: "K569SN",    name: "VÒI ECO",       category: "VÒI",            qty: 2,  price: "3.520.000",  discount: "55%", bigsale: "1.584.000", status: "HÀNG MỚI" },
+  { stt: 16, code: "K525B",     name: "VÒI",           category: "VÒI",            qty: 2,  price: "2.916.000",  discount: "55%", bigsale: "1.312.200", status: "HÀNG MỚI" },
+  { stt: 17, code: "K130S",     name: "VÒI",           category: "VÒI",            qty: 4,  price: "4.104.000",  discount: "55%", bigsale: "1.846.800", status: "HÀNG MỚI" },
+  { stt: 18, code: "K136A",     name: "VÒI",           category: "VÒI",            qty: 2,  price: "2.430.000",  discount: "55%", bigsale: "1.093.500", status: "HÀNG MỚI" },
+  { stt: 19, code: "K501B",     name: "VÒI",           category: "VÒI",            qty: 2,  price: "5.076.000",  discount: "55%", bigsale: "2.284.200", status: "HÀNG MỚI" },
+  { stt: 20, code: "MST-6667",  name: "LÓT NỒI",       category: "PHỤ KIỆN",       qty: 25, price: "255.000",    discount: "70%", bigsale: "76.500",   status: "HÀNG MỚI" },
+  { stt: 21, code: "MMPM-657A", name: "XAY TIÊU",      category: "PHỤ KIỆN",       qty: 34, price: "295.000",    discount: "70%", bigsale: "88.500",   status: "HÀNG MỚI" },
+  { stt: 22, code: "MOVS-10128",name: "BỘ ĐỰNG DẦU",     category: "PHỤ KIỆN",       qty: 2,  price: "491.000",    discount: "70%", bigsale: "147.300",  status: "HÀNG MỚI" },
+  { stt: 23, code: "BỘ LÀM SẠCH NHÀ BẾP", name: "BỘ LÀM SẠCH NHÀ BẾP", category: "PHỤ KIỆN", qty: 8, price: "720.000", discount: "70%", bigsale: "216.000", status: "HÀNG MỚI" }
 ];
 
-(function() {
-  'use strict';
+// Format VND currency
+function formatVND(price) {
+  const num = parseInt(price.replace(/\./g, ''));
+  if (isNaN(num)) return price;
+  return new Intl.NumberFormat('vi-VN', { style: 'currency', currency: 'VND' }).format(num);
+}
 
-  // Format currency VND
-  function formatVND(amount) {
-    return new Intl.NumberFormat('vi-VN', {
-      style: 'currency',
-      currency: 'VND',
-      minimumFractionDigits: 0
-    }).format(amount);
-  }
+// Build a product card HTML string
+function buildProductCard(p) {
+  const discountClass = p.discount.includes('7') ? 'discount-high' : 'discount-mid';
+  return `
+    <div class="big-sale-product" data-code="${p.code}" data-stt="${p.stt}">
+      <div class="big-sale-product-header">
+        <span class="big-sale-stt">S${p.stt}</span>
+        <span class="big-sale-discount ${discountClass}">-${p.discount}</span>
+      </div>
+      <div class="big-sale-product-name">${p.name}</div>
+      <div class="big-sale-product-code">${p.code}</div>
+      <div class="big-sale-product-meta">
+        <span class="big-sale-qty">SL: ${p.qty}</span>
+        <span class="big-sale-status">HÀNG MỚI</span>
+      </div>
+      <div class="big-sale-price-row">
+        <span class="big-sale-price-original">${formatVND(p.price)}</span>
+        <span class="big-sale-price-new">${formatVND(p.bigsale)}</span>
+      </div>
+    </div>`;
+}
 
-  // Create the BIG SALE floating button
-  function createFloatingButton() {
-    var button = document.createElement('button');
-    button.id = 'bigSaleToggle';
-    button.className = 'big-sale-floating';
-    button.setAttribute('aria-label', 'Mở chương trình BIG SALE');
-    button.setAttribute('title', 'BIG SALE - Khuyến mãi hot');
-    button.innerHTML =
-      '<span class="big-sale-badge">BIG SALE</span>' +
-      '<span class="big-sale-title">BIG SALE</span>' +
-      '<span class="big-sale-count">' + BIG_SALE_PRODUCTS.length + ' sản phẩm</span>';
-    return button;
-  }
+// Create the floating button + panel
+function createBigSaleElements() {
+  // Check if already exists
+  if (document.getElementById('big-sale-floating')) return;
 
-  // Create the BIG SALE panel
-  function createPanel() {
-    var panel = document.createElement('div');
-    panel.id = 'bigSalePanel';
-    panel.className = 'big-sale-panel';
-    panel.innerHTML =
-      '<div class="big-sale-header">' +
-        '<h3><i class="fas fa-bolt" style="margin-right:8px"></i> CHƯƠNG TRÌNH BIG SALE</h3>' +
-        '<button class="big-sale-close" id="bigSaleClose" aria-label="Đóng">' +
-          '<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">' +
-            '<line x1="18" y1="6" x2="6" y2="18"></line>' +
-            '<line x1="6" y1="6" x2="18" y2="18"></line>' +
-          '</svg>' +
-        '</button>' +
-      '</div>' +
-      '<div class="big-sale-products" id="bigSaleProducts"></div>';
-    return panel;
-  }
+  const floating = document.createElement('button');
+  floating.id = 'big-sale-floating';
+  floating.setAttribute('aria-label', 'Chương trình BIG SALE');
+  floating.setAttribute('title', 'Chương trình BIG SALE');
+  floating.innerHTML = `
+    <div class="big-sale-btn-content">
+      <span class="big-sale-badge">BIG SALE</span>
+      <span class="big-sale-count">${BIG_SALE_PRODUCTS.length} SP</span>
+    </div>
+    <div class="big-sale-chevron">▼</div>
+  `;
 
-  // Render product cards into the panel
-  function renderProducts() {
-    var container = document.getElementById('bigSaleProducts');
-    if (!container) return;
-
-    var html = '';
-    BIG_SALE_PRODUCTS.forEach(function(product) {
-      var stt = product[0];
-      var maSp = product[1];
-      var tenSp = product[2];
-      var sl = product[3];
-      var giaBan = product[4];
-      var chietKhau = product[5];
-      var giaBigSale = product[6];
-      var tinhTrang = product[7];
-      var originalPrice = formatVND(giaBan);
-      var bigSalePrice = formatVND(giaBigSale);
-
-      html +=
-        '<div class="big-sale-product" onclick="window.openBigSaleProduct(' + stt + ')">' +
-          '<div class="big-sale-product-info">' +
-            '<div class="big-sale-product-name">' + tenSp + '</div>' +
-            '<div class="big-sale-product-code">Mã: ' + maSp + '</div>' +
-            '<div class="big-sale-product-meta">' +
-              '<span class="big-sale-new-badge">SL: ' + sl + '</span>' +
-              '<span class="big-sale-new-badge">' + tinhTrang + '</span>' +
-            '</div>' +
-          '</div>' +
-          '<div class="big-sale-product-price-container">' +
-            '<div class="big-sale-product-bigprice">' + originalPrice + '</div>' +
-            '<div class="big-sale-product-price">' + bigSalePrice + '</div>' +
-            '<span class="big-sale-product-discount">' + chietKhau + '% OFF</span>' +
-          '</div>' +
-        '</div>';
-    });
+  const panel = document.createElement('div');
+  panel.id = 'big-sale-panel';
+  panel.setAttribute('role', 'dialog');
+  panel.setAttribute('aria-label', 'Chương trình khuyến mãi BIG SALE');
+  panel.innerHTML = `
+    <div class="big-sale-panel-header">
+      <div class="big-sale-panel-title">
+        <span class="big-sale-panel-icon">🔥</span>
+        <span>CHƯƠNG TRÌNH BIG SALE</span>
+      </div>
+      <span class="big-sale-product-count">${BIG_SALE_PRODUCTS.length} sản phẩm</span>
+    </div>
+    <div class="big-sale-product-list">
+      ${BIG_SALE_PRODUCTS.map(p => buildProductCard(p)).join('')}
+    </div>
+    <div class="big-sale-panel-footer">
+      <button class="big-sale-view-all-btn">Xem tất cả sản phẩm</button>
+    </div>
+  `;
 
-    container.innerHTML = html;
-  }
+  document.body.appendChild(floating);
+  document.body.appendChild(panel);
 
-  // Open product detail from BIG SALE
-  window.openBigSaleProduct = function(stt) {
-    var product = BIG_SALE_PRODUCTS.find(function(p) { return p[0] === stt; });
-    if (!product) return;
-
-    var maSp = product[1];
-    var tenSp = product[2];
-    var sl = product[3];
-    var giaBan = product[4];
-    var chietKhau = product[5];
-    var giaBigSale = product[6];
-    var tinhTrang = product[7];
-    var originalPrice = formatVND(giaBan);
-    var bigSalePrice = formatVND(giaBigSale);
-
-    // Try to use existing vaistudio detail modal
-    var detailOverlay = document.getElementById('vaistudio-detail-overlay');
-    if (detailOverlay) {
-      document.getElementById('detail-title').textContent = tenSp;
-      document.getElementById('detail-brand').textContent = maSp;
-      document.getElementById('detail-model').textContent = tinhTrang;
-      document.getElementById('detail-price').innerHTML =
-        '<div style="display:flex;align-items:center;gap:8px;flex-wrap:wrap">' +
-          '<span style="color:#c2410c;font-size:1.2rem;font-weight:800">' + bigSalePrice + '</span>' +
-          '<span style="font-size:0.7rem;background:#fee2e2;color:#dc2626;padding:2px 8px;border-radius:8px;font-weight:600">-' + chietKhau + '%</span>' +
-        '</div>' +
-        '<div style="font-size:0.7rem;text-decoration:line-through;color:#64748b;margin-top:2px">' + originalPrice + '</div>';
-      detailOverlay.style.display = 'flex';
-      return;
-    }
+  attachBigSaleEventListeners(floating, panel);
+}
 
-    alert(
-      'Sản phẩm: ' + tenSp + '\n' +
-      'Mã: ' + maSp + '\n' +
-      'Giá gốc: ' + originalPrice + '\n' +
-      'Giá BIG SALE: ' + bigSalePrice + '\n' +
-      'Chiết khấu: ' + chietKhau + '%\n' +
-      'Số lượng: ' + sl + '\n' +
-      'Tình trạng: ' + tinhTrang
-    );
-  };
+// Event listeners
+function attachBigSaleEventListeners(floating, panel) {
+  let isOpen = false;
 
-  // Close product detail
-  window.closeBigSaleDetail = function() {
-    var overlay = document.getElementById('vaistudio-detail-overlay');
-    if (overlay) overlay.style.display = 'none';
-  };
+  floating.addEventListener('click', function(e) {
+    e.stopPropagation();
+    isOpen = !isOpen;
+    panel.classList.toggle('open', isOpen);
+    floating.classList.toggle('open', isOpen);
+  });
 
-  // Initialize BIG SALE
-  function initBigSale() {
-    // Check if already initialized
-    if (document.getElementById('bigSaleToggle')) return;
+  // Close when clicking outside
+  document.addEventListener('click', function(e) {
+    if (isOpen && !panel.contains(e.target) && !floating.contains(e.target)) {
+      panel.classList.remove('open');
+      floating.classList.remove('open');
+      isOpen = false;
+    }
+  });
 
-    // Create floating button
-    var floatingBtn = createFloatingButton();
-    document.body.appendChild(floatingBtn);
+  // Product click → open detail modal
+  const products = panel.querySelectorAll('.big-sale-product');
+  products.forEach(card => {
+    card.addEventListener('click', function(e) {
+      e.stopPropagation();
+      const stt = parseInt(this.getAttribute('data-stt'));
+      const product = BIG_SALE_PRODUCTS.find(p => p.stt === stt);
+      if (product) {
+        openBigSaleDetail(product);
+      }
+    });
+  });
 
-    // Create panel
-    var panel = createPanel();
-    document.body.appendChild(panel);
+  // "Xem tất cả" button
+  const viewAllBtn = panel.querySelector('.big-sale-view-all-btn');
+  if (viewAllBtn) {
+    viewAllBtn.addEventListener('click', function(e) {
+      e.stopPropagation();
+      closeBigSalePanel();
+      if (window.vaistudioToggle && typeof window.vaistudioToggle === 'function') {
+        window.vaistudioToggle();
+      } else {
+        const toggle = document.getElementById('vaistudio-toggle');
+        if (toggle) toggle.click();
+      }
+    });
+  }
+}
 
-    // Wire up events
-    var toggleBtn = document.getElementById('bigSaleToggle');
-    var salePanel = document.getElementById('bigSalePanel');
-    var closeBtn = document.getElementById('bigSaleClose');
+// Open vaistudio detail modal with BIG SALE product info
+function openBigSaleDetail(product) {
+  const overlay = document.getElementById('vaistudio-detail-overlay');
+  const modal = document.getElementById('vaistudio-detail-modal');
+  if (!overlay || !modal) return;
 
-    if (toggleBtn && salePanel) {
-      toggleBtn.addEventListener('click', function() {
-        salePanel.classList.toggle('open');
-      });
-    }
+  // Set product title and code
+  const titleEl = document.getElementById('detail-title');
+  const modelEl = document.getElementById('detail-model');
+  const brandEl = document.getElementById('detail-brand');
+  const priceEl = document.getElementById('detail-price');
 
-    if (closeBtn && salePanel) {
-      closeBtn.addEventListener('click', function() {
-        salePanel.classList.remove('open');
-      });
-    }
+  if (titleEl) titleEl.textContent = product.name;
+  if (modelEl) modelEl.textContent = `Mã: ${product.code}`;
+  if (brandEl) {
+    brandEl.textContent = product.category;
+    brandEl.style.background = '#fff1f2';
+    brandEl.style.color = '#e11d48';
+  }
+  if (priceEl) {
+    priceEl.innerHTML = `
+      <div style="display:flex;align-items:center;gap:8px;flex-wrap:wrap">
+        <span style="color:#c2410c">${formatVND(product.bigsale)}</span>
+        <span style="font-size:0.8rem;color:#64748b;text-decoration:line-through">${formatVND(product.price)}</span>
+        <span style="font-size:0.85rem;background:#fef3c7;color:#92400e;padding:4px 10px;border-radius:8px;font-weight:700">-${product.discount}</span>
+      </div>
+    `;
+  }
 
-    // Close panel when clicking outside
-    if (salePanel) {
-      salePanel.addEventListener('click', function(e) {
-        if (e.target === salePanel) {
-          salePanel.classList.remove('open');
-        }
-      });
-    }
+  // Set images (show placeholder with category emoji)
+  const imagesEl = document.getElementById('detail-images');
+  if (imagesEl) {
+    imagesEl.innerHTML = `
+      <div style="flex:1;min-width:120px;height:120px;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:2.5rem">
+        ${getCategoryEmoji(product.category)}
+      </div>
+      <div style="flex:1;min-width:120px;height:120px;background:linear-gradient(135deg,#fef3c7,#fef9c3);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:2.5rem">
+        ${getCategoryEmoji(product.category)}
+      </div>
+    `;
+  }
+
+  // Show BIG SALE pricing info in summary
+  const summaryEl = document.getElementById('detail-summary');
+  if (summaryEl) {
+    summaryEl.style.display = 'block';
+    summaryEl.innerHTML = `
+      <div style="margin-bottom:8px"><strong>🔥 Giá BigSale:</strong> ${formatVND(product.bigsale)}</div>
+      <div style="margin-bottom:8px"><strong>💰 Giá bán lẻ:</strong> ${formatVND(product.price)} → <span style="color:#c2410d;font-weight:700">${formatVND(product.bigsale)}</span></div>
+      <div style="margin-bottom:8px"><strong>🏷️ Chiết khấu:</strong> <span style="color:#dc2626;font-weight:700">-${product.discount}</span></div>
+      <div style="margin-bottom:8px"><strong>📦 Tình trạng:</strong> <span style="color:#16a34a;font-weight:600">${product.status}</span></div>
+      <div><strong>💡 Danh mục:</strong> ${product.category}</div>
+    `;
+  }
 
-    // Render products
-    renderProducts();
+  // Hide features and specs sections
+  const featuresEl = document.getElementById('detail-features');
+  const specsEl = document.getElementById('detail-specs');
+  if (featuresEl) featuresEl.style.display = 'none';
+  if (specsEl) specsEl.style.display = 'none';
 
-    console.log('[BIG SALE] Floating promotion initialized with ' + BIG_SALE_PRODUCTS.length + ' products');
+  overlay.style.display = 'flex';
+
+  // Close vaistudio panel if open
+  const vaistudioPanel = document.getElementById('vaistudio-panel');
+  if (vaistudioPanel && vaistudioPanel.classList.contains('open')) {
+    vaistudioPanel.classList.remove('open');
+    const toggle = document.getElementById('vaistudio-toggle');
+    if (toggle) toggle.classList.remove('open');
   }
+}
+
+// Get emoji for category
+function getCategoryEmoji(category) {
+  const map = {
+    "MÁY HÚT": "🧹",
+    "BẾP GAS": "🔥",
+    "CHẬU ĐÁ": "🧊",
+    "CHẬU RỰA": "🚰",
+    "LỌC NƯỚC": "💧",
+    "VÒI": "🚿",
+    "PHỤ KIỆN": "🧰"
+  };
+  return map[category] || "📦";
+}
 
-  // Initialize when DOM is ready
+// Close BIG SALE panel
+function closeBigSalePanel() {
+  const panel = document.getElementById('big-sale-panel');
+  const floating = document.getElementById('big-sale-floating');
+  if (panel) panel.classList.remove('open');
+  if (floating) floating.classList.remove('open');
+}
+
+// Initialize when DOM is ready
+function initBigSale() {
+  createBigSaleElements();
+  console.log('[BIG SALE] Floating promotion initialized with 23 products');
+}
+
+// Handle dynamic DOM changes
+function tryInitBigSale(retries = 20) {
   if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', initBigSale);
+    document.addEventListener('DOMContentLoaded', () => initBigSale());
   } else {
     initBigSale();
   }
-})();
+}
+
+tryInitBigSale();