Merge branch 'master' of https://github.com/gowento/react-datetime into gowento-master

Author: arqex

DateTime.js

@@ -31,6 +31,7 @@ var Datetime = React.createClass({
 		// dateFormat: TYPES.string | TYPES.bool,
 		// timeFormat: TYPES.string | TYPES.bool,
 		inputProps: TYPES.object,
+		timeConstraints: TYPES.object,
 		viewMode: TYPES.oneOf(['years', 'months', 'days', 'time']),
 		isValidDate: TYPES.func,
 		open: TYPES.bool,
@@ -50,6 +51,7 @@ var Datetime = React.createClass({
 			onBlur: nof,
 			onChange: nof,
 			timeFormat: true,
+			timeConstraints: {},
 			dateFormat: true,
 			strictParsing: true,
 			closeOnSelect: false,
@@ -184,7 +186,7 @@ var Datetime = React.createClass({
 	},
 
 	onInputKey: function( e ){
-		if( e.which === 9 && this.props.closeOnTab ){
+		if ( e.which === 9 && this.props.closeOnTab ){
 			this.closeCalendar();
 		}
 	},
@@ -334,7 +336,7 @@ var Datetime = React.createClass({
 	},
 
 	componentProps: {
-		fromProps: ['value', 'isValidDate', 'renderDay', 'renderMonth', 'renderYear'],
+		fromProps: ['value', 'isValidDate', 'renderDay', 'renderMonth', 'renderYear', 'timeConstraints'],
 		fromState: ['viewDate', 'selectedDate', 'updateOn'],
 		fromThis: ['setDate', 'setTime', 'showView', 'addTime', 'subtractTime', 'updateSelectedDate', 'localMoment']
 	},

dist/react-datetime.js

@@ -39,8 +39,10 @@
     "gulp-webpack": "^1.5.0",
     "jsdom": "^7.0.2",
     "mocha": "^2.2.5",
+    "moment": "2.14.1",
     "react": ">=0.13",
     "react-addons-test-utils": ">=0.13",
+    "react-dom": "15.2.1",
     "react-tools": "^0.13.2",
     "webpack": "^1.5.1",
     "webpack-dev-server": "^1.7.0"

dist/react-datetime.min.js

@@ -1,6 +1,7 @@
 'use strict';
 
-var React = require('react');
+var React = require('react'),
+	assign = require('object-assign');
 
 var DOM = React.DOM;
 var DateTimePickerTime = React.createClass({
@@ -89,6 +90,12 @@ var DateTimePickerTime = React.createClass({
 			])
 		);
 	},
+	componentWillMount: function() {
+		var me = this;
+		['hours', 'minutes', 'seconds', 'milliseconds'].forEach(function(type) {
+			assign(me.timeConstraints[type], me.props.timeConstraints[type]);
+		});
+	},
 	componentWillReceiveProps: function( nextProps ){
 		this.setState( this.calculateState( nextProps ) );
 	},
@@ -133,12 +140,27 @@ var DateTimePickerTime = React.createClass({
 			document.body.addEventListener('mouseup', me.mouseUpListener);
 		};
 	},
-
-	maxValues: {
-		hours: 23,
-		minutes: 59,
-		seconds: 59,
-		milliseconds: 999
+	timeConstraints: {
+		hours: {
+			min: 0,
+			max: 23,
+			step: 1
+		},
+		minutes: {
+			min: 0,
+			max: 59,
+			step: 1
+		},
+		seconds: {
+			min: 0,
+			max: 59,
+			step: 1,
+		},
+		milliseconds: {
+			min: 0,
+			max: 999,
+			step: 1
+		}
 	},
 	padValues: {
 		hours: 1,
@@ -147,15 +169,15 @@ var DateTimePickerTime = React.createClass({
 		milliseconds: 3
 	},
 	increase: function( type ){
-		var value = parseInt(this.state[ type ], 10) + 1;
-		if ( value > this.maxValues[ type ] )
-			value = 0;
+		var value = parseInt(this.state[ type ], 10) + this.timeConstraints[ type ].step;
+		if ( value > this.timeConstraints[ type ].max )
+			value = this.timeConstraints[ type ].min + ( value - ( this.timeConstraints[ type ].max  + 1) );
 		return this.pad( type, value );
 	},
 	decrease: function( type ){
-		var value = parseInt(this.state[ type ], 10) - 1;
-		if ( value < 0 )
-			value = this.maxValues[ type ];
+		var value = parseInt(this.state[ type ], 10) - this.timeConstraints[ type ].step;
+		if ( value < this.timeConstraints[ type ].min )
+			value = this.timeConstraints[ type ].max + 1 - ( this.timeConstraints[ type ].min - value );
 		return this.pad( type, value );
 	},
 	pad: function( type, value ){

package.json

@@ -571,6 +571,39 @@ describe( 'Datetime', function(){
 		}, 920 );
 	});
 
+	it( 'increase time with timeConstraints', function( done ){
+		var i = 0;
+		createDatetime({ timeFormat: "HH:mm:ss:SSS", viewMode: 'time', defaultValue: date, onChange: function( selected ){
+			i++;
+			if( i > 2 ){
+				assert.equal( selected.minute(), 17 );
+				assert.equal( selected.second(), 3 );
+				done();
+			}
+		}, timeConstraints: { hours: { max: 6, step: 8 }, minutes: { step: 15 }}});
+
+		trigger( 'mousedown', dt.timeUp( 0 ) );
+		trigger('mouseup', document.body );
+		assert.equal( dt.hour().innerHTML, 3 );
+		trigger( 'mousedown', dt.timeUp( 1 ) );
+		trigger( 'mouseup', dt.timeUp( 1 ) );
+		assert.equal( dt.minute().innerHTML, 17 );
+		trigger( 'mousedown', dt.timeUp( 2 ) );
+		trigger( 'mouseup', dt.timeUp( 2 ) );
+		assert.equal( dt.second().innerHTML, 3 );
+	});
+
+	it( 'decrease time with timeConstraints', function( done ){
+		createDatetime({ timeFormat: "HH:mm:ss:SSS", viewMode: 'time', defaultValue: date, onChange: function( selected ){
+			assert.equal( selected.minute(), 47 );
+			done();
+		}, timeConstraints: { minutes: { step: 15 }}});
+
+		trigger( 'mousedown', dt.timeDown( 1 ) );
+		trigger( 'mouseup', dt.timeDown( 1 ) );
+		assert.equal( dt.minute().innerHTML, 47 );
+	});
+
 	it( 'invalid input value', function( done ){
 		createDatetime({ defaultValue: 'luis', onChange: function( updated ){
 			assert.equal( mDate.format('L LT'), updated.format('L LT') );