diff --git a/src/carousel/carousel.js b/src/carousel/carousel.js index f649ab73f8..2e7c727319 100644 --- a/src/carousel/carousel.js +++ b/src/carousel/carousel.js @@ -7,11 +7,12 @@ * */ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition']) -.controller('CarouselController', ['$scope', '$timeout', '$transition', function ($scope, $timeout, $transition) { +.controller('CarouselController', ['$scope', '$timeout', '$interval', '$transition', function ($scope, $timeout, $interval, $transition) { var self = this, slides = self.slides = [], currentIndex = -1, - currentTimeout, isPlaying; + currentInterval, + isPlaying; self.currentSlide = null; var destroyed = false; @@ -61,7 +62,7 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition']) self.currentSlide = nextSlide; currentIndex = nextIndex; //every time you change slides, reset the timer - restartTimer(); + restartInterval(); } function transitionDone(next, current) { angular.extend(next, {direction: '', active: true, leaving: false, entering: false}); @@ -108,28 +109,27 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition']) return slides; }; - $scope.$watch('interval', restartTimer); - $scope.$on('$destroy', resetTimer); + $scope.$watch('interval', restartInterval); + $scope.$on('$destroy', stopInterval); - function restartTimer() { - resetTimer(); + function restartInterval() { + stopInterval(); var interval = +$scope.interval; if (!isNaN(interval) && interval>=0) { - currentTimeout = $timeout(timerFn, interval); + currentInterval = $interval(intervalFn, interval); } } - function resetTimer() { - if (currentTimeout) { - $timeout.cancel(currentTimeout); - currentTimeout = null; + function stopInterval() { + if (currentInterval) { + $interval.cancel(currentInterval); + currentInterval = null; } } - function timerFn() { + function intervalFn() { if (isPlaying) { $scope.next(); - restartTimer(); } else { $scope.pause(); } @@ -138,13 +138,13 @@ angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition']) $scope.play = function() { if (!isPlaying) { isPlaying = true; - restartTimer(); + restartInterval(); } }; $scope.pause = function() { if (!$scope.noPause) { isPlaying = false; - resetTimer(); + stopInterval(); } }; diff --git a/src/carousel/test/carousel.spec.js b/src/carousel/test/carousel.spec.js index fe58f59b0f..ed9d56e62b 100644 --- a/src/carousel/test/carousel.spec.js +++ b/src/carousel/test/carousel.spec.js @@ -2,12 +2,12 @@ describe('carousel', function() { beforeEach(module('ui.bootstrap.carousel')); beforeEach(module('template/carousel/carousel.html', 'template/carousel/slide.html')); - var $rootScope, $compile, $controller, $timeout; - beforeEach(inject(function(_$rootScope_, _$compile_, _$controller_, _$timeout_) { + var $rootScope, $compile, $controller, $interval; + beforeEach(inject(function(_$rootScope_, _$compile_, _$controller_, _$interval_) { $rootScope = _$rootScope_; $compile = _$compile_; $controller = _$controller_; - $timeout = _$timeout_; + $interval = _$interval_; })); describe('basics', function() { @@ -126,12 +126,12 @@ describe('carousel', function() { //no timeout to flush, interval watch doesn't make a new one when interval is invalid testSlideActive(0); scope.$apply('interval = 1000'); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(1); scope.$apply('interval = false'); testSlideActive(1); scope.$apply('interval = 1000'); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(2); }); @@ -156,23 +156,23 @@ describe('carousel', function() { it('should be playing by default and cycle through slides', function() { testSlideActive(0); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(1); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(2); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(0); }); it('should pause and play on mouseover', function() { testSlideActive(0); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(1); elm.trigger('mouseenter'); - expect($timeout.flush).toThrow();//pause should cancel current timeout + expect($interval.flush).toThrow();//pause should cancel current timeout testSlideActive(1); elm.trigger('mouseleave'); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(2); }); @@ -180,10 +180,10 @@ describe('carousel', function() { scope.$apply('nopause = true'); testSlideActive(0); elm.trigger('mouseenter'); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(1); elm.trigger('mouseleave'); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(2); }); @@ -193,7 +193,7 @@ describe('carousel', function() { scope.$apply('slides.splice(0,1)'); expect(elm.find('div.item').length).toBe(2); testSlideActive(1); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(0); scope.$apply('slides.splice(1,1)'); expect(elm.find('div.item').length).toBe(1); @@ -227,14 +227,14 @@ describe('carousel', function() { it('issue 1414 - should not continue running timers after scope is destroyed', function() { testSlideActive(0); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(1); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(2); - $timeout.flush(); + $interval.flush(scope.interval); testSlideActive(0); scope.$destroy(); - expect($timeout.flush).toThrow('No deferred tasks to be flushed'); + expect($interval.flush).toThrow('No deferred tasks to be flushed'); }); }); @@ -300,12 +300,12 @@ describe('carousel', function() { scope.interval = 2000; scope.$digest(); - $timeout.flush(); + $interval.flush(); expect(scope.next.calls.length).toBe(1); scope.$destroy(); - $timeout.flush(scope.interval); + $interval.flush(scope.interval); expect(scope.next.calls.length).toBe(1); }); });