`; }); renderCharts(filtered.slice(0, 5)); } else { resultsGrid.classList.add('hidden'); document.getElementById('charts-container').classList.add('hidden'); document.getElementById('initial-message').classList.remove('hidden'); document.getElementById('initial-message').innerHTML = `

No products match your criteria.

`; } }; const renderCharts = (top5) => { if(salesChart) salesChart.destroy(); salesChart = new Chart(document.getElementById('sales-chart').getContext('2d'), { type: 'bar', data: { labels: top5.map(p => p.name), datasets: [{ label: 'Monthly Sales', data: top5.map(p => p.monthlySales), backgroundColor: '#34d399' }] }, options: { indexAxis: 'y', plugins: { legend: { display: false } } } }); if(trendChart) trendChart.destroy(); trendChart = new Chart(document.getElementById('trend-chart').getContext('2d'), { type: 'bar', data: { labels: top5.map(p => p.name), datasets: [{ label: 'Trend Score', data: top5.map(p => p.trendScore), backgroundColor: '#fbbf24' }] }, options: { indexAxis: 'y', plugins: { legend: { display: false } } } }); }; // --- EVENT HANDLERS --- const handleConfigChange = (e) => { if (e.target.tagName !== 'INPUT') return; const id = parseInt(e.target.closest('tr').dataset.id); const field = e.target.dataset.field; const value = e.target.type === 'number' ? parseFloat(e.target.value) || 0 : e.target.value; const product = products.find(p => p.id === id); if(product) product[field] = value; }; const handleAddProduct = () => { const newId = products.length > 0 ? Math.max(...products.map(p => p.id)) + 1 : 1; products.push({ id: newId, name: "New Product", category: "Electronics", price: 0, monthlySales: 0, searchGrowth: 0, socialMentions: 0, rating: 0, releaseDate: new Date().toISOString().split('T')[0] }); renderConfigTable(); }; const handleDeleteProduct = (e) => { const btn = e.target.closest('.delete-product-btn'); if(btn) { const id = parseInt(btn.closest('tr').dataset.id); products = products.filter(p => p.id !== id); renderConfigTable(); } }; const generatePDF = () => { const { jsPDF } = window.jspdf; const pdfContent = document.getElementById('pdf-content'); const pdfBtnContainer = document.getElementById('pdf-button-container'); if (!pdfContent || !pdfBtnContainer) return; pdfBtnContainer.style.display = 'none'; html2canvas(pdfContent, { scale: 2, useCORS: true }).then(canvas => { const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const imgWidth = pdfWidth - 20; const imgHeight = (canvas.height * imgWidth) / canvas.width; pdf.setFontSize(22); pdf.setFont('helvetica', 'bold'); pdf.text('Trending Product Report', pdfWidth / 2, 15, { align: 'center' }); pdf.addImage(imgData, 'PNG', 10, 25, imgWidth, imgHeight); pdf.save('bestseller-trending-report.pdf'); pdfBtnContainer.style.display = 'block'; }).catch(err => { console.error("Error generating PDF:", err); pdfBtnContainer.style.display = 'block'; }); }; // --- ATTACH LISTENERS --- Object.keys(tabButtons).forEach(key => tabButtons[key].addEventListener('click', () => showTab(key))); prevBtn.addEventListener('click', () => showTab('dashboard')); nextBtn.addEventListener('click', () => showTab('config')); document.getElementById('find-products-btn').addEventListener('click', findAndDisplayProducts); const ratingSlider = document.getElementById('filter-rating'); ratingSlider.addEventListener('input', () => { document.getElementById('rating-value').textContent = `> ${ratingSlider.value}`; }); document.getElementById('config-table-body').addEventListener('change', handleConfigChange); document.getElementById('config-table-body').addEventListener('click', handleDeleteProduct); document.getElementById('add-product-btn').addEventListener('click', handleAddProduct); document.getElementById('download-pdf-btn').addEventListener('click', generatePDF); // --- INITIAL SETUP --- showTab('dashboard'); });