(function () {
var grid = document.getElementById('portfolio-grid');
if (!grid) return;
var items = Array.from(grid.children);
if (!items.length) return;
var lb = document.createElement('div');
lb.id = 'lightbox';
lb.innerHTML =
'' +
'' +
'![]()
' +
'';
document.body.appendChild(lb);
var lbImg = lb.querySelector('img');
var current = -1;
function open(idx) {
current = idx;
var img = items[current].querySelector('img');
lbImg.removeAttribute('src');
lbImg.alt = '';
lb.classList.add('open');
lbImg.src = img.src;
lbImg.alt = img.alt;
}
function close() {
lb.classList.remove('open');
current = -1;
}
function prev() {
if (current < 0) return;
open((current - 1 + items.length) % items.length);
}
function next() {
if (current < 0) return;
open((current + 1) % items.length);
}
items.forEach(function (item, i) {
item.addEventListener('click', function () { open(i); });
});
lb.querySelector('#lb-close').addEventListener('click', close);
lb.querySelector('#lb-prev').addEventListener('click', function (e) { e.stopPropagation(); prev(); });
lb.querySelector('#lb-next').addEventListener('click', function (e) { e.stopPropagation(); next(); });
document.addEventListener('keydown', function (e) {
if (!lb.classList.contains('open')) return;
if (e.key === 'Escape') { close(); e.preventDefault(); }
if (e.key === 'ArrowLeft') { prev(); e.preventDefault(); }
if (e.key === 'ArrowRight') { next(); e.preventDefault(); }
});
lb.addEventListener('click', function (e) {
if (e.target === lb) close();
});
})();