Merge pull request #4309 from devansh-webkul/issue-4306

Fixed slider is not working properly in new product grid #4306
This commit is contained in:
Jitendra Singh 2020-11-26 13:52:05 +05:30 committed by GitHub
commit 59f4fadb25
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 36 additions and 6 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,5 @@
{
"/js/velocity.js": "/js/velocity.js?id=08a2c62f552381e1627c",
"/js/velocity.js": "/js/velocity.js?id=64eee9a349d40f22629e",
"/css/velocity-admin.css": "/css/velocity-admin.css?id=4322502d80a0e4a0affd",
"/css/velocity.css": "/css/velocity.css?id=e41e400c39a3cb5bc551"
}

View File

@ -11,7 +11,7 @@
<div class="row" :class="localeDirection">
<div
class="col-md-12 no-padding carousel-products"
:class="showRecentlyViewed ? 'with-recent-viewed col-lg-9' : 'col-lg-12'">
:class="showRecentlyViewed ? 'with-recent-viewed col-lg-9' : 'without-recent-viewed col-lg-12'">
<carousel-component
:slides-per-page="slidesPerPage"
navigation-enabled="hide"
@ -85,6 +85,7 @@
});
this.getProducts();
this.setWindowWidth();
this.setSlidesPerPage(this.windowWidth);
},
@ -122,17 +123,46 @@
})
},
/* waiting for element */
waitForElement: function (selector, callback) {
if (jQuery(selector).length) {
callback();
} else {
setTimeout(() => {
this.waitForElement(selector, callback);
}, 100);
}
},
/* setting window width */
setWindowWidth: function () {
let windowClass = this.getWindowClass();
this.waitForElement(windowClass, () => {
this.windowWidth = $(windowClass).width();
});
},
/* get window class */
getWindowClass: function () {
return this.showRecentlyViewed ? '.with-recent-viewed' : '.without-recent-viewed';
},
/* on resize set window width */
onResize: function () {
this.windowWidth = window.innerWidth;
this.windowWidth = $(this.getWindowClass()).width();
},
/* setting slides on the basis of window width */
setSlidesPerPage: function (width) {
if (width >= 992) {
if (width >= 1200) {
this.slidesPerPage = 6;
} else if (width < 992 && width >= 420) {
} else if (width < 1200 && width >= 992) {
this.slidesPerPage = 5;
} else if (width < 992 && width >= 822) {
this.slidesPerPage = 4;
} else if (width < 822 && width >= 626) {
this.slidesPerPage = 3;
} else {
this.slidesPerPage = 2;
}