Art History Timeline Generator
Chronological Organization of Movements and Periods
Total Events:
0
Western Art Movements
Period Focus: 1800 AD - Present | Analyst: N/A
Chronological Events
Timeline Context
Log New Event / Movement
Input the start year of the movement or event.
Current Log Entries
Log is empty.
"; return; } const sortedEvents = [...ahtData.events].sort((a, b) => a.startYear - b.startYear); sortedEvents.forEach(event => { const periodText = event.endYear ? `(${event.startYear} - ${event.endYear})` : `(${event.startYear})`; const row = document.createElement('div'); row.className = 'aht-event-row'; row.innerHTML = `
${event.title} ${periodText}
`;
outputs.eventListEditor.appendChild(row);
});
}
// --- 5. EVENT LISTENERS & ACTIONS ---
function attachListeners() {
// Meta Inputs
const metaInputs = Object.values(inputs).filter(i => !i.id.includes('inp-'));
metaInputs.forEach(inp => inp.addEventListener('input', renderAll));
// Add Event Button
document.getElementById('btn-add-event').addEventListener('click', addEvent);
}
function addEvent() {
const startYear = parseInt(inputs.startYear.value);
const endYear = parseInt(inputs.endYear.value);
const title = inputs.eventTitle.value.trim();
const notes = inputs.notes.value.trim();
if (!title || !startYear) {
alert("Title and Start Year are required.");
return;
}
if (endYear && endYear < startYear) {
alert("End Year cannot be before Start Year.");
return;
}
const newEvent = {
id: Date.now(),
startYear: startYear,
endYear: endYear || null,
title: title,
notes: notes || ""
};
ahtData.events.push(newEvent);
// Clear entry form for next entry
inputs.eventTitle.value = "";
inputs.notes.value = "";
inputs.startYear.value = "";
inputs.endYear.value = "";
renderAll();
}
window.removeEvent = function(id) {
if(confirm("Remove this event from the timeline?")) {
ahtData.events = ahtData.events.filter(e => e.id !== id);
renderAll();
}
};
// --- 6. TAB NAVIGATION ---
window.ahtSwitchTab = function(tabId) {
document.querySelectorAll('.aht-tab-pane').forEach(p => p.classList.remove('active'));
document.querySelectorAll('.aht-tab-btn').forEach(b => b.classList.remove('active'));
document.getElementById(tabId).classList.add('active');
document.querySelector(`.aht-tab-btn[data-tab="${tabId}"]`).classList.add('active');
document.getElementById('timeline-generator-tool').scrollIntoView({behavior: 'smooth'});
};
document.querySelectorAll('.aht-tab-btn').forEach(btn => {
btn.addEventListener('click', function() { ahtSwitchTab(this.dataset.tab); });
});
// --- 7. PDF EXPORT ---
const btnDown = document.getElementById('aht-download-btn');
if(btnDown) {
btnDown.addEventListener('click', function() {
renderAll();
const element = document.getElementById('aht-render-area');
const filename = (inputs.title.value || 'Art_Timeline').replace(/\s+/g,'_');
const opt = {
margin: 0.4,
filename: `${filename}_Timeline.pdf`,
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2, useCORS: true },
jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
};
const origText = btnDown.innerText;
btnDown.innerText = "Generating Timeline...";
html2pdf().set(opt).from(element).save().then(() => {
btnDown.innerText = origText;
});
});
}
// Start
init();
});