brc/js/galleryDisplay.js
2020-10-28 21:16:55 +01:00

132 lines
3.9 KiB
JavaScript

function galleryFilter(showValue) {
const elems = document.getElementsByClassName("gallery-item");
const dElems = document.getElementsByClassName("gallery-description");
const showElems = document.getElementsByClassName(showValue);
for(let i = 0; i < dElems.length; i++){
const dElem = dElems[i];
dElem.style.display='none';
}
for(let i = 0; i < elems.length; i++){
const elem = elems[i];
elem.style.display='none';
}
for(let i = 0; i < showElems.length; i++){
const sElem = showElems[i];
sElem.style.display='initial';
}
}
let currImgArr = [];
let currImgInd = 0;
let currImg = 'img/portfolio-01.jpg';
function openModalAll(className, imgArr) {
const elems = document.getElementsByClassName(className);
elems[0].style.display = imgArr ? 'flex' : 'none';
currImgArr = imgArr;
}
function zoomModal(initIndex) {
const elems = document.getElementsByClassName("modal-gallery");
elems[0].style.display = initIndex === false ? 'none' : 'flex';
currImgInd = initIndex;
currImg = 'img/' + currImgArr[currImgInd];
const imgElems = document.getElementsByClassName("modal-gallery-image");
imgElems[0].src = currImg;
const nextElems = document.getElementsByClassName("modal-gallery-button-next");
if(currImgInd === (currImgArr.length - 1)){
nextElems[0].style.visibility = 'hidden';
nextElems[0].style.pointerEvents = 'none';
} else {
nextElems[0].style.visibility = 'visible';
nextElems[0].style.pointerEvents = 'initial';
}
const prevElems = document.getElementsByClassName("modal-gallery-button-prev");
if(currImgInd === 0){
prevElems[0].style.visibility = 'hidden';
prevElems[0].style.pointerEvents = 'none';
} else {
prevElems[0].style.visibility = 'visible';
prevElems[0].style.pointerEvents = 'initial';
}
if(imgArr.length === 1){
nextElems[0].style.visibility = 'hidden';
nextElems[0].style.pointerEvents = 'none';
} else {
nextElems[0].style.visibility = 'visible';
nextElems[0].style.pointerEvents = 'initial';
}
}
function nextImg() {
currImgInd += 1;
currImg = 'img/' + currImgArr[currImgInd];
const imgElems = document.getElementsByClassName("modal-gallery-image");
imgElems[0].src = currImg;
const nextElems = document.getElementsByClassName("modal-gallery-button-next");
if(currImgInd === (currImgArr.length - 1)){
nextElems[0].style.visibility = 'hidden';
nextElems[0].style.pointerEvents = 'none';
} else {
nextElems[0].style.visibility = 'visible';
nextElems[0].style.pointerEvents = 'initial';
}
const prevElems = document.getElementsByClassName("modal-gallery-button-prev");
if(currImgInd === 0){
prevElems[0].style.visibility = 'hidden';
prevElems[0].style.pointerEvents = 'none';
} else {
prevElems[0].style.visibility = 'visible';
prevElems[0].style.pointerEvents = 'initial';
}
}
function prevImg() {
currImgInd -= 1;
currImg = 'img/' + currImgArr[currImgInd];
const imgElems = document.getElementsByClassName("modal-gallery-image");
imgElems[0].src = currImg;
const nextElems = document.getElementsByClassName("modal-gallery-button-next");
if(currImgInd === (currImgArr.length - 1)){
nextElems[0].style.visibility = 'hidden';
nextElems[0].style.pointerEvents = 'none';
} else {
nextElems[0].style.visibility = 'visible';
nextElems[0].style.pointerEvents = 'initial';
}
const prevElems = document.getElementsByClassName("modal-gallery-button-prev");
if(currImgInd === 0){
prevElems[0].style.visibility = 'hidden';
prevElems[0].style.pointerEvents = 'none';
} else {
prevElems[0].style.visibility = 'visible';
prevElems[0].style.pointerEvents = 'initial';
}
}