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

Commit

Permalink
feat(datepicker): move datepicker mode to options
Browse files Browse the repository at this point in the history 
- Fully move datepickerMode support to datepickerOptions, deprecate attribute usage

Closes #5526
  • Loading branch information
@wesleycho
wesleycho committed Feb 23, 2016
1 parent 3c0a7cd commit 74a1d04
Show file tree
Hide file tree
Showing 2 changed files with 75 additions and 15 deletions.
49 changes: 34 additions & 15 deletions src/datepicker/datepicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,15 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
var self = this,
ngModelCtrl = { $setViewValue: angular.noop }, // nullModelCtrl;
ngModelOptions = {},
watchListeners = [];
watchListeners = [],
optionsUsed = !!$attrs.datepickerOptions;

// Modes chain
this.modes = ['day', 'month', 'year'];

if ($attrs.datepickerOptions) {
angular.forEach([
if (optionsUsed) {
[
'datepickerMode',
'formatDay',
'formatDayHeader',
'formatDayTitle',
Expand All @@ -50,15 +52,21 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
'startingDay',
'yearColumns',
'yearRows'
], function(key) {
].forEach(function(key) {
switch (key) {
case 'datepickerMode':
$scope.datepickerMode = angular.isDefined($scope.datepickerOptions.datepickerMode) ?
$scope.datepickerOptions.datepickerMode : datepickerConfig.datepickerMode;
break;
case 'formatDay':
case 'formatDayHeader':
case 'formatDayTitle':
case 'formatMonth':
case 'formatMonthTitle':
case 'formatYear':
self[key] = angular.isDefined($scope.datepickerOptions[key]) ? $interpolate($scope.datepickerOptions[key])($scope.$parent) : datepickerConfig[key];
self[key] = angular.isDefined($scope.datepickerOptions[key]) ?
$interpolate($scope.datepickerOptions[key])($scope.$parent) :
datepickerConfig[key];
break;
case 'showWeeks':
case 'shortcutPropagation':
Expand Down Expand Up @@ -103,9 +111,10 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
if ($scope.datepickerOptions[key]) {
$scope.$watch(function() { return $scope.datepickerOptions[key]; }, function(value) {
self[key] = $scope[key] = angular.isDefined(value) ? value : datepickerOptions[key];
if (key === 'minMode' && self.modes.indexOf($scope.datepickerMode) < self.modes.indexOf(self[key]) ||
key === 'maxMode' && self.modes.indexOf($scope.datepickerMode) > self.modes.indexOf(self[key])) {
if (key === 'minMode' && self.modes.indexOf($scope.datepickerOptions.datepickerMode) < self.modes.indexOf(self[key]) ||
key === 'maxMode' && self.modes.indexOf($scope.datepickerOptions.datepickerMode) > self.modes.indexOf(self[key])) {
$scope.datepickerMode = self[key];
$scope.datepickerOptions.datepickerMode = self[key];
}
});
} else {
Expand Down Expand Up @@ -217,10 +226,15 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
} else {
this.activeDate = new Date();
}

if ($attrs.datepickerMode && datepickerAttributeWarning) {
$log.warn('uib-datepicker datepickerMode attribute usage is deprecated, use datepicker-options attribute instead');
}

$scope.datepickerMode = $scope.datepickerMode ||
datepickerConfig.datepickerMode;
}

$scope.datepickerMode = $scope.datepickerMode ||
datepickerConfig.datepickerMode;
$scope.uniqueId = 'datepicker-' + $scope.$id + '-' + Math.floor(Math.random() * 10000);

$scope.disabled = angular.isDefined($attrs.disabled) || false;
Expand Down Expand Up @@ -331,7 +345,8 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
ngModelCtrl.$render();
} else {
self.activeDate = date;
$scope.datepickerMode = self.modes[self.modes.indexOf($scope.datepickerMode) - 1];
setMode(self.modes[self.modes.indexOf($scope.datepickerMode) - 1]);

$scope.$emit('uib:datepicker.mode');
}
};
Expand All @@ -351,7 +366,8 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
return;
}

$scope.datepickerMode = self.modes[self.modes.indexOf($scope.datepickerMode) + direction];
setMode(self.modes[self.modes.indexOf($scope.datepickerMode) + direction]);

$scope.$emit('uib:datepicker.mode');
};

Expand Down Expand Up @@ -396,6 +412,13 @@ angular.module('ui.bootstrap.datepicker', ['ui.bootstrap.dateparser', 'ui.bootst
watchListeners.shift()();
}
});

function setMode(mode) {
$scope.datepickerMode = mode;
if (optionsUsed) {
$scope.datepickerOptions.datepickerMode = mode;
}
}
}])

.controller('UibDaypickerController', ['$scope', '$element', 'dateFilter', function(scope, $element, dateFilter) {
Expand Down Expand Up @@ -833,10 +856,6 @@ function($scope, $element, $attrs, $compile, $log, $parse, $window, $document, $

if ($scope.datepickerOptions) {
datepickerEl.attr('datepicker-options', 'datepickerOptions');

if (angular.isDefined($scope.datepickerOptions.datepickerMode)) {
datepickerEl.attr('datepicker-mode', 'datepickerOptions.datepickerMode');
}
}

angular.forEach(['minMode', 'maxMode', 'datepickerMode', 'shortcutPropagation'], function(key) {
Expand Down
41 changes: 41 additions & 0 deletions src/datepicker/test/datepicker.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -230,6 +230,47 @@ describe('datepicker', function() {
expect($log.warn).not.toHaveBeenCalled();
});

it('should log warning for datepickerMode attribute usage', function() {
inject(function(_$log_, _$rootScope_, _$compile_) {
$log = _$log_;
$scope = _$rootScope_.$new();
$compile = _$compile_;
});

$scope.locals = {
date: new Date(),
mode: 'day'
};

spyOn($log, 'warn');
element = $compile('<uib-datepicker ng-model="locals.date" datepicker-mode="mode"></uib-datepicker>')($scope);
$scope.$digest();

expect($log.warn).toHaveBeenCalledWith('uib-datepicker datepickerMode attribute usage is deprecated, use datepicker-options attribute instead');
});

it('should suppress warning for datepickerMode attribute usage', function() {
module(function($provide) {
$provide.value('uibDatepickerAttributeWarning', false);
});
inject(function(_$log_, _$rootScope_, _$compile_) {
$log = _$log_;
$scope = _$rootScope_.$new();
$compile = _$compile_;
});

$scope.locals = {
date: new Date(),
mode: 'day'
};

spyOn($log, 'warn');
element = $compile('<uib-datepicker ng-model="locals.date" datepicker-mode="mode"></uib-datepicker>')($scope);
$scope.$digest();

expect($log.warn).not.toHaveBeenCalled();
});

it('should log warning for formatDay attribute usage', function() {
inject(function(_$log_, _$rootScope_, _$compile_) {
$log = _$log_;
Expand Down

0 comments on commit 74a1d04

Please sign in to comment.