javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ionInfiniteScroll): allow configuration of icon

Browse Source
This commit is contained in:
Andy Joslin
2014-03-11 13:56:08 -06:00
parent 703f68fb0b
commit 5f2c32ea9b
2 changed files with 34 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
js/ext/angular/src/directive/ionicContent.js vendored
View File

@@ -211,7 +211,8 @@ function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
* @param {expression} on-infinite What to call when the scroller reaches the
* bottom.
* @param {string=} distance The distance from the bottom that the scroll must
* reach to trigger the on-infinite expression. Default 1%.
* reach to trigger the on-infinite expression. Default: 1%.
* @param {string=} icon The icon to show while loading. Default: 'ion-loading-d'.
*
* @usage
* ```html
@@ -240,6 +241,7 @@ function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
* ```html
* <ion-infinite-scroll
* ng-if="moreDataCanBeLoaded()"
* icon="ion-loading-c"
* on-infinite="loadMoreData()">
* </ion-infinite-scroll>
* ```
@@ -251,9 +253,10 @@ function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
template:
'<div class="scroll-infinite">' +
'<div class="scroll-infinite-content">' +
'<i class="icon ion-loading-d icon-refreshing"></i>' +
'<i class="icon {{icon()}} icon-refreshing"></i>' +
'</div>' +
'</div>',
scope: true,
controller: ['$scope', '$attrs', function($scope, $attrs) {
this.isLoading = false;
this.scrollView = null; //given by link function
@@ -272,6 +275,12 @@ function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
var infiniteScrollCtrl = ctrls[1];
var scrollView = infiniteScrollCtrl.scrollView = scrollCtrl.scrollView;
var iconElement = $element[0].querySelector('.icon');
$scope.icon = function() {
return angular.isDefined($attrs.icon) ? $attrs.icon : 'ion-loading-d';
};
$scope.$on('scroll.infiniteScrollComplete', function() {
$element[0].classList.remove('active');
$timeout(function() {

24
js/ext/angular/test/directive/ionicInfiniteScroll.unit.js
View File

@@ -32,7 +32,7 @@ describe('ionicInfiniteScroll directive', function() {
});
return element;
}
it('should error if no ionicScroll parent', function() {
expect(function() {
inject(function($compile, $rootScope) {
@@ -47,6 +47,28 @@ describe('ionicInfiniteScroll directive', function() {
expect(ctrl.isLoading).toBe(false);
});
describe('icon', function() {
it('should have default icon ion-loading-d', function() {
var el = setup();
var icon = angular.element(el[0].querySelector('.icon'));
expect(icon.hasClass('ion-loading-d')).toBe(true);
});
it('should allow icon attr blank', function() {
var el = setup('icon=""');
var icon = angular.element(el[0].querySelector('.icon'));
expect(icon.hasClass('ion-loading-d')).toBe(false);
});
it('should allow interpolated icon attr', function() {
var el = setup('icon="{{someIcon}}"');
var icon = angular.element(el[0].querySelector('.icon'));
expect(icon.hasClass('ion-loading-d')).toBe(false);
el.scope().$apply('someIcon = "super-icon"');
expect(icon.hasClass('super-icon')).toBe(true);
});
});
describe('getMaxScroll', function() {
it('getMaxScroll should default to 1%', function() {
var el = setup();