col.innerHTML = '
' + file.name + '';
preview.appendChild(col);
};
reader.readAsDataURL(file);
});
}
}
function initPhotoFilters() {
var filterBtns = document.querySelectorAll('#photo-type-filter button');
var photos = document.querySelectorAll('.photo-item');
filterBtns.forEach(function(btn) {
btn.addEventListener('click', function() {
var type = this.dataset.type;
filterBtns.forEach(function(b) { b.classList.remove('active'); });
this.classList.add('active');
photos.forEach(function(photo) {
if (type === 'all' || photo.dataset.type === type) {
photo.style.display = '';
} else {
photo.style.display = 'none';
}
});
});
});
}
function initComparisonSliders() {
document.querySelectorAll('.comparison-slider').forEach(function(slider) {
var range = slider.querySelector('.comparison-range');
var afterImage = slider.querySelector('.after-image');
range.addEventListener('input', function() {
afterImage.style.clipPath = 'inset(0 0 0 ' + this.value + '%)';
});
});
}
function initSortable() {
var grid = document.getElementById('photo-grid');
if (grid && typeof Sortable !== 'undefined') {
new Sortable(grid, {
animation: 150,
onEnd: function() {
var order = Array.from(grid.querySelectorAll('.photo-item')).map(function(el) {
return el.dataset.id;
});
fetch(baseUrl + '&photo_action=reorder', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({order: order})
});
}
});
}
}
function openLightbox(photoId) {
currentPhotoIndex = photos.findIndex(function(p) { return p.id == photoId; });
updateLightbox();
$('#photo-lightbox').modal('show');
}
function updateLightbox() {
var photo = photos[currentPhotoIndex];
document.getElementById('lightbox-image').src = '/uploads/' + photo.file_path;
document.getElementById('lightbox-title').textContent = photo.caption || photo.original_filename;
document.getElementById('lightbox-info').textContent = (currentPhotoIndex + 1) + ' / ' + photos.length;
}
document.getElementById('lightbox-prev').addEventListener('click', function() {
currentPhotoIndex = (currentPhotoIndex - 1 + photos.length) % photos.length;
updateLightbox();
});
document.getElementById('lightbox-next').addEventListener('click', function() {
currentPhotoIndex = (currentPhotoIndex + 1) % photos.length;
updateLightbox();
});
function editPhoto(photoId) {
var photo = photos.find(function(p) { return p.id == photoId; });
if (!photo) return;
document.getElementById('edit-photo-id').value = photo.id;
document.getElementById('edit-photo-type').value = photo.photo_type;
document.getElementById('edit-caption').value = photo.caption || '';
document.getElementById('edit-description').value = photo.description || '';
document.getElementById('edit-location').value = photo.location_on_object || '';
document.getElementById('edit-photographer').value = photo.photographer || '';
document.getElementById('edit-photo-date').value = photo.photo_date || '';
$('#edit-photo-modal').modal('show');
}
document.getElementById('edit-photo-form').addEventListener('submit', function(e) {
e.preventDefault();
var formData = new FormData(this);
fetch(baseUrl + '&photo_action=edit&photo_id=' + formData.get('photo_id'), {
method: 'POST',
body: formData
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
location.reload();
}
});
});
function rotatePhoto(photoId, degrees) {
fetch(baseUrl + '&photo_action=rotate&photo_id=' + photoId + '°rees=' + degrees, {
method: 'POST'
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
var img = document.querySelector('.photo-item[data-id="' + photoId + '"] img');
if (img) {
img.src = data.thumbnail_url;
}
}
});
}
function setPrimary(photoId) {
fetch(baseUrl + '&photo_action=set_primary&photo_id=' + photoId, {
method: 'POST'
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
location.reload();
}
});
}
function deletePhoto(photoId) {
if (!confirm('Are you sure you want to delete this photo?')) {
return;
}
fetch(baseUrl + '&photo_action=delete&photo_id=' + photoId, {
method: 'POST'
})
.then(function(response) { return response.json(); })
.then(function(data) {
if (data.success) {
var item = document.querySelector('.photo-item[data-id="' + photoId + '"]');
if (item) {
item.remove();
}
}
});
}