${data.goal}

${emailsHtml} `; } function showMessage() { messageBox.classList.remove('opacity-0', 'translate-y-10'); messageBox.classList.add('opacity-100', 'translate-y-0'); setTimeout(() => { messageBox.classList.remove('opacity-100', 'translate-y-0'); messageBox.classList.add('opacity-0', 'translate-y-10'); }, 2000); } function generateDripCampaignPdf() { const { jsPDF } = window.jspdf; const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' }); const data = getFormData(); const pageW = pdf.internal.pageSize.getWidth(); const pageH = pdf.internal.pageSize.getHeight(); const margin = 20; const contentWidth = pageW - (margin * 2); let y = 0; const lineH = 7; const today = new Date().toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }); const addHeaderFooter = () => { const pageCount = pdf.internal.getNumberOfPages(); for (let i = 1; i <= pageCount; i++) { pdf.setPage(i); pdf.setFontSize(9); pdf.setTextColor('#94a3b8'); // slate-400 if (i > 1) { pdf.text(data.campaignName, margin, 12); } pdf.text(`Page ${i}`, pageW - margin, pageH - 10, { align: 'right' }); } }; const checkBreak = (needed = 20) => { if (y + needed > pageH - margin) { pdf.addPage(); y = margin; } }; const addText = (text, options = {}) => { const { size=11, style='normal', color='#334155', indent=0, spacing=1 } = options; if (!text && text !== '') return; checkBreak(15); pdf.setFontSize(size); pdf.setFont('helvetica', style); pdf.setTextColor(color); const splitText = pdf.splitTextToSize(text, contentWidth - indent); pdf.text(splitText, margin + indent, y); y += (splitText.length * lineH * 0.75) + (lineH * spacing); }; const addSectionHeader = (title, level = 1) => { y += level === 1 ? lineH * 1.5 : lineH; checkBreak(20); pdf.setFontSize(level === 1 ? 16 : 14); pdf.setFont('helvetica', 'bold'); pdf.setTextColor(level === 1 ? '#0e7490' : '#0891b2'); // cyan-700 / cyan-600 pdf.text(title, margin, y); y += lineH * 1.5; }; // --- Build PDF Document --- // Page 1: Title Page pdf.setFillColor('#ecfeff'); // cyan-50 pdf.rect(0, 0, pageW, 60, 'F'); pdf.setFontSize(26); pdf.setFont('helvetica', 'bold'); pdf.setTextColor('#1e293b'); // slate-800 const titleLines = pdf.splitTextToSize(data.campaignName, contentWidth); pdf.text(titleLines, margin, 35); pdf.text(`Email Drip Campaign Plan`, margin, 45 + (titleLines.length > 1 ? 5 : 0)); y = 80; addSectionHeader("Campaign Overview"); addText('Campaign Goal:', {style: 'bold'}); addText(data.goal, {indent: 5}); y += lineH; addText('Target Audience:', {style: 'bold'}); addText(data.audience, {indent: 5}); y += lineH; addText('Overall Tone:', {style: 'bold'}); addText(data.tone, {indent: 5}); // Emails if(data.emails.length > 0) { pdf.addPage(); y=margin; addSectionHeader("Email Sequence"); data.emails.forEach(email => { checkBreak(50); pdf.setDrawColor('#e2e8f0'); pdf.setLineWidth(0.2); pdf.line(margin, y - (lineH * 0.5), pageW - margin, y - (lineH * 0.5)); addSectionHeader(`Email #${email.id}: ${email.subject}`, 2); addText(`Trigger/Delay: ${email.delay}`, {style: 'bold', size: 10, color: '#475569'}); y+=lineH*0.5; addText('Body:', {style: 'bold'}); addText(email.body, {indent: 5}); y+=lineH; addText(`CTA: "${email.ctaText}" -> ${email.ctaLink}`, {style: 'italic', size:10, color: '#475569', indent:5}); y+=lineH; }); } addHeaderFooter(); pdf.save(`Drip_Campaign_${data.campaignName.replace(/\s+/g, '_').substring(0,20)}.pdf`); } // --- Event Listeners & Init --- tabs.forEach(tab => tab.addEventListener('click', () => goToTab(parseInt(tab.dataset.tab)))); prevButton.addEventListener('click', () => goToTab(currentTab - 1)); nextButton.addEventListener('click', () => goToTab(currentTab + 1)); copyButton.addEventListener('click', () => { const preview = document.getElementById('campaign-preview-container'); if (preview) { navigator.clipboard.writeText(preview.innerText).then(() => { showMessage(); }).catch(err => console.error('Copy failed: ', err)); } }); pdfDownloadButton.addEventListener('click', generateDripCampaignPdf); addEmailButton.addEventListener('click', addEmailItem); // Add one initial email item addEmailItem(); updateTabUI(); });