`; resultsContainer.appendChild(resultDiv); }); document.getElementById('compatibleCount').textContent = `${compatibleCount} / ${userCards.length}`; } function renderWalletSelector() { const container = document.getElementById('wallet-selector'); container.innerHTML = DB.wallets.map(w => ` ${w} `).join(''); } function renderCardList() { const container = document.getElementById('card-list'); if (userCards.length === 0) { container.innerHTML = `

No cards added yet.

`; return; } container.innerHTML = userCards.map(c => ` `).join(''); } function openCardModal() { document.getElementById('cardNetwork').innerHTML = DB.networks.map(n => `${n}`).join(''); document.getElementById('issuingBank').innerHTML = DB.banks.map(b => `${b}`).join(''); document.getElementById('cardModal').classList.remove('hidden'); document.getElementById('cardModal').classList.add('flex'); } function closeCardModal() { document.getElementById('cardModal').classList.add('hidden'); document.getElementById('cardModal').classList.remove('flex'); } function addCard() { userCards.push({ id: Date.now(), network: document.getElementById('cardNetwork').value, bank: document.getElementById('issuingBank').value }); renderCardList(); checkCompatibility(); closeCardModal(); } async function generatePdf() { document.getElementById('pdf-date').textContent = new Date().toLocaleDateString(); document.getElementById('pdf-wallet-name').textContent = selectedWallet; document.getElementById('pdf-summary').innerHTML = document.querySelector('.grid.grid-cols-2.gap-4').innerHTML; let tableHtml = ``; const walletData = DB.compatibility[selectedWallet]; userCards.forEach(card => { const isCompatible = walletData[card.network] && walletData[card.network].includes(card.bank); tableHtml += ``; }); tableHtml += `

Card	Status
${card.bank} ${card.network}	${isCompatible ? 'Supported' : 'Not Supported'}

`; document.getElementById('pdf-table-container').innerHTML = tableHtml; const reportEl = document.getElementById('pdf-report'); reportEl.classList.remove('hidden'); const canvas = await html2canvas(reportEl, { scale: 2 }); reportEl.classList.add('hidden'); const imgData = canvas.toDataURL('image/png'); const { jsPDF } = window.jspdf; const pdf = new jsPDF({ orientation: 'p', unit: 'in', format: 'letter' }); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (canvas.height * pdfWidth) / canvas.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save('Wallet-Compatibility-Report.pdf'); } // Event Listeners document.getElementById('wallet-selector').addEventListener('click', e => { if(e.target.matches('.wallet-btn')) { selectedWallet = e.target.dataset.wallet; renderWalletSelector(); checkCompatibility(); } }); document.getElementById('card-list').addEventListener('click', e => { if(e.target.matches('.remove-card-btn')) { const cardId = parseInt(e.target.dataset.id); userCards = userCards.filter(c => c.id !== cardId); renderCardList(); checkCompatibility(); } }); document.getElementById('addCardBtn').addEventListener('click', openCardModal); document.getElementById('cancelModalBtn').addEventListener('click', closeCardModal); document.getElementById('saveCardBtn').addEventListener('click', addCard); document.getElementById('downloadPdfBtn').addEventListener('click', generatePdf); // Initial Load renderWalletSelector(); renderCardList(); checkCompatibility(); });