diff --git a/js/angular/directive/infiniteScroll.js b/js/angular/directive/infiniteScroll.js index 631fffcf83..3c63afb6e5 100644 --- a/js/angular/directive/infiniteScroll.js +++ b/js/angular/directive/infiniteScroll.js @@ -93,13 +93,24 @@ IonicModule return angular.isDefined($attrs.icon) ? $attrs.icon : 'ion-loading-d'; }; - $scope.$on('scroll.infiniteScrollComplete', function() { + var onInfinite = function() { + $element[0].classList.add('active'); + infiniteScrollCtrl.isLoading = true; + $scope.$parent && $scope.$parent.$apply($attrs.onInfinite || ''); + } + + var finishInfiniteScroll = function() { $element[0].classList.remove('active'); $timeout(function() { scrollView.resize(); }, 0, false); infiniteScrollCtrl.isLoading = false; + }; + + $scope.$on('scroll.infiniteScrollComplete', function() { + finishInfiniteScroll(); }); + $scope.$on('$destroy', function() { scrollCtrl.$element.off('scroll', checkBounds); }); @@ -116,11 +127,13 @@ IonicModule var scrollValues = scrollView.getValues(); var maxScroll = infiniteScrollCtrl.getMaxScroll(); + if(maxScroll.top === 0) { + return; + } + if ((maxScroll.left !== -1 && scrollValues.left >= maxScroll.left) || (maxScroll.top !== -1 && scrollValues.top >= maxScroll.top)) { - $element[0].classList.add('active'); - infiniteScrollCtrl.isLoading = true; - $scope.$parent && $scope.$parent.$apply($attrs.onInfinite || ''); + onInfinite(); } } } diff --git a/js/views/scrollView.js b/js/views/scrollView.js index d42bc26fa2..57415842e4 100644 --- a/js/views/scrollView.js +++ b/js/views/scrollView.js @@ -946,28 +946,34 @@ ionic.views.Scroll = ionic.views.View.inherit({ if (helperElem.style[perspectiveProperty] !== undef) { - return function(left, top, zoom) { + return function(left, top, zoom, wasResize) { content.style[transformProperty] = 'translate3d(' + (-left) + 'px,' + (-top) + 'px,0)'; self.__repositionScrollbars(); - self.triggerScrollEvent(); + if(!wasResize) { + self.triggerScrollEvent(); + } }; } else if (helperElem.style[transformProperty] !== undef) { - return function(left, top, zoom) { + return function(left, top, zoom, wasResize) { content.style[transformProperty] = 'translate(' + (-left) + 'px,' + (-top) + 'px)'; self.__repositionScrollbars(); - self.triggerScrollEvent(); + if(!wasResize) { + self.triggerScrollEvent(); + } }; } else { - return function(left, top, zoom) { + return function(left, top, zoom, wasResize) { content.style.marginLeft = left ? (-left/zoom) + 'px' : ''; content.style.marginTop = top ? (-top/zoom) + 'px' : ''; content.style.zoom = zoom || ''; self.__repositionScrollbars(); - self.triggerScrollEvent(); + if(!wasResize) { + self.triggerScrollEvent(); + } }; } @@ -1010,7 +1016,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ self.__resizeScrollbars(); // Refresh scroll position - self.scrollTo(self.__scrollLeft, self.__scrollTop, true); + self.scrollTo(self.__scrollLeft, self.__scrollTop, true, null, true); }, @@ -1224,8 +1230,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ * @param animate {Boolean} Whether the scrolling should happen using an animation * @param zoom {Number} Zoom level to go to */ - scrollTo: function(left, top, animate, zoom) { - + scrollTo: function(left, top, animate, zoom, wasResize) { var self = this; // Stop deceleration @@ -1293,7 +1298,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ } // Publish new values - self.__publish(left, top, zoom, animate); + self.__publish(left, top, zoom, animate, wasResize); }, @@ -1745,7 +1750,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ * @param top {Number} Top scroll position * @param animate {Boolean} Whether animation should be used to move to the new coordinates */ - __publish: function(left, top, zoom, animate) { + __publish: function(left, top, zoom, animate, wasResize) { var self = this; @@ -1781,7 +1786,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ // Push values out if (self.__callback) { - self.__callback(self.__scrollLeft, self.__scrollTop, self.__zoomLevel); + self.__callback(self.__scrollLeft, self.__scrollTop, self.__zoomLevel, wasResize); } } @@ -1815,7 +1820,7 @@ ionic.views.Scroll = ionic.views.View.inherit({ // Push values out if (self.__callback) { - self.__callback(left, top, zoom); + self.__callback(left, top, zoom, wasResize); } // Fix max scroll ranges diff --git a/scss/_scaffolding.scss b/scss/_scaffolding.scss index a740eb7c2c..e0b1a678b2 100644 --- a/scss/_scaffolding.scss +++ b/scss/_scaffolding.scss @@ -249,7 +249,7 @@ ion-infinite-scroll .scroll-infinite { .scroll-infinite-content { position: absolute; - bottom: 15px; + bottom: -1px; left: 0; width: 100%; color: #666666; diff --git a/test/html/infinite-scroll.html b/test/html/infinite-scroll.html new file mode 100644 index 0000000000..a185b49732 --- /dev/null +++ b/test/html/infinite-scroll.html @@ -0,0 +1,54 @@ + + +
+ + + +