`;
const systemPrompt = "You are an expert content strategist and SEO specialist. Your task is to create a well-structured and logical blog post outline based on the provided topic, key points, and complexity. Respond only with a valid JSON object matching the provided schema.";
const userPrompt = `Topic: "${inputsData.topic}", Key Points to Include: "${inputsData.points}", Complexity: "${inputsData.complexity}"`;
const jsonSchema = {
type: "OBJECT",
properties: {
outline: {
type: "ARRAY",
items: {
type: "OBJECT",
properties: {
title: { type: "STRING" },
points: {
type: "ARRAY",
items: { type: "STRING" }
}
},
required: ["title"]
}
}
},
required: ["outline"]
};
const apiKey = "";
const apiUrl = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-05-20:generateContent?key=${apiKey}`;
const payload = {
contents: [{ parts: [{ text: userPrompt }] }],
systemInstruction: { parts: [{ text: systemPrompt }] },
generationConfig: { responseMimeType: "application/json", responseSchema: jsonSchema }
};
try {
const response = await fetch(apiUrl, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) });
if (!response.ok) throw new Error(`API Error: ${response.statusText}`);
const result = await response.json();
const aiResult = JSON.parse(result.candidates?.[0]?.content?.parts?.[0]?.text);
if (aiResult.outline && aiResult.outline.length > 0) {
generatedOutline = aiResult.outline;
renderOutline();
} else {
throw new Error("No outline was generated.");
}
} catch (error) {
console.error("Outline generation error:", error);
resultsContainer.innerHTML = ``;
showNotification("Error generating outline.");
} finally {
generateBtn.disabled = false;
generateBtn.textContent = 'Generate Outline';
}
}
function renderOutline() {
if (!generatedOutline) return;
resultsContainer.innerHTML = generatedOutline.map(section => `
`).join('');
}
// --- UTILITY FUNCTIONS ---
function showNotification(message) {
notification.textContent = message;
notification.classList.remove('opacity-0');
setTimeout(() => notification.classList.add('opacity-0'), 2000);
}
function copyToClipboard(text, message) {
navigator.clipboard.writeText(text).then(() => showNotification(message));
}
copyBtn.addEventListener('click', () => {
if (!generatedOutline) {
showNotification("Nothing to copy.");
return;
}
const textToCopy = generatedOutline.map(section => {
let sectionText = `- ${section.title}`;
if (section.points && section.points.length > 0) {
sectionText += '\n' + section.points.map(p => ` - ${p}`).join('\n');
}
return sectionText;
}).join('\n\n');
copyToClipboard(textToCopy, 'Outline copied!');
});
// --- PDF GENERATION ---
async function generatePdfReport() {
if (!generatedOutline) {
showNotification("No outline to generate a report for.");
return;
}
downloadPdfBtn.disabled = true;
downloadPdfBtn.textContent = '...';
const outlineHtml = generatedOutline.map(section => `
`).join('');
const reportHtml = `
${outlineHtml}
`;
const pdfTemplate = document.getElementById('pdf-template');
pdfTemplate.innerHTML = reportHtml;
pdfTemplate.classList.remove('invisible');
try {
const { jsPDF } = window.jspdf;
const canvas = await html2canvas(pdfTemplate.querySelector('.pdf-report-container'), { scale: 2 });
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'p', unit: 'pt', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth(), pdfHeight = (canvas.height * pdfWidth) / canvas.width;
pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
pdf.save(`Content_Outline_${inputsData.topic.replace(/\s+/g, '_')}.pdf`);
} catch (e) { console.error('PDF Generation Error:', e); } finally {
downloadPdfBtn.disabled = false;
downloadPdfBtn.textContent = 'Download PDF';
pdfTemplate.classList.add('invisible');
pdfTemplate.innerHTML = '';
}
}
// --- EVENT LISTENERS ---
generateBtn.addEventListener('click', generateOutline);
downloadPdfBtn.addEventListener('click', generatePdfReport);
});
An error occurred: ${error.message}
${section.title}
${(section.points && section.points.length > 0) ? `-
${section.points.map(point => `
- ${point} `).join('')}
${section.title}
${(section.points && section.points.length > 0) ? `-
${section.points.map(p => `
- ${p} `).join('')}
Content Strategy Blueprint
Topic: ${inputsData.topic}
