fix(ionicScrollDelegate): trigger resize before scrolling to top/bottom

Closes #522
This commit is contained in:
Andy Joslin
2014-02-06 09:51:35 -05:00
parent 0fe4486737
commit ea289b81c6
2 changed files with 58 additions and 35 deletions

View File

@@ -26,7 +26,7 @@ angular.module('ionic.ui.service.scrollDelegate', [])
if(ionic.DomUtil.rectContains(e.gesture.touches[0].pageX, e.gesture.touches[0].pageY, bounds.left, bounds.top, bounds.left + bounds.width, bounds.top + 20)) {
_this.scrollTop();
}
}
}, element[0]);
},
@@ -47,6 +47,14 @@ angular.module('ionic.ui.service.scrollDelegate', [])
* $scope {Scope} the scope to register and listen for events
*/
register: function($scope, $element) {
function scrollViewResize() {
// Run the resize after this digest
return $timeout(function() {
$scope.$parent.scrollView && $scope.$parent.scrollView.resize();
});
}
$element.bind('scroll', function(e) {
$scope.onScroll({
event: e,
@@ -56,10 +64,7 @@ angular.module('ionic.ui.service.scrollDelegate', [])
});
$scope.$parent.$on('scroll.resize', function(e) {
// Run the resize after this digest
$timeout(function() {
$scope.$parent.scrollView && $scope.$parent.scrollView.resize();
});
scrollViewResize();
});
// Called to stop refreshing on the scroll view
@@ -73,14 +78,18 @@ angular.module('ionic.ui.service.scrollDelegate', [])
* @param animate {boolean} whether to animate or just snap
*/
$scope.$parent.$on('scroll.scrollTop', function(e, animate) {
$scope.$parent.scrollView && $scope.$parent.scrollView.scrollTo(0, 0, animate === false ? false : true);
scrollViewResize().then(function() {
$scope.$parent.scrollView && $scope.$parent.scrollView.scrollTo(0, 0, animate === false ? false : true);
});
});
$scope.$parent.$on('scroll.scrollBottom', function(e, animate) {
var sv = $scope.$parent.scrollView;
var max;
if(!sv) { return; }
max = sv.getScrollMax();
sv.scrollTo(0, max.top, animate === false ? false : true);
scrollViewResize().then(function() {
var sv = $scope.$parent.scrollView;
if (sv) {
var max = sv.getScrollMax();
sv.scrollTo(0, max.top, animate === false ? false : true);
}
});
});
}
};

View File

@@ -27,45 +27,59 @@ describe('Ionic ScrollDelegate Service', function() {
expect(sv).not.toBe(undefined);
});
it('Should scroll top', function() {
spyOn(del, 'register');
it('should resize', function() {
var scope = rootScope.$new();
var el = compile('<content></content>')(scope);
var sv = del.getScrollView(scope);
spyOn(sv, 'resize');
del.resize();
timeout.flush();
expect(sv.resize).toHaveBeenCalled();
});
it('Should resize & scroll top', function() {
var scope = rootScope.$new();
var el = compile('<content start-y="100"></content>')(scope);
var sv = del.getScrollView(scope);
spyOn(sv, 'resize');
var v = sv.getValues();
expect(sv.getValues().top).toBe(100);
expect(v.top).toBe(100);
del.scrollTop(false);
timeout.flush();
expect(sv.resize).toHaveBeenCalled();
del.scrollTop();
expect(v.top).toBe(100);
expect(sv.getValues().top).toBe(0);
});
/*
it('Should scroll bottom', function() {
spyOn(del, 'register');
it('Should resize & scroll top', function() {
var scope = rootScope.$new();
var el = compile('<content start-y="100"><div style="height:1000px; width:100px;"></div></content>')(scope);
var el = compile('<content start-y="100"></content>')(scope);
var sv = del.getScrollView(scope);
spyOn(sv, 'resize');
expect(sv.getValues().top).toBe(100);
del.scrollBottom(false);
timeout.flush();
sv.resize();
expect(sv.resize).toHaveBeenCalled();
var v = sv.getValues();
expect(v.top).toBe(100);
console.log(sv.getScrollMax());
del.scrollBottom();
expect(v.top).toBe(100);
expect(sv.getValues().top).toBe(sv.getScrollMax().top);
});
*/
it('should finish refreshing', function() {
var scope = rootScope.$new();
var el = compile('<content start-y="100"></content>')(scope);
var sv = del.getScrollView(scope);
spyOn(sv, 'finishPullToRefresh');
del.finishRefreshing(scope);
expect(sv.finishPullToRefresh).toHaveBeenCalled();
});
});