/**
 * Change top "Daily Downloads", "Active Users" values with animation effect
 */
(function () {
  'use strict';

  angular.module('Monitour.theme')
      .directive('textRotator', textRotator);

  /** @ngInject */
  function textRotator($interval) {
        return {
        restrict: 'E',
        scope: {
        	options: '='   
        },
        template: '<span class="word" ng-repeat="item in options">{{item}}</span>',
        link: function (scope, element, attrs) {
            var i = 0;
            // TODO: animate
            stop = $interval(function () {
            	element.children().css('opacity', 0);
                element.children().eq(i++ % 5).css('opacity', 0.8);
            }, 1000)
            
            scope.$on('$destroy', function() {
          		// Make sure that the interval is destroyed too
          		$interval.cancel(stop);
        	});
        }
  }
     }

})();