mxmehl/hugo-snap-gallery
1
0
Fork 0
Code Issues 2 Pull Requests Releases 2 Wiki Activity

Complete rewrite #1

Merged
mxmehl merged 27 commits from refactoring into master 2024-02-07 22:17:50 +01:00
Conversation 0 Commits 27 Files Changed 11 +36 -30
1 changed files with 36 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7211bdb558 - Show all commits

60
static/js/snap-gallery.js
View File

@@ -14,44 +14,50 @@ function closeLightbox(id) {
document.getElementById(lightbox_baseid + id).style.display = "none"; document.getElementById(lightbox_baseid + id).style.display = "none";
} }
// Move lightbox to the specified item
function openLightboxItem(id, n) {
showItem(lightbox_baseid, id, imageIndex[id] = n, ".snap-lightbox-inner");
}
// Next/previous controls for lightbox // Next/previous controls for lightbox
function moveLightboxItem(id, n) { function moveLightboxItem(id, n) {
showLightboxItem(id, imageIndex[id] += n); showItem(lightbox_baseid, id, imageIndex[id] += n, ".snap-lightbox-inner");
} }
// Next/previous controls for slideshow // Next/previous controls for slideshow
function moveSlideshowItem(id, n) { function moveSlideshowItem(id, n) {
showSlideshowItem(id, imageIndex[id] += n); showItem(slideshow_baseid, id, imageIndex[id] += n, ".snap-image");
} }
// Move lightbox to the specified item // In the slideshow or lightbox, make a specific image visible, make others hidden
function openLightboxItem(id, n) { function showItem(baseId, id, n, className) {
showLightboxItem(id, imageIndex[id] = n); // Get elements that shall be rotated
} const element = document.getElementById(baseId + id);
const items = element.querySelectorAll(className);
// TODO: Unify these functions // Increment item index
// In the lightbox, make a specific image visible, make others hidden const updateIndex = () => {
function showLightboxItem(id, n) { if (n > items.length) {
var i; imageIndex[id] = 1;
var lightbox = document.getElementById(lightbox_baseid + id);
var images = lightbox.querySelectorAll(".snap-lightbox-inner");
if (n > images.length) { imageIndex[id] = 1 }
if (n < 1) { imageIndex[id] = images.length }
for (i = 0; i < images.length; i++) {
images[i].style.display = "none";
} }
images[imageIndex[id] - 1].style.display = "inline-block"; if (n < 1) {
imageIndex[id] = items.length;
} }
};
// In the slideshow, make a specific image visible, make others hidden // hide all selected elements
function showSlideshowItem(id, n) { const hideAllItems = () => {
var i; for (let i = 0; i < items.length; i++) {
var slideshow = document.getElementById(slideshow_baseid + id); items[i].style.display = "none";
var images = slideshow.querySelectorAll(".snap-image");
if (n > images.length) { imageIndex[id] = 1 }
if (n < 1) { imageIndex[id] = images.length }
for (i = 0; i < images.length; i++) {
images[i].style.display = "none";
} }
images[imageIndex[id] - 1].style.display = "block"; };
// make desired item visible
const showCurrentItem = () => {
items[imageIndex[id] - 1].style.display = "inline-block";
};
updateIndex();
hideAllItems();
showCurrentItem();
} }