diff --git a/themes/one-pager/assets/js/scripts.js b/themes/one-pager/assets/js/scripts.js
index 37cbdcf..cb84aa1 100644
--- a/themes/one-pager/assets/js/scripts.js
+++ b/themes/one-pager/assets/js/scripts.js
@@ -31,33 +31,30 @@ function isAllowedArtist(artist) {
}
// ============================================
-// 2. CUSTOM LIGHTBOX (UPDATED)
+// 2. CUSTOM LIGHTBOX
// ============================================
-let allPicturesArray = [];
-let currentPhotoIndex = 0;
+let currentPhotos = [];
+let currentIndex = 0;
-// Helper function to create a picture element
-function createPictureElement(picture) {
- const item = document.createElement('div');
- item.className = 'photo-item';
- item.dataset.image = picture.url;
- item.dataset.alt = picture.alt;
- item.dataset.created = picture.created_at;
- item.dataset.pubkey = picture.pubkey || '';
-
- const date = new Date(picture.created_at * 1000);
- const dateStr = date.toLocaleDateString('en-US', {
- year: 'numeric', month: 'short', day: 'numeric'
+// Build photo array from DOM
+function buildPhotoArray() {
+ const photoItems = document.querySelectorAll('.photo-item');
+ currentPhotos = [];
+ photoItems.forEach(item => {
+ const image = item.querySelector('img');
+ const date = item.dataset.date || '';
+ const pubkey = item.dataset.pubkey || '';
+ const alt = item.dataset.alt || '';
+ if (image) {
+ currentPhotos.push({
+ url: image.src,
+ alt: alt || image.alt || '',
+ date: date,
+ pubkey: pubkey
+ });
+ }
});
- item.dataset.date = dateStr;
-
- item.innerHTML = `
- ${picture.url ? `
` : ''}
-
📅 ${dateStr}
- `;
-
- return item;
}
// Open lightbox
@@ -68,48 +65,26 @@ function openLightbox(index) {
const lightboxMeta = document.getElementById('lightboxMeta');
const lightboxCounter = document.getElementById('lightboxCounter');
- if (!lightbox || !lightboxImage || allPicturesArray.length === 0) return;
+ if (!lightbox || !lightboxImage || currentPhotos.length === 0) return;
- if (index < 0) index = allPicturesArray.length - 1;
- if (index >= allPicturesArray.length) index = 0;
- currentPhotoIndex = index;
-
- const photo = allPicturesArray[currentPhotoIndex];
+ if (index < 0) index = currentPhotos.length - 1;
+ if (index >= currentPhotos.length) index = 0;
+ currentIndex = index;
+ const photo = currentPhotos[currentIndex];
lightboxImage.src = photo.url;
lightboxImage.alt = photo.alt;
lightboxCaption.textContent = photo.alt;
- const date = new Date(photo.created_at * 1000);
- const dateStr = date.toLocaleDateString('en-US', {
- year: 'numeric', month: 'short', day: 'numeric'
- });
+ let metaText = '';
+ if (photo.date) metaText += `📅 ${photo.date}`;
- let metaText = `📅 ${dateStr}`;
+ lightboxMeta.textContent = metaText || '📅 No date available';
- lightboxMeta.textContent = metaText;
-
- lightboxCounter.textContent = `${currentPhotoIndex + 1} / ${allPicturesArray.length}`;
+ lightboxCounter.textContent = `${currentIndex + 1} / ${currentPhotos.length}`;
lightbox.classList.add('active');
document.body.style.overflow = 'hidden';
-
- // Preload next and previous images
- preloadAdjacentImages(currentPhotoIndex);
-}
-
-function preloadAdjacentImages(index) {
- const nextIndex = (index + 1) % allPicturesArray.length;
- if (nextIndex !== index) {
- const nextImg = new Image();
- nextImg.src = allPicturesArray[nextIndex].url;
- }
-
- const prevIndex = (index - 1 + allPicturesArray.length) % allPicturesArray.length;
- if (prevIndex !== index) {
- const prevImg = new Image();
- prevImg.src = allPicturesArray[prevIndex].url;
- }
}
// Close lightbox
@@ -121,8 +96,8 @@ function closeLightbox() {
}
// Navigate
-function prevPhoto() { openLightbox(currentPhotoIndex - 1); }
-function nextPhoto() { openLightbox(currentPhotoIndex + 1); }
+function prevPhoto() { openLightbox(currentIndex - 1); }
+function nextPhoto() { openLightbox(currentIndex + 1); }
// Initialize lightbox event listeners
function initLightbox() {
@@ -133,16 +108,14 @@ function initLightbox() {
if (!lightbox) return;
+ buildPhotoArray();
+
// Photo click listeners
- document.querySelectorAll('.photo-item img').forEach((img) => {
+ document.querySelectorAll('.photo-item img').forEach((img, index) => {
img.removeEventListener('click', img._lightboxClick);
img._lightboxClick = function(e) {
e.preventDefault();
- const url = this.src;
- const fullIndex = allPicturesArray.findIndex(p => p.url === url);
- if (fullIndex !== -1) {
- openLightbox(fullIndex);
- }
+ openLightbox(index);
};
img.addEventListener('click', img._lightboxClick);
});
@@ -227,6 +200,7 @@ function renderMusicTracks(tracks, containerId, randomize = false) {
else if (key === 'image') image = value;
else if (key === 'artist') artist = value;
else if (key === 'album') album = value;
+ // ONLY collect tags with key 't' (genre tags)
else if (key === 't') genreTags.push(value);
else if (key === 'alt') alt = value;
});
@@ -244,6 +218,7 @@ function renderMusicTracks(tracks, containerId, randomize = false) {
${album ? `${album}
` : ''}
${url ? `` : ''}
+
${genreTags.length > 0 ? `