fix(progress): rename to avoid conflict

- Rename to `ui-progress` and `ui-bar`

Closes #4255

Author: wesleycho

src/progressbar/docs/demo.html

@@ -19,6 +19,6 @@ <h3>Dynamic <button type="button" class="btn btn-sm btn-primary" ng-click="rando
 
     <hr />
     <h3>Stacked <button type="button" class="btn btn-sm btn-primary" ng-click="randomStacked()">Randomize</button></h3>
-    <progress><bar ng-repeat="bar in stacked track by $index" value="bar.value" type="{{bar.type}}"><span ng-hide="bar.value < 5">{{bar.value}}%</span></bar></progress>
+    <uib-progress><uib-bar ng-repeat="bar in stacked track by $index" value="bar.value" type="{{bar.type}}"><span ng-hide="bar.value < 5">{{bar.value}}%</span></uib-bar></uib-progress>
 
 </div>

src/progressbar/docs/readme.md

@@ -1,6 +1,6 @@
 A progress bar directive that is focused on providing feedback on the progress of a workflow or action.
 
-It supports multiple (stacked) bars into the same `<progress>` element or a single `<progressbar>` elemtnt with optional `max` attribute and transition animations.
+It supports multiple (stacked) bars into the same `<ui-progress>` element or a single `<progressbar>` elemtnt with optional `max` attribute and transition animations.
 
 ### Settings ###
 
@@ -25,5 +25,5 @@ It supports multiple (stacked) bars into the same `<progress>` element or a sing
 
 ### Stacked ###
 
-Place multiple `<bars>` into the same `<progress>` element to stack them.
-`<progress>` supports `max` and `animate` &  `<bar>` supports  `value` and `type` attributes.
+Place multiple `<uib-bar>`s into the same `<uib-progress>` element to stack them.
+`<uib-progress>` supports `max` and `animate` &  `<uib-bar>` supports  `value` and `type` attributes.

src/progressbar/progressbar.js

@@ -5,6 +5,8 @@ angular.module('ui.bootstrap.progressbar', [])
   max: 100
 })
 
+.value('$progressSuppressWarning', false)
+
 .controller('ProgressController', ['$scope', '$attrs', 'progressConfig', function($scope, $attrs, progressConfig) {
   var self = this,
       animate = angular.isDefined($attrs.animate) ? $scope.$parent.$eval($attrs.animate) : progressConfig.animate;
@@ -55,26 +57,45 @@ angular.module('ui.bootstrap.progressbar', [])
   });
 }])
 
-.directive('progress', function() {
+.directive('uibProgress', function() {
   return {
     restrict: 'EA',
     replace: true,
     transclude: true,
     controller: 'ProgressController',
-    require: 'progress',
+    require: 'uibProgress',
     scope: {
       max: '=?'
     },
     templateUrl: 'template/progressbar/progress.html'
   };
 })
 
-.directive('bar', function() {
+.directive('progress', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
   return {
     restrict: 'EA',
     replace: true,
     transclude: true,
-    require: '^progress',
+    controller: 'ProgressController',
+    require: 'progress',
+    scope: {
+      max: '=?'
+    },
+    templateUrl: 'template/progressbar/progress.html',
+    link: function() {
+      if ($progressSuppressWarning) {
+        $log.warn('progress is now deprecated. Use uib-progress instead');
+      }
+    }
+  };
+}])
+
+.directive('uibBar', function() {
+  return {
+    restrict: 'EA',
+    replace: true,
+    transclude: true,
+    require: '^uibProgress',
     scope: {
       value: '=',
       type: '@'
@@ -86,6 +107,26 @@ angular.module('ui.bootstrap.progressbar', [])
   };
 })
 
+.directive('bar', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
+  return {
+    restrict: 'EA',
+    replace: true,
+    transclude: true,
+    require: '^progress',
+    scope: {
+      value: '=',
+      type: '@'
+    },
+    templateUrl: 'template/progressbar/bar.html',
+    link: function(scope, element, attrs, progressCtrl) {
+      if ($progressSuppressWarning) {
+        $log.warn('bar is now deprecated. Use uib-bar instead');
+      }
+      progressCtrl.addBar(scope, element);
+    }
+  };
+}])
+
 .directive('progressbar', function() {
   return {
     restrict: 'EA',

src/progressbar/test/progressbar.spec.js

@@ -1,3 +1,48 @@
+describe('progressbar directive', function() {
+  describe('$progressSuppressWarning', function() {
+    beforeEach(module('ui.bootstrap.progressbar'));
+    beforeEach(module('template/progressbar/progress.html', 'template/progressbar/bar.html'));
+
+    it('should give warning', inject(function($compile, $log, $rootScope) {
+      spyOn($log, 'warn');
+
+      $rootScope.objects = [
+        { value: 10, type: 'success' },
+        { value: 50, type: 'warning' },
+        { value: 20 }
+      ];
+      var element = $compile('<progress animate="false"><bar ng-repeat="o in objects" value="o.value" type="{{o.type}}">{{o.value}}</bar></progress>')($rootScope);
+      $rootScope.$digest();
+
+      expect($log.warn.calls.count()).toBe(0);
+    }));
+
+    it('should suppress warning', function() {
+      module(function($provide) {
+        $provide.value('$progressSuppressWarning', true);
+      });
+
+      inject(function($compile, $log, $rootScope) {
+        spyOn($log, 'warn');
+
+        $rootScope.objects = [
+          { value: 10, type: 'success' },
+          { value: 50, type: 'warning' },
+          { value: 20 }
+        ];
+        var element = $compile('<progress animate="false"><bar ng-repeat="o in objects" value="o.value" type="{{o.type}}">{{o.value}}</bar></progress>')($rootScope);
+        $rootScope.$digest();
+
+        expect($log.warn.calls.count()).toBe(4);
+        expect($log.warn.calls.argsFor(0)).toEqual(['progress is now deprecated. Use uib-progress instead']);
+        expect($log.warn.calls.argsFor(1)).toEqual(['bar is now deprecated. Use uib-bar instead']);
+        expect($log.warn.calls.argsFor(2)).toEqual(['bar is now deprecated. Use uib-bar instead']);
+        expect($log.warn.calls.argsFor(3)).toEqual(['bar is now deprecated. Use uib-bar instead']);
+      });
+    });
+  });
+});
+
 describe('progressbar directive', function() {
   var $rootScope, $compile, element;
   beforeEach(module('ui.bootstrap.progressbar'));
@@ -156,7 +201,7 @@ describe('progressbar directive', function() {
         { value: 50, type: 'warning' },
         { value: 20 }
       ];
-      element = $compile('<progress animate="false"><bar ng-repeat="o in objects" value="o.value" type="{{o.type}}">{{o.value}}</bar></progress>')($rootScope);
+      element = $compile('<uib-progress animate="false"><uib-bar ng-repeat="o in objects" value="o.value" type="{{o.type}}">{{o.value}}</uib-bar></uib-progress>')($rootScope);
       $rootScope.$digest();
     }));
 
@@ -219,7 +264,7 @@ describe('progressbar directive', function() {
     describe('"max" attribute', function() {
       beforeEach(inject(function() {
         $rootScope.max = 200;
-        element = $compile('<progress max="max" animate="false"><bar ng-repeat="o in objects" value="o.value">{{o.value}}/{{max}}</bar></progress>')($rootScope);
+        element = $compile('<uib-progress max="max" animate="false"><uib-bar ng-repeat="o in objects" value="o.value">{{o.value}}/{{max}}</uib-bar></uib-progress>')($rootScope);
         $rootScope.$digest();
       }));