Enable infinite scroll on mobile view

- Remove desktop-only restriction from InfiniteScroll.init()
- Auto-detect container: .property-list-container (desktop map) or #property-results (mobile/grid)
- Hide pagination on all screen sizes when infinite scroll is enabled
- Reinitialize infinite scroll after all AJAX filter loads (not just desktop)
This commit is contained in:
Hanson.xyz Dev
2025-12-16 14:38:21 -06:00
parent bc39aa19dc
commit 9228a1f1ea
4 changed files with 24 additions and 23 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -820,14 +820,11 @@
LayoutCalculator.calculate(); LayoutCalculator.calculate();
} }
// Reinitialize infinite scroll (desktop map view only) // Reinitialize infinite scroll (all views)
if (window.innerWidth >= 1024 && $('.is-map-view').length) {
// Destroy existing, then reinit with new content
InfiniteScroll.destroy(); InfiniteScroll.destroy();
setTimeout(function() { setTimeout(function() {
InfiniteScroll.init(); InfiniteScroll.init();
}, 100); }, 100);
}
// Update URL (skip when map-triggered) // Update URL (skip when map-triggered)
if (updateHistory) { if (updateHistory) {
@@ -1171,14 +1168,19 @@
/** /**
* Initialize infinite scroll * Initialize infinite scroll
* Works on both desktop (map view) and mobile (grid view)
*/ */
init: function() { init: function() {
// Only enable on desktop (>= 1024px) in map view // Find the appropriate container based on view
if (window.innerWidth < 1024 || !$('.is-map-view').length) { // Desktop map view: .property-list-container
return; // Mobile/Grid view: .grid-view-container or #property-results
if (window.innerWidth >= 1024 && $('.is-map-view').length) {
this.$container = $('.property-list-container');
} else {
// Mobile or grid view - use the results container
this.$container = $('#property-results');
} }
this.$container = $('.property-list-container');
this.$grid = this.$container.find('.properties-grid'); this.$grid = this.$container.find('.properties-grid');
if (!this.$container.length || !this.$grid.length) { if (!this.$container.length || !this.$grid.length) {
@@ -1836,12 +1838,10 @@
LayoutCalculator.init(); LayoutCalculator.init();
CardImageLoader.init(); CardImageLoader.init();
// Initialize infinite scroll (desktop map view only) // Initialize infinite scroll (all views - desktop map and mobile grid)
if (window.innerWidth >= 1024 && $('.is-map-view').length) {
setTimeout(function() { setTimeout(function() {
InfiniteScroll.init(); InfiniteScroll.init();
}, 300); }, 300);
}
}); });
})(jQuery); })(jQuery);
@@ -626,7 +626,8 @@
} }
} }
// Hide pagination when infinite scroll is active // Hide pagination when infinite scroll is active (all screen sizes)
.infinite-scroll-enabled .pagination { .infinite-scroll-enabled .pagination,
display: none; #property-results.infinite-scroll-enabled .pagination {
display: none !important;
} }