| 1 |
(function ($, elementor) { |
| 2 |
("use strict"); |
| 3 |
var SubCategoryCarousel = function ($scope, $) { |
| 4 |
var $SubCategoryCarousel = $scope.find(".usk-sub-category-carousel"); |
| 5 |
if (!$SubCategoryCarousel.length) { |
| 6 |
return; |
| 7 |
} |
| 8 |
var $SubCategoryCarouselContainer = $SubCategoryCarousel.find(".swiper-carousel"); |
| 9 |
var $carouselSettings = $SubCategoryCarousel.find('.usk-carousel').data("settings"); |
| 10 |
|
| 11 |
const Swiper = elementorFrontend.utils.swiper; |
| 12 |
initSwiper(); |
| 13 |
async function initSwiper() { |
| 14 |
var swiper = await new Swiper($SubCategoryCarouselContainer, $carouselSettings); // this is an example |
| 15 |
if ($carouselSettings.pauseOnHover) { |
| 16 |
$($SubCategoryCarouselContainer).hover(function () { |
| 17 |
(this).swiper.autoplay.stop(); |
| 18 |
}, function () { |
| 19 |
(this).swiper.autoplay.start(); |
| 20 |
}); |
| 21 |
} |
| 22 |
}; |
| 23 |
|
| 24 |
setTimeout(function () { |
| 25 |
|
| 26 |
var items = $SubCategoryCarousel.find(".usk-item"); |
| 27 |
|
| 28 |
$(items).each(function (index) { |
| 29 |
var element = $(this).find(".usk-image-slider"); |
| 30 |
const Swiper = elementorFrontend.utils.swiper; |
| 31 |
var $settings = $(this).data('settings'); |
| 32 |
|
| 33 |
if ($settings.effect === 'creative') { |
| 34 |
if ($settings.creativeEffect === 'creative-1') { |
| 35 |
$settings.creativeEffect = { |
| 36 |
next: { shadow: true, translate: ["100%", 0, 0] }, |
| 37 |
prev: { shadow: true, translate: ["0%", "0%", -400] }, |
| 38 |
limitProgress: 5, |
| 39 |
} |
| 40 |
} else if ($settings.creativeEffect === 'creative-2') { |
| 41 |
$settings.creativeEffect = { |
| 42 |
next: { shadow: true, translate: ["120%", 0, -500] }, |
| 43 |
prev: { shadow: true, translate: ["-120%", 0, -500] }, |
| 44 |
limitProgress: 5, |
| 45 |
} |
| 46 |
} else if ($settings.creativeEffect === 'creative-3') { |
| 47 |
$settings.creativeEffect = { |
| 48 |
next: { shadow: true, translate: ["100%", 0, 0] }, |
| 49 |
prev: { shadow: true, translate: ["-20%", 0, -1] }, |
| 50 |
limitProgress: 5, |
| 51 |
} |
| 52 |
} else if ($settings.creativeEffect === 'creative-4') { |
| 53 |
$settings.creativeEffect = { |
| 54 |
next: { |
| 55 |
rotate: [0, 0, 90], |
| 56 |
shadow: true, |
| 57 |
translate: ["120%", "0%", -800], |
| 58 |
}, |
| 59 |
prev: { |
| 60 |
rotate: [0, 0, -90], |
| 61 |
shadow: true, |
| 62 |
translate: ["-120%", "0%", -800], |
| 63 |
}, |
| 64 |
limitProgress: 5, |
| 65 |
} |
| 66 |
} else if ($settings.creativeEffect === 'creative-5') { |
| 67 |
$settings.creativeEffect = { |
| 68 |
next: { |
| 69 |
rotate: [0, 100, 0], |
| 70 |
shadow: true, |
| 71 |
translate: ["70%", "0%", -400], |
| 72 |
}, |
| 73 |
prev: { |
| 74 |
rotate: [0, -100, 0], |
| 75 |
shadow: true, |
| 76 |
translate: ["-70%", "0%", -400], |
| 77 |
}, |
| 78 |
limitProgress: 5, |
| 79 |
} |
| 80 |
} |
| 81 |
} |
| 82 |
|
| 83 |
initSwiper(); |
| 84 |
async function initSwiper() { |
| 85 |
await new Swiper(element, $settings); |
| 86 |
} |
| 87 |
}); |
| 88 |
|
| 89 |
}, 1000); |
| 90 |
}; |
| 91 |
jQuery(window).on("elementor/frontend/init", function () { |
| 92 |
elementorFrontend.hooks.addAction( |
| 93 |
"frontend/element_ready/usk-sub-category-carousel.default", |
| 94 |
SubCategoryCarousel |
| 95 |
); |
| 96 |
}); |
| 97 |
})(jQuery, window.elementorFrontend); |
| 98 |
|
