File: /var/www/html/wp-content/themes/thegem-elementor/js/thegem-product-legacy-gallery.js
(function($) {
$(function() {
function gallery_images_loaded($box, image_selector, callback) {
function check_image_loaded(img) {
return img.getAttribute('loading') === 'lazy' || img.getAttribute('src') === '' || (img.complete && img.naturalWidth !== undefined && img.naturalWidth !== 0);
}
var $images = $(image_selector, $box).filter(function() {
return !check_image_loaded(this);
}),
images_count = $images.length;
if (images_count == 0) {
return callback();
}
if (window.gemBrowser.name == 'ie' && !isNaN(parseInt(window.gemBrowser.version)) && parseInt(window.gemBrowser.version) <= 10) {
function image_load_event() {
images_count--;
if (images_count == 0) {
callback();
}
}
$images.each(function() {
if (check_image_loaded(this)) {
return;
}
var proxyImage = new Image();
proxyImage.addEventListener( 'load', image_load_event );
proxyImage.addEventListener( 'error', image_load_event );
proxyImage.src = this.src;
});
return;
}
$images.on('load error', function() {
images_count--;
if (images_count == 0) {
callback();
}
});
}
function initGallerySlider() {
if (window.tgpLazyItems !== undefined) {
var isShowed = window.tgpLazyItems.checkGroupShowed(this, function(node) {
initGallerySlider.call(node);
});
if (!isShowed) {
return;
}
}
var $gallery = $(this);
var $set = $('.gallery-set', this);
var $items = $('.gallery-item', $set);
init_circular_overlay($gallery, $set);
// update images list
$set.wrap('<div class="gem-gallery-preview-carousel-wrap clearfix"/>');
var $galleryPreviewWrap = $('.gem-gallery-preview-carousel-wrap', this);
$galleryPreviewWrap.wrap('<div class="gem-gallery-preview-carousel-padding clearfix"/>');
var $galleryPreviewNavigation = $('<div class="gem-gallery-preview-navigation"/>')
.appendTo($galleryPreviewWrap);
var $galleryPreviewPrev = $('<a href="#" class="gem-prev gem-gallery-preview-prev" aria-label="arrow-left"></a>')
.appendTo($galleryPreviewNavigation);
var $galleryPreviewNext = $('<a href="#" class="gem-next gem-gallery-preview-next" aria-label="arrow-right"></a>')
.appendTo($galleryPreviewNavigation);
// create thumbs list
var $galleryThumbsWrap = $('<div class="gem-gallery-thumbs-carousel-wrap col-lg-12 col-md-12 col-sm-12 clearfix" style="opacity: 0"/>')
.appendTo($gallery);
var $galleryThumbsCarousel = $('<ul class="gem-gallery-thumbs-carousel"/>')
.appendTo($galleryThumbsWrap);
var $galleryThumbsNavigation = $('<div class="gem-gallery-thumbs-navigation"/>')
.appendTo($galleryThumbsWrap);
var $galleryThumbsPrev = $('<a href="#" class="gem-prev gem-gallery-thumbs-prev" aria-label="arrow-left"></a>')
.appendTo($galleryThumbsNavigation);
var $galleryThumbsNext = $('<a href="#" class="gem-next gem-gallery-thumbs-next" aria-label="arrow-right"></a>')
.appendTo($galleryThumbsNavigation);
var thumbItems = '';
$items.each(function() {
thumbItems += '<li><span><img src="' + $('.image-wrap img', this).data('thumb-url') + '" alt="" /></span></li>';
});
var $thumbItems = $(thumbItems);
$thumbItems.appendTo($galleryThumbsCarousel);
$thumbItems.each(function(index) {
$(this).data('gallery-item-num', index);
});
var $galleryPreview = $set.carouFredSel({
auto: false,
circular: false,
infinite: false,
responsive: true,
width: '100%',
height: '100%',
items: 1,
align: 'center',
prev: $galleryPreviewPrev,
next: $galleryPreviewNext,
swipe: true,
scroll: {
items: 1,
onBefore: function(data) {
var current = $(this).triggerHandler('currentPage');
var thumbCurrent = $galleryThumbs.triggerHandler('slice', [current, current+1]);
var thumbsVisible = $galleryThumbs.triggerHandler('currentVisible');
$thumbItems.filter('.active').removeClass('active');
if(thumbsVisible.index(thumbCurrent) === -1) {
$galleryThumbs.trigger('slideTo', current);
}
$('span', thumbCurrent).trigger('click');
}
}
});
var $galleryThumbs = null;
gallery_images_loaded($galleryThumbsCarousel, 'img', function() {
$galleryThumbs = $galleryThumbsCarousel.carouFredSel({
auto: false,
circular: false,
infinite: false,
width: '100%',
height: 'variable',
align: 'center',
prev: $galleryThumbsPrev,
next: $galleryThumbsNext,
swipe: true,
onCreate: function(data) {
$('span', $thumbItems).click(function(e) {
e.preventDefault();
$thumbItems.filter('.active').removeClass('active');
$(this).closest('li').addClass('active');
$galleryPreview.trigger('slideTo', $(this).closest('li').data('gallery-item-num'));
});
$thumbItems.eq(0).addClass('active');
}
});
$galleryThumbsWrap.animate({opacity: 1}, 400);
if($thumbItems.length < 2) {
$galleryThumbsWrap.hide();
}
});
}
function initGallery() {
if (window.tgpLazyItems !== undefined) {
var isShowed = window.tgpLazyItems.checkGroupShowed(this, function(node) {
initGallery.call(node);
});
if (!isShowed) {
return;
}
}
var $galleryElement = $(this);
var $thumbItems = $('.gem-gallery-item', $galleryElement);
var $galleryPreviewWrap = $('<div class="gem-gallery-preview-carousel-wrap"/>')
.appendTo($galleryElement);
var $galleryPreviewCarousel = $('<div class="gem-gallery-preview-carousel "/>')
.appendTo($galleryPreviewWrap);
var $galleryPreviewNavigation = $('<div class="gem-gallery-preview-navigation"/>')
.appendTo($galleryPreviewWrap);
var $galleryPreviewPrev = $('<a href="#" class="gem-prev gem-gallery-preview-prev" aria-label="arrow-left"></a>')
.appendTo($galleryPreviewNavigation);
var $galleryPreviewNext = $('<a href="#" class="gem-next gem-gallery-preview-next" aria-label="arrow-right"></a>')
.appendTo($galleryPreviewNavigation);
if($galleryElement.hasClass('with-pagination')) {
var $galleryPreviewPagination = $('<div class="gem-gallery-preview-pagination gem-mini-pagination"/>')
.appendTo($galleryPreviewWrap);
}
var $previewItems = $thumbItems.clone(true, true);
$previewItems.appendTo($galleryPreviewCarousel);
$previewItems.each(function() {
$('img', this).attr('src', $('a', this).attr('href'));
$('a', this)
.attr('href', $('a', this)
.data('full-image-url'))
.attr('data-fancybox', $('a', this).data('fancybox-group'))
.addClass('fancy-gallery');
});
$galleryPreviewCarousel.initGalleryFancybox();
var $galleryThumbsWrap = $('<div class="gem-gallery-thumbs-carousel-wrap"/>')
.appendTo($galleryElement);
var $galleryThumbsCarousel = $('<div class="gem-gallery-thumbs-carousel"/>')
.appendTo($galleryThumbsWrap);
var $galleryThumbsNavigation = $('<div class="gem-gallery-thumbs-navigation"/>')
.appendTo($galleryThumbsWrap);
var $galleryThumbsPrev = $('<a href="#" class="gem-prev gem-gallery-thumbs-prev" aria-label="arrow-left"></a>')
.appendTo($galleryThumbsNavigation);
var $galleryThumbsNext = $('<a href="#" class="gem-next gem-gallery-thumbs-next" aria-label="arrow-right"></a>')
.appendTo($galleryThumbsNavigation);
$thumbItems.appendTo($galleryThumbsCarousel);
$thumbItems.each(function(index) {
$(this).data('gallery-item-num', index);
});
}
$('.gallery-slider').each(initGallerySlider);
$('.gem-gallery:not(.gem-gallery-elementor-preview)').each(initGallery);
$('body:not(.elementor-editor-active)').updateGalleries();
$('body:not(.elementor-editor-active)').buildSimpleGalleries();
$('body:not(.elementor-editor-active)').updateSimpleGalleries();
$('.gem_tab').on('tab-update', function() {
$(this).updateGalleries();
});
$(document).on('gem.show.vc.tabs', '[data-vc-accordion]', function() {
$(this).data('vc.accordion').getTarget().updateGalleries();
});
$(document).on('gem.show.vc.accordion', '[data-vc-accordion]', function() {
$(this).data('vc.accordion').getTarget().updateGalleries();
});
});
function updateGallery() {
if (window.tgpLazyItems !== undefined) {
var isShowed = window.tgpLazyItems.checkGroupShowed(this, function(node) {
updateGallery.call(node);
});
if (!isShowed) {
return;
}
}
var $galleryElement = $(this);
$('img', $galleryElement).removeAttr('data-tgpli-image-inited');
var $galleryPreviewCarousel = $('.gem-gallery-preview-carousel', $galleryElement);
var $galleryThumbsWrap = $('.gem-gallery-thumbs-carousel-wrap', $galleryElement);
var $galleryThumbsCarousel = $('.gem-gallery-thumbs-carousel', $galleryElement);
var $thumbItems = $('.gem-gallery-item', $galleryThumbsCarousel);
var $galleryPreviewPrev = $('.gem-gallery-preview-prev', $galleryElement);
var $galleryPreviewNext = $('.gem-gallery-preview-next', $galleryElement);
var $galleryPreviewPagination = $('.gem-gallery-preview-pagination', $galleryElement);
var $galleryThumbsPrev = $('.gem-gallery-thumbs-prev', $galleryElement);
var $galleryThumbsNext = $('.gem-gallery-thumbs-next', $galleryElement);
$galleryElement.thegemPreloader(function() {
var $galleryThumbs = $galleryThumbsCarousel, $galleryPreview = $galleryPreviewCarousel;
$galleryPreview = $galleryPreviewCarousel.carouFredSel({
auto: $galleryElement.data('autoscroll') ? $galleryElement.data('autoscroll') : false,
circular: true,
infinite: true,
responsive: true,
width: '100%',
height: 'auto',
items: 1,
align: 'center',
prev: $galleryPreviewPrev,
next: $galleryPreviewNext,
pagination: $galleryElement.hasClass('with-pagination') ? $galleryPreviewPagination : false,
swipe: true,
scroll: {
pauseOnHover: true,
items: 1,
onBefore: function(data) {
var current = $(this).triggerHandler('currentPage');
var thumbCurrent = $galleryThumbs.triggerHandler('slice', [current, current+1]);
var thumbsVisible = $galleryThumbs.triggerHandler('currentVisible');
$thumbItems.filter('.active').removeClass('active');
if(thumbsVisible.index(thumbCurrent) === -1) {
$galleryThumbs.trigger('slideTo', current);
}
$('a', thumbCurrent).trigger('gemActivate');
}
},
onCreate: function () {
$(window).on('resize', function () {
$galleryPreviewCarousel.parent().add($galleryPreviewCarousel).height($galleryPreviewCarousel.children().first().height());
}).trigger('resize');
}
});
$galleryThumbs = $galleryThumbsCarousel.carouFredSel({
auto: false,
circular: true,
infinite: true,
width: '100%',
height: 'variable',
align: 'center',
prev: $galleryThumbsPrev,
next: $galleryThumbsNext,
swipe: true,
onCreate: function(data) {
$('a', $thumbItems).on('gemActivate', function(e) {
$thumbItems.filter('.active').removeClass('active');
$(this).closest('.gem-gallery-item').addClass('active');
$galleryPreview.trigger('slideTo', $(this).closest('.gem-gallery-item').data('gallery-item-num'));
});
$('a', $thumbItems).click(function(e) {
e.preventDefault();
$(this).trigger('gemActivate');
});
}
});
if($thumbItems.filter('.active').length) {
$thumbItems.filter('.active').eq(0).find('a').trigger('click');
} else {
$thumbItems.eq(0).find('a').trigger('gemActivate');
}
if($thumbItems.length < 2) {
$galleryThumbsWrap.hide();
}
});
}
function updateSimpleGallery() {
if (window.tgpLazyItems !== undefined) {
var isShowed = window.tgpLazyItems.checkGroupShowed(this, function(node) {
updateSimpleGallery.call(node);
});
if (!isShowed) {
return;
}
}
var $galleryElement = $(this);
var $galleryItemsCarousel = $('.gem-gallery-items-carousel', $galleryElement);
var $thumbItems = $('.gem-gallery-item', $galleryItemsCarousel);
var $galleryItemsPrev = $('.gem-gallery-items-prev', $galleryElement);
var $galleryItemsNext = $('.gem-gallery-items-next', $galleryElement);
$galleryElement.thegemPreloader(function() {
var $galleryItems = $galleryItemsCarousel.carouFredSel({
auto: ($galleryElement.data('autoscroll') > 0 ? $galleryElement.data('autoscroll') : false),
circular: true,
infinite: true,
responsive: $galleryElement.hasClass('responsive'),
width: '100%',
height: 'variable',
align: 'center',
prev: $galleryItemsPrev,
next: $galleryItemsNext,
swipe: true,
scroll: {
pauseOnHover: true
},
onCreate: function(data) {
$galleryElement.trigger('gallery-inited');
}
});
});
}
$.fn.buildSimpleGalleries = function() {
$('.gem-simple-gallery:not(.activated)', this).each(function() {
var $galleryElement = $(this);
$galleryElement.addClass('activated');
var $thumbItems = $('.gem-gallery-item', $galleryElement);
var $galleryItemsWrap = $('<div class="gem-gallery-items-carousel-wrap"/>')
.appendTo($galleryElement);
var $galleryItemsCarousel = $('<div class="gem-gallery-items-carousel"/>')
.appendTo($galleryItemsWrap);
var $galleryItemsNavigation = $('<div class="gem-gallery-items-navigation"/>')
.appendTo($galleryItemsWrap);
var $galleryItemsPrev = $('<a href="#" class="gem-prev gem-gallery-items-prev" aria-label="arrow-left"></a>')
.appendTo($galleryItemsNavigation);
var $galleryItemsNext = $('<a href="#" class="gem-next gem-gallery-items-next" aria-label="arrow-right"></a>')
.appendTo($galleryItemsNavigation);
$thumbItems.appendTo($galleryItemsCarousel);
$('a', $galleryItemsCarousel).addClass('fancy-gallery');
$galleryItemsCarousel.initGalleryFancybox();
});
}
$.fn.updateGalleries = function() {
$('.gem-gallery:not(.gem-gallery-elementor-preview)', this).each(updateGallery);
}
$.fn.updateSimpleGalleries = function() {
$('.gem-simple-gallery', this).each(updateSimpleGallery);
}
})(jQuery);