93 lines
4.1 KiB
JavaScript
93 lines
4.1 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const themeSwitcher = document.getElementById('theme-switcher');
|
|
const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
|
|
|
|
if (currentTheme) {
|
|
document.body.classList.add(currentTheme);
|
|
if (currentTheme === 'dark-theme') {
|
|
themeSwitcher.innerHTML = '<i class="bi bi-sun-fill"></i>';
|
|
} else {
|
|
themeSwitcher.innerHTML = '<i class="bi bi-moon-fill"></i>';
|
|
}
|
|
} else {
|
|
// Default to light
|
|
document.body.classList.add('light-theme');
|
|
themeSwitcher.innerHTML = '<i class="bi bi-moon-fill"></i>';
|
|
}
|
|
|
|
themeSwitcher.addEventListener('click', () => {
|
|
if (document.body.classList.contains('dark-theme')) {
|
|
document.body.classList.remove('dark-theme');
|
|
document.body.classList.add('light-theme');
|
|
localStorage.setItem('theme', 'light-theme');
|
|
themeSwitcher.innerHTML = '<i class="bi bi-moon-fill"></i>';
|
|
} else {
|
|
document.body.classList.remove('light-theme');
|
|
document.body.classList.add('dark-theme');
|
|
localStorage.setItem('theme', 'dark-theme');
|
|
themeSwitcher.innerHTML = '<i class="bi bi-sun-fill"></i>';
|
|
}
|
|
});
|
|
|
|
// Folder import functionality
|
|
const importFolderBtn = document.getElementById('import-folder-btn');
|
|
const folderInput = document.getElementById('folder-input');
|
|
const photoGallery = document.querySelector('.photo-gallery');
|
|
|
|
if (importFolderBtn && folderInput && photoGallery) {
|
|
importFolderBtn.addEventListener('click', () => {
|
|
folderInput.click();
|
|
});
|
|
|
|
folderInput.addEventListener('change', (event) => {
|
|
const files = event.target.files;
|
|
if (files.length > 0) {
|
|
const formData = new FormData();
|
|
const imageFiles = Array.from(files).filter(file => file.type.startsWith('image/'));
|
|
|
|
if (imageFiles.length > 0) {
|
|
imageFiles.forEach(file => {
|
|
formData.append('photos[]', file);
|
|
});
|
|
|
|
// Show a loading indicator
|
|
photoGallery.innerHTML = '<div class="col"><p>Uploading...</p></div>';
|
|
|
|
fetch('api/import.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
console.log('Server response:', data); // Log the full response
|
|
photoGallery.innerHTML = ''; // Clear loading indicator
|
|
|
|
if (data.success && data.files.length > 0) {
|
|
// On success, refresh the page to show all images from the DB
|
|
window.location.reload();
|
|
} else {
|
|
let errorMessages = 'Upload failed. Please try again.';
|
|
if (data.errors && data.errors.length > 0) {
|
|
// Create a list of error messages
|
|
errorMessages = '<ul>';
|
|
data.errors.forEach(err => {
|
|
errorMessages += `<li>${err}</li>`;
|
|
});
|
|
errorMessages += '</ul>';
|
|
}
|
|
photoGallery.innerHTML = `<div class="col"><p><strong>Upload Failed:</strong></p>${errorMessages}</div>`;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error uploading files:', error);
|
|
photoGallery.innerHTML = '<div class="col"><p>An error occurred during upload. Check the browser console for details.</p></div>';
|
|
});
|
|
|
|
} else {
|
|
photoGallery.innerHTML = '<div class="col"><p>No images found in the selected folder.</p></div>';
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|