Productivity Blog Post Generator
Generate actionable and motivating productivity articles.
1. Topic & Goal
2. Article Outline
3. Generated Post
Review and edit the proposed article structure.
Your generated blog post will appear here.
${generateParagraph(conclusionTitle)}
`; elements.generatedPostContainer.innerHTML = postHtml; }; // --- UTILITY FUNCTIONS --- const copyToClipboard = () => { const content = elements.generatedPostContainer.innerText; const button = elements.copyHtmlBtn; navigator.clipboard.writeText(content).then(() => { button.textContent = 'Copied!'; setTimeout(() => { button.textContent = 'Copy Post'; }, 2000); }).catch(err => { // Fallback for iFrame environments const textArea = document.createElement("textarea"); textArea.value = content; document.body.appendChild(textArea); textArea.select(); try { document.execCommand('copy'); button.textContent = 'Copied!'; setTimeout(() => { button.textContent = 'Copy Post'; }, 2000); } catch (err) { console.error('Failed to copy text: ', err); button.textContent = 'Error'; } document.body.removeChild(textArea); }); }; const downloadPDF = () => { const { jsPDF } = window.jspdf; const pdf = new jsPDF({ orientation: 'p', unit: 'pt', format: 'a4' }); const title = document.querySelector('#generatedPostContainer h1')?.innerText || "Productivity Article"; const contentElements = elements.generatedPostContainer.children; const PAGE_WIDTH = pdf.internal.pageSize.getWidth(); const MARGIN = 50; let y = MARGIN; // Header pdf.setFont('helvetica', 'bold'); pdf.setFontSize(24); pdf.setTextColor(79, 70, 229); // indigo-600 const titleLines = pdf.splitTextToSize(title, PAGE_WIDTH - MARGIN*2); pdf.text(titleLines, PAGE_WIDTH / 2, y, { align: 'center' }); y += titleLines.length * 24 + 10; pdf.setFontSize(10); pdf.setFont('helvetica', 'normal'); pdf.setTextColor(100, 116, 139); // slate-500 pdf.text(new Date().toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }), PAGE_WIDTH / 2, y, { align: 'center' }); y += 40; // Content Array.from(contentElements).forEach(el => { const text = el.innerText; let fontSize = 11; let fontStyle = 'normal'; if (el.tagName === 'H1') { fontSize = 18; fontStyle = 'bold'; } if (el.tagName === 'H2') { fontSize = 14; fontStyle = 'bold'; } pdf.setFont('helvetica', fontStyle); pdf.setFontSize(fontSize); pdf.setTextColor(30, 41, 59); // slate-800 const lines = pdf.splitTextToSize(text, PAGE_WIDTH - MARGIN*2); const textHeight = lines.length * fontSize * 1.15; if (y + textHeight > pdf.internal.pageSize.getHeight() - MARGIN) { pdf.addPage(); y = MARGIN; } pdf.text(lines, MARGIN, y); y += textHeight + (el.tagName.startsWith('H') ? 10 : 15); }); pdf.save(`${title.replace(/ /g, '_').substring(0, 30)}.pdf`); }; // --- EVENT LISTENERS --- elements.prevBtn.addEventListener('click', () => nextPrev(-1)); elements.nextBtn.addEventListener('click', () => nextPrev(1)); elements.tabs.forEach((tab, i) => { tab.addEventListener('click', () => { // Disabling direct tab clicking to enforce workflow. // A user can implement this if they wish by calling showTab(i) // after validating the current step. console.warn("Direct tab navigation is disabled. Please use Next/Previous buttons."); }); }); elements.copyHtmlBtn.addEventListener('click', copyToClipboard); elements.downloadPdfBtn.addEventListener('click', downloadPDF); // Initialize showTab(currentTab); });