function lightbox(settings) { if (!settings) { settings = {selectors: undefined}; } if (settings.selectors === undefined) { settings.selectors = ['body']; } let sources = []; let joinedSelectors = []; let blankSelector; !settings.blank ? (blankSelector = ':not([target="_blank"])') : (blankSelector = ''); let extensions = ['png', 'jpg', 'gif', 'webp']; $.extend(extensions, settings.extensions); $(settings.selectors).each(function (i, selector) { $(extensions).each(function (i, extension) { joinedSelectors.push( selector + ' a[href$=".' + extension + '" i]' + blankSelector, ); }); }); if (settings.specialSelector) { joinedSelectors.push(settings.specialSelector); } sources = $(joinedSelectors.join()); if (sources.length > 0) { let params = { lightboxContainer: 'body', captionSelector: 'alt-lightbox', closeOnOuter: true, guttenberg: false, icons: { zoom: '+', prev: '<', next: '>', close: 'x', }, }; params.icons = $.extend(params.icons, settings.icons); $.extend(params, settings); const lightboxContainer = $(params.lightboxContainer); let currentIndex; const indexlength = sources.length; let icons = []; if (params.icons) { if (params.icons.zoom) { icons.push( `
`, ); } if (params.icons.close) { icons.push( ` `, ); } if (params.icons.prev) { icons.push( ` `, ); } if (params.icons.next) { icons.push( ` `, ); } } icons = icons.join(''); for (let i = 0; i < indexlength; i++) { const source = sources.eq(i); let sourceLink = source.attr('img-lightbox'); if (!sourceLink) { sourceLink = source.attr('href'); } if (sourceLink) { source.addClass('hc-lbx-link'); let figcaption, galerycaption; if (params.guttenberg) { figcaption = source.closest('figure').find('figcaption').html(); if (params.guttenberg === 'gallery') { galerycaption = source .closest('figure') .find('figcaption') .html(); if (!galerycaption) { galerycaption = source .closest('.wp-block-gallery') .find('.blocks-gallery-caption') .html(); } } } let sourceCaption = source.attr(params.captionSelector); if (sourceCaption) { sourceCaption = ` `; } else if (figcaption) { sourceCaption = ` `; } else if (galerycaption) { sourceCaption = ` `; } else { sourceCaption = ''; } const number = i + 1; source.attr('heycisco-id', number); lightboxContainer.append( ` `, ); } } function manipulateModal() { $('.hc-lbx').removeClass('zoom'); $('.hc-lbx__button.prev, .hc-lbx__button.next').addClass('disabled'); if (currentIndex < indexlength) { $('.hc-lbx__button.next').removeClass('disabled'); } if (currentIndex > 1) { $('.hc-lbx__button.prev').removeClass('disabled'); } $('.hc-lbx').addClass('hidden').parent(); $('body').addClass('modal'); const posY = window.pageYOffset; $(`.hc-lbx[heycisco-id="${currentIndex}"]`) .removeClass('hidden') .css({ top: posY }); } $('.hc-lbx-link').on('click', function (e) { e.preventDefault(); currentIndex = Number($(this).attr('heycisco-id')); manipulateModal(); }); $('.hc-lbx__button.next').on('click', function () { if (!$(this).hasClass('disabled')) { currentIndex++; manipulateModal(); } }); $('.hc-lbx__button.prev').on('click', function () { if (!$(this).hasClass('disabled')) { currentIndex--; manipulateModal(); } }); $('.hc-lbx').on('click', function (e) { if ( !$(e.target).closest('picture, .hc-lbx__button').length && !$(e.target).is('picture, .hc-lbx__button') && params.closeOnOuter === true ) { $('.hc-lbx').addClass('hidden'); $('body').removeClass('modal'); } }); $('.hc-lbx__button.close').on('click', function () { $('.hc-lbx').addClass('hidden'); $('body').removeClass('modal'); }); $('.hc-lbx__button.zoom').on('click', function () { $('.hc-lbx').toggleClass('zoom'); }); $(window).on('resize', function () { clearTimeout(window.removeZoom); window.removeZoom = setTimeout(function () { if ($(window).width() > 852) { $('.hc-lbx').removeClass('zoom'); } }, 100); }); } }