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

feat(timepicker): Added min/max attributes to timepicker. #4019

Closed
mikeknoll wants to merge 5 commits into from
Closed

feat(timepicker): Added min/max attributes to timepicker. #4019

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
e15780b
feat(timepicker): Added min/max attributes for timepicker.
mikeknoll Jul 27, 2015
d67763f
fix(timepicker): Removing unnecessary conditional
mikeknoll Aug 1, 2015
b86b668
fix(timepicker): Removing unnecessary Date instance in addMinutes().
mikeknoll Aug 1, 2015
21e5a75
style(timepicker): updating if block styling
mikeknoll Aug 6, 2015
1c0108d
fix(timepicker): Allow time to rollover if within min or max
mikeknoll Aug 7, 2015
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
Prev Previous commit
fix(timepicker): Allow time to rollover if within min or max
  • Loading branch information
@mikeknoll
mikeknoll committed Aug 7, 2015
commit 1c0108d0572f2c328d44ad21e3b161b52a9cadfd
180 changes: 160 additions & 20 deletions src/timepicker/test/timepicker.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@ describe('timepicker directive', function () {

function newTime(hours, minutes) {
var time = new Date();
time.setHours(hours);
time.setMinutes(minutes);
time.setHours(hours, minutes, 0, 0);
return time;
}

Expand Down Expand Up @@ -1125,35 +1124,71 @@ describe('timepicker directive', function () {
expect(getModelState()).toEqual([14, 37]);
});

it('should not increase hours when time would rollover', function() {
it('should not increase hours when time would rollover to a time earlier than min', function() {
var up = getHoursButton(true);
var inputs = element.find('input');
var hoursEl = inputs.eq(0);
var upMouseWheelEvent = wheelThatMouse(1);
var upKeydownEvent = keydown('up');

$rootScope.time = newTime(23, 0);
$rootScope.time = newTime(23, 59);
$rootScope.min = newTime(13, 40);
$rootScope.$digest();

expect(up.hasClass('disabled')).toBe(true);

doClick(up);
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);

hoursEl.trigger( upMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);

hoursEl.trigger( upKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);
});

it('should increase hours when time would rollover to a time not earlier than min', function() {
var up = getHoursButton(true);
var inputs = element.find('input');
var hoursEl = inputs.eq(0);
var upMouseWheelEvent = wheelThatMouse(1);
var upKeydownEvent = keydown('up');

$rootScope.min = newTime(0, 0);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

expect(up.hasClass('disabled')).toBe(false);

doClick(up);
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

hoursEl.trigger( upMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

hoursEl.trigger( upKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);
});

it('should not increase minutes when time would rollover', function() {

it('should not increase minutes when time would rollover to a time earlier than min', function() {
var up = getMinutesButton(true);
var inputs = element.find('input');
var minutessEl = inputs.eq(1);
Expand Down Expand Up @@ -1181,6 +1216,41 @@ describe('timepicker directive', function () {
expect(getModelState()).toEqual([23, 59]);
});

it('should increase minutes when time would rollover to a time not earlier than min', function() {
var up = getMinutesButton(true);
var inputs = element.find('input');
var minutessEl = inputs.eq(1);
var upMouseWheelEvent = wheelThatMouse(1);
var upKeydownEvent = keydown('up');

$rootScope.min = newTime(0, 0);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

expect(up.hasClass('disabled')).toBe(false);

doClick(up);
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

minutessEl.trigger( upMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);

$rootScope.time = newTime(23, 59);
$rootScope.$digest();

minutessEl.trigger( upKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);
});

it('should not change meridian when it would result a in time earlier than min', function() {
var button = getMeridianButton();

Expand Down Expand Up @@ -1382,35 +1452,70 @@ describe('timepicker directive', function () {
expect(getModelState()).toEqual([14, 43]);
});

it('should not decrease hours when time would rollover', function() {
it('should not decrease hours when time would rollover to a time later than max', function() {
var down = getHoursButton(false);
var inputs = element.find('input');
var hoursEl = inputs.eq(0);
var downMouseWheelEvent = wheelThatMouse(-1);
var downKeydownEvent = keydown('down');

$rootScope.time = newTime(0, 59);
$rootScope.time = newTime(0, 0);
$rootScope.max = newTime(13, 40);
$rootScope.$digest();

expect(down.hasClass('disabled')).toBe(true);

doClick(down);
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);

hoursEl.trigger( downMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);

hoursEl.trigger( downKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['12', '59', 'AM']);
expect(getModelState()).toEqual([0, 59]);
expect(getTimeState()).toEqual(['12', '00', 'AM']);
expect(getModelState()).toEqual([0, 0]);
});

it('should not decrease minutes when time would rollover', function() {
it('should decrease hours when time would rollover to a time not later than max', function() {
var down = getHoursButton(false);
var inputs = element.find('input');
var hoursEl = inputs.eq(0);
var downMouseWheelEvent = wheelThatMouse(-1);
var downKeydownEvent = keydown('down');

$rootScope.max = newTime(23, 59);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

expect(down.hasClass('disabled')).toBe(false);

doClick(down);
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

hoursEl.trigger( downMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

hoursEl.trigger( downKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '00', 'PM']);
expect(getModelState()).toEqual([23, 0]);
});

it('should not decrease minutes when time would rollover to a time later than max', function() {
var down = getMinutesButton(false);
var inputs = element.find('input');
var minutessEl = inputs.eq(1);
Expand Down Expand Up @@ -1438,6 +1543,41 @@ describe('timepicker directive', function () {
expect(getModelState()).toEqual([0, 0]);
});

it('should decrease minutes when time would rollover to a time not later than max', function() {
var down = getMinutesButton(false);
var inputs = element.find('input');
var minutessEl = inputs.eq(1);
var downMouseWheelEvent = wheelThatMouse(-1);
var downKeydownEvent = keydown('down');

$rootScope.max = newTime(23, 59);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

expect(down.hasClass('disabled')).toBe(false);

doClick(down);
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

minutessEl.trigger( downMouseWheelEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);

$rootScope.time = newTime(0, 0);
$rootScope.$digest();

minutessEl.trigger( downKeydownEvent );
$rootScope.$digest();
expect(getTimeState()).toEqual(['11', '59', 'PM']);
expect(getModelState()).toEqual([23, 59]);
});

it('should not change meridian when it would result a in time later than max', function() {
var button = getMeridianButton();

Expand Down
8 changes: 4 additions & 4 deletions src/timepicker/timepicker.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,22 +69,22 @@ angular.module('ui.bootstrap.timepicker', [])

$scope.noIncrementHours = function() {
var incrementedSelected = addMinutes( selected, hourStep * 60 );
return incrementedSelected > max || (min && incrementedSelected < selected);
return incrementedSelected > max || (incrementedSelected < selected && incrementedSelected < min);
};

$scope.noDecrementHours = function() {
var decrementedSelected = addMinutes( selected, - hourStep * 60 );
return decrementedSelected < min || (max && decrementedSelected > selected);
return decrementedSelected < min || (decrementedSelected > selected && decrementedSelected > max);
};

$scope.noIncrementMinutes = function() {
var incrementedSelected = addMinutes( selected, minuteStep );
return incrementedSelected > max || (min && incrementedSelected < selected);
return incrementedSelected > max || (incrementedSelected < selected && incrementedSelected < min);
};

$scope.noDecrementMinutes = function() {
var decrementedSelected = addMinutes( selected, - minuteStep );
return decrementedSelected < min || (max && decrementedSelected > selected);
return decrementedSelected < min || (decrementedSelected > selected && decrementedSelected > max);
};

$scope.noToggleMeridian = function() {
Expand Down