`;
// Metadata Table
html += `
`;
// 2. Section I: Description
html += `
| Artwork: | ${data.title} | Movement: | ${data.style} |
| Artist: | ${data.artist} | Medium: | ${data.medium} |
I. DESCRIPTION (What do you see?)
`;
html += `Key Subject Matter:
`;
html += `${data.subject}
`;
// 3. Section II: Formal Analysis
html += `II. FORMAL ANALYSIS (How is the work organized?)
`;
html += `Composition, Line, and Form:
`;
html += `Color, Light, and Texture:
`;
// 4. Section III: Interpretation
html += `III. INTERPRETATION (What is the meaning?)
`;
html += `Context & Symbolism:
`;
html += `Specific Questions to Address:
`;
html += `${data.focus}
`; html += ``; // 5. Section IV: Judgment html += `IV. JUDGMENT (What is the value/success?)
`;
html += `Thesis Statement/Conclusion:
`;
html += `${data.thesis}
`;
container.innerHTML = html;
}
function actgSwitchTab(tabId) {
document.querySelectorAll('.actg-tab-btn').forEach(b => b.classList.remove('active'));
document.querySelectorAll('.actg-content').forEach(c => c.classList.remove('active'));
const idx = tabId === 'builder' ? 0 : 1;
document.querySelectorAll('.actg-tab-btn')[idx].classList.add('active');
document.getElementById('actg-' + tabId).classList.add('active');
if (tabId === 'preview') {
actgRenderTemplate();
}
}
function actgLoadExample() {
if(!confirm("Overwrite current inputs with example data?")) return;
document.getElementById('inp-title').value = "Guernica";
document.getElementById('inp-artist').value = "Pablo Picasso";
document.getElementById('inp-medium').value = "Oil on canvas (1937)";
document.getElementById('inp-style').value = "Cubism / Surrealism";
document.getElementById('inp-focus').value = "Analyze how the black, white, and gray palette enhances the theme of brutality and despair in the Spanish Civil War.";
document.getElementById('inp-subject').value = "Large-scale mural depicting distorted figures, animals (bull, horse, bird), and architectural elements, all in black and white.";
document.getElementById('inp-thesis').value = "Guernica successfully transforms a specific historical event into a universal, timeless symbol of the brutality and suffering caused by war, achieving profound emotional impact through its fractured form.";
actgRenderTemplate();
actgSwitchTab('preview');
}
/* --- PDF Generation --- */
async function actgGeneratePDF() {
actgRenderTemplate(); // Final render check
const data = {
title: document.getElementById('inp-title').value || "Artwork Title",
artist: document.getElementById('inp-artist').value || "Artist Name",
medium: document.getElementById('inp-medium').value || "Medium & Date",
style: document.getElementById('inp-style').value || "Style",
subject: document.getElementById('inp-subject').value || "Brief descriptive summary pending.",
thesis: document.getElementById('inp-thesis').value || "Thesis statement pending.",
focus: document.getElementById('inp-focus').value || "Focus questions pending.",
};
const { jsPDF } = window.jspdf;
const doc = new jsPDF('p', 'mm', 'a4');
const purple = [106, 5, 173];
let y = 20;
// 1. Header
doc.setFillColor(...purple);
doc.rect(0, 0, 210, 20, 'F');
doc.setTextColor(255, 255, 255);
doc.setFontSize(16);
doc.text(`Art Critique and Analysis Sheet`, 105, 10, { align: 'center' });
doc.setFontSize(10);
doc.text("Four-Step Method (Description, Analysis, Interpretation, Judgment)", 105, 16, { align: 'center' });
y = 30;
// Metadata Table (using manual text layout for simplicity)
doc.setTextColor(0, 0, 0);
doc.setFontSize(10);
doc.setFont("times", "bold");
doc.text("Artwork:", 14, y);
doc.text("Artist:", 105, y);
y += 5;
doc.setFont("times", "normal");
doc.text(data.title, 14, y);
doc.text(data.artist, 105, y);
y += 8;
doc.setFont("times", "bold");
doc.text("Medium:", 14, y);
doc.text("Movement:", 105, y);
y += 5;
doc.setFont("times", "normal");
doc.text(data.medium, 14, y);
doc.text(data.style, 105, y);
y += 10;
// Helper function to add analysis sections
const addSection = (title, content, height, startY) => {
if (startY > 270) { doc.addPage(); startY = 20; }
doc.setFont("times", "bold");
doc.setTextColor(purple);
doc.setFontSize(12);
doc.text(title, 14, startY);
startY += 6;
doc.setFont("times", "normal");
doc.setTextColor(50, 50, 50);
doc.setFontSize(10);
if (content && content.length > 0) {
const splitContent = doc.splitTextToSize(content, 180);
doc.text(splitContent, 18, startY);
startY += (splitContent.length * 5) + 5;
}
// Add blank space box for written analysis
doc.rect(14, startY, 182, height, 'D');
return startY + height + 5;
};
// I. Description
y = addSection("I. DESCRIPTION (The Facts)", data.subject, 15, y);
// II. Formal Analysis
doc.setFontSize(12);
doc.setFont("times", "bold");
doc.setTextColor(purple);
doc.text("II. FORMAL ANALYSIS (How is the work organized?)", 14, y);
y += 5;
y = addSection("Composition, Line, and Form:", null, 20, y);
y = addSection("Color, Light, and Texture:", null, 20, y);
// III. Interpretation
doc.setFontSize(12);
doc.setFont("times", "bold");
doc.setTextColor(purple);
doc.text("III. INTERPRETATION (What is the meaning?)", 14, y);
y += 5;
y = addSection("Context & Symbolism:", null, 20, y);
y = addSection("Specific Questions to Address:", data.focus, 30, y);
// IV. Judgment
y = addSection("IV. JUDGMENT (What is the value/success?)", null, y);
y = addSection("Thesis Statement/Conclusion:", data.thesis, 30, y);
doc.save(`ArtCritique_Template_${data.title.replace(/\s/g, '_')}.pdf`);
}
