diff options
author | Karl Hallsby <karl@hallsby.com> | 2020-09-27 17:45:13 -0500 |
---|---|---|
committer | Karl Hallsby <karl@hallsby.com> | 2020-09-27 17:45:13 -0500 |
commit | c6bf5f7c895287d2028f6024265913b59784a154 (patch) | |
tree | 3a298df17d9472a679411dd81ea00a1239652477 /_includes/scripts/components/lightbox.js | |
parent | 50dafcddc0392b99b228824274b1b97d0e72e423 (diff) |
Bring all of jekyll-text-theme _includes into site
Diffstat (limited to '_includes/scripts/components/lightbox.js')
-rw-r--r-- | _includes/scripts/components/lightbox.js | 49 |
1 files changed, 49 insertions, 0 deletions
diff --git a/_includes/scripts/components/lightbox.js b/_includes/scripts/components/lightbox.js new file mode 100644 index 0000000..51689c2 --- /dev/null +++ b/_includes/scripts/components/lightbox.js @@ -0,0 +1,49 @@ +{%- include scripts/utils/imagesLoad.js -%} +(function () { + var SOURCES = window.TEXT_VARIABLES.sources; + window.Lazyload.js(SOURCES.jquery, function() { + var $pageGalleryModal = $('.js-page-gallery-modal'); + var $images = $('.page__content').find('img:not(.lightbox-ignore)'); + window.imagesLoad($images).then(function() { + /* global Gallery */ + var pageGalleryModal = $pageGalleryModal.modal({ onChange: handleModalChange }); + var gallery = null; + var modalVisible = false; + var i, items = [], image, item; + if($images && $images.length > 0) { + for (i = 0; i < $images.length; i++) { + image = $images.eq(i); + if (image.get(0).naturalWidth > 800) { + items.push({ src: image.attr('src'), w: image.get(0).naturalWidth, h: image.get(0).naturalHeight, $el: image}); + } + } + } + + if(items.length > 0) { + gallery = new Gallery('.gallery', items); + gallery.setOptions({ disabled: !modalVisible }); + gallery.init(); + for (i = 0; i < items.length; i++) { + item = items[i]; + item.$el && (item.$el.addClass('popup-image'), item.$el.on('click', (function() { + var index = i; + return function() { + pageGalleryModal.show(); + gallery.setOptions({ initialSlide: index }); + gallery.refresh(true, { animation: false }); + }; + })())); + } + } + + function handleModalChange(visible) { + modalVisible = visible; + gallery && gallery.setOptions({ disabled: !modalVisible }); + } + + $pageGalleryModal.on('click', function() { + pageGalleryModal.hide(); + }); + }); + }); +})(); |