how to solve slider issue that items are displaying twice on pdp page

how to solve the in slider the items are displaying twice on pdp page
for that we need to make a infinite loop false so in the source that will be true we need to make it false

define(
	'JJ.Slider.Slider', [
	    'Utils',
		'RecentlyViewedItems.View',
		'RecentlyViewedItems.Collection',
		'ItemRelations.RelatedItem.View', 
		'ItemRelations.Related.View',
		'ItemRelations.Correlated.View'
	],
	function (
        Utils, 
		RecentlyViewedItemsView, 
		RecentlyViewedItemsCollection, 
		ItemRelationsRelatedItemView,
		ItemRelationsRelatedView,
		ItemRelationsCorrelatedView
	) {
		'use strict';
		var productLength;
		return {
			mountToApp: function mountToApp(container) {
				var layout = container.getComponent('Layout');
				if (layout) {
					_.extend(RecentlyViewedItemsView.prototype, {
						loadRecentlyViewedItem: function loadRecentlyViewedItem() {
							const self = this;
							RecentlyViewedItemsCollection.getInstance().turnOnTracking();
							this.collection.promise &&
								this.collection.promise.done(function () {
									const application = self.options;
									const number_of_items_displayed = SC.CONFIGURATION.recentlyViewedItems.numberOfItemsDisplayed;
									self.collection = self.collection.first(parseInt(number_of_items_displayed));
									self.render();
									const carousel = self.$el.find('[data-type="carousel-items"]');
									if (Utils.isPhoneDevice() === false && SC.CONFIGURATION.siteSettings.imagesizes) {
										const thumbnail = _.where(
											SC.CONFIGURATION.siteSettings.imagesizes, {
												name: SC.CONFIGURATION.imageSizeMapping.thumbnail
											}
										)[0];
										const img_min_height = thumbnail.maxheight;
										carousel
											.find('.item-relations-related-item-thumbnail')
											.css('minHeight', img_min_height);
									}
									var sliderNewProperty = SC.CONFIGURATION.bxSliderDefaults;
									sliderNewProperty.minSlides = 2;
									sliderNewProperty.infiniteLoop = false;
									if (productLength >= 5) {
										sliderNewProperty.controls = true;
										if (window.innerWidth > 768) {
											sliderNewProperty.oneToOneTouch = true;
										} else {
											sliderNewProperty.oneToOneTouch = false;
										}
									} else {
										sliderNewProperty.controls = false;
										if (window.innerWidth > 768) {
											sliderNewProperty.oneToOneTouch = false;
										} else {
											sliderNewProperty.oneToOneTouch = true;
										}
									}
									Utils.initBxSlider(carousel, sliderNewProperty);
								});
						},
						getContext: _.wrap(RecentlyViewedItemsView.prototype.getContext, function (fn) {
							var originalRet = fn.apply(this, _.toArray(arguments).slice(1));
							productLength = originalRet.collection.length;
							return originalRet;
						})
					});
					_.extend(ItemRelationsRelatedView.prototype, {
						carouselInitialize: function carouselInitialize() {
							const { siteSettings, imageSizeMapping } = this.options.application.getConfig();
							const carousel = this.$el.find('[data-type="carousel-items"]');
							if (carousel.length > 0) {
								if (Utils.isPhoneDevice() === false && (siteSettings.imagesizes || false)) {
									const img_min_height = (_.where(siteSettings.imagesizes || [], {
										name: imageSizeMapping.thumbnail || ''
									})[0]).maxheight;
									console.log('img_min_height', img_min_height);
									carousel
										.find('.item-relations-related-item-thumbnail')
										.css('minHeight', img_min_height);
								}
								var sliderNewProperty = SC.CONFIGURATION.bxSliderDefaults;
								sliderNewProperty.infiniteLoop = false;
								sliderNewProperty.minSlides = 2;
								if (productLength >= 5) {
									sliderNewProperty.controls = true;
									if (window.innerWidth > 768) {
										sliderNewProperty.oneToOneTouch = true;
									} else {
										sliderNewProperty.oneToOneTouch = false;
									}
								} else {
									sliderNewProperty.controls = false;
									if (window.innerWidth > 768) {
										sliderNewProperty.oneToOneTouch = false;
									} else {
										sliderNewProperty.oneToOneTouch = true;
									}
								}
								Utils.initBxSlider(carousel, sliderNewProperty);
							}
						},
						getContext: _.wrap(ItemRelationsRelatedView.prototype.getContext, function (fn) {
							var originalRet = fn.apply(this, _.toArray(arguments).slice(1));
							productLength = originalRet.collection.length;
							$(document).ready(function () {
								$('.item-relations-related-carousel-prev.disabled').css('display', 'none');
								$('.item-relations-related-carousel-next.disabled').css('display', 'none');
							})
							return originalRet;
						})
					});
					_.extend(ItemRelationsCorrelatedView.prototype, {
						carouselInitialize: function carouselInitialize() {
							const carousel = this.$el.find('[data-type="carousel-items"]');
							const {
								siteSettings,
								imageSizeMapping,
								bxSliderDefaults
							} = this.options.application.getConfig();
							if (carousel.length > 0) {
								if (Utils.isPhoneDevice() === false && siteSettings.imagesizes) {
									const img_min_height = (_.where(siteSettings.imagesizes, {
										name: imageSizeMapping.thumbnail
									})[0]).maxheight;
									carousel
										.find('.item-relations-related-item-thumbnail')
										.css('minHeight', img_min_height);
								}
								var sliderNewProperty = SC.CONFIGURATION.bxSliderDefaults;
								sliderNewProperty.infiniteLoop = false;
								sliderNewProperty.minSlides = 2;
								sliderNewProperty.maxSlides = 4
								if (productLength >= 5) {
									sliderNewProperty.controls = true;
									if (window.innerWidth > 768) {
										sliderNewProperty.oneToOneTouch = true;
									} else {
										sliderNewProperty.oneToOneTouch = false;
									}
								} else {
									sliderNewProperty.controls = false;
									if (window.innerWidth > 768) {
										sliderNewProperty.oneToOneTouch = false;
									} else {
										sliderNewProperty.oneToOneTouch = true;
									}
								}
								Utils.initBxSlider(carousel, sliderNewProperty);
							}
						},
						getContext: _.wrap(ItemRelationsCorrelatedView.prototype.getContext, function (fn) {
							var originalRet = fn.apply(this, _.toArray(arguments).slice(1));
							productLength = originalRet.collection.length;
							$('.item-relations-related-carousel-prev.disabled').css('display', 'none');
							$('.item-relations-related-carousel-next.disabled').css('display', 'none');
							return originalRet;
						})
					});
				}

			}
		};
	});

Leave a comment

Your email address will not be published. Required fields are marked *