From 7050b8141eae25a0cdc394fd195e66dd9af29ad7 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sat, 18 Jun 2022 08:47:28 +0200 Subject: Improved exhibit --- content/lightbox.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) (limited to 'content/lightbox.js') diff --git a/content/lightbox.js b/content/lightbox.js index 66facd6..e4a2c29 100644 --- a/content/lightbox.js +++ b/content/lightbox.js @@ -27,13 +27,14 @@ } const setIndex = (i) => { - if (i < 0 || i >= thumbnailEls.length) { + if (i < 0 || i >= images.length) { return; } - thumbnailEls[currentIndex].classList.remove("is-selected"); + images[currentIndex].thumbnailEl.classList.remove("is-selected"); currentIndex = i; lightboxImgEl.src = figureEls[i].firstElementChild.href; - thumbnailEls[i].classList.add("is-selected"); + lightboxImgEl.alt = images[currentIndex].description; + images[i].thumbnailEl.classList.add("is-selected"); }; const prev = () => { @@ -48,7 +49,7 @@ lightboxPrevEl.addEventListener("click", prev); lightboxNextEl.addEventListener("click", next); - const thumbnailEls = figureEls.map((figureEl, i) => { + const images = figureEls.map((figureEl, i) => { const go = e => { e.preventDefault(); show(); @@ -72,7 +73,6 @@ } anchorEl.addEventListener("click", go); - const thumbnailButtonEl = document.createElement("button"); const thumbnailImgEl = document.createElement("img"); @@ -89,7 +89,13 @@ lightboxFooterEl.appendChild(thumbnailButtonEl); - return thumbnailButtonEl; + const captionEl = figureEl.querySelector("figcaption"); + const description = captionEl?.innerHTML ?? ""; + + return { + thumbnailEl: thumbnailButtonEl, + description, + }; }); setIndex(0); -- cgit v1.2.3-54-g00ecf