No artwork has been added. Please use the "Manage Gallery" tab.
';
return;
}
vag_artwork.forEach(art => {
const card = document.createElement('div');
card.className = 'vag-art-card';
const isFavorited = vag_favorites.includes(art.id);
card.innerHTML = `
${art.title}
${art.artist} (${art.year})
${art.desc}
${isFavorited ? 'Added to Favorites' : 'Add to Favorites'}
`;
vag_galleryGrid.appendChild(card);
});
}
/**
* Adds an artwork ID to the favorites list.
*/
window.vag_addFavorite = function(id) {
if (!vag_favorites.includes(id)) {
vag_favorites.push(id);
vag_renderGallery(); // Re-render gallery to update button state
vag_renderFavorites(); // Re-render favorites list
}
}
// --- V. TAB 2 (FAVORITES) FUNCTIONS ---
/**
* Renders the list of favorited artwork.
*/
function vag_renderFavorites() {
if (!vag_favoritesList) return;
vag_favoritesList.innerHTML = '';
if (vag_favorites.length === 0) {
vag_favoritesList.innerHTML = '
You haven\'t added any favorites yet. Browse the "Gallery" tab to add some!
';
return;
}
const favoriteArtworks = vag_artwork.filter(art => vag_favorites.includes(art.id));
favoriteArtworks.forEach(art => {
const item = document.createElement('div');
item.className = 'vag-favorite-item';
item.innerHTML = `
${art.title}
${art.artist} (${art.year})
Remove
`;
vag_favoritesList.appendChild(item);
});
}
/**
* Removes an artwork ID from the favorites list.
*/
window.vag_removeFavorite = function(id) {
vag_favorites = vag_favorites.filter(favId => favId !== id);
vag_renderGallery(); // Re-render gallery to update button state
vag_renderFavorites(); // Re-render favorites list
}
/**
* Handles the PDF download request.
*/
function vag_downloadPDF() {
const element = vag_container.querySelector('#vag-favorites-pdf-output');
if (!element || vag_favorites.length === 0) {
alert("No favorites to download. Please add artwork to your favorites list first.");
return;
}
// Clone the element to prepare for PDF
const elementToPrint = element.cloneNode(true);
// CRITICAL: Remove all buttons from the PDF clone (Spec II.C.2, Other 9)
elementToPrint.querySelectorAll('.vag-remove-btn').forEach(btn => btn.remove());
// Create a title for the PDF
const pdfContainer = document.createElement('div');
const pdfTitle = document.createElement('h1');
pdfTitle.textContent = 'My Favorite Artwork';
pdfTitle.style.textAlign = 'center';
pdfTitle.style.color = '#2c3e50';
pdfTitle.style.fontSize = '24px';
pdfTitle.style.marginBottom = '20px';
pdfContainer.appendChild(pdfTitle);
pdfContainer.appendChild(elementToPrint);
// Apply PDF-specific styles
pdfContainer.style.padding = '20px';
pdfContainer.style.fontFamily = 'Arial, sans-serif';
elementToPrint.querySelectorAll('.vag-favorite-item').forEach(item => {
item.style.pageBreakInside = 'avoid';
item.style.border = '1px solid #ccc';
item.style.boxShadow = 'none';
});
const options = {
margin: 1, // in
filename: 'my_virtual_gallery_favorites.pdf',
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2 },
jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
};
if (typeof html2pdf === 'function') {
html2pdf().from(pdfContainer).set(options).save();
} else {
console.error("VAG Tool: html2pdf.js library is not loaded.");
alert("Error: PDF generation library is missing.");
}
}
// --- VI. TAB 3 (CONFIG) FUNCTIONS ---
/**
* Renders the artwork management table.
*/
function vag_renderArtTable() {
if (!vag_artTableBody) return;
vag_artTableBody.innerHTML = '';
if (vag_artwork.length === 0) {
vag_artTableBody.innerHTML = '
No artwork added yet. ';
return;
}
vag_artwork.forEach(art => {
const row = document.createElement('tr');
row.innerHTML = `
${art.title}
${art.artist}
Edit
Delete
`;
vag_artTableBody.appendChild(row);
});
}
/**
* Handles submission of the Add/Edit artwork form.
*/
function vag_handleArtFormSubmit(e) {
e.preventDefault();
if (!vag_artTitle || !vag_artArtist || !vag_artYear || !vag_artImageUrl || !vag_artDesc || !vag_editIdField) return;
const artData = {
id: vag_editingId ? parseInt(vag_editingId, 10) : Date.now(),
title: vag_artTitle.value.trim(),
artist: vag_artArtist.value.trim(),
year: vag_artYear.value.trim(),
url: vag_artImageUrl.value.trim(),
desc: vag_artDesc.value.trim()
};
if (!artData.title || !artData.artist || !artData.url) {
alert("Please fill out Title, Artist, and Image URL.");
return;
}
if (vag_editingId) {
// Update
vag_artwork = vag_artwork.map(art => art.id === artData.id ? artData : art);
} else {
// Add
vag_artwork.push(artData);
}
// Re-render everything
vag_renderArtTable();
vag_renderGallery();
vag_renderFavorites(); // In case the edited item was a favorite
vag_resetArtForm();
}
/**
* Resets the art form.
*/
function vag_resetArtForm() {
vag_editingId = null;
if (!vag_editIdField || !vag_artForm || !vag_cancelBtn || !vag_formTitle) return;
vag_editIdField.value = '';
vag_artForm.reset();
vag_cancelBtn.classList.add('vag-hidden');
vag_formTitle.textContent = "Add New Artwork";
}
/**
* Populates the form to edit artwork.
*/
window.vag_editArt = function(id) {
const art = vag_artwork.find(a => a.id === id);
if (!art) return;
if (!vag_editIdField || !vag_artTitle || !vag_artArtist || !vag_artYear || !vag_artImageUrl || !vag_artDesc || !vag_cancelBtn || !vag_formTitle || !vag_artForm) return;
vag_editingId = id;
vag_editIdField.value = id;
vag_artTitle.value = art.title;
vag_artArtist.value = art.artist;
vag_artYear.value = art.year;
vag_artImageUrl.value = art.url;
vag_artDesc.value = art.desc;
vag_formTitle.textContent = "Edit Artwork";
vag_cancelBtn.classList.remove('vag-hidden');
vag_artForm.scrollIntoView({ behavior: 'smooth' });
}
/**
* Deletes an artwork.
*/
window.vag_deleteArt = function(id) {
if (confirm("Are you sure you want to delete this artwork? This cannot be undone.")) {
vag_artwork = vag_artwork.filter(a => a.id !== id);
// Also remove from favorites if it's there
vag_removeFavorite(id);
vag_renderArtTable();
vag_renderGallery();
// vag_removeFavorite already calls renderFavorites
if (vag_editingId === id) {
vag_resetArtForm();
}
}
}
// --- VII. INITIALIZE THE TOOL ---
vag_init();
}); // End of DOMContentLoaded
