${valueText}

`; div.innerHTML = label + value; summaryContainer.appendChild(div); } }); if(!hasContent){ summaryContainer.innerHTML = `

Your proposal preview will appear here once you fill out the fields in the previous tabs.

`; } }; const navigateTab = (n) => { const newIndex = currentTab + n; if (newIndex >= 0 && newIndex < tabs.length) { showTab(newIndex); } }; const downloadPDF = () => { const { jsPDF } = window.jspdf; const doc = new jsPDF({ orientation: 'p', unit: 'pt', format: 'a4' }); const data = Array.from(document.querySelectorAll('input, textarea')).reduce((acc, input) => { if (input.id) acc[input.id] = input.value; return acc; }, {}); const theme = document.querySelector('input[name="theme"]:checked').value; const page = { width: doc.internal.pageSize.getWidth(), height: doc.internal.pageSize.getHeight() }; const margin = 60; let y = 0; let colors = theme === 'modern' ? { bg: '#4c1d95', text: '#FFFFFF', primary: '#1f2937', secondary: '#4b5563' } : { bg: '#1e3a8a', text: '#FFFFFF', primary: '#111827', secondary: '#374151' }; // --- Helper Function --- const addSection = (title, textContent) => { if (!textContent) return; const textLines = doc.splitTextToSize(textContent, page.width - margin * 2); const spaceNeeded = textLines.length * 14 + 45; // Approx height needed if (y + spaceNeeded > page.height - margin) { doc.addPage(); y = margin; } y += 25; doc.setFont('helvetica', 'bold'); doc.setFontSize(12); doc.setTextColor(colors.primary); doc.text(title.toUpperCase(), margin, y); y += 5; doc.setDrawColor(colors.bg); doc.setLineWidth(1.5); doc.line(margin, y, margin + 50, y); y += 20; doc.setFont('helvetica', 'normal'); doc.setFontSize(10); doc.setTextColor(colors.secondary); doc.text(textLines, margin, y); y += textLines.length * 12 + 10; }; // --- PDF Header --- doc.setFillColor(colors.bg); doc.rect(0, 0, page.width, 100, 'F'); doc.setFont('helvetica', 'bold'); doc.setFontSize(24); doc.setTextColor(colors.text); const title = `Collaboration Proposal: ${data.brandName || 'Your Brand'} x ${data.influencerName || 'Influencer'}`; doc.text(title, margin, 60); y = 140; // --- PDF Body --- doc.setFont('helvetica', 'normal'); doc.setFontSize(10); doc.setTextColor(colors.secondary); const date = new Date().toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }); doc.text(`Date: ${date}`, margin, y); y += 15; doc.text(`To: ${data.influencerName || 'N/A'} (${data.influencerHandle || 'N/A'})`, margin, y); y += 15; doc.text(`From: ${data.contactPerson || 'N/A'}, ${data.brandName || 'N/A'}`, margin, y); y += 30; doc.setFontSize(11); doc.setTextColor(colors.primary); const opening = `Dear ${data.influencerName || ''},`; doc.text(opening, margin, y); y += 20; const introLines = doc.splitTextToSize(data.personalization, page.width - margin * 2); doc.setFontSize(10); doc.setTextColor(colors.secondary); doc.text(introLines, margin, y); y += introLines.length * 12 + 20; const intro2 = `We believe a partnership would be a perfect fit and would like to formally propose a collaboration for our upcoming campaign, "${data.campaignName || 'New Campaign'}".`; const intro2Lines = doc.splitTextToSize(intro2, page.width - margin * 2); doc.text(intro2Lines, margin, y); y += intro2Lines.length * 12; addSection("About the Product", data.productDescription); addSection("Campaign Goals", data.campaignGoals); addSection("Proposed Deliverables", data.deliverables); addSection("Compensation", `We are pleased to offer a flat fee of $${data.compensation || '0'} for this collaboration, in addition to providing you with the ${data.productName || 'product'} free of charge.`); addSection("Timeline", data.timeline); y += 20; doc.setFont('helvetica', 'bold'); doc.setFontSize(11); doc.setTextColor(colors.primary); doc.text("Next Steps", margin, y); y += 15; const closingLines = doc.splitTextToSize(data.callToAction, page.width - margin * 2); doc.setFont('helvetica', 'normal'); doc.setFontSize(10); doc.setTextColor(colors.secondary); doc.text(closingLines, margin, y); y += closingLines.length * 12 + 30; doc.text(`Sincerely,`, margin, y); y += 20; doc.text(data.contactPerson || 'N/A', margin, y); y += 12; doc.text(data.brandName || 'N/A', margin, y); doc.save(`proposal-${(data.brandName || 'brand').replace(/\s+/g, '-')}-${(data.influencerName || 'influencer').replace(/\s+/g, '-')}.pdf`); }; // Event Listeners tabs.forEach((tab, index) => tab.addEventListener('click', () => showTab(index))); prevBtn.addEventListener('click', () => navigateTab(-1)); nextBtn.addEventListener('click', () => navigateTab(1)); downloadPdfBtn.addEventListener('click', downloadPDF); // Initialization showTab(0); });