jquery-ui-timepicker-addon.js 50 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326
  1. /*
  2. * jQuery timepicker addon
  3. * By: Trent Richardson [http://trentrichardson.com]
  4. * Version 0.9.9
  5. * Last Modified: 02/05/2012
  6. *
  7. * Copyright 2012 Trent Richardson
  8. * Dual licensed under the MIT and GPL licenses.
  9. * http://trentrichardson.com/Impromptu/GPL-LICENSE.txt
  10. * http://trentrichardson.com/Impromptu/MIT-LICENSE.txt
  11. *
  12. * HERES THE CSS:
  13. * .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
  14. * .ui-timepicker-div dl { text-align: left; }
  15. * .ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
  16. * .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
  17. * .ui-timepicker-div td { font-size: 90%; }
  18. * .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
  19. */
  20. (function($) {
  21. $.extend($.ui, { timepicker: { version: "0.9.9" } });
  22. /* Time picker manager.
  23. Use the singleton instance of this class, $.timepicker, to interact with the time picker.
  24. Settings for (groups of) time pickers are maintained in an instance object,
  25. allowing multiple different settings on the same page. */
  26. function Timepicker() {
  27. this.regional = []; // Available regional settings, indexed by language code
  28. this.regional[''] = { // Default regional settings
  29. currentText: 'Now',
  30. closeText: 'Done',
  31. ampm: false,
  32. amNames: ['AM', 'A'],
  33. pmNames: ['PM', 'P'],
  34. timeFormat: 'hh:mm tt',
  35. timeSuffix: '',
  36. timeOnlyTitle: 'Choose Time',
  37. timeText: 'Time',
  38. hourText: 'Hour',
  39. minuteText: 'Minute',
  40. secondText: 'Second',
  41. millisecText: 'Millisecond',
  42. timezoneText: 'Time Zone'
  43. };
  44. this._defaults = { // Global defaults for all the datetime picker instances
  45. showButtonPanel: true,
  46. timeOnly: false,
  47. showHour: true,
  48. showMinute: true,
  49. showSecond: false,
  50. showMillisec: false,
  51. showTimezone: false,
  52. showTime: true,
  53. stepHour: 1,
  54. stepMinute: 1,
  55. stepSecond: 1,
  56. stepMillisec: 1,
  57. hour: 0,
  58. minute: 0,
  59. second: 0,
  60. millisec: 0,
  61. timezone: '+0000',
  62. hourMin: 0,
  63. minuteMin: 0,
  64. secondMin: 0,
  65. millisecMin: 0,
  66. hourMax: 23,
  67. minuteMax: 59,
  68. secondMax: 59,
  69. millisecMax: 999,
  70. minDateTime: null,
  71. maxDateTime: null,
  72. onSelect: null,
  73. hourGrid: 0,
  74. minuteGrid: 0,
  75. secondGrid: 0,
  76. millisecGrid: 0,
  77. alwaysSetTime: true,
  78. separator: ' ',
  79. altFieldTimeOnly: true,
  80. showTimepicker: true,
  81. timezoneIso8609: false,
  82. timezoneList: null,
  83. addSliderAccess: false,
  84. sliderAccessArgs: null
  85. };
  86. $.extend(this._defaults, this.regional['']);
  87. };
  88. $.extend(Timepicker.prototype, {
  89. $input: null,
  90. $altInput: null,
  91. $timeObj: null,
  92. inst: null,
  93. hour_slider: null,
  94. minute_slider: null,
  95. second_slider: null,
  96. millisec_slider: null,
  97. timezone_select: null,
  98. hour: 0,
  99. minute: 0,
  100. second: 0,
  101. millisec: 0,
  102. timezone: '+0000',
  103. hourMinOriginal: null,
  104. minuteMinOriginal: null,
  105. secondMinOriginal: null,
  106. millisecMinOriginal: null,
  107. hourMaxOriginal: null,
  108. minuteMaxOriginal: null,
  109. secondMaxOriginal: null,
  110. millisecMaxOriginal: null,
  111. ampm: '',
  112. formattedDate: '',
  113. formattedTime: '',
  114. formattedDateTime: '',
  115. timezoneList: null,
  116. /* Override the default settings for all instances of the time picker.
  117. @param settings object - the new settings to use as defaults (anonymous object)
  118. @return the manager object */
  119. setDefaults: function(settings) {
  120. extendRemove(this._defaults, settings || {});
  121. return this;
  122. },
  123. //########################################################################
  124. // Create a new Timepicker instance
  125. //########################################################################
  126. _newInst: function($input, o) {
  127. var tp_inst = new Timepicker(),
  128. inlineSettings = {};
  129. for (var attrName in this._defaults) {
  130. var attrValue = $input.attr('time:' + attrName);
  131. if (attrValue) {
  132. try {
  133. inlineSettings[attrName] = eval(attrValue);
  134. } catch (err) {
  135. inlineSettings[attrName] = attrValue;
  136. }
  137. }
  138. }
  139. tp_inst._defaults = $.extend({}, this._defaults, inlineSettings, o, {
  140. beforeShow: function(input, dp_inst) {
  141. if ($.isFunction(o.beforeShow))
  142. return o.beforeShow(input, dp_inst, tp_inst);
  143. },
  144. onChangeMonthYear: function(year, month, dp_inst) {
  145. // Update the time as well : this prevents the time from disappearing from the $input field.
  146. tp_inst._updateDateTime(dp_inst);
  147. if ($.isFunction(o.onChangeMonthYear))
  148. o.onChangeMonthYear.call($input[0], year, month, dp_inst, tp_inst);
  149. },
  150. onClose: function(dateText, dp_inst) {
  151. if (tp_inst.timeDefined === true && $input.val() != '')
  152. tp_inst._updateDateTime(dp_inst);
  153. if ($.isFunction(o.onClose))
  154. o.onClose.call($input[0], dateText, dp_inst, tp_inst);
  155. },
  156. timepicker: tp_inst // add timepicker as a property of datepicker: $.datepicker._get(dp_inst, 'timepicker');
  157. });
  158. tp_inst.amNames = $.map(tp_inst._defaults.amNames, function(val) { return val.toUpperCase() });
  159. tp_inst.pmNames = $.map(tp_inst._defaults.pmNames, function(val) { return val.toUpperCase() });
  160. if (tp_inst._defaults.timezoneList === null) {
  161. var timezoneList = [];
  162. for (var i = -11; i <= 12; i++)
  163. timezoneList.push((i >= 0 ? '+' : '-') + ('0' + Math.abs(i).toString()).slice(-2) + '00');
  164. if (tp_inst._defaults.timezoneIso8609)
  165. timezoneList = $.map(timezoneList, function(val) {
  166. return val == '+0000' ? 'Z' : (val.substring(0, 3) + ':' + val.substring(3));
  167. });
  168. tp_inst._defaults.timezoneList = timezoneList;
  169. }
  170. tp_inst.hour = tp_inst._defaults.hour;
  171. tp_inst.minute = tp_inst._defaults.minute;
  172. tp_inst.second = tp_inst._defaults.second;
  173. tp_inst.millisec = tp_inst._defaults.millisec;
  174. tp_inst.ampm = '';
  175. tp_inst.$input = $input;
  176. if (o.altField)
  177. tp_inst.$altInput = $(o.altField)
  178. .css({ cursor: 'pointer' })
  179. .focus(function(){ $input.trigger("focus"); });
  180. if(tp_inst._defaults.minDate==0 || tp_inst._defaults.minDateTime==0)
  181. {
  182. tp_inst._defaults.minDate=new Date();
  183. }
  184. if(tp_inst._defaults.maxDate==0 || tp_inst._defaults.maxDateTime==0)
  185. {
  186. tp_inst._defaults.maxDate=new Date();
  187. }
  188. // datepicker needs minDate/maxDate, timepicker needs minDateTime/maxDateTime..
  189. if(tp_inst._defaults.minDate !== undefined && tp_inst._defaults.minDate instanceof Date)
  190. tp_inst._defaults.minDateTime = new Date(tp_inst._defaults.minDate.getTime());
  191. if(tp_inst._defaults.minDateTime !== undefined && tp_inst._defaults.minDateTime instanceof Date)
  192. tp_inst._defaults.minDate = new Date(tp_inst._defaults.minDateTime.getTime());
  193. if(tp_inst._defaults.maxDate !== undefined && tp_inst._defaults.maxDate instanceof Date)
  194. tp_inst._defaults.maxDateTime = new Date(tp_inst._defaults.maxDate.getTime());
  195. if(tp_inst._defaults.maxDateTime !== undefined && tp_inst._defaults.maxDateTime instanceof Date)
  196. tp_inst._defaults.maxDate = new Date(tp_inst._defaults.maxDateTime.getTime());
  197. return tp_inst;
  198. },
  199. //########################################################################
  200. // add our sliders to the calendar
  201. //########################################################################
  202. _addTimePicker: function(dp_inst) {
  203. var currDT = (this.$altInput && this._defaults.altFieldTimeOnly) ?
  204. this.$input.val() + ' ' + this.$altInput.val() :
  205. this.$input.val();
  206. this.timeDefined = this._parseTime(currDT);
  207. this._limitMinMaxDateTime(dp_inst, false);
  208. this._injectTimePicker();
  209. },
  210. //########################################################################
  211. // parse the time string from input value or _setTime
  212. //########################################################################
  213. _parseTime: function(timeString, withDate) {
  214. var regstr = this._defaults.timeFormat.toString()
  215. .replace(/h{1,2}/ig, '(\\d?\\d)')
  216. .replace(/m{1,2}/ig, '(\\d?\\d)')
  217. .replace(/s{1,2}/ig, '(\\d?\\d)')
  218. .replace(/l{1}/ig, '(\\d?\\d?\\d)')
  219. .replace(/t{1,2}/ig, this._getPatternAmpm())
  220. .replace(/z{1}/ig, '(z|[-+]\\d\\d:?\\d\\d)?')
  221. .replace(/\s/g, '\\s?') + this._defaults.timeSuffix + '$',
  222. order = this._getFormatPositions(),
  223. ampm = '',
  224. treg;
  225. if (!this.inst) this.inst = $.datepicker._getInst(this.$input[0]);
  226. if (withDate || !this._defaults.timeOnly) {
  227. // the time should come after x number of characters and a space.
  228. // x = at least the length of text specified by the date format
  229. var dp_dateFormat = $.datepicker._get(this.inst, 'dateFormat');
  230. // escape special regex characters in the seperator
  231. var specials = new RegExp("[.*+?|()\\[\\]{}\\\\]", "g");
  232. regstr = '^.{' + dp_dateFormat.length + ',}?' + this._defaults.separator.replace(specials, "\\$&") + regstr;
  233. }
  234. treg = timeString.match(new RegExp(regstr, 'i'));
  235. if (treg) {
  236. if (order.t !== -1) {
  237. if (treg[order.t] === undefined || treg[order.t].length === 0) {
  238. ampm = '';
  239. this.ampm = '';
  240. } else {
  241. ampm = $.inArray(treg[order.t].toUpperCase(), this.amNames) !== -1 ? 'AM' : 'PM';
  242. this.ampm = this._defaults[ampm == 'AM' ? 'amNames' : 'pmNames'][0];
  243. }
  244. }
  245. if (order.h !== -1) {
  246. if (ampm == 'AM' && treg[order.h] == '12')
  247. this.hour = 0; // 12am = 0 hour
  248. else if (ampm == 'PM' && treg[order.h] != '12')
  249. this.hour = (parseFloat(treg[order.h]) + 12).toFixed(0); // 12pm = 12 hour, any other pm = hour + 12
  250. else this.hour = Number(treg[order.h]);
  251. }
  252. if (order.m !== -1) this.minute = Number(treg[order.m]);
  253. if (order.s !== -1) this.second = Number(treg[order.s]);
  254. if (order.l !== -1) this.millisec = Number(treg[order.l]);
  255. if (order.z !== -1 && treg[order.z] !== undefined) {
  256. var tz = treg[order.z].toUpperCase();
  257. switch (tz.length) {
  258. case 1: // Z
  259. tz = this._defaults.timezoneIso8609 ? 'Z' : '+0000';
  260. break;
  261. case 5: // +hhmm
  262. if (this._defaults.timezoneIso8609)
  263. tz = tz.substring(1) == '0000'
  264. ? 'Z'
  265. : tz.substring(0, 3) + ':' + tz.substring(3);
  266. break;
  267. case 6: // +hh:mm
  268. if (!this._defaults.timezoneIso8609)
  269. tz = tz == 'Z' || tz.substring(1) == '00:00'
  270. ? '+0000'
  271. : tz.replace(/:/, '');
  272. else if (tz.substring(1) == '00:00')
  273. tz = 'Z';
  274. break;
  275. }
  276. this.timezone = tz;
  277. }
  278. return true;
  279. }
  280. return false;
  281. },
  282. //########################################################################
  283. // pattern for standard and localized AM/PM markers
  284. //########################################################################
  285. _getPatternAmpm: function() {
  286. var markers = [];
  287. o = this._defaults;
  288. if (o.amNames)
  289. $.merge(markers, o.amNames);
  290. if (o.pmNames)
  291. $.merge(markers, o.pmNames);
  292. markers = $.map(markers, function(val) { return val.replace(/[.*+?|()\[\]{}\\]/g, '\\$&') });
  293. return '(' + markers.join('|') + ')?';
  294. },
  295. //########################################################################
  296. // figure out position of time elements.. cause js cant do named captures
  297. //########################################################################
  298. _getFormatPositions: function() {
  299. var finds = this._defaults.timeFormat.toLowerCase().match(/(h{1,2}|m{1,2}|s{1,2}|l{1}|t{1,2}|z)/g),
  300. orders = { h: -1, m: -1, s: -1, l: -1, t: -1, z: -1 };
  301. if (finds)
  302. for (var i = 0; i < finds.length; i++)
  303. if (orders[finds[i].toString().charAt(0)] == -1)
  304. orders[finds[i].toString().charAt(0)] = i + 1;
  305. return orders;
  306. },
  307. //########################################################################
  308. // generate and inject html for timepicker into ui datepicker
  309. //########################################################################
  310. _injectTimePicker: function() {
  311. var $dp = this.inst.dpDiv,
  312. o = this._defaults,
  313. tp_inst = this,
  314. // Added by Peter Medeiros:
  315. // - Figure out what the hour/minute/second max should be based on the step values.
  316. // - Example: if stepMinute is 15, then minMax is 45.
  317. hourMax = parseInt((o.hourMax - ((o.hourMax - o.hourMin) % o.stepHour)) ,10),
  318. minMax = parseInt((o.minuteMax - ((o.minuteMax - o.minuteMin) % o.stepMinute)) ,10),
  319. secMax = parseInt((o.secondMax - ((o.secondMax - o.secondMin) % o.stepSecond)) ,10),
  320. millisecMax = parseInt((o.millisecMax - ((o.millisecMax - o.millisecMin) % o.stepMillisec)) ,10),
  321. dp_id = this.inst.id.toString().replace(/([^A-Za-z0-9_])/g, '');
  322. // Prevent displaying twice
  323. //if ($dp.find("div#ui-timepicker-div-"+ dp_id).length === 0) {
  324. if ($dp.find("div#ui-timepicker-div-"+ dp_id).length === 0 && o.showTimepicker) {
  325. var noDisplay = ' style="display:none;"',
  326. html = '<div class="ui-timepicker-div" id="ui-timepicker-div-' + dp_id + '"><dl>' +
  327. '<dt class="ui_tpicker_time_label" id="ui_tpicker_time_label_' + dp_id + '"' +
  328. ((o.showTime) ? '' : noDisplay) + '>' + o.timeText + '</dt>' +
  329. '<dd class="ui_tpicker_time" id="ui_tpicker_time_' + dp_id + '"' +
  330. ((o.showTime) ? '' : noDisplay) + '></dd>' +
  331. '<dt class="ui_tpicker_hour_label" id="ui_tpicker_hour_label_' + dp_id + '"' +
  332. ((o.showHour) ? '' : noDisplay) + '>' + o.hourText + '</dt>',
  333. hourGridSize = 0,
  334. minuteGridSize = 0,
  335. secondGridSize = 0,
  336. millisecGridSize = 0,
  337. size;
  338. // Hours
  339. html += '<dd class="ui_tpicker_hour"><div id="ui_tpicker_hour_' + dp_id + '"' +
  340. ((o.showHour) ? '' : noDisplay) + '></div>';
  341. if (o.showHour && o.hourGrid > 0) {
  342. html += '<div style="padding-left: 1px"><table class="ui-tpicker-grid-label"><tr>';
  343. for (var h = o.hourMin; h <= hourMax; h += parseInt(o.hourGrid,10)) {
  344. hourGridSize++;
  345. var tmph = (o.ampm && h > 12) ? h-12 : h;
  346. if (tmph < 10) tmph = '0' + tmph;
  347. if (o.ampm) {
  348. if (h == 0) tmph = 12 +'a';
  349. else if (h < 12) tmph += 'a';
  350. else tmph += 'p';
  351. }
  352. html += '<td>' + tmph + '</td>';
  353. }
  354. html += '</tr></table></div>';
  355. }
  356. html += '</dd>';
  357. // Minutes
  358. html += '<dt class="ui_tpicker_minute_label" id="ui_tpicker_minute_label_' + dp_id + '"' +
  359. ((o.showMinute) ? '' : noDisplay) + '>' + o.minuteText + '</dt>'+
  360. '<dd class="ui_tpicker_minute"><div id="ui_tpicker_minute_' + dp_id + '"' +
  361. ((o.showMinute) ? '' : noDisplay) + '></div>';
  362. if (o.showMinute && o.minuteGrid > 0) {
  363. html += '<div style="padding-left: 1px"><table class="ui-tpicker-grid-label"><tr>';
  364. for (var m = o.minuteMin; m <= minMax; m += parseInt(o.minuteGrid,10)) {
  365. minuteGridSize++;
  366. html += '<td>' + ((m < 10) ? '0' : '') + m + '</td>';
  367. }
  368. html += '</tr></table></div>';
  369. }
  370. html += '</dd>';
  371. // Seconds
  372. html += '<dt class="ui_tpicker_second_label" id="ui_tpicker_second_label_' + dp_id + '"' +
  373. ((o.showSecond) ? '' : noDisplay) + '>' + o.secondText + '</dt>'+
  374. '<dd class="ui_tpicker_second"><div id="ui_tpicker_second_' + dp_id + '"'+
  375. ((o.showSecond) ? '' : noDisplay) + '></div>';
  376. if (o.showSecond && o.secondGrid > 0) {
  377. html += '<div style="padding-left: 1px"><table><tr>';
  378. for (var s = o.secondMin; s <= secMax; s += parseInt(o.secondGrid,10)) {
  379. secondGridSize++;
  380. html += '<td>' + ((s < 10) ? '0' : '') + s + '</td>';
  381. }
  382. html += '</tr></table></div>';
  383. }
  384. html += '</dd>';
  385. // Milliseconds
  386. html += '<dt class="ui_tpicker_millisec_label" id="ui_tpicker_millisec_label_' + dp_id + '"' +
  387. ((o.showMillisec) ? '' : noDisplay) + '>' + o.millisecText + '</dt>'+
  388. '<dd class="ui_tpicker_millisec"><div id="ui_tpicker_millisec_' + dp_id + '"'+
  389. ((o.showMillisec) ? '' : noDisplay) + '></div>';
  390. if (o.showMillisec && o.millisecGrid > 0) {
  391. html += '<div style="padding-left: 1px"><table><tr>';
  392. for (var l = o.millisecMin; l <= millisecMax; l += parseInt(o.millisecGrid,10)) {
  393. millisecGridSize++;
  394. html += '<td>' + ((l < 10) ? '0' : '') + l + '</td>';
  395. }
  396. html += '</tr></table></div>';
  397. }
  398. html += '</dd>';
  399. // Timezone
  400. html += '<dt class="ui_tpicker_timezone_label" id="ui_tpicker_timezone_label_' + dp_id + '"' +
  401. ((o.showTimezone) ? '' : noDisplay) + '>' + o.timezoneText + '</dt>';
  402. html += '<dd class="ui_tpicker_timezone" id="ui_tpicker_timezone_' + dp_id + '"' +
  403. ((o.showTimezone) ? '' : noDisplay) + '></dd>';
  404. html += '</dl></div>';
  405. $tp = $(html);
  406. // if we only want time picker...
  407. if (o.timeOnly === true) {
  408. $tp.prepend(
  409. '<div class="ui-widget-header ui-helper-clearfix ui-corner-all">' +
  410. '<div class="ui-datepicker-title">' + o.timeOnlyTitle + '</div>' +
  411. '</div>');
  412. $dp.find('.ui-datepicker-header, .ui-datepicker-calendar').hide();
  413. }
  414. this.hour_slider = $tp.find('#ui_tpicker_hour_'+ dp_id).slider({
  415. orientation: "horizontal",
  416. value: this.hour,
  417. min: o.hourMin,
  418. max: hourMax,
  419. step: o.stepHour,
  420. slide: function(event, ui) {
  421. tp_inst.hour_slider.slider( "option", "value", ui.value);
  422. tp_inst._onTimeChange();
  423. }
  424. });
  425. // Updated by Peter Medeiros:
  426. // - Pass in Event and UI instance into slide function
  427. this.minute_slider = $tp.find('#ui_tpicker_minute_'+ dp_id).slider({
  428. orientation: "horizontal",
  429. value: this.minute,
  430. min: o.minuteMin,
  431. max: minMax,
  432. step: o.stepMinute,
  433. slide: function(event, ui) {
  434. tp_inst.minute_slider.slider( "option", "value", ui.value);
  435. tp_inst._onTimeChange();
  436. }
  437. });
  438. this.second_slider = $tp.find('#ui_tpicker_second_'+ dp_id).slider({
  439. orientation: "horizontal",
  440. value: this.second,
  441. min: o.secondMin,
  442. max: secMax,
  443. step: o.stepSecond,
  444. slide: function(event, ui) {
  445. tp_inst.second_slider.slider( "option", "value", ui.value);
  446. tp_inst._onTimeChange();
  447. }
  448. });
  449. this.millisec_slider = $tp.find('#ui_tpicker_millisec_'+ dp_id).slider({
  450. orientation: "horizontal",
  451. value: this.millisec,
  452. min: o.millisecMin,
  453. max: millisecMax,
  454. step: o.stepMillisec,
  455. slide: function(event, ui) {
  456. tp_inst.millisec_slider.slider( "option", "value", ui.value);
  457. tp_inst._onTimeChange();
  458. }
  459. });
  460. this.timezone_select = $tp.find('#ui_tpicker_timezone_'+ dp_id).append('<select></select>').find("select");
  461. $.fn.append.apply(this.timezone_select,
  462. $.map(o.timezoneList, function(val, idx) {
  463. return $("<option />")
  464. .val(typeof val == "object" ? val.value : val)
  465. .text(typeof val == "object" ? val.label : val);
  466. })
  467. );
  468. this.timezone_select.val((typeof this.timezone != "undefined" && this.timezone != null && this.timezone != "") ? this.timezone : o.timezone);
  469. this.timezone_select.change(function() {
  470. tp_inst._onTimeChange();
  471. });
  472. // Add grid functionality
  473. if (o.showHour && o.hourGrid > 0) {
  474. size = 100 * hourGridSize * o.hourGrid / (hourMax - o.hourMin);
  475. $tp.find(".ui_tpicker_hour table").css({
  476. width: size + "%",
  477. marginLeft: (size / (-2 * hourGridSize)) + "%",
  478. borderCollapse: 'collapse'
  479. }).find("td").each( function(index) {
  480. $(this).click(function() {
  481. var h = $(this).html();
  482. if(o.ampm) {
  483. var ap = h.substring(2).toLowerCase(),
  484. aph = parseInt(h.substring(0,2), 10);
  485. if (ap == 'a') {
  486. if (aph == 12) h = 0;
  487. else h = aph;
  488. } else if (aph == 12) h = 12;
  489. else h = aph + 12;
  490. }
  491. tp_inst.hour_slider.slider("option", "value", h);
  492. tp_inst._onTimeChange();
  493. tp_inst._onSelectHandler();
  494. }).css({
  495. cursor: 'pointer',
  496. width: (100 / hourGridSize) + '%',
  497. textAlign: 'center',
  498. overflow: 'hidden'
  499. });
  500. });
  501. }
  502. if (o.showMinute && o.minuteGrid > 0) {
  503. size = 100 * minuteGridSize * o.minuteGrid / (minMax - o.minuteMin);
  504. $tp.find(".ui_tpicker_minute table").css({
  505. width: size + "%",
  506. marginLeft: (size / (-2 * minuteGridSize)) + "%",
  507. borderCollapse: 'collapse'
  508. }).find("td").each(function(index) {
  509. $(this).click(function() {
  510. tp_inst.minute_slider.slider("option", "value", $(this).html());
  511. tp_inst._onTimeChange();
  512. tp_inst._onSelectHandler();
  513. }).css({
  514. cursor: 'pointer',
  515. width: (100 / minuteGridSize) + '%',
  516. textAlign: 'center',
  517. overflow: 'hidden'
  518. });
  519. });
  520. }
  521. if (o.showSecond && o.secondGrid > 0) {
  522. $tp.find(".ui_tpicker_second table").css({
  523. width: size + "%",
  524. marginLeft: (size / (-2 * secondGridSize)) + "%",
  525. borderCollapse: 'collapse'
  526. }).find("td").each(function(index) {
  527. $(this).click(function() {
  528. tp_inst.second_slider.slider("option", "value", $(this).html());
  529. tp_inst._onTimeChange();
  530. tp_inst._onSelectHandler();
  531. }).css({
  532. cursor: 'pointer',
  533. width: (100 / secondGridSize) + '%',
  534. textAlign: 'center',
  535. overflow: 'hidden'
  536. });
  537. });
  538. }
  539. if (o.showMillisec && o.millisecGrid > 0) {
  540. $tp.find(".ui_tpicker_millisec table").css({
  541. width: size + "%",
  542. marginLeft: (size / (-2 * millisecGridSize)) + "%",
  543. borderCollapse: 'collapse'
  544. }).find("td").each(function(index) {
  545. $(this).click(function() {
  546. tp_inst.millisec_slider.slider("option", "value", $(this).html());
  547. tp_inst._onTimeChange();
  548. tp_inst._onSelectHandler();
  549. }).css({
  550. cursor: 'pointer',
  551. width: (100 / millisecGridSize) + '%',
  552. textAlign: 'center',
  553. overflow: 'hidden'
  554. });
  555. });
  556. }
  557. var $buttonPanel = $dp.find('.ui-datepicker-buttonpane');
  558. if ($buttonPanel.length) $buttonPanel.before($tp);
  559. else $dp.append($tp);
  560. this.$timeObj = $tp.find('#ui_tpicker_time_'+ dp_id);
  561. if (this.inst !== null) {
  562. var timeDefined = this.timeDefined;
  563. this._onTimeChange();
  564. this.timeDefined = timeDefined;
  565. }
  566. //Emulate datepicker onSelect behavior. Call on slidestop.
  567. var onSelectDelegate = function() {
  568. tp_inst._onSelectHandler();
  569. };
  570. this.hour_slider.bind('slidestop',onSelectDelegate);
  571. this.minute_slider.bind('slidestop',onSelectDelegate);
  572. this.second_slider.bind('slidestop',onSelectDelegate);
  573. this.millisec_slider.bind('slidestop',onSelectDelegate);
  574. // slideAccess integration: http://trentrichardson.com/2011/11/11/jquery-ui-sliders-and-touch-accessibility/
  575. if (this._defaults.addSliderAccess){
  576. var sliderAccessArgs = this._defaults.sliderAccessArgs;
  577. setTimeout(function(){ // fix for inline mode
  578. if($tp.find('.ui-slider-access').length == 0){
  579. $tp.find('.ui-slider:visible').sliderAccess(sliderAccessArgs);
  580. // fix any grids since sliders are shorter
  581. var sliderAccessWidth = $tp.find('.ui-slider-access:eq(0)').outerWidth(true);
  582. if(sliderAccessWidth){
  583. $tp.find('table:visible').each(function(){
  584. var $g = $(this),
  585. oldWidth = $g.outerWidth(),
  586. oldMarginLeft = $g.css('marginLeft').toString().replace('%',''),
  587. newWidth = oldWidth - sliderAccessWidth,
  588. newMarginLeft = ((oldMarginLeft * newWidth)/oldWidth) + '%';
  589. $g.css({ width: newWidth, marginLeft: newMarginLeft });
  590. });
  591. }
  592. }
  593. },0);
  594. }
  595. // end slideAccess integration
  596. }
  597. },
  598. //########################################################################
  599. // This function tries to limit the ability to go outside the
  600. // min/max date range
  601. //########################################################################
  602. _limitMinMaxDateTime: function(dp_inst, adjustSliders){
  603. var o = this._defaults,
  604. dp_date = new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay);
  605. if(!this._defaults.showTimepicker) return; // No time so nothing to check here
  606. if($.datepicker._get(dp_inst, 'minDateTime') !== null && $.datepicker._get(dp_inst, 'minDateTime') !== undefined && dp_date){
  607. var minDateTime = $.datepicker._get(dp_inst, 'minDateTime'),
  608. minDateTimeDate = new Date(minDateTime.getFullYear(), minDateTime.getMonth(), minDateTime.getDate(), 0, 0, 0, 0);
  609. if(this.hourMinOriginal === null || this.minuteMinOriginal === null || this.secondMinOriginal === null || this.millisecMinOriginal === null){
  610. this.hourMinOriginal = o.hourMin;
  611. this.minuteMinOriginal = o.minuteMin;
  612. this.secondMinOriginal = o.secondMin;
  613. this.millisecMinOriginal = o.millisecMin;
  614. }
  615. if(dp_inst.settings.timeOnly || minDateTimeDate.getTime() == dp_date.getTime()) {
  616. this._defaults.hourMin = minDateTime.getHours();
  617. if (this.hour <= this._defaults.hourMin) {
  618. this.hour = this._defaults.hourMin;
  619. this._defaults.minuteMin = minDateTime.getMinutes();
  620. if (this.minute <= this._defaults.minuteMin) {
  621. this.minute = this._defaults.minuteMin;
  622. this._defaults.secondMin = minDateTime.getSeconds();
  623. } else if (this.second <= this._defaults.secondMin){
  624. this.second = this._defaults.secondMin;
  625. this._defaults.millisecMin = minDateTime.getMilliseconds();
  626. } else {
  627. if(this.millisec < this._defaults.millisecMin)
  628. this.millisec = this._defaults.millisecMin;
  629. this._defaults.millisecMin = this.millisecMinOriginal;
  630. }
  631. } else {
  632. this._defaults.minuteMin = this.minuteMinOriginal;
  633. this._defaults.secondMin = this.secondMinOriginal;
  634. this._defaults.millisecMin = this.millisecMinOriginal;
  635. }
  636. }else{
  637. this._defaults.hourMin = this.hourMinOriginal;
  638. this._defaults.minuteMin = this.minuteMinOriginal;
  639. this._defaults.secondMin = this.secondMinOriginal;
  640. this._defaults.millisecMin = this.millisecMinOriginal;
  641. }
  642. }
  643. if($.datepicker._get(dp_inst, 'maxDateTime') !== null && $.datepicker._get(dp_inst, 'maxDateTime') !== undefined && dp_date){
  644. var maxDateTime = $.datepicker._get(dp_inst, 'maxDateTime'),
  645. maxDateTimeDate = new Date(maxDateTime.getFullYear(), maxDateTime.getMonth(), maxDateTime.getDate(), 0, 0, 0, 0);
  646. if(this.hourMaxOriginal === null || this.minuteMaxOriginal === null || this.secondMaxOriginal === null){
  647. this.hourMaxOriginal = o.hourMax;
  648. this.minuteMaxOriginal = o.minuteMax;
  649. this.secondMaxOriginal = o.secondMax;
  650. this.millisecMaxOriginal = o.millisecMax;
  651. }
  652. if(dp_inst.settings.timeOnly || maxDateTimeDate.getTime() == dp_date.getTime()){
  653. this._defaults.hourMax = maxDateTime.getHours();
  654. if (this.hour >= this._defaults.hourMax) {
  655. this.hour = this._defaults.hourMax;
  656. this._defaults.minuteMax = maxDateTime.getMinutes();
  657. if (this.minute >= this._defaults.minuteMax) {
  658. this.minute = this._defaults.minuteMax;
  659. this._defaults.secondMax = maxDateTime.getSeconds();
  660. } else if (this.second >= this._defaults.secondMax) {
  661. this.second = this._defaults.secondMax;
  662. this._defaults.millisecMax = maxDateTime.getMilliseconds();
  663. } else {
  664. if(this.millisec > this._defaults.millisecMax) this.millisec = this._defaults.millisecMax;
  665. this._defaults.millisecMax = this.millisecMaxOriginal;
  666. }
  667. } else {
  668. this._defaults.minuteMax = this.minuteMaxOriginal;
  669. this._defaults.secondMax = this.secondMaxOriginal;
  670. this._defaults.millisecMax = this.millisecMaxOriginal;
  671. }
  672. }else{
  673. this._defaults.hourMax = this.hourMaxOriginal;
  674. this._defaults.minuteMax = this.minuteMaxOriginal;
  675. this._defaults.secondMax = this.secondMaxOriginal;
  676. this._defaults.millisecMax = this.millisecMaxOriginal;
  677. }
  678. }
  679. if(adjustSliders !== undefined && adjustSliders === true){
  680. var hourMax = parseInt((this._defaults.hourMax - ((this._defaults.hourMax - this._defaults.hourMin) % this._defaults.stepHour)) ,10),
  681. minMax = parseInt((this._defaults.minuteMax - ((this._defaults.minuteMax - this._defaults.minuteMin) % this._defaults.stepMinute)) ,10),
  682. secMax = parseInt((this._defaults.secondMax - ((this._defaults.secondMax - this._defaults.secondMin) % this._defaults.stepSecond)) ,10),
  683. millisecMax = parseInt((this._defaults.millisecMax - ((this._defaults.millisecMax - this._defaults.millisecMin) % this._defaults.stepMillisec)) ,10);
  684. if(this.hour_slider)
  685. this.hour_slider.slider("option", { min: this._defaults.hourMin, max: hourMax }).slider('value', this.hour);
  686. if(this.minute_slider)
  687. this.minute_slider.slider("option", { min: this._defaults.minuteMin, max: minMax }).slider('value', this.minute);
  688. if(this.second_slider)
  689. this.second_slider.slider("option", { min: this._defaults.secondMin, max: secMax }).slider('value', this.second);
  690. if(this.millisec_slider)
  691. this.millisec_slider.slider("option", { min: this._defaults.millisecMin, max: millisecMax }).slider('value', this.millisec);
  692. }
  693. },
  694. //########################################################################
  695. // when a slider moves, set the internal time...
  696. // on time change is also called when the time is updated in the text field
  697. //########################################################################
  698. _onTimeChange: function() {
  699. var hour = (this.hour_slider) ? this.hour_slider.slider('value') : false,
  700. minute = (this.minute_slider) ? this.minute_slider.slider('value') : false,
  701. second = (this.second_slider) ? this.second_slider.slider('value') : false,
  702. millisec = (this.millisec_slider) ? this.millisec_slider.slider('value') : false,
  703. timezone = (this.timezone_select) ? this.timezone_select.val() : false,
  704. o = this._defaults;
  705. if (typeof(hour) == 'object') hour = false;
  706. if (typeof(minute) == 'object') minute = false;
  707. if (typeof(second) == 'object') second = false;
  708. if (typeof(millisec) == 'object') millisec = false;
  709. if (typeof(timezone) == 'object') timezone = false;
  710. if (hour !== false) hour = parseInt(hour,10);
  711. if (minute !== false) minute = parseInt(minute,10);
  712. if (second !== false) second = parseInt(second,10);
  713. if (millisec !== false) millisec = parseInt(millisec,10);
  714. var ampm = o[hour < 12 ? 'amNames' : 'pmNames'][0];
  715. // If the update was done in the input field, the input field should not be updated.
  716. // If the update was done using the sliders, update the input field.
  717. var hasChanged = (hour != this.hour || minute != this.minute
  718. || second != this.second || millisec != this.millisec
  719. || (this.ampm.length > 0
  720. && (hour < 12) != ($.inArray(this.ampm.toUpperCase(), this.amNames) !== -1))
  721. || timezone != this.timezone);
  722. if (hasChanged) {
  723. if (hour !== false)this.hour = hour;
  724. if (minute !== false) this.minute = minute;
  725. if (second !== false) this.second = second;
  726. if (millisec !== false) this.millisec = millisec;
  727. if (timezone !== false) this.timezone = timezone;
  728. if (!this.inst) this.inst = $.datepicker._getInst(this.$input[0]);
  729. this._limitMinMaxDateTime(this.inst, true);
  730. }
  731. if (o.ampm) this.ampm = ampm;
  732. //this._formatTime();
  733. this.formattedTime = $.datepicker.formatTime(this._defaults.timeFormat, this, this._defaults);
  734. if (this.$timeObj) this.$timeObj.text(this.formattedTime + o.timeSuffix);
  735. this.timeDefined = true;
  736. if (hasChanged) this._updateDateTime();
  737. },
  738. //########################################################################
  739. // call custom onSelect.
  740. // bind to sliders slidestop, and grid click.
  741. //########################################################################
  742. _onSelectHandler: function() {
  743. var onSelect = this._defaults.onSelect;
  744. var inputEl = this.$input ? this.$input[0] : null;
  745. if (onSelect && inputEl) {
  746. onSelect.apply(inputEl, [this.formattedDateTime, this]);
  747. }
  748. },
  749. //########################################################################
  750. // left for any backwards compatibility
  751. //########################################################################
  752. _formatTime: function(time, format) {
  753. time = time || { hour: this.hour, minute: this.minute, second: this.second, millisec: this.millisec, ampm: this.ampm, timezone: this.timezone };
  754. var tmptime = (format || this._defaults.timeFormat).toString();
  755. tmptime = $.datepicker.formatTime(tmptime, time, this._defaults);
  756. if (arguments.length) return tmptime;
  757. else this.formattedTime = tmptime;
  758. },
  759. //########################################################################
  760. // update our input with the new date time..
  761. //########################################################################
  762. _updateDateTime: function(dp_inst) {
  763. dp_inst = this.inst || dp_inst;
  764. var dt = $.datepicker._daylightSavingAdjust(new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay)),
  765. dateFmt = $.datepicker._get(dp_inst, 'dateFormat'),
  766. formatCfg = $.datepicker._getFormatConfig(dp_inst),
  767. timeAvailable = dt !== null && this.timeDefined;
  768. this.formattedDate = $.datepicker.formatDate(dateFmt, (dt === null ? new Date() : dt), formatCfg);
  769. var formattedDateTime = this.formattedDate;
  770. if (dp_inst.lastVal !== undefined && (dp_inst.lastVal.length > 0 && this.$input.val().length === 0))
  771. return;
  772. if (this._defaults.timeOnly === true) {
  773. formattedDateTime = this.formattedTime;
  774. } else if (this._defaults.timeOnly !== true && (this._defaults.alwaysSetTime || timeAvailable)) {
  775. formattedDateTime += this._defaults.separator + this.formattedTime + this._defaults.timeSuffix;
  776. }
  777. this.formattedDateTime = formattedDateTime;
  778. if(!this._defaults.showTimepicker) {
  779. this.$input.val(this.formattedDate);
  780. } else if (this.$altInput && this._defaults.altFieldTimeOnly === true) {
  781. this.$altInput.val(this.formattedTime);
  782. this.$input.val(this.formattedDate);
  783. } else if(this.$altInput) {
  784. this.$altInput.val(formattedDateTime);
  785. this.$input.val(formattedDateTime);
  786. } else {
  787. this.$input.val(formattedDateTime);
  788. }
  789. this.$input.trigger("change");
  790. }
  791. });
  792. $.fn.extend({
  793. //########################################################################
  794. // shorthand just to use timepicker..
  795. //########################################################################
  796. timepicker: function(o) {
  797. o = o || {};
  798. var tmp_args = arguments;
  799. if (typeof o == 'object') tmp_args[0] = $.extend(o, { timeOnly: true });
  800. return $(this).each(function() {
  801. $.fn.datetimepicker.apply($(this), tmp_args);
  802. });
  803. },
  804. //########################################################################
  805. // extend timepicker to datepicker
  806. //########################################################################
  807. datetimepicker: function(o) {
  808. o = o || {};
  809. var $input = this,
  810. tmp_args = arguments;
  811. if (typeof(o) == 'string'){
  812. if(o == 'getDate')
  813. return $.fn.datepicker.apply($(this[0]), tmp_args);
  814. else
  815. return this.each(function() {
  816. var $t = $(this);
  817. $t.datepicker.apply($t, tmp_args);
  818. });
  819. }
  820. else
  821. return this.each(function() {
  822. var $t = $(this);
  823. $t.datepicker($.timepicker._newInst($t, o)._defaults);
  824. });
  825. }
  826. });
  827. //########################################################################
  828. // format the time all pretty...
  829. // format = string format of the time
  830. // time = a {}, not a Date() for timezones
  831. // options = essentially the regional[].. amNames, pmNames, ampm
  832. //########################################################################
  833. $.datepicker.formatTime = function(format, time, options) {
  834. options = options || {};
  835. options = $.extend($.timepicker._defaults, options);
  836. time = $.extend({hour:0, minute:0, second:0, millisec:0, timezone:'+0000'}, time);
  837. var tmptime = format;
  838. var ampmName = options['amNames'][0];
  839. var hour = parseInt(time.hour, 10);
  840. if (options.ampm) {
  841. if (hour > 11){
  842. ampmName = options['pmNames'][0];
  843. if(hour > 12)
  844. hour = hour % 12;
  845. }
  846. if (hour === 0)
  847. hour = 12;
  848. }
  849. tmptime = tmptime.replace(/(?:hh?|mm?|ss?|[tT]{1,2}|[lz])/g, function(match) {
  850. switch (match.toLowerCase()) {
  851. case 'hh': return ('0' + hour).slice(-2);
  852. case 'h': return hour;
  853. case 'mm': return ('0' + time.minute).slice(-2);
  854. case 'm': return time.minute;
  855. case 'ss': return ('0' + time.second).slice(-2);
  856. case 's': return time.second;
  857. case 'l': return ('00' + time.millisec).slice(-3);
  858. case 'z': return time.timezone;
  859. case 't': case 'tt':
  860. if (options.ampm) {
  861. if (match.length == 1)
  862. ampmName = ampmName.charAt(0);
  863. return match.charAt(0) == 'T' ? ampmName.toUpperCase() : ampmName.toLowerCase();
  864. }
  865. return '';
  866. }
  867. });
  868. tmptime = $.trim(tmptime);
  869. return tmptime;
  870. }
  871. //########################################################################
  872. // the bad hack :/ override datepicker so it doesnt close on select
  873. // inspired: http://stackoverflow.com/questions/1252512/jquery-datepicker-prevent-closing-picker-when-clicking-a-date/1762378#1762378
  874. //########################################################################
  875. $.datepicker._base_selectDate = $.datepicker._selectDate;
  876. $.datepicker._selectDate = function (id, dateStr) {
  877. var inst = this._getInst($(id)[0]),
  878. tp_inst = this._get(inst, 'timepicker');
  879. if (tp_inst) {
  880. tp_inst._limitMinMaxDateTime(inst, true);
  881. inst.inline = inst.stay_open = true;
  882. //This way the onSelect handler called from calendarpicker get the full dateTime
  883. this._base_selectDate(id, dateStr);
  884. inst.inline = inst.stay_open = false;
  885. this._notifyChange(inst);
  886. this._updateDatepicker(inst);
  887. }
  888. else this._base_selectDate(id, dateStr);
  889. };
  890. //#############################################################################################
  891. // second bad hack :/ override datepicker so it triggers an event when changing the input field
  892. // and does not redraw the datepicker on every selectDate event
  893. //#############################################################################################
  894. $.datepicker._base_updateDatepicker = $.datepicker._updateDatepicker;
  895. $.datepicker._updateDatepicker = function(inst) {
  896. // don't popup the datepicker if there is another instance already opened
  897. var input = inst.input[0];
  898. if($.datepicker._curInst &&
  899. $.datepicker._curInst != inst &&
  900. $.datepicker._datepickerShowing &&
  901. $.datepicker._lastInput != input) {
  902. return;
  903. }
  904. if (typeof(inst.stay_open) !== 'boolean' || inst.stay_open === false) {
  905. this._base_updateDatepicker(inst);
  906. // Reload the time control when changing something in the input text field.
  907. var tp_inst = this._get(inst, 'timepicker');
  908. if(tp_inst) tp_inst._addTimePicker(inst);
  909. }
  910. };
  911. //#######################################################################################
  912. // third bad hack :/ override datepicker so it allows spaces and colon in the input field
  913. //#######################################################################################
  914. $.datepicker._base_doKeyPress = $.datepicker._doKeyPress;
  915. $.datepicker._doKeyPress = function(event) {
  916. var inst = $.datepicker._getInst(event.target),
  917. tp_inst = $.datepicker._get(inst, 'timepicker');
  918. if (tp_inst) {
  919. if ($.datepicker._get(inst, 'constrainInput')) {
  920. var ampm = tp_inst._defaults.ampm,
  921. dateChars = $.datepicker._possibleChars($.datepicker._get(inst, 'dateFormat')),
  922. datetimeChars = tp_inst._defaults.timeFormat.toString()
  923. .replace(/[hms]/g, '')
  924. .replace(/TT/g, ampm ? 'APM' : '')
  925. .replace(/Tt/g, ampm ? 'AaPpMm' : '')
  926. .replace(/tT/g, ampm ? 'AaPpMm' : '')
  927. .replace(/T/g, ampm ? 'AP' : '')
  928. .replace(/tt/g, ampm ? 'apm' : '')
  929. .replace(/t/g, ampm ? 'ap' : '') +
  930. " " +
  931. tp_inst._defaults.separator +
  932. tp_inst._defaults.timeSuffix +
  933. (tp_inst._defaults.showTimezone ? tp_inst._defaults.timezoneList.join('') : '') +
  934. (tp_inst._defaults.amNames.join('')) +
  935. (tp_inst._defaults.pmNames.join('')) +
  936. dateChars,
  937. chr = String.fromCharCode(event.charCode === undefined ? event.keyCode : event.charCode);
  938. return event.ctrlKey || (chr < ' ' || !dateChars || datetimeChars.indexOf(chr) > -1);
  939. }
  940. }
  941. return $.datepicker._base_doKeyPress(event);
  942. };
  943. //#######################################################################################
  944. // Override key up event to sync manual input changes.
  945. //#######################################################################################
  946. $.datepicker._base_doKeyUp = $.datepicker._doKeyUp;
  947. $.datepicker._doKeyUp = function (event) {
  948. var inst = $.datepicker._getInst(event.target),
  949. tp_inst = $.datepicker._get(inst, 'timepicker');
  950. if (tp_inst) {
  951. if (tp_inst._defaults.timeOnly && (inst.input.val() != inst.lastVal)) {
  952. try {
  953. $.datepicker._updateDatepicker(inst);
  954. }
  955. catch (err) {
  956. $.datepicker.log(err);
  957. }
  958. }
  959. }
  960. return $.datepicker._base_doKeyUp(event);
  961. };
  962. //#######################################################################################
  963. // override "Today" button to also grab the time.
  964. //#######################################################################################
  965. $.datepicker._base_gotoToday = $.datepicker._gotoToday;
  966. $.datepicker._gotoToday = function(id) {
  967. var inst = this._getInst($(id)[0]),
  968. $dp = inst.dpDiv;
  969. this._base_gotoToday(id);
  970. var now = new Date();
  971. var tp_inst = this._get(inst, 'timepicker');
  972. if (tp_inst && tp_inst._defaults.showTimezone && tp_inst.timezone_select) {
  973. var tzoffset = now.getTimezoneOffset(); // If +0100, returns -60
  974. var tzsign = tzoffset > 0 ? '-' : '+';
  975. tzoffset = Math.abs(tzoffset);
  976. var tzmin = tzoffset % 60;
  977. tzoffset = tzsign + ('0' + (tzoffset - tzmin) / 60).slice(-2) + ('0' + tzmin).slice(-2);
  978. if (tp_inst._defaults.timezoneIso8609)
  979. tzoffset = tzoffset.substring(0, 3) + ':' + tzoffset.substring(3);
  980. tp_inst.timezone_select.val(tzoffset);
  981. }
  982. this._setTime(inst, now);
  983. $( '.ui-datepicker-today', $dp).click();
  984. };
  985. //#######################################################################################
  986. // Disable & enable the Time in the datetimepicker
  987. //#######################################################################################
  988. $.datepicker._disableTimepickerDatepicker = function(target, date, withDate) {
  989. var inst = this._getInst(target),
  990. tp_inst = this._get(inst, 'timepicker');
  991. $(target).datepicker('getDate'); // Init selected[Year|Month|Day]
  992. if (tp_inst) {
  993. tp_inst._defaults.showTimepicker = false;
  994. tp_inst._updateDateTime(inst);
  995. }
  996. };
  997. $.datepicker._enableTimepickerDatepicker = function(target, date, withDate) {
  998. var inst = this._getInst(target),
  999. tp_inst = this._get(inst, 'timepicker');
  1000. $(target).datepicker('getDate'); // Init selected[Year|Month|Day]
  1001. if (tp_inst) {
  1002. tp_inst._defaults.showTimepicker = true;
  1003. tp_inst._addTimePicker(inst); // Could be disabled on page load
  1004. tp_inst._updateDateTime(inst);
  1005. }
  1006. };
  1007. //#######################################################################################
  1008. // Create our own set time function
  1009. //#######################################################################################
  1010. $.datepicker._setTime = function(inst, date) {
  1011. var tp_inst = this._get(inst, 'timepicker');
  1012. if (tp_inst) {
  1013. var defaults = tp_inst._defaults,
  1014. // calling _setTime with no date sets time to defaults
  1015. hour = date ? date.getHours() : defaults.hour,
  1016. minute = date ? date.getMinutes() : defaults.minute,
  1017. second = date ? date.getSeconds() : defaults.second,
  1018. millisec = date ? date.getMilliseconds() : defaults.millisec;
  1019. //check if within min/max times..
  1020. if ((hour < defaults.hourMin || hour > defaults.hourMax) || (minute < defaults.minuteMin || minute > defaults.minuteMax) || (second < defaults.secondMin || second > defaults.secondMax) || (millisec < defaults.millisecMin || millisec > defaults.millisecMax)) {
  1021. hour = defaults.hourMin;
  1022. minute = defaults.minuteMin;
  1023. second = defaults.secondMin;
  1024. millisec = defaults.millisecMin;
  1025. }
  1026. tp_inst.hour = hour;
  1027. tp_inst.minute = minute;
  1028. tp_inst.second = second;
  1029. tp_inst.millisec = millisec;
  1030. if (tp_inst.hour_slider) tp_inst.hour_slider.slider('value', hour);
  1031. if (tp_inst.minute_slider) tp_inst.minute_slider.slider('value', minute);
  1032. if (tp_inst.second_slider) tp_inst.second_slider.slider('value', second);
  1033. if (tp_inst.millisec_slider) tp_inst.millisec_slider.slider('value', millisec);
  1034. tp_inst._onTimeChange();
  1035. tp_inst._updateDateTime(inst);
  1036. }
  1037. };
  1038. //#######################################################################################
  1039. // Create new public method to set only time, callable as $().datepicker('setTime', date)
  1040. //#######################################################################################
  1041. $.datepicker._setTimeDatepicker = function(target, date, withDate) {
  1042. var inst = this._getInst(target),
  1043. tp_inst = this._get(inst, 'timepicker');
  1044. if (tp_inst) {
  1045. this._setDateFromField(inst);
  1046. var tp_date;
  1047. if (date) {
  1048. if (typeof date == "string") {
  1049. tp_inst._parseTime(date, withDate);
  1050. tp_date = new Date();
  1051. tp_date.setHours(tp_inst.hour, tp_inst.minute, tp_inst.second, tp_inst.millisec);
  1052. }
  1053. else tp_date = new Date(date.getTime());
  1054. if (tp_date.toString() == 'Invalid Date') tp_date = undefined;
  1055. this._setTime(inst, tp_date);
  1056. }
  1057. }
  1058. };
  1059. //#######################################################################################
  1060. // override setDate() to allow setting time too within Date object
  1061. //#######################################################################################
  1062. $.datepicker._base_setDateDatepicker = $.datepicker._setDateDatepicker;
  1063. $.datepicker._setDateDatepicker = function(target, date) {
  1064. var inst = this._getInst(target),
  1065. tp_date = (date instanceof Date) ? new Date(date.getTime()) : date;
  1066. this._updateDatepicker(inst);
  1067. this._base_setDateDatepicker.apply(this, arguments);
  1068. this._setTimeDatepicker(target, tp_date, true);
  1069. };
  1070. //#######################################################################################
  1071. // override getDate() to allow getting time too within Date object
  1072. //#######################################################################################
  1073. $.datepicker._base_getDateDatepicker = $.datepicker._getDateDatepicker;
  1074. $.datepicker._getDateDatepicker = function(target, noDefault) {
  1075. var inst = this._getInst(target),
  1076. tp_inst = this._get(inst, 'timepicker');
  1077. if (tp_inst) {
  1078. this._setDateFromField(inst, noDefault);
  1079. var date = this._getDate(inst);
  1080. if (date && tp_inst._parseTime($(target).val(), tp_inst.timeOnly)) date.setHours(tp_inst.hour, tp_inst.minute, tp_inst.second, tp_inst.millisec);
  1081. return date;
  1082. }
  1083. return this._base_getDateDatepicker(target, noDefault);
  1084. };
  1085. //#######################################################################################
  1086. // override parseDate() because UI 1.8.14 throws an error about "Extra characters"
  1087. // An option in datapicker to ignore extra format characters would be nicer.
  1088. //#######################################################################################
  1089. $.datepicker._base_parseDate = $.datepicker.parseDate;
  1090. $.datepicker.parseDate = function(format, value, settings) {
  1091. var date;
  1092. try {
  1093. date = this._base_parseDate(format, value, settings);
  1094. } catch (err) {
  1095. if (err.indexOf(":") >= 0) {
  1096. // Hack! The error message ends with a colon, a space, and
  1097. // the "extra" characters. We rely on that instead of
  1098. // attempting to perfectly reproduce the parsing algorithm.
  1099. date = this._base_parseDate(format, value.substring(0,value.length-(err.length-err.indexOf(':')-2)), settings);
  1100. } else {
  1101. // The underlying error was not related to the time
  1102. throw err;
  1103. }
  1104. }
  1105. return date;
  1106. };
  1107. //#######################################################################################
  1108. // override formatDate to set date with time to the input
  1109. //#######################################################################################
  1110. $.datepicker._base_formatDate=$.datepicker._formatDate;
  1111. $.datepicker._formatDate = function(inst, day, month, year){
  1112. var tp_inst = this._get(inst, 'timepicker');
  1113. if(tp_inst)
  1114. {
  1115. if(day)
  1116. var b = this._base_formatDate(inst, day, month, year);
  1117. tp_inst._updateDateTime(inst);
  1118. return tp_inst.$input.val();
  1119. }
  1120. return this._base_formatDate(inst);
  1121. };
  1122. //#######################################################################################
  1123. // override options setter to add time to maxDate(Time) and minDate(Time). MaxDate
  1124. //#######################################################################################
  1125. $.datepicker._base_optionDatepicker = $.datepicker._optionDatepicker;
  1126. $.datepicker._optionDatepicker = function(target, name, value) {
  1127. var inst = this._getInst(target),
  1128. tp_inst = this._get(inst, 'timepicker');
  1129. if (tp_inst) {
  1130. var min,max,onselect;
  1131. if (typeof name == 'string') { // if min/max was set with the string
  1132. if (name==='minDate' || name==='minDateTime' )
  1133. min = value;
  1134. else if (name==='maxDate' || name==='maxDateTime')
  1135. max = value;
  1136. else if (name==='onSelect')
  1137. onselect=value;
  1138. } else if (typeof name == 'object') { //if min/max was set with the JSON
  1139. if(name.minDate)
  1140. min = name.minDate;
  1141. else if (name.minDateTime)
  1142. min = name.minDateTime;
  1143. else if (name.maxDate)
  1144. max = name.maxDate;
  1145. else if (name.maxDateTime)
  1146. max = name.maxDateTime;
  1147. }
  1148. if(min){ //if min was set
  1149. if(min==0)
  1150. min=new Date();
  1151. else
  1152. min= new Date(min);
  1153. tp_inst._defaults.minDate = min;
  1154. tp_inst._defaults.minDateTime = min;
  1155. } else if (max){ //if max was set
  1156. if(max==0)
  1157. max=new Date();
  1158. else
  1159. max= new Date(max);
  1160. tp_inst._defaults.maxDate = max;
  1161. tp_inst._defaults.maxDateTime = max;
  1162. }
  1163. else if (onselect)
  1164. tp_inst._defaults.onSelect=onselect;
  1165. }
  1166. if (value === undefined)
  1167. return this._base_optionDatepicker(target, name);
  1168. return this._base_optionDatepicker(target, name, value);
  1169. };
  1170. //#######################################################################################
  1171. // jQuery extend now ignores nulls!
  1172. //#######################################################################################
  1173. function extendRemove(target, props) {
  1174. $.extend(target, props);
  1175. for (var name in props)
  1176. if (props[name] === null || props[name] === undefined)
  1177. target[name] = props[name];
  1178. return target;
  1179. };
  1180. $.timepicker = new Timepicker(); // singleton instance
  1181. $.timepicker.version = "0.9.9";
  1182. })(jQuery);