Files
backend-mm/resources/views/web/themes/shella/pages/home/collections.blade.php
2025-09-25 03:03:31 +05:00

64 lines
2.2 KiB
PHP

@push('header-css')
<style>
.m-w-90 {
max-width: 90%;
}
#product-collections-container {
margin: 0 -12.5px;
}
</style>
@endpush
@push('footer-javascript')
<script>
document.addEventListener('DOMContentLoaded', () => {
let homepage2GridBannerContainer = document.getElementById('theme-section-two-grid-banners');
let productCollectionContainer = document.getElementById('product-collections-container');
let collectionLoader = document.getElementById('collection-products-loader');
let loading = false;
let pagination = 2;
let paginationDone = false;
elementAppeared(homepage2GridBannerContainer, () => {
if (! loading && ! paginationDone) {
loading = true;
collectionLoader.classList.remove('d-none')
collectionLoader.classList.add('d-flex')
$.ajax(location.href, {
data: {
page: pagination
},
success(response) {
productCollectionContainer.insertAdjacentHTML('beforeend', response.collections)
pagination++;
loading = false;
collectionLoader.classList.remove('d-flex')
collectionLoader.classList.add('d-none')
new LazyLoad({
elements_selector: '.lazyload',
threshold: 100,
})
if (! response.pagination.next_page_url) {
paginationDone = true
}
}
})
}
});
})
</script>
@endpush
<div class="container m-w-90">
<div id="product-collections-container" class="component-list component-small-list d-flex flex-wrap">
@include('web.themes.trendyol.components.products.collection.collections')
</div>
<div id="collection-products-loader" class="d-flex justify-content-center">
<img src="/web/shella/images/shella-preloader.svg" alt="Pre-loader"></div>
</div>
</div>