Paragraph Snippets
${typeCounts['Paragraph'] || 0}
List Snippets
${typeCounts['List'] || 0}
`;
reportTableBody.innerHTML = '';
if (keywordList.length === 0) {
reportTableBody.innerHTML = `
| No opportunities found. Try a broader topic like "SEO", "bread", or "garden". |
`;
return;
}
keywordList.forEach(item => {
const tr = document.createElement('tr');
tr.className = 'bg-white border-b hover:bg-gray-50';
const typeClass = `snippet-${item.type.toLowerCase()}`;
const diffClass = {
'Low': 'text-green-600',
'Medium': 'text-yellow-600',
'High': 'text-red-600'
}[item.diff];
tr.innerHTML = `
${item.kw} |
${item.type} |
${item.vol.toLocaleString()} |
${item.diff} |
`;
reportTableBody.appendChild(tr);
});
};
// --- Tab & Navigation Logic ---
function switchTab(targetTabId, runAnalysis = false) {
if (runAnalysis) {
currentTab = targetTabId;
tabs.forEach(tab => tab.classList.toggle('active', tab.dataset.tab === currentTab));
tabContents.forEach(content => content.classList.toggle('active', content.id === currentTab));
updateNavButtons();
loader.style.display = 'flex';
pdfContent.style.display = 'none';
setTimeout(() => {
const results = findOpportunities();
renderReport(results);
loader.style.display = 'none';
pdfContent.style.display = 'block';
}, 1500);
} else {
currentTab = targetTabId;
tabs.forEach(tab => tab.classList.toggle('active', tab.dataset.tab === currentTab));
tabContents.forEach(content => content.classList.toggle('active', content.id === currentTab));
updateNavButtons();
}
}
function updateNavButtons() {
if (currentTab === 'input') {
prevBtn.style.display = 'none';
nextBtn.style.display = 'inline-flex';
pdfButtonContainer.style.display = 'none';
} else {
prevBtn.style.display = 'inline-flex';
nextBtn.style.display = 'none';
pdfButtonContainer.style.display = 'block';
}
}
// --- Event Handlers ---
tabs.forEach(tab => tab.addEventListener('click', () => switchTab(tab.dataset.tab)));
nextBtn.addEventListener('click', () => switchTab('report', true));
prevBtn.addEventListener('click', () => switchTab('input'));
// --- PDF Download ---
downloadPdfBtn.addEventListener('click', async () => {
const { jsPDF } = window.jspdf;
const doc = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' });
const content = document.getElementById('pdf-content');
document.getElementById('pdf-date').textContent = `Report Generated: ${new Date().toLocaleString()}`;
const canvas = await html2canvas(content, { scale: 2 });
const imgData = canvas.toDataURL('image/jpeg', 1.0);
const imgProps = doc.getImageProperties(imgData);
const pdfWidth = doc.internal.pageSize.getWidth() - 28;
const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
doc.addImage(imgData, 'JPEG', 14, 15, pdfWidth, pdfHeight);
document.getElementById('pdf-date').textContent = '';
doc.save(`Featured-Snippet-Report-${new Date().toISOString().slice(0,10)}.pdf`);
});
// --- Initial Load ---
updateNavButtons();
});
