From 3032076e2ebbb8b14ee0e7fe955462ca26c84a54 Mon Sep 17 00:00:00 2001 From: Simon Wade Date: Fri, 17 Aug 2012 11:06:23 +1000 Subject: [PATCH 1/5] Added methods to enforce date range limits. --- jquery-ui-timepicker-addon.js | 105 ++++++++++++++++++++++++++++++++++ 1 file changed, 105 insertions(+) diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js index 8d5a107..5bc1234 100644 --- a/jquery-ui-timepicker-addon.js +++ b/jquery-ui-timepicker-addon.js @@ -1527,4 +1527,109 @@ var timeZoneString = function(date) $.timepicker = new Timepicker(); // singleton instance $.timepicker.version = "1.0.1"; +/** + * Calls `timepicker()` on the `startTime` and `endTime` elements, and configures them to + * enforce date range limits. + * n.b. The input value must be correctly formatted (reformatting is not supported) + * @param Element startTime + * @param Element endTime + * @param obj options Options for the timepicker() call + * @return jQuery + */ +$.timepicker.timeRange = function( startTime, endTime, options ) { + return $.timepicker.handleRange('timepicker', startTime, endTime, options); +} + +/** + * Calls `datetimepicker` on the `startTime` and `endTime` elements, and configures them to + * enforce date range limits. + * @param Element startTime + * @param Element endTime + * @param obj options Options for the `timepicker()` call. Also supports `reformat`, + * a boolean value that can be used to reformat the input values to the `dateFormat`. + * @param string method Can be used to specify the type of picker to be added + * @return jQuery + */ +$.timepicker.dateTimeRange = function( startTime, endTime, options ) { + $.timepicker.dateRange(startTime, endTime, options, 'datetimepicker'); +} + +/** + * Calls `method` on the `startTime` and `endTime` elements, and configures them to + * enforce date range limits. + * @param Element startTime + * @param Element endTime + * @param obj options Options for the `timepicker()` call. Also supports `reformat`, + * a boolean value that can be used to reformat the input values to the `dateFormat`. + * @param string method Can be used to specify the type of picker to be added + * @return jQuery + */ +$.timepicker.dateRange = function( startTime, endTime, options, method ) { + method = method || 'datepicker'; + $.timepicker.handleRange(method, startTime, endTime, options); +} + +/** + * Calls `method` on the `startTime` and `endTime` elements, and configures them to + * enforce date range limits. + * @param string method Can be used to specify the type of picker to be added + * @param Element startTime + * @param Element endTime + * @param obj options Options for the `timepicker()` call. Also supports `reformat`, + * a boolean value that can be used to reformat the input values to the `dateFormat`. + * @return jQuery + */ +$.timepicker.handleRange = function( method, startTime, endTime, options ) { + $.fn[method].call(startTime, $.extend({}, { + onClose: function(dateText, inst) { + checkDates(this, endTime, dateText); + }, + onSelect: function (selectedDateTime) { + selected(this, endTime, 'minDate'); + } + }, options) + ); + $.fn[method].call(endTime, $.extend({}, { + onClose: function(dateText, inst) { + checkDates(this, startTime, dateText); + }, + onSelect: function (selectedDateTime) { + selected(this, startTime, 'maxDate'); + } + }, options) + ); + // timepicker doesn't provide access to its 'timeFormat' option, + // nor could I get datepicker.formatTime() to behave with times, so I + // have disabled reformatting for timepicker + if( method != 'timepicker' && options.reformat ) { + $([startTime, endTime]).each(function() { + var format = $(this)[method].call($(this), 'option', 'dateFormat'), + date = new Date($(this).val()); + if( $(this).val() && date ) { + $(this).val($.datepicker.formatDate(format, date)); + } + }); + } + checkDates(startTime, endTime, startTime.val()); + function checkDates(changed, other, dateText) { + if( other.val() && (new Date(startTime.val()) > new Date(endTime.val())) ) { + other.val(dateText); + } + } + selected(startTime, endTime, 'minDate'); + selected(endTime, startTime, 'maxDate'); + function selected(changed, other, option) { + if( !$(changed).val() ) { + return; + } + var date = $(changed)[method].call($(changed), 'getDate'); + // timepicker doesn't implement 'getDate' and returns a jQuery + if( date.getTime ) { + $(other)[method].call($(other), 'option', option, date); + } + } + return $([startTime.get(0), endTime.get(0)]); +}; + + })(jQuery); From 971e0b98eb13ea4e4832d2e1a6668d19fe82b642 Mon Sep 17 00:00:00 2001 From: Simon Wade Date: Wed, 29 Aug 2012 01:47:53 +1000 Subject: [PATCH 2/5] - Added support for specifying a defaultValue that will be used when the text input fires a focus event and has an empty value - Added support for providing separate options for the start and end inputs in the range methods using "start" and "end" properties in the options object --- jquery-ui-timepicker-addon.js | 27 ++++++++++++++++++++++----- 1 file changed, 22 insertions(+), 5 deletions(-) diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js index 5bc1234..ccc2bdd 100644 --- a/jquery-ui-timepicker-addon.js +++ b/jquery-ui-timepicker-addon.js @@ -95,7 +95,8 @@ function Timepicker() { timezoneIso8601: false, timezoneList: null, addSliderAccess: false, - sliderAccessArgs: null + sliderAccessArgs: null, + defaultValue: null, }; $.extend(this._defaults, this.regional['']); } @@ -742,6 +743,22 @@ $.extend(Timepicker.prototype, { // on time change is also called when the time is updated in the text field //######################################################################## _onTimeChange: function() { + if( !this.$input.val() && this._defaults.defaultValue ) { + this.$input.val(this._defaults.defaultValue); + var inst = $.datepicker._getInst(this.$input.get(0)), + tp_inst = $.datepicker._get(inst, 'timepicker'); + if (tp_inst) { + if (tp_inst._defaults.timeOnly && (inst.input.val() != inst.lastVal)) { + try { + $.datepicker._updateDatepicker(inst); + } + catch (err) { + $.datepicker.log(err); + } + } + } + } + var hour = (this.hour_slider) ? this.hour_slider.slider('value') : false, minute = (this.minute_slider) ? this.minute_slider.slider('value') : false, second = (this.second_slider) ? this.second_slider.slider('value') : false, @@ -1580,23 +1597,23 @@ $.timepicker.dateRange = function( startTime, endTime, options, method ) { * @return jQuery */ $.timepicker.handleRange = function( method, startTime, endTime, options ) { - $.fn[method].call(startTime, $.extend({}, { + $.fn[method].call(startTime, $.extend({ onClose: function(dateText, inst) { checkDates(this, endTime, dateText); }, onSelect: function (selectedDateTime) { selected(this, endTime, 'minDate'); } - }, options) + }, options, options.start) ); - $.fn[method].call(endTime, $.extend({}, { + $.fn[method].call(endTime, $.extend({ onClose: function(dateText, inst) { checkDates(this, startTime, dateText); }, onSelect: function (selectedDateTime) { selected(this, startTime, 'maxDate'); } - }, options) + }, options, options.end) ); // timepicker doesn't provide access to its 'timeFormat' option, // nor could I get datepicker.formatTime() to behave with times, so I From 9b89846d2c527824d71e4fb7159632ea11881a06 Mon Sep 17 00:00:00 2001 From: Simon Wade Date: Wed, 29 Aug 2012 01:50:22 +1000 Subject: [PATCH 3/5] Fixed trailing comma --- jquery-ui-timepicker-addon.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js index ccc2bdd..5f43ebf 100644 --- a/jquery-ui-timepicker-addon.js +++ b/jquery-ui-timepicker-addon.js @@ -96,7 +96,7 @@ function Timepicker() { timezoneList: null, addSliderAccess: false, sliderAccessArgs: null, - defaultValue: null, + defaultValue: null }; $.extend(this._defaults, this.regional['']); } From 70c676c8072f2155c709e8d4c94269a7e0bff7e3 Mon Sep 17 00:00:00 2001 From: Simon Wade Date: Wed, 29 Aug 2012 02:13:39 +1000 Subject: [PATCH 4/5] Changed to only set defaultValue on focus to allow user to unset the input value --- jquery-ui-timepicker-addon.js | 38 ++++++++++++++++++++--------------- 1 file changed, 22 insertions(+), 16 deletions(-) diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js index 5f43ebf..b416354 100644 --- a/jquery-ui-timepicker-addon.js +++ b/jquery-ui-timepicker-addon.js @@ -231,6 +231,10 @@ $.extend(Timepicker.prototype, { if(tp_inst._defaults.maxDateTime !== undefined && tp_inst._defaults.maxDateTime instanceof Date) { tp_inst._defaults.maxDate = new Date(tp_inst._defaults.maxDateTime.getTime()); } + tp_inst.$input.bind('focus', function() { + tp_inst._onFocus(); + }); + return tp_inst; }, @@ -743,22 +747,6 @@ $.extend(Timepicker.prototype, { // on time change is also called when the time is updated in the text field //######################################################################## _onTimeChange: function() { - if( !this.$input.val() && this._defaults.defaultValue ) { - this.$input.val(this._defaults.defaultValue); - var inst = $.datepicker._getInst(this.$input.get(0)), - tp_inst = $.datepicker._get(inst, 'timepicker'); - if (tp_inst) { - if (tp_inst._defaults.timeOnly && (inst.input.val() != inst.lastVal)) { - try { - $.datepicker._updateDatepicker(inst); - } - catch (err) { - $.datepicker.log(err); - } - } - } - } - var hour = (this.hour_slider) ? this.hour_slider.slider('value') : false, minute = (this.minute_slider) ? this.minute_slider.slider('value') : false, second = (this.second_slider) ? this.second_slider.slider('value') : false, @@ -872,6 +860,24 @@ $.extend(Timepicker.prototype, { } this.$input.trigger("change"); + }, + + _onFocus: function() { + if( !this.$input.val() && this._defaults.defaultValue ) { + this.$input.val(this._defaults.defaultValue); + var inst = $.datepicker._getInst(this.$input.get(0)), + tp_inst = $.datepicker._get(inst, 'timepicker'); + if (tp_inst) { + if (tp_inst._defaults.timeOnly && (inst.input.val() != inst.lastVal)) { + try { + $.datepicker._updateDatepicker(inst); + } + catch (err) { + $.datepicker.log(err); + } + } + } + } } }); From f5532ee9cb815d87af0036cbf14f83b4a00946e6 Mon Sep 17 00:00:00 2001 From: Simon Wade Date: Tue, 4 Sep 2012 10:00:05 +1000 Subject: [PATCH 5/5] Handled lowercase 'AM' specified in defaultValue --- jquery-ui-timepicker-addon.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js index b416354..b28adcd 100644 --- a/jquery-ui-timepicker-addon.js +++ b/jquery-ui-timepicker-addon.js @@ -993,7 +993,7 @@ $.datepicker.parseTime = function(timeFormat, timeString, options) { ampm = ''; resTime.ampm = ''; } else { - ampm = $.inArray(treg[order.t], o.amNames) !== -1 ? 'AM' : 'PM'; + ampm = $.inArray(treg[order.t].toUpperCase(), o.amNames) !== -1 ? 'AM' : 'PM'; resTime.ampm = o[ampm == 'AM' ? 'amNames' : 'pmNames'][0]; } }