`;
outputContainer.innerHTML = outputHTML;
};
/**
* Copies text from a target element to the clipboard.
* @param {HTMLElement} copyButton - The button that was clicked.
*/
const copyToClipboard = (copyButton) => {
const targetSelector = copyButton.dataset.clipboardTarget;
const targetElement = document.querySelector(targetSelector);
if (targetElement) {
const textToCopy = targetElement.innerText;
// A temporary textarea is used to hold the text for the copy command.
const textArea = document.createElement('textarea');
textArea.value = textToCopy;
document.body.appendChild(textArea);
textArea.select();
try {
document.execCommand('copy');
copyButton.textContent = 'Copied!';
copyButton.classList.add('copied');
setTimeout(() => {
copyButton.textContent = 'Copy';
copyButton.classList.remove('copied');
}, 2000);
} catch (err) {
console.error('Failed to copy text: ', err);
}
document.body.removeChild(textArea);
}
};
// --- Event Listeners ---
generateBtn.addEventListener('click', generateSubjects);
outputContainer.addEventListener('click', (event) => {
if (event.target.classList.contains('copy-btn')) {
copyToClipboard(event.target);
}
});
downloadPdfBtn.addEventListener('click', () => {
// 1. Generate clean HTML for PDF
const topic = mainTopicInput.value || "Our Latest News";
const audience = targetAudienceInput.value || "You";
let pdfHTML = `
Email Subject Lines for: ${topic}
`;
const tones = ['Urgent', 'Curious', 'Friendly', 'Direct', 'Playful'];
tones.forEach(tone => {
const subjectNodes = outputContainer.querySelectorAll(`h3:first-child`);
if (outputContainer.innerHTML.includes(tone)){
pdfHTML += `
${tone}
`;
const lines = Array.from(outputContainer.querySelectorAll('span'));
lines.forEach(line => {
pdfHTML += `- ${line.innerText}
`;
});
pdfHTML += `
`;
}
});
pdfHTML += `
`;
pdfOutputContainer.innerHTML = pdfHTML;
pdfOutputContainer.classList.remove('hidden');
// 2. Use html2canvas and jspdf
const { jsPDF } = window.jspdf;
html2canvas(pdfOutputContainer, {
scale: 2,
useCORS: true
}).then(canvas => {
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({
orientation: 'portrait',
unit: 'pt',
format: 'a4'
});
const pdfWidth = pdf.internal.pageSize.getWidth();
const margin = 40;
const contentWidth = pdfWidth - (margin * 2);
const imgHeight = canvas.height * contentWidth / canvas.width;
pdf.addImage(imgData, 'PNG', margin, margin, contentWidth, imgHeight);
pdf.save(`subject-lines-${topic.replace(/\s+/g, '_').toLowerCase()}.pdf`);
}).finally(() => {
pdfOutputContainer.classList.add('hidden');
pdfOutputContainer.innerHTML = '';
});
});
// --- Initialization ---
generateSubjects(); // Run once on load with default values
});
