11&&(e=c.pmNames[0]),d=d.replace(/(?:HH?|hh?|mm?|ss?|[tT]{1,2}|[zZ]|[lc]|'.*?')/g,function(a){switch(a){case"HH":return("0"+f).slice(-2);case"H":return f;case"hh":return("0"+convert24to12(f)).slice(-2);case"h":return convert24to12(f);case"mm":return("0"+b.minute).slice(-2);case"m":return b.minute;case"ss":return("0"+b.second).slice(-2);case"s":return b.second;case"l":return("00"+b.millisec).slice(-3);case"c":return("00"+b.microsec).slice(-3);case"z":return $.timepicker.timezoneOffsetString(null===b.timezone?c.timezone:b.timezone,!1);case"Z":return $.timepicker.timezoneOffsetString(null===b.timezone?c.timezone:b.timezone,!0);case"T":return e.charAt(0).toUpperCase();case"TT":return e.toUpperCase();case"t":return e.charAt(0).toLowerCase();case"tt":return e.toLowerCase();default:return a.replace(/'/g,"")}})},$.datepicker._base_selectDate=$.datepicker._selectDate,$.datepicker._selectDate=function(a,b){var c,d=this._getInst($(a)[0]),e=this._get(d,"timepicker");e&&d.settings.showTimepicker?(e._limitMinMaxDateTime(d,!0),c=d.inline,d.inline=d.stay_open=!0,this._base_selectDate(a,b),d.inline=c,d.stay_open=!1,this._notifyChange(d),this._updateDatepicker(d)):this._base_selectDate(a,b)},$.datepicker._base_updateDatepicker=$.datepicker._updateDatepicker,$.datepicker._updateDatepicker=function(a){var b=a.input[0];if(!($.datepicker._curInst&&$.datepicker._curInst!==a&&$.datepicker._datepickerShowing&&$.datepicker._lastInput!==b||"boolean"==typeof a.stay_open&&a.stay_open!==!1)){this._base_updateDatepicker(a);var c=this._get(a,"timepicker");c&&c._addTimePicker(a)}},$.datepicker._base_doKeyPress=$.datepicker._doKeyPress,$.datepicker._doKeyPress=function(a){var b=$.datepicker._getInst(a.target),c=$.datepicker._get(b,"timepicker");if(c&&$.datepicker._get(b,"constrainInput")){var d=c.support.ampm,e=null!==c._defaults.showTimezone?c._defaults.showTimezone:c.support.timezone,f=$.datepicker._possibleChars($.datepicker._get(b,"dateFormat")),g=c._defaults.timeFormat.toString().replace(/[hms]/g,"").replace(/TT/g,d?"APM":"").replace(/Tt/g,d?"AaPpMm":"").replace(/tT/g,d?"AaPpMm":"").replace(/T/g,d?"AP":"").replace(/tt/g,d?"apm":"").replace(/t/g,d?"ap":"")+" "+c._defaults.separator+c._defaults.timeSuffix+(e?c._defaults.timezoneList.join(""):"")+c._defaults.amNames.join("")+c._defaults.pmNames.join("")+f,h=String.fromCharCode(void 0===a.charCode?a.keyCode:a.charCode);return a.ctrlKey||" ">h||!f||g.indexOf(h)>-1}return $.datepicker._base_doKeyPress(a)},$.datepicker._base_updateAlternate=$.datepicker._updateAlternate,$.datepicker._updateAlternate=function(a){var b=this._get(a,"timepicker");if(b){var c=b._defaults.altField;if(c){var d=(b._defaults.altFormat||b._defaults.dateFormat,this._getDate(a)),e=$.datepicker._getFormatConfig(a),f="",g=b._defaults.altSeparator?b._defaults.altSeparator:b._defaults.separator,h=b._defaults.altTimeSuffix?b._defaults.altTimeSuffix:b._defaults.timeSuffix,i=null!==b._defaults.altTimeFormat?b._defaults.altTimeFormat:b._defaults.timeFormat;f+=$.datepicker.formatTime(i,b,b._defaults)+h,b._defaults.timeOnly||b._defaults.altFieldTimeOnly||null===d||(f=b._defaults.altFormat?$.datepicker.formatDate(b._defaults.altFormat,d,e)+g+f:b.formattedDate+g+f),$(c).val(a.input.val()?f:"")}}else $.datepicker._base_updateAlternate(a)},$.datepicker._base_doKeyUp=$.datepicker._doKeyUp,$.datepicker._doKeyUp=function(a){var b=$.datepicker._getInst(a.target),c=$.datepicker._get(b,"timepicker");
+if(c&&c._defaults.timeOnly&&b.input.val()!==b.lastVal)try{$.datepicker._updateDatepicker(b)}catch(d){$.timepicker.log(d)}return $.datepicker._base_doKeyUp(a)},$.datepicker._base_gotoToday=$.datepicker._gotoToday,$.datepicker._gotoToday=function(a){var b=this._getInst($(a)[0]);this._base_gotoToday(a);var c=this._get(b,"timepicker");if(c){var d=$.timepicker.timezoneOffsetNumber(c.timezone),e=new Date;e.setMinutes(e.getMinutes()+e.getTimezoneOffset()+parseInt(d,10)),this._setTime(b,e),this._setDate(b,e),c._onSelectHandler()}},$.datepicker._disableTimepickerDatepicker=function(a){var b=this._getInst(a);if(b){var c=this._get(b,"timepicker");$(a).datepicker("getDate"),c&&(b.settings.showTimepicker=!1,c._defaults.showTimepicker=!1,c._updateDateTime(b))}},$.datepicker._enableTimepickerDatepicker=function(a){var b=this._getInst(a);if(b){var c=this._get(b,"timepicker");$(a).datepicker("getDate"),c&&(b.settings.showTimepicker=!0,c._defaults.showTimepicker=!0,c._addTimePicker(b),c._updateDateTime(b))}},$.datepicker._setTime=function(a,b){var c=this._get(a,"timepicker");if(c){var d=c._defaults;c.hour=b?b.getHours():d.hour,c.minute=b?b.getMinutes():d.minute,c.second=b?b.getSeconds():d.second,c.millisec=b?b.getMilliseconds():d.millisec,c.microsec=b?b.getMicroseconds():d.microsec,c._limitMinMaxDateTime(a,!0),c._onTimeChange(),c._updateDateTime(a)}},$.datepicker._setTimeDatepicker=function(a,b,c){var d=this._getInst(a);if(d){var e=this._get(d,"timepicker");if(e){this._setDateFromField(d);var f;b&&("string"==typeof b?(e._parseTime(b,c),f=new Date,f.setHours(e.hour,e.minute,e.second,e.millisec),f.setMicroseconds(e.microsec)):(f=new Date(b.getTime()),f.setMicroseconds(b.getMicroseconds())),"Invalid Date"===f.toString()&&(f=void 0),this._setTime(d,f))}}},$.datepicker._base_setDateDatepicker=$.datepicker._setDateDatepicker,$.datepicker._setDateDatepicker=function(a,b){var c=this._getInst(a),d=b;if(c){"string"==typeof b&&(d=new Date(b),d.getTime()||(this._base_setDateDatepicker.apply(this,arguments),d=$(a).datepicker("getDate")));var e,f=this._get(c,"timepicker");d instanceof Date?(e=new Date(d.getTime()),e.setMicroseconds(d.getMicroseconds())):e=d,f&&e&&(f.support.timezone||null!==f._defaults.timezone||(f.timezone=-1*e.getTimezoneOffset()),d=$.timepicker.timezoneAdjust(d,$.timepicker.timezoneOffsetString(-d.getTimezoneOffset()),f.timezone),e=$.timepicker.timezoneAdjust(e,$.timepicker.timezoneOffsetString(-e.getTimezoneOffset()),f.timezone)),this._updateDatepicker(c),this._base_setDateDatepicker.apply(this,arguments),this._setTimeDatepicker(a,e,!0)}},$.datepicker._base_getDateDatepicker=$.datepicker._getDateDatepicker,$.datepicker._getDateDatepicker=function(a,b){var c=this._getInst(a);if(c){var d=this._get(c,"timepicker");if(d){void 0===c.lastVal&&this._setDateFromField(c,b);var e=this._getDate(c),f=null;return f=d.$altInput&&d._defaults.altFieldTimeOnly?d.$input.val()+" "+d.$altInput.val():"INPUT"!==d.$input.get(0).tagName&&d.$altInput?d.$altInput.val():d.$input.val(),e&&d._parseTime(f,!c.settings.timeOnly)&&(e.setHours(d.hour,d.minute,d.second,d.millisec),e.setMicroseconds(d.microsec),null!=d.timezone&&(d.support.timezone||null!==d._defaults.timezone||(d.timezone=-1*e.getTimezoneOffset()),e=$.timepicker.timezoneAdjust(e,d.timezone,$.timepicker.timezoneOffsetString(-e.getTimezoneOffset())))),e}return this._base_getDateDatepicker(a,b)}},$.datepicker._base_parseDate=$.datepicker.parseDate,$.datepicker.parseDate=function(a,b,c){var d;try{d=this._base_parseDate(a,b,c)}catch(e){if(!(e.indexOf(":")>=0))throw e;d=this._base_parseDate(a,b.substring(0,b.length-(e.length-e.indexOf(":")-2)),c),$.timepicker.log("Error parsing the date string: "+e+"\ndate string = "+b+"\ndate format = "+a)}return d},$.datepicker._base_formatDate=$.datepicker._formatDate,$.datepicker._formatDate=function(a,b,c,d){var e=this._get(a,"timepicker");return e?(e._updateDateTime(a),e.$input.val()):this._base_formatDate(a)},$.datepicker._base_optionDatepicker=$.datepicker._optionDatepicker,$.datepicker._optionDatepicker=function(a,b,c){var d,e=this._getInst(a);if(!e)return null;var f=this._get(e,"timepicker");if(f){var g,h,i,j,k=null,l=null,m=null,n=f._defaults.evnts,o={};if("string"==typeof b){if("minDate"===b||"minDateTime"===b)k=c;else if("maxDate"===b||"maxDateTime"===b)l=c;else if("onSelect"===b)m=c;else if(n.hasOwnProperty(b)){if("undefined"==typeof c)return n[b];o[b]=c,d={}}}else if("object"==typeof b){b.minDate?k=b.minDate:b.minDateTime?k=b.minDateTime:b.maxDate?l=b.maxDate:b.maxDateTime&&(l=b.maxDateTime);for(g in n)n.hasOwnProperty(g)&&b[g]&&(o[g]=b[g])}for(g in o)o.hasOwnProperty(g)&&(n[g]=o[g],d||(d=$.extend({},b)),delete d[g]);if(d&&isEmptyObject(d))return;if(k?(k=0===k?new Date:new Date(k),f._defaults.minDate=k,f._defaults.minDateTime=k):l?(l=0===l?new Date:new Date(l),f._defaults.maxDate=l,f._defaults.maxDateTime=l):m&&(f._defaults.onSelect=m),k||l)return j=$(a),i=j.datetimepicker("getDate"),h=this._base_optionDatepicker.call($.datepicker,a,d||b,c),j.datetimepicker("setDate",i),h}return void 0===c?this._base_optionDatepicker.call($.datepicker,a,b):this._base_optionDatepicker.call($.datepicker,a,d||b,c)};var isEmptyObject=function(a){var b;for(b in a)if(a.hasOwnProperty(b))return!1;return!0},extendRemove=function(a,b){$.extend(a,b);for(var c in b)(null===b[c]||void 0===b[c])&&(a[c]=b[c]);return a},detectSupport=function(a){var b=a.replace(/'.*?'/g,"").toLowerCase(),c=function(a,b){return-1!==a.indexOf(b)?!0:!1};return{hour:c(b,"h"),minute:c(b,"m"),second:c(b,"s"),millisec:c(b,"l"),microsec:c(b,"c"),timezone:c(b,"z"),ampm:c(b,"t")&&c(a,"h"),iso8601:c(a,"Z")}},convert24to12=function(a){return a%=12,0===a&&(a=12),String(a)},computeEffectiveSetting=function(a,b){return a&&a[b]?a[b]:$.timepicker._defaults[b]},splitDateTime=function(a,b){var c=computeEffectiveSetting(b,"separator"),d=computeEffectiveSetting(b,"timeFormat"),e=d.split(c),f=e.length,g=a.split(c),h=g.length;return h>1?{dateString:g.splice(0,h-f).join(c),timeString:g.splice(0,f).join(c)}:{dateString:a,timeString:""}},parseDateTimeInternal=function(a,b,c,d,e){var f,g,h;if(g=splitDateTime(c,e),f=$.datepicker._base_parseDate(a,g.dateString,d),""===g.timeString)return{date:f};if(h=$.datepicker.parseTime(b,g.timeString,e),!h)throw"Wrong time format";return{date:f,timeObj:h}},selectLocalTimezone=function(a,b){if(a&&a.timezone_select){var c=b||new Date;a.timezone_select.val(-c.getTimezoneOffset())}};$.timepicker=new Timepicker,$.timepicker.timezoneOffsetString=function(a,b){if(isNaN(a)||a>840||-720>a)return a;var c=a,d=c%60,e=(c-d)/60,f=b?":":"",g=(c>=0?"+":"-")+("0"+Math.abs(e)).slice(-2)+f+("0"+Math.abs(d)).slice(-2);return"+00:00"===g?"Z":g},$.timepicker.timezoneOffsetNumber=function(a){var b=a.toString().replace(":","");return"Z"===b.toUpperCase()?0:/^(\-|\+)\d{4}$/.test(b)?("-"===b.substr(0,1)?-1:1)*(60*parseInt(b.substr(1,2),10)+parseInt(b.substr(3,2),10)):parseInt(a,10)},$.timepicker.timezoneAdjust=function(a,b,c){var d=$.timepicker.timezoneOffsetNumber(b),e=$.timepicker.timezoneOffsetNumber(c);return isNaN(e)||a.setMinutes(a.getMinutes()+-d- -e),a},$.timepicker.timeRange=function(a,b,c){return $.timepicker.handleRange("timepicker",a,b,c)},$.timepicker.datetimeRange=function(a,b,c){$.timepicker.handleRange("datetimepicker",a,b,c)},$.timepicker.dateRange=function(a,b,c){$.timepicker.handleRange("datepicker",a,b,c)},$.timepicker.handleRange=function(a,b,c,d){function e(e,f){var g=b[a]("getDate"),h=c[a]("getDate"),i=e[a]("getDate");if(null!==g){var j=new Date(g.getTime()),k=new Date(g.getTime());j.setMilliseconds(j.getMilliseconds()+d.minInterval),k.setMilliseconds(k.getMilliseconds()+d.maxInterval),d.minInterval>0&&j>h?c[a]("setDate",j):d.maxInterval>0&&h>k?c[a]("setDate",k):g>h&&f[a]("setDate",i)}}function f(b,c,e){if(b.val()){var f=b[a].call(b,"getDate");null!==f&&d.minInterval>0&&("minDate"===e&&f.setMilliseconds(f.getMilliseconds()+d.minInterval),"maxDate"===e&&f.setMilliseconds(f.getMilliseconds()-d.minInterval)),f.getTime&&c[a].call(c,"option",e,f)}}d=$.extend({},{minInterval:0,maxInterval:0,start:{},end:{}},d);var g=!1;return"timepicker"===a&&(g=!0,a="datetimepicker"),$.fn[a].call(b,$.extend({timeOnly:g,onClose:function(a,b){e($(this),c)},onSelect:function(a){f($(this),c,"minDate")}},d,d.start)),$.fn[a].call(c,$.extend({timeOnly:g,onClose:function(a,c){e($(this),b)},onSelect:function(a){f($(this),b,"maxDate")}},d,d.end)),e(b,c),f(b,c,"minDate"),f(c,b,"maxDate"),$([b.get(0),c.get(0)])},$.timepicker.log=function(){window.console&&window.console.log&&window.console.log.apply&&window.console.log.apply(window.console,Array.prototype.slice.call(arguments))},$.timepicker._util={_extendRemove:extendRemove,_isEmptyObject:isEmptyObject,_convert24to12:convert24to12,_detectSupport:detectSupport,_selectLocalTimezone:selectLocalTimezone,_computeEffectiveSetting:computeEffectiveSetting,_splitDateTime:splitDateTime,_parseDateTimeInternal:parseDateTimeInternal},Date.prototype.getMicroseconds||(Date.prototype.microseconds=0,Date.prototype.getMicroseconds=function(){return this.microseconds},Date.prototype.setMicroseconds=function(a){return this.setMilliseconds(this.getMilliseconds()+Math.floor(a/1e3)),this.microseconds=a%1e3,this}),$.timepicker.version="1.6.3"}});
\ No newline at end of file
diff --git a/jquery-ui-timepicker-addon.json b/jquery-ui-timepicker-addon.json
index dff0de3..6d41321 100644
--- a/jquery-ui-timepicker-addon.json
+++ b/jquery-ui-timepicker-addon.json
@@ -2,8 +2,8 @@
"name": "jquery-ui-timepicker-addon",
"title": "jQuery Timepicker Addon",
"description": "A timepicker addon for jQueryUI datepicker.",
- "version": "1.4.5",
- "modified": "2014-05-26",
+ "version": "1.6.3",
+ "modified": "2016-04-20",
"homepage": "http://trentrichardson.com/examples/timepicker",
"author": {
"name": "Trent Richardson",
@@ -25,4 +25,4 @@
"jquery": "*"
},
"keywords": []
-}
\ No newline at end of file
+}
diff --git a/package.json b/package.json
index 8b61dc2..81e0e6d 100644
--- a/package.json
+++ b/package.json
@@ -1,17 +1,35 @@
{
- "name": "jQuery-Timepicker-Addon",
- "version": "0.0.0-ignored",
+ "name": "jquery-ui-timepicker-addon",
+ "version": "1.6.3",
"engines": {
"node": ">= 0.8.0"
},
+ "keywords": [
+ "timepicker", "jquery", "datetime", "jquery-ui"
+ ],
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/trentrichardson/jQuery-Timepicker-Addon.git"
+ },
+ "licenses": [
+ {
+ "type": "MIT",
+ "url": "https://raw.github.com/trentrichardson/jQuery-Timepicker-Addon/master/LICENSE-MIT"
+ }
+ ],
+ "homepage": "http://trentrichardson.com/examples/timepicker",
+ "main": "./dist/jquery-ui-timepicker-addon.js",
+ "browser": "./dist/jquery-ui-timepicker-addon.js",
"scripts": {
- "test": "grunt jasmine"
+ "start": "grunt",
+ "test": "grunt test"
},
+ "dependencies": {},
"devDependencies": {
"grunt-contrib-jshint": "~0.1.1",
"grunt-contrib-jasmine": "~0.5.1",
"grunt-contrib-concat": "~0.4.0",
- "grunt-contrib-uglify": "~0.1.1",
+ "grunt-contrib-uglify": "~0.9.1",
"grunt-contrib-watch": "~0.2.0",
"grunt-contrib-clean": "~0.4.0",
"grunt-contrib-copy": "~0.4.0",
@@ -19,4 +37,4 @@
"grunt-replace": "~0.4.4",
"grunt": "~0.4.1"
}
-}
\ No newline at end of file
+}
diff --git a/src/.jshintrc b/src/.jshintrc
index d3d850f..a624e4c 100644
--- a/src/.jshintrc
+++ b/src/.jshintrc
@@ -13,5 +13,5 @@
"boss": true,
"eqnull": true,
"browser": true,
- "predef": ["jQuery"]
+ "predef": ["jQuery","define"]
}
diff --git a/src/docs/examples.html b/src/docs/examples.html
index 77dd2ef..fa112d1 100644
--- a/src/docs/examples.html
+++ b/src/docs/examples.html
@@ -9,7 +9,9 @@ Examples
Using Timezones Slider Modifications Alternate Fields Time Input Time Restraints Time Ranges Utilities Basic Initializations
+
+
+
+
Timepicker comes with a collection of localization files and one combined file with all available localizations. $.timepicker.regional["your localization code here"] is a simple object with preset options:
+
+
+
+$('#basic_example_4').timepicker(
+ $.timepicker.regional['es']
+);
+
+
Using Timezones
@@ -82,27 +98,6 @@ Using Timezones
{ value: -480, label: 'Pacific' }
]
});
-
-
-
-
-
-
You may also use timezone string abbreviations for values. This should be used with caution. Computing accurate javascript Date objects may not be possible when trying to retrieve or set the date from timepicker (see setDate and getDate examples below). For simple input values however this should work.
-
-
-
-$('#timezone_example_3').datetimepicker({
- timeFormat: 'HH:mm z',
- timezone: 'MT',
- timezoneList: [
- { value: 'ET', label: 'Eastern'},
- { value: 'CT', label: 'Central' },
- { value: 'MT', label: 'Mountain' },
- { value: 'PT', label: 'Pacific' }
- ]
-});
-
Slider Modifications
});
+
+
+
Uses one line dropdowns instead of sliders.
+
+
+
+$('#slider_example_4andHalf').datetimepicker({
+ controlType: 'select',
+ oneLine: true,
+ timeFormat: 'hh:mm tt'
+});
+
Create your own control by implementing the create, options, and value methods. If you want to use your new control for all instances use the $.timepicker.setDefaults({controlType:myControl}). Here we implement jQueryUI's spinner control (jQueryUI 1.9+).
@@ -258,7 +267,7 @@
Alternate Fields
});
-
+
With inline mode using altField:
@@ -271,6 +280,38 @@
Alternate Fields
altField: "#alt_example_4_alt",
altFieldTimeOnly: false
});
+
+
+
+
+
+
+
+
Allows time displayed inside the picker to allow being typed in.
+
+
+
+$('#input_example_1').datetimepicker({
+ timeInput: true,
+ timeFormat: "hh:mm tt"
+});
+
+
+
Don't show any sliders, only the time input.
+
+
+
+$('#input_example_2').datetimepicker({
+ timeInput: true,
+ timeFormat: "hh:mm tt",
+ showHour: false,
+ showMinute: false
+});
Time Restraints
+
+ Time Ranges
+
+
+
+
+
Timepicker also includes some shortcut methods for ranges:
+
+
+
+var startDateTextBox = $('#range_example_2_start');
+var endDateTextBox = $('#range_example_2_end');
+
+$.timepicker.datetimeRange(
+ startDateTextBox,
+ endDateTextBox,
+ {
+ minInterval: (1000*60*60), // 1hr
+ dateFormat: 'dd M yy',
+ timeFormat: 'HH:mm',
+ start: {}, // start picker options
+ end: {} // end picker options
+ }
+);
+
+
+
To use only times for a time range use $.timepicker.timeRange():
+
+
+
+var startTimeTextBox = $('#range_example_3_start');
+var endTimeTextBox = $('#range_example_3_end');
+
+$.timepicker.timeRange(
+ startTimeTextBox,
+ endTimeTextBox,
+ {
+ minInterval: (1000*60*60), // 1hr
+ timeFormat: 'HH:mm',
+ start: {}, // start picker options
+ end: {} // end picker options
+ }
+);
+
+
Utilities
$.datepicker.parseTime('HH:mm:ss:l z', "14:36:21:765 +2000", {})
));
-
-
-
\ No newline at end of file
+
diff --git a/src/docs/footer.html b/src/docs/footer.html
index 738157d..919cf65 100644
--- a/src/docs/footer.html
+++ b/src/docs/footer.html
@@ -5,8 +5,9 @@
-
+
+
-
-
+ -->
\ No newline at end of file
diff --git a/src/docs/header.html b/src/docs/header.html
index 87a0836..b9747b2 100644
--- a/src/docs/header.html
+++ b/src/docs/header.html
@@ -1,12 +1,12 @@
-
-
-
+
+
+
Adding a Timepicker to jQuery UI Datepicker
+ Adding a Timepicker to jQuery UI Datepicker
-
Adding a Timepicker to jQuery UI Datepicker
-
+
Adding a Timepicker to jQuery UI Datepicker
+
The timepicker addon adds a timepicker to jQuery UI Datepicker, thus the datepicker and slider components (jQueryUI) are required for using any of these. In addition all datepicker options are still available through the timepicker addon.
-
+
If you are interested in contributing to Timepicker Addon please check it out on GitHub . If you do make additions please keep in mind I enjoy tabs over spaces,.. But contributions are welcome in any form.
-
+
Back to Blog or Follow on Twitter
-
-
Donation
Has this Timepicker Addon been helpful to you?
@@ -72,4 +70,4 @@
Donation
Formatting Localization Examples
-
\ No newline at end of file
+
diff --git a/src/docs/i18n.html b/src/docs/i18n.html
index 377252a..bd05ccf 100644
--- a/src/docs/i18n.html
+++ b/src/docs/i18n.html
@@ -19,7 +19,8 @@
Working with Localizations
closeText: 'Закрыть'
});
-
However, if you plan to use timepicker extensively you will need to include (build your own) localization. It is simply assigning those same variables to an object. As you see in the example below we maintain a separate object for timepicker. This way we aren't bound to any changes within datepicker.
+
However, if you plan to use timepicker extensively you will need to include (build your own) localization. It is simply assigning those same variables to an object.
+
As you see in the example below we maintain a separate object for timepicker. This way we aren't bound to any future changes within datepicker.
$.datepicker.regional['ru'] = {
closeText: 'Закрыть',
@@ -60,6 +61,12 @@ Working with Localizations
};
$.timepicker.setDefaults($.timepicker.regional['ru']);
+
Now all you have to do is call timepicker and the Russian localization is used. Generally you only need to include the localization file, it will setDefaults() for you.
-
You can also visit localization for datepicker for more information about datepicker localizations.
+
As of version 1.4.5 a combined file of all localizations available is included. This file DOES NOT call setDefaults(), so you will need to pass, or merge with your options.
+
+
$('#example123').timepicker($.timepicker.regional['ru']);
+
+
+
Localization files for datepicker are typically available in your jQueryUI downloads.
Subscribe to Blog and Twitter
Download
- Download Timepicker Addon
+ Download Timepicker Addon and the required CSS .
+
Download/Contribute on GitHub (Need the entire repo? Find a bug? See if its fixed here)
- There is a small bit of required CSS (Download ):
-/* css for timepicker */
-.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
-.ui-timepicker-div dl { text-align: left; }
-.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
-.ui-timepicker-div dl dd { margin: 0 10px 10px 45%; }
-.ui-timepicker-div td { font-size: 90%; }
-.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
-
-.ui-timepicker-rtl{ direction: rtl; }
-.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
-.ui-timepicker-rtl dl dt{ float: right; clear: right; }
-.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }
-
+
+ If you prefer a hosted CDN there are a couple available: CDNJS , jsDelivr .
Requirements
diff --git a/src/docs/options.html b/src/docs/options.html
index 22fc123..06201ce 100644
--- a/src/docs/options.html
+++ b/src/docs/options.html
@@ -202,13 +202,19 @@ Other Options
showButtonPanel
Default: true - Whether to show the button panel at the bottom. This is generally needed.timeInput
+ Default: false - Allows direct input in time fieldtimeOnly
Default: false - Hide the datepicker and only provide a time interface.timeOnlyShowDate
Default: false - Show the date and time in the input, but only allow the timepicker.afterInject
+ Default: null - Function to be called when the timepicker or selection control is injected or re-rendered. Called in the context of the timepicker instance.onSelect
Default: null - Function to be called when a date is chosen or time has changed (parameters: datetimeText, datepickerInstance).Other Options
showTimepicker
Default: true - Whether to show the timepicker within the datepicker.oneLine
+ Default: false - Try to show the time dropdowns all on one line. This should be used with controlType 'select' and as few units as possible.addSliderAccess
Default: false - Adds the sliderAccess plugin to sliders within timepicker' + '' + o.timeText + ' ' +
- '' + '' + o.timeText + ' ' +
+ '' + o[litem + 'Text'] + ' ' +
- '
';
+ html += '' + o[litem + 'Text'] + ' ' +
+ '
';
if (show && o[litem + 'Grid'] > 0) {
html += '';
@@ -412,11 +431,11 @@
}
html += '';
}
-
+
// Timezone
var showTz = o.showTimezone !== null ? o.showTimezone : this.support.timezone;
- html += '' + o.timezoneText + ' ';
- html += '' + o.timezoneText + ' ';
+ html += 'tempMaxTime.getHours()) {
- this.hour=this._defaults.hourMax=tempMaxTime.getHours();
+ this.hour=this._defaults.hourMax=tempMaxTime.getHours();
+ this.minute=this._defaults.minuteMax=tempMaxTime.getMinutes();
+ } else if (this.hour===tempMaxTime.getHours() && this.minute>tempMaxTime.getMinutes()) {
this.minute=this._defaults.minuteMax=tempMaxTime.getMinutes();
- } else if (this.hour===tempMaxTime.getHours() && this.minute>tempMaxTime.getMinutes()) {
- this.minute=this._defaults.minuteMax=tempMaxTime.getMinutes();
} else {
if (this._defaults.hourMax>tempMaxTime.getHours()) {
this._defaults.hourMax=tempMaxTime.getHours();
- this._defaults.minuteMax=tempMaxTime.getMinutes();
+ this._defaults.minuteMax=tempMaxTime.getMinutes();
} else if (this._defaults.hourMax===tempMaxTime.getHours()===this.hour && this._defaults.minuteMax>tempMaxTime.getMinutes()) {
- this._defaults.minuteMax=tempMaxTime.getMinutes();
+ this._defaults.minuteMax=tempMaxTime.getMinutes();
} else {
this._defaults.minuteMax=59;
}
- }
+ }
}
-
+
if (adjustSliders !== undefined && adjustSliders === true) {
var hourMax = parseInt((this._defaults.hourMax - ((this._defaults.hourMax - this._defaults.hourMin) % this._defaults.stepHour)), 10),
minMax = parseInt((this._defaults.minuteMax - ((this._defaults.minuteMax - this._defaults.minuteMin) % this._defaults.stepMinute)), 10),
@@ -806,11 +840,11 @@
// If the update was done using the sliders, update the input field.
var hasChanged = (
hour !== parseInt(this.hour,10) || // sliders should all be numeric
- minute !== parseInt(this.minute,10) ||
- second !== parseInt(this.second,10) ||
- millisec !== parseInt(this.millisec,10) ||
- microsec !== parseInt(this.microsec,10) ||
- (this.ampm.length > 0 && (hour < 12) !== ($.inArray(this.ampm.toUpperCase(), this.amNames) !== -1)) ||
+ minute !== parseInt(this.minute,10) ||
+ second !== parseInt(this.second,10) ||
+ millisec !== parseInt(this.millisec,10) ||
+ microsec !== parseInt(this.microsec,10) ||
+ (this.ampm.length > 0 && (hour < 12) !== ($.inArray(this.ampm.toUpperCase(), this.amNames) !== -1)) ||
(this.timezone !== null && timezone !== this.timezone.toString()) // could be numeric or "EST" format, so use toString()
);
@@ -849,10 +883,15 @@
this.formattedTime = $.datepicker.formatTime(o.timeFormat, this, o);
if (this.$timeObj) {
if (pickerTimeFormat === o.timeFormat) {
- this.$timeObj.text(this.formattedTime + pickerTimeSuffix);
+ this.$timeObj.val(this.formattedTime + pickerTimeSuffix);
}
else {
- this.$timeObj.text($.datepicker.formatTime(pickerTimeFormat, this, o) + pickerTimeSuffix);
+ this.$timeObj.val($.datepicker.formatTime(pickerTimeFormat, this, o) + pickerTimeSuffix);
+ }
+ if (this.$timeObj[0].setSelectionRange) {
+ var sPos = this.$timeObj[0].selectionStart;
+ var ePos = this.$timeObj[0].selectionEnd;
+ this.$timeObj[0].setSelectionRange(sPos, ePos);
}
}
@@ -880,8 +919,8 @@
*/
_updateDateTime: function (dp_inst) {
dp_inst = this.inst || dp_inst;
- var dtTmp = (dp_inst.currentYear > 0?
- new Date(dp_inst.currentYear, dp_inst.currentMonth, dp_inst.currentDay) :
+ var dtTmp = (dp_inst.currentYear > 0?
+ new Date(dp_inst.currentYear, dp_inst.currentMonth, dp_inst.currentDay) :
new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay)),
dt = $.datepicker._daylightSavingAdjust(dtTmp),
//dt = $.datepicker._daylightSavingAdjust(new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay)),
@@ -891,7 +930,7 @@
timeAvailable = dt !== null && this.timeDefined;
this.formattedDate = $.datepicker.formatDate(dateFmt, (dt === null ? new Date() : dt), formatCfg);
var formattedDateTime = this.formattedDate;
-
+
// if a slider was changed but datepicker doesn't have a value yet, set it
if (dp_inst.lastVal === "") {
dp_inst.currentYear = dp_inst.selectedYear;
@@ -901,7 +940,7 @@
/*
* remove following lines to force every changes in date picker to change the input value
- * Bug descriptions: when an input field has a default value, and click on the field to pop up the date picker.
+ * Bug descriptions: when an input field has a default value, and click on the field to pop up the date picker.
* If the user manually empty the value in the input field, the date picker will never change selected value.
*/
//if (dp_inst.lastVal !== undefined && (dp_inst.lastVal.length > 0 && this.$input.val().length === 0)) {
@@ -926,7 +965,7 @@
var altFormattedDateTime = '',
altSeparator = this._defaults.altSeparator !== null ? this._defaults.altSeparator : this._defaults.separator,
altTimeSuffix = this._defaults.altTimeSuffix !== null ? this._defaults.altTimeSuffix : this._defaults.timeSuffix;
-
+
if (!this._defaults.timeOnly) {
if (this._defaults.altFormat) {
altFormattedDateTime = $.datepicker.formatDate(this._defaults.altFormat, (dt === null ? new Date() : dt), formatCfg);
@@ -993,7 +1032,7 @@
stop: function (event, ui) {
tp_inst._onSelectHandler();
}
- });
+ });
},
options: function (tp_inst, obj, unit, opts, val) {
if (tp_inst._defaults.isRTL) {
@@ -1006,7 +1045,7 @@
}
return obj.slider(opts);
}
- var min = opts.min,
+ var min = opts.min,
max = opts.max;
opts.min = opts.max = null;
if (min !== undefined) {
@@ -1038,7 +1077,7 @@
// select methods
select: {
create: function (tp_inst, obj, unit, val, min, max, step) {
- var sel = '',
+ var sel = '',
format = tp_inst._defaults.pickerTimeFormat || tp_inst._defaults.timeFormat;
for (var i = min; i <= max; i += step) {
@@ -1057,6 +1096,7 @@
$(sel).appendTo(obj).change(function (e) {
tp_inst._onTimeChange();
tp_inst._onSelectHandler();
+ tp_inst._afterInject();
});
return obj;
@@ -1068,10 +1108,10 @@
if (val === undefined) {
return $t.data(opts);
}
- o[opts] = val;
+ o[opts] = val;
}
else { o = opts; }
- return tp_inst.control.create(tp_inst, obj, $t.data('unit'), $t.val(), o.min || $t.data('min'), o.max || $t.data('max'), o.step || $t.data('step'));
+ return tp_inst.control.create(tp_inst, obj, $t.data('unit'), $t.val(), o.min>=0 ? o.min : $t.data('min'), o.max || $t.data('max'), o.step || $t.data('step'));
},
value: function (tp_inst, obj, unit, val) {
var $t = obj.children('select');
@@ -1235,7 +1275,7 @@
ampm = '';
resTime.ampm = '';
} else {
- ampm = $.inArray(treg[order.t].toUpperCase(), o.amNames) !== -1 ? 'AM' : 'PM';
+ ampm = $.inArray(treg[order.t].toUpperCase(), $.map(o.amNames, function (x,i) { return x.toUpperCase(); })) !== -1 ? 'AM' : 'PM';
resTime.ampm = o[ampm === 'AM' ? 'amNames' : 'pmNames'][0];
}
}
@@ -1303,11 +1343,11 @@
}
catch (err2) {
$.timepicker.log("Unable to parse \ntimeString: " + s + "\ntimeFormat: " + f);
- }
+ }
}
return false;
}; // end looseParse
-
+
if (typeof o.parse === "function") {
return o.parse(timeFormat, timeString, o);
}
@@ -1393,14 +1433,17 @@
$.datepicker._base_selectDate = $.datepicker._selectDate;
$.datepicker._selectDate = function (id, dateStr) {
var inst = this._getInst($(id)[0]),
- tp_inst = this._get(inst, 'timepicker');
+ tp_inst = this._get(inst, 'timepicker'),
+ was_inline;
if (tp_inst && inst.settings.showTimepicker) {
tp_inst._limitMinMaxDateTime(inst, true);
+ was_inline = inst.inline;
inst.inline = inst.stay_open = true;
//This way the onSelect handler called from calendarpicker get the full dateTime
this._base_selectDate(id, dateStr);
- inst.inline = inst.stay_open = false;
+ inst.inline = was_inline;
+ inst.stay_open = false;
this._notifyChange(inst);
this._updateDatepicker(inst);
} else {
@@ -1453,11 +1496,11 @@
.replace(/tT/g, ampm ? 'AaPpMm' : '')
.replace(/T/g, ampm ? 'AP' : '')
.replace(/tt/g, ampm ? 'apm' : '')
- .replace(/t/g, ampm ? 'ap' : '') +
- " " + tp_inst._defaults.separator +
- tp_inst._defaults.timeSuffix +
- (tz ? tp_inst._defaults.timezoneList.join('') : '') +
- (tp_inst._defaults.amNames.join('')) + (tp_inst._defaults.pmNames.join('')) +
+ .replace(/t/g, ampm ? 'ap' : '') +
+ " " + tp_inst._defaults.separator +
+ tp_inst._defaults.timeSuffix +
+ (tz ? tp_inst._defaults.timezoneList.join('') : '') +
+ (tp_inst._defaults.amNames.join('')) + (tp_inst._defaults.pmNames.join('')) +
dateChars,
chr = String.fromCharCode(event.charCode === undefined ? event.keyCode : event.charCode);
return event.ctrlKey || (chr < ' ' || !dateChars || datetimeChars.indexOf(chr) > -1);
@@ -1480,11 +1523,11 @@
var altFormat = tp_inst._defaults.altFormat || tp_inst._defaults.dateFormat,
date = this._getDate(inst),
formatCfg = $.datepicker._getFormatConfig(inst),
- altFormattedDateTime = '',
- altSeparator = tp_inst._defaults.altSeparator ? tp_inst._defaults.altSeparator : tp_inst._defaults.separator,
+ altFormattedDateTime = '',
+ altSeparator = tp_inst._defaults.altSeparator ? tp_inst._defaults.altSeparator : tp_inst._defaults.separator,
altTimeSuffix = tp_inst._defaults.altTimeSuffix ? tp_inst._defaults.altTimeSuffix : tp_inst._defaults.timeSuffix,
altTimeFormat = tp_inst._defaults.altTimeFormat !== null ? tp_inst._defaults.altTimeFormat : tp_inst._defaults.timeFormat;
-
+
altFormattedDateTime += $.datepicker.formatTime(altTimeFormat, tp_inst, tp_inst._defaults) + altTimeSuffix;
if (!tp_inst._defaults.timeOnly && !tp_inst._defaults.altFieldTimeOnly && date !== null) {
if (tp_inst._defaults.altFormat) {
@@ -1498,7 +1541,7 @@
}
}
else {
- $.datepicker._base_updateAlternate(inst);
+ $.datepicker._base_updateAlternate(inst);
}
};
@@ -1524,18 +1567,23 @@
};
/*
- * override "Today" button to also grab the time.
+ * override "Today" button to also grab the time and set it to input field.
*/
$.datepicker._base_gotoToday = $.datepicker._gotoToday;
$.datepicker._gotoToday = function (id) {
- var inst = this._getInst($(id)[0]),
- $dp = inst.dpDiv;
+ var inst = this._getInst($(id)[0]);
this._base_gotoToday(id);
var tp_inst = this._get(inst, 'timepicker');
- selectLocalTimezone(tp_inst);
+ if (!tp_inst) {
+ return;
+ }
+
+ var tzoffset = $.timepicker.timezoneOffsetNumber(tp_inst.timezone);
var now = new Date();
+ now.setMinutes(now.getMinutes() + now.getTimezoneOffset() + parseInt(tzoffset, 10));
this._setTime(inst, now);
- $('.ui-datepicker-today', $dp).click();
+ this._setDate(inst, now);
+ tp_inst._onSelectHandler();
};
/*
@@ -1587,7 +1635,7 @@
tp_inst.millisec = date ? date.getMilliseconds() : defaults.millisec;
tp_inst.microsec = date ? date.getMicroseconds() : defaults.microsec;
- //check if within min/max times..
+ //check if within min/max times..
tp_inst._limitMinMaxDateTime(inst, true);
tp_inst._onTimeChange();
@@ -1655,9 +1703,9 @@
} else {
tp_date = date;
}
-
- // This is important if you are using the timezone option, javascript's Date
- // object will only return the timezone offset for the current locale, so we
+
+ // This is important if you are using the timezone option, javascript's Date
+ // object will only return the timezone offset for the current locale, so we
// adjust it accordingly. If not using timezone option this won't matter..
// If a timezone is different in tp, keep the timezone as is
if (tp_inst && tp_date) {
@@ -1665,8 +1713,8 @@
if (!tp_inst.support.timezone && tp_inst._defaults.timezone === null) {
tp_inst.timezone = tp_date.getTimezoneOffset() * -1;
}
- date = $.timepicker.timezoneAdjust(date, tp_inst.timezone);
- tp_date = $.timepicker.timezoneAdjust(tp_date, tp_inst.timezone);
+ date = $.timepicker.timezoneAdjust(date, $.timepicker.timezoneOffsetString(-date.getTimezoneOffset()), tp_inst.timezone);
+ tp_date = $.timepicker.timezoneAdjust(tp_date, $.timepicker.timezoneOffsetString(-tp_date.getTimezoneOffset()), tp_inst.timezone);
}
this._updateDatepicker(inst);
@@ -1693,19 +1741,39 @@
}
var date = this._getDate(inst);
- if (date && tp_inst._parseTime($(target).val(), tp_inst.timeOnly)) {
+
+ var currDT = null;
+
+ if (tp_inst.$altInput && tp_inst._defaults.altFieldTimeOnly) {
+ currDT = tp_inst.$input.val() + ' ' + tp_inst.$altInput.val();
+ }
+ else if (tp_inst.$input.get(0).tagName !== 'INPUT' && tp_inst.$altInput) {
+ /**
+ * in case the datetimepicker has been applied to a non-input tag for inline UI,
+ * and the user has not configured the plugin to display only time in altInput,
+ * pick current date time from the altInput (and hope for the best, for now, until "ER1" is applied)
+ *
+ * @todo ER1. Since altInput can have a totally difference format, convert it to standard format by reading input format from "altFormat" and "altTimeFormat" option values
+ */
+ currDT = tp_inst.$altInput.val();
+ }
+ else {
+ currDT = tp_inst.$input.val();
+ }
+
+ if (date && tp_inst._parseTime(currDT, !inst.settings.timeOnly)) {
date.setHours(tp_inst.hour, tp_inst.minute, tp_inst.second, tp_inst.millisec);
date.setMicroseconds(tp_inst.microsec);
- // This is important if you are using the timezone option, javascript's Date
- // object will only return the timezone offset for the current locale, so we
+ // This is important if you are using the timezone option, javascript's Date
+ // object will only return the timezone offset for the current locale, so we
// adjust it accordingly. If not using timezone option this won't matter..
if (tp_inst.timezone != null) {
// look out for DST if tz wasn't specified
if (!tp_inst.support.timezone && tp_inst._defaults.timezone === null) {
tp_inst.timezone = date.getTimezoneOffset() * -1;
}
- date = $.timepicker.timezoneAdjust(date, tp_inst.timezone);
+ date = $.timepicker.timezoneAdjust(date, tp_inst.timezone, $.timepicker.timezoneOffsetString(-date.getTimezoneOffset()));
}
}
return date;
@@ -1767,7 +1835,10 @@
onselect = null,
overrides = tp_inst._defaults.evnts,
fns = {},
- prop;
+ prop,
+ ret,
+ oldVal,
+ $target;
if (typeof name === 'string') { // if min/max was set with the string
if (name === 'minDate' || name === 'minDateTime') {
min = value;
@@ -1825,13 +1896,24 @@
} else if (onselect) {
tp_inst._defaults.onSelect = onselect;
}
+
+ // Datepicker will override our date when we call _base_optionDatepicker when
+ // calling minDate/maxDate, so we will first grab the value, call
+ // _base_optionDatepicker, then set our value back.
+ if(min || max){
+ $target = $(target);
+ oldVal = $target.datetimepicker('getDate');
+ ret = this._base_optionDatepicker.call($.datepicker, target, name_clone || name, value);
+ $target.datetimepicker('setDate', oldVal);
+ return ret;
+ }
}
if (value === undefined) {
return this._base_optionDatepicker.call($.datepicker, target, name);
}
return this._base_optionDatepicker.call($.datepicker, target, name_clone || name, value);
};
-
+
/*
* jQuery isEmptyObject does not check hasOwnProperty - if someone has added to the object prototype,
* it will return false for all objects
@@ -1989,7 +2071,7 @@
hours = (off - minutes) / 60,
iso = iso8601 ? ':' : '',
tz = (off >= 0 ? '+' : '-') + ('0' + Math.abs(hours)).slice(-2) + iso + ('0' + Math.abs(minutes)).slice(-2);
-
+
if (tz === '+00:00') {
return 'Z';
}
@@ -2009,7 +2091,7 @@
}
if (!/^(\-|\+)\d{4}$/.test(normalized)) { // possibly a user defined tz, so just give it back
- return tzString;
+ return parseInt(tzString, 10);
}
return ((normalized.substr(0, 1) === '-' ? -1 : 1) * // plus or minus
@@ -2020,13 +2102,15 @@
/**
* No way to set timezone in js Date, so we must adjust the minutes to compensate. (think setDate, getDate)
* @param {Date} date
+ * @param {string} fromTimezone formatted like "+0500", "-1245"
* @param {string} toTimezone formatted like "+0500", "-1245"
* @return {Date}
*/
- $.timepicker.timezoneAdjust = function (date, toTimezone) {
+ $.timepicker.timezoneAdjust = function (date, fromTimezone, toTimezone) {
+ var fromTz = $.timepicker.timezoneOffsetNumber(fromTimezone);
var toTz = $.timepicker.timezoneOffsetNumber(toTimezone);
if (!isNaN(toTz)) {
- date.setMinutes(date.getMinutes() + -date.getTimezoneOffset() - toTz);
+ date.setMinutes(date.getMinutes() + (-fromTz) - (-toTz));
}
return date;
};
@@ -2133,6 +2217,7 @@
date.setMilliseconds(date.getMilliseconds() - options.minInterval);
}
}
+
if (date.getTime) {
other[method].call(other, 'option', option, date);
}
@@ -2158,8 +2243,10 @@
}, options, options.end));
checkDates(startTime, endTime);
+
selected(startTime, endTime, 'minDate');
selected(endTime, startTime, 'maxDate');
+
return $([startTime.get(0), endTime.get(0)]);
};
@@ -2168,9 +2255,10 @@
* @param {Object} err pass any type object to log to the console during error or debugging
* @return {void}
*/
- $.timepicker.log = function (err) {
- if (window.console) {
- window.console.log(err);
+ $.timepicker.log = function () {
+ // Older IE (9, maybe 10) throw error on accessing `window.console.log.apply`, so check first.
+ if (window.console && window.console.log && window.console.log.apply) {
+ window.console.log.apply(window.console, Array.prototype.slice.call(arguments));
}
};
@@ -2206,4 +2294,4 @@
*/
$.timepicker.version = "@@version";
-})(jQuery);
+}));
diff --git a/test/SpecRunner.html b/test/SpecRunner.html
index 9793cc5..b31b2f2 100644
--- a/test/SpecRunner.html
+++ b/test/SpecRunner.html
@@ -3,7 +3,7 @@
jquery-ui-timepicker-addon Spec Runner
-
+
Try my new app to keep you informed of your car's financing status and value.