| | |
| | | CalendarContainer = require('./src/CalendarContainer') |
| | | ; |
| | | |
| | | var viewModes = Object.freeze({ |
| | | YEARS: 'years', |
| | | MONTHS: 'months', |
| | | DAYS: 'days', |
| | | TIME: 'time', |
| | | }); |
| | | |
| | | var TYPES = PropTypes; |
| | | var Datetime = createClass({ |
| | | propTypes: { |
| | | // value: TYPES.object | TYPES.string, |
| | | // defaultValue: TYPES.object | TYPES.string, |
| | | // viewDate: TYPES.object | TYPES.string, |
| | | onFocus: TYPES.func, |
| | | onBlur: TYPES.func, |
| | | onChange: TYPES.func, |
| | |
| | | // timeFormat: TYPES.string | TYPES.bool, |
| | | inputProps: TYPES.object, |
| | | timeConstraints: TYPES.object, |
| | | viewMode: TYPES.oneOf(['years', 'months', 'days', 'time']), |
| | | viewMode: TYPES.oneOf([viewModes.YEARS, viewModes.MONTHS, viewModes.DAYS, viewModes.TIME]), |
| | | isValidDate: TYPES.func, |
| | | open: TYPES.bool, |
| | | strictParsing: TYPES.bool, |
| | | closeOnSelect: TYPES.bool, |
| | | closeOnTab: TYPES.bool |
| | | }, |
| | | |
| | | getDefaultProps: function() { |
| | | var nof = function() {}; |
| | | return { |
| | | className: '', |
| | | defaultValue: '', |
| | | inputProps: {}, |
| | | input: true, |
| | | onFocus: nof, |
| | | onBlur: nof, |
| | | onChange: nof, |
| | | onViewModeChange: nof, |
| | | timeFormat: true, |
| | | timeConstraints: {}, |
| | | dateFormat: true, |
| | | strictParsing: true, |
| | | closeOnSelect: false, |
| | | closeOnTab: true, |
| | | utc: false |
| | | }; |
| | | }, |
| | | |
| | | getInitialState: function() { |
| | |
| | | if ( state.open === undefined ) |
| | | state.open = !this.props.input; |
| | | |
| | | state.currentView = this.props.dateFormat ? (this.props.viewMode || state.updateOn || 'days') : 'time'; |
| | | state.currentView = this.props.dateFormat ? |
| | | (this.props.viewMode || state.updateOn || viewModes.DAYS) : viewModes.TIME; |
| | | |
| | | return state; |
| | | }, |
| | | |
| | | parseDate: function (date, formats) { |
| | | var parsedDate; |
| | | |
| | | if (date && typeof date === 'string') |
| | | parsedDate = this.localMoment(date, formats.datetime); |
| | | else if (date) |
| | | parsedDate = this.localMoment(date); |
| | | |
| | | if (parsedDate && !parsedDate.isValid()) |
| | | parsedDate = null; |
| | | |
| | | return parsedDate; |
| | | }, |
| | | |
| | | getStateFromProps: function( props ) { |
| | |
| | | selectedDate, viewDate, updateOn, inputValue |
| | | ; |
| | | |
| | | if ( date && typeof date === 'string' ) |
| | | selectedDate = this.localMoment( date, formats.datetime ); |
| | | else if ( date ) |
| | | selectedDate = this.localMoment( date ); |
| | | selectedDate = this.parseDate(date, formats); |
| | | |
| | | if ( selectedDate && !selectedDate.isValid() ) |
| | | selectedDate = null; |
| | | viewDate = this.parseDate(props.viewDate, formats); |
| | | |
| | | viewDate = selectedDate ? |
| | | selectedDate.clone().startOf('month') : |
| | | this.localMoment().startOf('month') |
| | | ; |
| | | viewDate ? viewDate.clone().startOf('month') : this.localMoment().startOf('month'); |
| | | |
| | | updateOn = this.getUpdateOn(formats); |
| | | |
| | |
| | | |
| | | getUpdateOn: function( formats ) { |
| | | if ( formats.date.match(/[lLD]/) ) { |
| | | return 'days'; |
| | | return viewModes.DAYS; |
| | | } else if ( formats.date.indexOf('M') !== -1 ) { |
| | | return 'months'; |
| | | return viewModes.MONTHS; |
| | | } else if ( formats.date.indexOf('Y') !== -1 ) { |
| | | return 'years'; |
| | | return viewModes.YEARS; |
| | | } |
| | | |
| | | return 'days'; |
| | | return viewModes.DAYS; |
| | | }, |
| | | |
| | | getFormats: function( props ) { |
| | |
| | | if ( formats.date === true ) { |
| | | formats.date = locale.longDateFormat('L'); |
| | | } |
| | | else if ( this.getUpdateOn(formats) !== 'days' ) { |
| | | else if ( this.getUpdateOn(formats) !== viewModes.DAYS ) { |
| | | formats.time = ''; |
| | | } |
| | | |
| | |
| | | if ( updatedState.open === undefined ) { |
| | | if ( typeof nextProps.open !== 'undefined' ) { |
| | | updatedState.open = nextProps.open; |
| | | } else if ( this.props.closeOnSelect && this.state.currentView !== 'time' ) { |
| | | } else if ( this.props.closeOnSelect && this.state.currentView !== viewModes.TIME ) { |
| | | updatedState.open = false; |
| | | } else { |
| | | updatedState.open = this.state.open; |
| | |
| | | updatedState.inputValue = updatedState.selectedDate.format(formats.datetime); |
| | | } |
| | | } |
| | | } |
| | | |
| | | if ( nextProps.viewDate !== this.props.viewDate ) { |
| | | updatedState.viewDate = moment(nextProps.viewDate); |
| | | } |
| | | //we should only show a valid date if we are provided a isValidDate function. Removed in 2.10.3 |
| | | /*if (this.props.isValidDate) { |
| | |
| | | setDate: function( type ) { |
| | | var me = this, |
| | | nextViews = { |
| | | month: 'days', |
| | | year: 'months' |
| | | month: viewModes.DAYS, |
| | | year: viewModes.MONTHS, |
| | | } |
| | | ; |
| | | return function( e ) { |
| | |
| | | }, |
| | | |
| | | handleClickOutside: function() { |
| | | if ( this.props.input && this.state.open && !this.props.open ) { |
| | | if ( this.props.input && this.state.open && !this.props.open && !this.props.disableOnClickOutside ) { |
| | | this.setState({ open: false }, function() { |
| | | this.props.onBlur( this.state.selectedDate || this.state.inputValue ); |
| | | }); |
| | |
| | | } |
| | | }); |
| | | |
| | | Datetime.defaultProps = { |
| | | className: '', |
| | | defaultValue: '', |
| | | inputProps: {}, |
| | | input: true, |
| | | onFocus: function() {}, |
| | | onBlur: function() {}, |
| | | onChange: function() {}, |
| | | onViewModeChange: function() {}, |
| | | timeFormat: true, |
| | | timeConstraints: {}, |
| | | dateFormat: true, |
| | | strictParsing: true, |
| | | closeOnSelect: false, |
| | | closeOnTab: true, |
| | | utc: false |
| | | }; |
| | | |
| | | // Make moment accessible through the Datetime class |
| | | Datetime.moment = moment; |
| | | |