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

feat(progressbar): change to fully add uib prefix #4503

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions src/progressbar/docs/demo.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,20 @@

<h3>Static</h3>
<div class="row">
<div class="col-sm-4"><progressbar value="55"></progressbar></div>
<div class="col-sm-4"><progressbar class="progress-striped" value="22" type="warning">22%</progressbar></div>
<div class="col-sm-4"><progressbar class="progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></progressbar></div>
<div class="col-sm-4"><uib-progressbar value="55"></uib-progressbar></div>
<div class="col-sm-4"><uib-progressbar class="progress-striped" value="22" type="warning">22%</uib-progressbar></div>
<div class="col-sm-4"><uib-progressbar class="progress-striped active" max="200" value="166" type="danger"><i>166 / 200</i></uib-progressbar></div>
</div>

<hr />
<h3>Dynamic <button type="button" class="btn btn-sm btn-primary" ng-click="random()">Randomize</button></h3>
<progressbar max="max" value="dynamic"><span style="color:white; white-space:nowrap;">{{dynamic}} / {{max}}</span></progressbar>
<uib-progressbar max="max" value="dynamic"><span style="color:white; white-space:nowrap;">{{dynamic}} / {{max}}</span></uib-progressbar>

<small><em>No animation</em></small>
<progressbar animate="false" value="dynamic" type="success"><b>{{dynamic}}%</b></progressbar>
<uib-progressbar animate="false" value="dynamic" type="success"><b>{{dynamic}}%</b></uib-progressbar>

<small><em>Object (changes type based on value)</em></small>
<progressbar class="progress-striped active" value="dynamic" type="{{type}}">{{type}} <i ng-show="showWarning">!!! Watch out !!!</i></progressbar>
<uib-progressbar class="progress-striped active" value="dynamic" type="{{type}}">{{type}} <i ng-show="showWarning">!!! Watch out !!!</i></uib-progressbar>

<hr />
<h3>Stacked <button type="button" class="btn btn-sm btn-primary" ng-click="randomStacked()">Randomize</button></h3>
Expand Down
75 changes: 50 additions & 25 deletions src/progressbar/progressbar.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
angular.module('ui.bootstrap.progressbar', [])

.constant('progressConfig', {
.constant('uibProgressConfig', {
animate: true,
max: 100
})

.value('$progressSuppressWarning', false)

.controller('ProgressController', ['$scope', '$attrs', 'progressConfig', function($scope, $attrs, progressConfig) {
.controller('UibProgressController', ['$scope', '$attrs', 'uibProgressConfig', function($scope, $attrs, progressConfig) {
var self = this,
animate = angular.isDefined($attrs.animate) ? $scope.$parent.$eval($attrs.animate) : progressConfig.animate;

Expand Down Expand Up @@ -63,7 +61,7 @@ angular.module('ui.bootstrap.progressbar', [])
restrict: 'EA',
replace: true,
transclude: true,
controller: 'ProgressController',
controller: 'UibProgressController',
require: 'uibProgress',
scope: {
max: '=?'
Expand All @@ -72,42 +70,66 @@ angular.module('ui.bootstrap.progressbar', [])
};
})

.directive('progress', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
.directive('uibBar', function() {
return {
restrict: 'EA',
replace: true,
transclude: true,
controller: 'ProgressController',
require: 'progress',
require: '^uibProgress',
scope: {
max: '=?',
title: '@?'
value: '=',
type: '@'
},
templateUrl: 'template/progressbar/progress.html',
link: function() {
if (!$progressSuppressWarning) {
$log.warn('progress is now deprecated. Use uib-progress instead');
}
templateUrl: 'template/progressbar/bar.html',
link: function(scope, element, attrs, progressCtrl) {
progressCtrl.addBar(scope, element, attrs);
}
};
}])
})

.directive('uibBar', function() {
.directive('uibProgressbar', function() {
return {
restrict: 'EA',
replace: true,
transclude: true,
require: '^uibProgress',
controller: 'UibProgressController',
scope: {
value: '=',
max: '=?',
type: '@'
},
templateUrl: 'template/progressbar/bar.html',
templateUrl: 'template/progressbar/progressbar.html',
link: function(scope, element, attrs, progressCtrl) {
progressCtrl.addBar(scope, element, attrs);
progressCtrl.addBar(scope, angular.element(element.children()[0]), {title: attrs.title});
}
};
})
});

/* Deprecated progressbar below */

angular.module('ui.bootstrap.progressbar')

.value('$progressSuppressWarning', false)

.directive('progress', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
return {
restrict: 'EA',
replace: true,
transclude: true,
controller: 'UibProgressController',
require: 'progress',
scope: {
max: '=?',
title: '@?'
},
templateUrl: 'template/progressbar/progress.html',
link: function() {
if (!$progressSuppressWarning) {
$log.warn('progress is now deprecated. Use uib-progress instead.');
}
}
};
}])

.directive('bar', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
return {
Expand All @@ -122,27 +144,30 @@ angular.module('ui.bootstrap.progressbar', [])
templateUrl: 'template/progressbar/bar.html',
link: function(scope, element, attrs, progressCtrl) {
if (!$progressSuppressWarning) {
$log.warn('bar is now deprecated. Use uib-bar instead');
$log.warn('bar is now deprecated. Use uib-bar instead.');
}
progressCtrl.addBar(scope, element);
}
};
}])

.directive('progressbar', function() {
.directive('progressbar', ['$log', '$progressSuppressWarning', function($log, $progressSuppressWarning) {
return {
restrict: 'EA',
replace: true,
transclude: true,
controller: 'ProgressController',
controller: 'UibProgressController',
scope: {
value: '=',
max: '=?',
type: '@'
},
templateUrl: 'template/progressbar/progressbar.html',
link: function(scope, element, attrs, progressCtrl) {
if (!$progressSuppressWarning) {
$log.warn('progressbar is now deprecated. Use uib-progressbar instead.');
}
progressCtrl.addBar(scope, angular.element(element.children()[0]), {title: attrs.title});
}
};
});
}]);
129 changes: 80 additions & 49 deletions src/progressbar/test/progressbar.spec.js
Original file line number Diff line number Diff line change
@@ -1,48 +1,3 @@
describe('progressbar directive', function() {
describe('$progressSuppressWarning', function() {
beforeEach(module('ui.bootstrap.progressbar'));
beforeEach(module('template/progressbar/progress.html', 'template/progressbar/bar.html'));

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(0);
});
});

it('should give warning by default', 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'));
Expand All @@ -51,7 +6,7 @@ describe('progressbar directive', function() {
$compile = _$compile_;
$rootScope = _$rootScope_;
$rootScope.value = 22;
element = $compile('<progressbar animate="false" value="value" title="foo">{{value}} %</progressbar>')($rootScope);
element = $compile('<uib-progressbar animate="false" value="value" title="foo">{{value}} %</uib-progressbar>')($rootScope);
$rootScope.$digest();
}));

Expand Down Expand Up @@ -85,7 +40,7 @@ describe('progressbar directive', function() {
});

it('has the default aria-labelledby value of `progressbar`', function() {
element = $compile('<progressbar animate="false" value="value">{{value}} %</progressbar>')($rootScope);
element = $compile('<uib-progressbar animate="false" value="value">{{value}} %</uib-progressbar>')($rootScope);
$rootScope.$digest();
var bar = getBar(0);
expect(bar.attr('aria-labelledby')).toBe('progressbar');
Expand Down Expand Up @@ -140,7 +95,7 @@ describe('progressbar directive', function() {
describe('"max" attribute', function() {
beforeEach(inject(function() {
$rootScope.max = 200;
element = $compile('<progressbar max="max" animate="false" value="value">{{value}}/{{max}}</progressbar>')($rootScope);
element = $compile('<uib-progressbar max="max" animate="false" value="value">{{value}}/{{max}}</uib-progressbar>')($rootScope);
$rootScope.$digest();
}));

Expand Down Expand Up @@ -181,7 +136,7 @@ describe('progressbar directive', function() {
describe('"type" attribute', function() {
beforeEach(inject(function() {
$rootScope.type = 'success';
element = $compile('<progressbar value="value" type="{{type}}"></progressbar>')($rootScope);
element = $compile('<uib-progressbar value="value" type="{{type}}"></uib-progressbar>')($rootScope);
$rootScope.$digest();
}));

Expand Down Expand Up @@ -363,3 +318,79 @@ describe('progressbar directive', function() {
});
});
});

/* Deprecation tests below */

describe('progressbar deprecation', function() {
beforeEach(module('ui.bootstrap.progressbar'));
beforeEach(module('template/progressbar/progress.html', 'template/progressbar/bar.html', 'template/progressbar/progressbar.html'));

describe('progress & bar directives', function() {
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(0);
});
});

it('should give warning by default', 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() {
it('should suppress warning', function() {
module(function($provide) {
$provide.value('$progressSuppressWarning', true);
});

inject(function($compile, $log, $rootScope) {
spyOn($log, 'warn');

$rootScope.value = 22;
var element = $compile('<progressbar animate="false" value="value" title="foo">{{value}} %</progressbar>')($rootScope);
$rootScope.$digest();

expect($log.warn.calls.count()).toBe(0);
});
});

it('should give warning by default', inject(function($compile, $log, $rootScope) {
spyOn($log, 'warn');

$rootScope.value = 22;
var element = $compile('<progressbar animate="false" value="value" title="foo">{{value}} %</progressbar>')($rootScope);
$rootScope.$digest();

expect($log.warn.calls.count()).toBe(1);
expect($log.warn.calls.argsFor(0)).toEqual(['progressbar is now deprecated. Use uib-progressbar instead.']);
}));
});
});