Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Commit

Permalink
feat(carousel): add option to prevent pause
Browse files Browse the repository at this point in the history
sometimes we want the carousel to spin even if the mouse hovers over it. Added an option for an optional attribute, doesn't break current templates
  • Loading branch information
mokesmokes authored and ajoslin committed Jun 22, 2013
1 parent d952647 commit 5f895c1
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 6 deletions.
14 changes: 9 additions & 5 deletions src/carousel/carousel.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@
* A pure AngularJS carousel.
*
* For no interval set the interval to non-number, or milliseconds of desired interval
* Template: <carousel interval="none"><slide>{{anything}}</slide></carousel>
* To prevent pause upon mouseover set the nopause attribute to a truthy value
* Template: <carousel interval="none" nopause="someValue"><slide>{{anything}}</slide></carousel>
* To change the carousel's active slide set the active attribute to true
* Template: <carousel interval="none"><slide active="someModel">{{anything}}</slide></carousel>
*/
Expand Down Expand Up @@ -130,9 +131,11 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
}
};
$scope.pause = function() {
isPlaying = false;
if (currentTimeout) {
$timeout.cancel(currentTimeout);
if (!$scope.noPause) {
isPlaying = false;
if (currentTimeout) {
$timeout.cancel(currentTimeout);
}
}
};

Expand Down Expand Up @@ -173,7 +176,8 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
templateUrl: 'template/carousel/carousel.html',
scope: {
interval: '=',
noTransition: '='
noTransition: '=',
noPause: '='
}
};
}])
Expand Down
14 changes: 13 additions & 1 deletion src/carousel/test/carousel.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,15 @@ describe('carousel', function() {
{active:false,content:'three'}
];
elm = $compile(
'<carousel interval="interval" no-transition="true">' +
'<carousel interval="interval" no-transition="true" no-pause="nopause">' +
'<slide ng-repeat="slide in slides" active="slide.active">' +
'{{slide.content}}' +
'</slide>' +
'</carousel>'
)(scope);
carouselScope = elm.scope();
scope.interval = 5000;
scope.nopause = undefined;
scope.$apply();
});
afterEach(function() {
Expand Down Expand Up @@ -178,6 +179,17 @@ describe('carousel', function() {
$timeout.flush();
testSlideActive(2);
});

it('should not pause on mouseover if noPause', function() {
scope.$apply('nopause = true');
testSlideActive(0);
elm.trigger('mouseenter');
$timeout.flush();
testSlideActive(1);
elm.trigger('mouseleave');
$timeout.flush();
testSlideActive(2);
});

it('should remove slide from dom and change active slide', function() {
scope.$apply('slides[1].active = true');
Expand Down

0 comments on commit 5f895c1

Please sign in to comment.