https://pustakaimamsyafii.com/js/addons/ab__video_gallery/product_image_gallery.js?ver=1780411873

1/*******************************************************************************************
2*   ___  _          ______                     _ _                _                        *
3*  / _ \| |         | ___ \                   | (_)              | |              © 2024   *
4* / /_\ | | _____  _| |_/ /_ __ __ _ _ __   __| |_ _ __   __ _   | |_ ___  __ _ _ __ ___   *
5* |  _  | |/ _ \ \/ / ___ \ '__/ _` | '_ \ / _` | | '_ \ / _` |  | __/ _ \/ _` | '_ ` _ \  *
6* | | | | |  __/>  <| |_/ / | | (_| | | | | (_| | | | | | (_| |  | ||  __/ (_| | | | | | | *
7* \_| |_/_|\___/_/\_\____/|_|  \__,_|_| |_|\__,_|_|_| |_|\__, |  \___\___|\__,_|_| |_| |_| *
8*                                                         __/ |                            *
9*                                                        |___/                             *
10* ---------------------------------------------------------------------------------------- *
11* This is commercial software, only users who have purchased a valid license and accept    *
12* to the terms of the License Agreement can install and use this program.                  *
13* ---------------------------------------------------------------------------------------- *
14* website: https://cs-cart.alexbranding.com                                                *
15*   email: [email protected]                                                           *
16*******************************************************************************************/
17(function(_, $) {
18const ITEMS_COUNT_DEFAULT = 3;
19const theme_name = _.ab__video_gallery?.settings?.theme_name;
20var scroller_type;
21var methods = {
22init: function() {
23var container = $(this);
24var params = {
25items_count: container.data('caItemsCount') ? container.data('caItemsCount') : ITEMS_COUNT_DEFAULT,
26items_responsive: !!container.data('caItemsResponsive'),
27cycle: container.data('caCycle') === 'Y',
28vertical: container.data('caVertical') === 'Y',
29total_img: methods.countElms(container)
30};
31if (params.vertical && $(window).width() > 767) {
32scroller_type = 'jcarousel';
33} else {
34scroller_type = 'owlcarousel';
35}
36if (params.total_img <= params.items_count && container.parents('.ab_vg-images-wrapper').length) {
37container.removeClass('owl-carousel');
38}
39if (
40(
41params.total_img > params.items_count
42|| (!params.vertical && ['bright_theme', 'responsive'].includes(theme_name))
43)
44|| scroller_type === 'jcarousel'
45|| !container.parents('.ab_vg-images-wrapper').length
46) {
47if (container.data('owl-carousel') || container.data('jcarousel')) {
48return true;
49}
50methods.check(container, params);
51} else {
52container.addClass('ab__vg_loaded');
53}
54methods.bind(container);
55return true;
56},
57load: function(container, params) {
58if (scroller_type === 'owlcarousel') {
59container.owlCarousel({
60direction: _.language_direction,
61items: params.items_count,
62singleItem: params.items_count === 1,
63responsive: params.items_responsive,
64pagination: false,
65navigation: true,
66lazyLoad: true,
67navigationText: params.items_count === 1 ? ['<i class="icon-left-circle ty-icon-left-circle"></i>', '<i class="icon-right-circle ty-icon-right-circle"></i>'] : ['<i class="icon-left-open-thin ty-icon-left-open-thin"></i>', '<i class="icon-right-open-thin ty-icon-right-open-thin"></i>'],
68theme: params.items_count === 1 ? 'owl-one-theme' : 'owl-more-theme',
69beforeInit: function beforeInit() {
70$.ceEvent('trigger', 'ce.product_image_gallery.inner.beforeInit', [this]);
71},
72afterInit: function(item) {
73
74}
75});
76} else {
77container.css({
78'height': (params.items_count * params.i_height),
79'overflow': 'hidden',
80'padding': 0,
81'margin': 0,
82'position': 'relative',
83'z-index': 'auto'
84});
85var wrapper = container.parent();
86var nav_prev = $('<i class="icon-up-open ty-icon-up-open hand ty-hand" />').prependTo(wrapper);
87var nav_next = $('<i class="icon-down-open ty-icon-down-open hand ty-hand" />').appendTo(wrapper);
88var wrapper_height = container.outerHeight(true)+nav_prev.outerHeight(true)+nav_next.outerHeight(true);
89if (params.main_image_height < wrapper_height && params.items_count > ITEMS_COUNT_DEFAULT) {
90params.items_count--;
91container.height(params.items_count * params.i_height);
92}
93var scrolled = 0;
94if (!params.cycle) {
95nav_prev.css('visibility', 'hidden');
96}
97nav_next.on('click', function(){
98if ((scrolled + params.items_count) < params.items_amount) {
99scrolled += 1;
100if ((scrolled + params.items_count) === params.items_amount && !params.cycle) {
101nav_next.css('visibility', 'hidden');
102}
103} else if ((scrolled + params.items_count) === params.items_amount && params.cycle) {
104scrolled = 0;
105} else {
106return false;

107}
108nav_prev.css('visibility', 'visible');
109container.stop(true, false).animate({
110scrollTop: scrolled*params.i_height
111});
112});
113nav_prev.on('click', function(){
114if (scrolled > 0) {
115scrolled -= 1;
116if (scrolled === 0 && !params.cycle) {
117nav_prev.css('visibility', 'hidden');
118}
119} else if (scrolled === 0 && params.cycle) {
120scrolled = params.items_amount - params.items_count;
121} else {
122return false;
123}
124nav_next.css('visibility', 'visible');
125container.stop(true, false).animate({
126scrollTop: scrolled*params.i_height
127});
128});
129let elem = $('.cm-thumbnails-mini.active', container);
130if (elem.length) {
131let pos = elem.data('caImageOrder') || 0;
132while (scrolled <= (pos - params.items_count)) {
133nav_next.trigger('click');
134}
135}
136}
137container.addClass('ab__vg_loaded');
138},
139check: function(container, params) {
140if (container.data('owl-carousel') || container.data('jcarousel')) {
141return true;
142}
143const set_image_gallery_wraper_width = function (container, params) {
144if ((!params.vertical || $(window).width() < 767) && (['bright_theme', 'responsive'].includes(theme_name))) {
145const reserved_width = 50,
146max_container_width = params.main_image_width - reserved_width;
147if (params.c_width > max_container_width) {
148params.c_width = max_container_width;
149container.closest('.cm-image-gallery-wrapper').width(params.c_width);
150params.items_count = Math.floor(params.c_width / params.i_width);
151}
152container.closest('.cm-image-gallery-wrapper').width(params.c_width);
153} else if (scroller_type === 'owlcarousel') {
154container.closest('.cm-image-gallery-wrapper').width(params.c_width);
155}
156}
157if (!params.i_width || !params.i_height) {
158var t_elm = false;
159var wrapper = container.closest('.ab_vg-images-wrapper');
160if ($('.cm-thumbnails-mini', container).length) {
161var load = false;
162if (!t_elm) {
163t_elm = $('.cm-thumbnails-mini:first', container);
164var i_elm = $('img', t_elm);
165if (i_elm.height() <= 5 || i_elm.width() <= 5) {
166load = true;
167}
168let t_elm_image = null;
169if ((t_elm_image = $('.cm-previewer:first', wrapper).find('img')[0] ?? null)) {
170if (!t_elm_image.complete && t_elm_image.naturalWidth === 0) {
171load = true;
172}
173}
174if (load) {
175var check_load = function() {
176methods.check(container, params);
177};
178setTimeout(check_load, 500);
179return false;
180}
181}
182} else {
183t_elm = $('img:first', container);
184}
185params.i_width = t_elm.outerWidth(true);
186params.i_height = t_elm.outerHeight(true);
187params.c_width = params.i_width * params.items_count;
188params.main_image_width = $('.cm-preview-wrapper', wrapper).outerWidth(false);
189params.main_image_height = $('.cm-preview-wrapper', wrapper).outerHeight(false);
190set_image_gallery_wraper_width(container, params);
191if (scroller_type !== 'owlcarousel') {
192params.items_count = parseInt(params.main_image_height/params.i_height);
193params.items_amount = methods.countElms(container);
194if (params.items_count < ITEMS_COUNT_DEFAULT) {
195params.items_count = params.items_amount < 3 ? params.items_amount : ITEMS_COUNT_DEFAULT;
196}
197set_image_gallery_wraper_width(container, params);
198if ((params.main_image_height > params.items_amount * params.i_height) || params.items_amount <= params.items_count) {
199container.addClass('ab__vg_loaded');
200return false;
201} else {
202container.data('jcarousel', true);
203}
204}
205}
206return methods.load(container, params);
207},
208bind: function(container) {
209container.click(function(e) {
210var jelm = $(e.target);
211var pjelm;
212var in_elm;
213if (scroller_type === 'owlcarousel') {
214in_elm = (jelm.parents('.cm-item-gallery') || jelm.parents('div.cm-thumbnails-mini'));
215} else {
216in_elm = (jelm.parents('.cm-item-gallery') || jelm.parents('.cm-thumbnails-mini'));
217}
218if (in_elm && !jelm.is('img') && !jelm.has('iframe') && !jelm.has('video')) {
219return false;
220}
221if (jelm.hasClass('cm-thumbnails-mini') || (pjelm = jelm.parents('a:first.cm-thumbnails-mini'))) {
222jelm = (pjelm && pjelm.length) ? pjelm : jelm;
223var c_id = jelm.data('caGalleryLargeId');
224$('#' + c_id).closest('.cm-preview-wrapper').trigger('owl.goTo', $(jelm).data('caImageOrder') || 0);
225}
226});
227},
228countElms: function(container) {
229if (scroller_type === 'owlcarousel') {
230return $('.cm-thumbnails-mini', container).length;
231} else {
232return $('.cm-thumbnails-mini', container).length;
233}
234}
235};
236$.fn.AB_ceProductImageGallery = function( method ) {
237if (!$().owlCarousel) {
238var gelms = $(this);
239$.getScript('js/lib/owlcarousel/owl.carousel.min.js', function() {
240gelms.AB_ceProductImageGallery();
241});
242return false;

243}
244return $(this).each(function(i, elm) {
245var errors = { };
246if (methods[method]) {
247return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
248} else if ( typeof method === 'object' || !method ) {
249return methods.init.apply(this, arguments);
250} else {
251$.error('ty.productimagegallery: method ' + method + ' does not exist');
252}
253});
254};
255$.ceEvent('on', 'ce.commoninit', function(context) {
256context.find('.cm-image-gallery:not(.ab__vg_loaded)').each(function () {
257let self = $(this);
258self.AB_ceProductImageGallery();
259});
260});
261$.ceEvent('on', 'ce.commoninit', function (context) {
262var wrapper = $('.cm-preview-wrapper', context);
263var gallery_items_view = +(_.abt__ut2?.settings?.products[_.abt__ut2?.details_layout]?.multiple_product_images?.[_.abt__ut2?.device]||1);
264if (gallery_items_view == 2) {
265var item = gallery_items_view,
266itemsDesktop = gallery_items_view,
267itemsDesktopSmall = 2,
268itemsTablet = 1,
269itemsMobile = 1;
270}
271if (gallery_items_view == 3) {
272var item = gallery_items_view,
273itemsDesktop = gallery_items_view,
274itemsDesktopSmall = 2,
275itemsTablet = 2,
276itemsMobile = 1;
277}
278var desktop = [1400, itemsDesktop],
279desktopSmall = [1230, itemsDesktopSmall],
280tablet = [1040, itemsTablet],
281mobile = [900, itemsMobile];
282if (wrapper.length) {
283let params = {
284direction: _.language_direction,
285lazyLoad: true,
286pagination: false,
287center: true,
288addClassActive: true,
289beforeInit: function beforeInit() {
290$.ceEvent('trigger', 'ce.product_image_gallery.beforeInit', [this]);
291},
292afterInit: function (item) {
293var thumbnails = $('.cm-thumbnails-mini', item.parents('[data-ca-previewer]')),
294previewers = $('.cm-image-previewer', item.parents('[data-ca-previewer]')),
295previousScreenX = 0,
296newScreenX = 0,
297swipeThreshold = 7;
298previewers.each(function (index, elm) {
299$(elm).data('caImageOrder', index);
300});
301thumbnails.on('click', function () {
302item.trigger('owl.goTo', $(this).data('caImageOrder') ? $(this).data('caImageOrder') : 0);
303});
304item.on('touchstart', function (e) {
305previousScreenX = e.changedTouches[0].screenX;
306});
307item.on('touchmove', function (e) {
308newScreenX = e.changedTouches[0].screenX;
309if (Math.abs(newScreenX - previousScreenX) > swipeThreshold && e.cancelable) {
310e.preventDefault();
311}
312previousScreenX = newScreenX;
313});
314$('.cm-image-previewer.hidden', item).toggleClass('hidden', false);
315$.ceEvent('trigger', 'ce.product_image_gallery.ready');
316},
317beforeMove: function (item) {
318$('.ty-image-zoom__flyout--visible').removeClass('ty-image-zoom__flyout--visible');
319},
320afterMove: function (item) {
321var _parent = item.parent();
322$('.cm-thumbnails-mini', _parent)
323.toggleClass('active', false);
324var elmOrderInGallery = $('.owl-item.active', item).index();
325$('[data-ca-image-order=' + elmOrderInGallery + ']', _parent)
326.toggleClass('active', true);
327$('.owl-carousel.cm-image-gallery', _parent)
328.trigger('owl.goTo', elmOrderInGallery);
329$.ceEvent('trigger', 'ce.product_image_gallery.image_changed', [wrapper, item]);
330}
331}
332if($('.ty-quick-view__wrapper').length) {
333params = {
334...params,
335singleItem: true,
336items: 1,
337navigation: false
338}
339} else if(gallery_items_view > 1 ) {
340params = {
341...params,
342singleItem: false,
343items: item,
344itemsDesktop: desktop,
345itemsDesktopSmall: desktopSmall,
346itemsTablet: tablet,
347itemsMobile: mobile,
348navigation: true,
349navigationText: ['<i class="icon-left-open ty-icon-left-open hand ty-hand" />', '<i class="icon-right-open ty-icon-right-open hand ty-hand" />']
350}
351} else {
352params = {
353...params,
354singleItem: true,
355items: 1,
356navigation: 'abt__ut2' in _ ,
357navigationText: ['<i class="icon-left-open ty-icon-left-open hand ty-hand" />', '<i class="icon-right-open ty-icon-right-open hand ty-hand" />']
358}
359}
360wrapper.owlCarousel(params);
361}
362});
363})(Tygh, Tygh.$);