jquery.timepicker.js 30 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246
  1. /*!
  2. * jquery-timepicker v1.11.5 - A jQuery timepicker plugin inspired by Google Calendar. It supports both mouse and keyboard navigation.
  3. * Copyright (c) 2015 Jon Thornton - http://jonthornton.github.com/jquery-timepicker/
  4. * License: MIT
  5. */
  6. (function (factory) {
  7. if (typeof exports === "object" && exports &&
  8. typeof module === "object" && module && module.exports === exports) {
  9. // Browserify. Attach to jQuery module.
  10. factory(require("jquery"));
  11. } else if (typeof define === 'function' && define.amd) {
  12. // AMD. Register as an anonymous module.
  13. define(['jquery'], factory);
  14. } else {
  15. // Browser globals
  16. factory(jQuery);
  17. }
  18. }(function ($) {
  19. var _ONE_DAY = 86400;
  20. var _lang = {
  21. am: 'am',
  22. pm: 'pm',
  23. AM: 'AM',
  24. PM: 'PM',
  25. decimal: '.',
  26. mins: 'mins',
  27. hr: 'hr',
  28. hrs: 'hrs'
  29. };
  30. var methods = {
  31. init: function(options)
  32. {
  33. return this.each(function()
  34. {
  35. var self = $(this);
  36. // pick up settings from data attributes
  37. var attributeOptions = [];
  38. for (var key in $.fn.tribeTimepicker.defaults) {
  39. if (self.data(key)) {
  40. attributeOptions[key] = self.data(key);
  41. }
  42. }
  43. var settings = $.extend({}, $.fn.tribeTimepicker.defaults, attributeOptions, options);
  44. if (settings.lang) {
  45. _lang = $.extend(_lang, settings.lang);
  46. }
  47. settings = _parseSettings(settings);
  48. self.data('timepicker-settings', settings);
  49. self.addClass('ui-timepicker-input');
  50. if (settings.useSelect) {
  51. _render(self);
  52. } else {
  53. self.prop('autocomplete', 'off');
  54. if (settings.showOn) {
  55. for (var i in settings.showOn) {
  56. self.on(settings.showOn[i]+'.timepicker', methods.show);
  57. }
  58. }
  59. self.on('change.timepicker', _formatValue);
  60. self.on('keydown.timepicker', _keydownhandler);
  61. self.on('keyup.timepicker', _keyuphandler);
  62. if (settings.disableTextInput) {
  63. self.on('keydown.timepicker', _disableTextInputHandler);
  64. }
  65. _formatValue.call(self.get(0), null, 'initial');
  66. }
  67. });
  68. },
  69. show: function(e)
  70. {
  71. var self = $(this);
  72. var settings = self.data('timepicker-settings');
  73. if (e) {
  74. e.preventDefault();
  75. }
  76. if (settings.useSelect) {
  77. self.data('timepicker-list').focus();
  78. return;
  79. }
  80. if (_hideKeyboard(self)) {
  81. // block the keyboard on mobile devices
  82. self.blur();
  83. }
  84. var list = self.data('timepicker-list');
  85. // check if input is readonly
  86. if (self.prop('readonly')) {
  87. return;
  88. }
  89. // check if list needs to be rendered
  90. if (!list || list.length === 0 || typeof settings.durationTime === 'function') {
  91. _render(self);
  92. list = self.data('timepicker-list');
  93. }
  94. if (_isVisible(list)) {
  95. return;
  96. }
  97. self.data('ui-timepicker-value', self.val());
  98. _setSelected(self, list);
  99. // make sure other pickers are hidden
  100. methods.hide();
  101. // position the dropdown relative to the input
  102. list.show();
  103. var listOffset = {};
  104. if (settings.orientation.match(/r/)) {
  105. // right-align the dropdown
  106. listOffset.left = self.offset().left + self.outerWidth() - list.outerWidth() + parseInt(list.css('marginLeft').replace('px', ''), 10);
  107. } else {
  108. // left-align the dropdown
  109. listOffset.left = self.offset().left + parseInt(list.css('marginLeft').replace('px', ''), 10);
  110. }
  111. var verticalOrientation;
  112. if (settings.orientation.match(/t/)) {
  113. verticalOrientation = 't';
  114. } else if (settings.orientation.match(/b/)) {
  115. verticalOrientation = 'b';
  116. } else if ((self.offset().top + self.outerHeight(true) + list.outerHeight()) > $(window).height() + $(window).scrollTop()) {
  117. verticalOrientation = 't';
  118. } else {
  119. verticalOrientation = 'b';
  120. }
  121. if (verticalOrientation == 't') {
  122. // position the dropdown on top
  123. list.addClass('ui-timepicker-positioned-top');
  124. listOffset.top = self.offset().top - list.outerHeight() + parseInt(list.css('marginTop').replace('px', ''), 10);
  125. } else {
  126. // put it under the input
  127. list.removeClass('ui-timepicker-positioned-top');
  128. listOffset.top = self.offset().top + self.outerHeight() + parseInt(list.css('marginTop').replace('px', ''), 10);
  129. }
  130. list.offset(listOffset);
  131. // position scrolling
  132. var selected = list.find('.ui-timepicker-selected');
  133. if (!selected.length) {
  134. var timeInt = _time2int(_getTimeValue(self));
  135. if (timeInt !== null) {
  136. selected = _findRow(self, list, timeInt);
  137. } else if (settings.scrollDefault) {
  138. selected = _findRow(self, list, settings.scrollDefault());
  139. }
  140. }
  141. if (selected && selected.length) {
  142. var topOffset = list.scrollTop() + selected.position().top - selected.outerHeight();
  143. list.scrollTop(topOffset);
  144. } else {
  145. list.scrollTop(0);
  146. }
  147. // prevent scroll propagation
  148. if(settings.stopScrollPropagation) {
  149. $(document).on('wheel.ui-timepicker', '.ui-timepicker-wrapper', function(e){
  150. e.preventDefault();
  151. var currentScroll = $(this).scrollTop();
  152. $(this).scrollTop(currentScroll + e.originalEvent.deltaY);
  153. });
  154. }
  155. // attach close handlers
  156. $(document).on('touchstart.ui-timepicker mousedown.ui-timepicker', _closeHandler);
  157. $(window).on('resize.ui-timepicker', _closeHandler);
  158. if (settings.closeOnWindowScroll) {
  159. $(document).on('scroll.ui-timepicker', _closeHandler);
  160. }
  161. self.trigger('showTimepicker');
  162. return this;
  163. },
  164. hide: function(e)
  165. {
  166. var self = $(this);
  167. var settings = self.data('timepicker-settings');
  168. if (settings && settings.useSelect) {
  169. self.blur();
  170. }
  171. $('.ui-timepicker-wrapper').each(function() {
  172. var list = $(this);
  173. if (!_isVisible(list)) {
  174. return;
  175. }
  176. var self = list.data('timepicker-input');
  177. var settings = self.data('timepicker-settings');
  178. if (settings && settings.selectOnBlur) {
  179. _selectValue(self);
  180. }
  181. list.hide();
  182. self.trigger('hideTimepicker');
  183. });
  184. return this;
  185. },
  186. option: function(key, value)
  187. {
  188. if (typeof key == 'string' && typeof value == 'undefined') {
  189. return $(this).data('timepicker-settings')[key];
  190. }
  191. return this.each(function(){
  192. var self = $(this);
  193. var settings = self.data('timepicker-settings');
  194. var list = self.data('timepicker-list');
  195. if (typeof key == 'object') {
  196. settings = $.extend(settings, key);
  197. } else if (typeof key == 'string') {
  198. settings[key] = value;
  199. }
  200. settings = _parseSettings(settings);
  201. self.data('timepicker-settings', settings);
  202. if (list) {
  203. list.remove();
  204. self.data('timepicker-list', false);
  205. }
  206. if (settings.useSelect) {
  207. _render(self);
  208. }
  209. });
  210. },
  211. getSecondsFromMidnight: function()
  212. {
  213. return _time2int(_getTimeValue(this));
  214. },
  215. getTime: function(relative_date)
  216. {
  217. var self = this;
  218. var time_string = _getTimeValue(self);
  219. if (!time_string) {
  220. return null;
  221. }
  222. var offset = _time2int(time_string);
  223. if (offset === null) {
  224. return null;
  225. }
  226. if (!relative_date) {
  227. relative_date = new Date();
  228. }
  229. // construct a Date from relative date, and offset's time
  230. var time = new Date(relative_date);
  231. time.setHours(offset / 3600);
  232. time.setMinutes(offset % 3600 / 60);
  233. time.setSeconds(offset % 60);
  234. time.setMilliseconds(0);
  235. return time;
  236. },
  237. isVisible: function() {
  238. var self = this;
  239. var list = self.data('timepicker-list');
  240. return !!(list && _isVisible(list));
  241. },
  242. setTime: function(value)
  243. {
  244. var self = this;
  245. var settings = self.data('timepicker-settings');
  246. if (settings.forceRoundTime) {
  247. var prettyTime = _roundAndFormatTime(_time2int(value), settings)
  248. } else {
  249. var prettyTime = _int2time(_time2int(value), settings);
  250. }
  251. if (value && prettyTime === null && settings.noneOption) {
  252. prettyTime = value;
  253. }
  254. _setTimeValue(self, prettyTime);
  255. if (self.data('timepicker-list')) {
  256. _setSelected(self, self.data('timepicker-list'));
  257. }
  258. return this;
  259. },
  260. remove: function()
  261. {
  262. var self = this;
  263. // check if this element is a timepicker
  264. if (!self.hasClass('ui-timepicker-input')) {
  265. return;
  266. }
  267. var settings = self.data('timepicker-settings');
  268. self.removeAttr('autocomplete', 'off');
  269. self.removeClass('ui-timepicker-input');
  270. self.removeData('timepicker-settings');
  271. self.off('.timepicker');
  272. // timepicker-list won't be present unless the user has interacted with this timepicker
  273. if (self.data('timepicker-list')) {
  274. self.data('timepicker-list').remove();
  275. }
  276. if (settings.useSelect) {
  277. self.show();
  278. }
  279. self.removeData('timepicker-list');
  280. return this;
  281. }
  282. };
  283. // private methods
  284. function _isVisible(elem)
  285. {
  286. var el = elem[0];
  287. return el.offsetWidth > 0 && el.offsetHeight > 0;
  288. }
  289. function _parseSettings(settings)
  290. {
  291. if (settings.minTime) {
  292. settings.minTime = _time2int(settings.minTime);
  293. }
  294. if (settings.maxTime) {
  295. settings.maxTime = _time2int(settings.maxTime);
  296. }
  297. if (settings.durationTime && typeof settings.durationTime !== 'function') {
  298. settings.durationTime = _time2int(settings.durationTime);
  299. }
  300. if (settings.scrollDefault == 'now') {
  301. settings.scrollDefault = function() {
  302. return settings.roundingFunction(_time2int(new Date()), settings);
  303. }
  304. } else if (settings.scrollDefault && typeof settings.scrollDefault != 'function') {
  305. var val = settings.scrollDefault;
  306. settings.scrollDefault = function() {
  307. return settings.roundingFunction(_time2int(val), settings);
  308. }
  309. } else if (settings.minTime) {
  310. settings.scrollDefault = function() {
  311. return settings.roundingFunction(settings.minTime, settings);
  312. }
  313. }
  314. if ($.type(settings.timeFormat) === "string" && settings.timeFormat.match(/[gh]/)) {
  315. settings._twelveHourTime = true;
  316. }
  317. if (settings.showOnFocus === false && settings.showOn.indexOf('focus') != -1) {
  318. settings.showOn.splice(settings.showOn.indexOf('focus'), 1);
  319. }
  320. if (settings.disableTimeRanges.length > 0) {
  321. // convert string times to integers
  322. for (var i in settings.disableTimeRanges) {
  323. settings.disableTimeRanges[i] = [
  324. _time2int(settings.disableTimeRanges[i][0]),
  325. _time2int(settings.disableTimeRanges[i][1])
  326. ];
  327. }
  328. // sort by starting time
  329. settings.disableTimeRanges = settings.disableTimeRanges.sort(function(a, b){
  330. return a[0] - b[0];
  331. });
  332. // merge any overlapping ranges
  333. for (var i = settings.disableTimeRanges.length-1; i > 0; i--) {
  334. if (settings.disableTimeRanges[i][0] <= settings.disableTimeRanges[i-1][1]) {
  335. settings.disableTimeRanges[i-1] = [
  336. Math.min(settings.disableTimeRanges[i][0], settings.disableTimeRanges[i-1][0]),
  337. Math.max(settings.disableTimeRanges[i][1], settings.disableTimeRanges[i-1][1])
  338. ];
  339. settings.disableTimeRanges.splice(i, 1);
  340. }
  341. }
  342. }
  343. return settings;
  344. }
  345. function _render(self)
  346. {
  347. var settings = self.data('timepicker-settings');
  348. var list = self.data('timepicker-list');
  349. if (list && list.length) {
  350. list.remove();
  351. self.data('timepicker-list', false);
  352. }
  353. if (settings.useSelect) {
  354. list = $('<select />', { 'class': 'ui-timepicker-select' });
  355. var wrapped_list = list;
  356. } else {
  357. list = $('<ul />', { 'class': 'ui-timepicker-list' });
  358. var wrapped_list = $('<div />', { 'class': 'ui-timepicker-wrapper', 'tabindex': -1 });
  359. wrapped_list.css({'display':'none', 'position': 'absolute' }).append(list);
  360. }
  361. if (settings.noneOption) {
  362. if (settings.noneOption === true) {
  363. settings.noneOption = (settings.useSelect) ? 'Time...' : 'None';
  364. }
  365. if ($.isArray(settings.noneOption)) {
  366. for (var i in settings.noneOption) {
  367. if (parseInt(i, 10) == i){
  368. var noneElement = _generateNoneElement(settings.noneOption[i], settings.useSelect);
  369. list.append(noneElement);
  370. }
  371. }
  372. } else {
  373. var noneElement = _generateNoneElement(settings.noneOption, settings.useSelect);
  374. list.append(noneElement);
  375. }
  376. }
  377. if (settings.className) {
  378. wrapped_list.addClass(settings.className);
  379. }
  380. if ((settings.minTime !== null || settings.durationTime !== null) && settings.showDuration) {
  381. var stepval = typeof settings.step == 'function' ? 'function' : settings.step;
  382. wrapped_list.addClass('ui-timepicker-with-duration');
  383. wrapped_list.addClass('ui-timepicker-step-'+settings.step);
  384. }
  385. var durStart = settings.minTime;
  386. if (typeof settings.durationTime === 'function') {
  387. durStart = _time2int(settings.durationTime());
  388. } else if (settings.durationTime !== null) {
  389. durStart = settings.durationTime;
  390. }
  391. var start = (settings.minTime !== null) ? settings.minTime : 0;
  392. var end = (settings.maxTime !== null) ? settings.maxTime : (start + _ONE_DAY - 1);
  393. if (end < start) {
  394. // make sure the end time is greater than start time, otherwise there will be no list to show
  395. end += _ONE_DAY;
  396. }
  397. if (end === _ONE_DAY-1 && $.type(settings.timeFormat) === "string" && settings.show2400) {
  398. // show a 24:00 option when using military time
  399. end = _ONE_DAY;
  400. }
  401. var dr = settings.disableTimeRanges;
  402. var drCur = 0;
  403. var drLen = dr.length;
  404. var stepFunc = settings.step;
  405. if (typeof stepFunc != 'function') {
  406. stepFunc = function() {
  407. return settings.step;
  408. }
  409. }
  410. for (var i=start, j=0; i <= end; j++, i += stepFunc(j)*60) {
  411. var timeInt = i;
  412. var timeString = _int2time(timeInt, settings);
  413. if (settings.useSelect) {
  414. var row = $('<option />', { 'value': timeString });
  415. row.text(timeString);
  416. } else {
  417. var row = $('<li />');
  418. row.addClass(timeInt % 86400 < 43200 ? 'ui-timepicker-am' : 'ui-timepicker-pm');
  419. row.data('time', (timeInt <= 86400 ? timeInt : timeInt % 86400));
  420. row.text(timeString);
  421. }
  422. if ((settings.minTime !== null || settings.durationTime !== null) && settings.showDuration) {
  423. var durationString = _int2duration(i - durStart, settings.step);
  424. if (settings.useSelect) {
  425. row.text(row.text()+' ('+durationString+')');
  426. } else {
  427. var duration = $('<span />', { 'class': 'ui-timepicker-duration' });
  428. duration.text(' ('+durationString+')');
  429. row.append(duration);
  430. }
  431. }
  432. if (drCur < drLen) {
  433. if (timeInt >= dr[drCur][1]) {
  434. drCur += 1;
  435. }
  436. if (dr[drCur] && timeInt >= dr[drCur][0] && timeInt < dr[drCur][1]) {
  437. if (settings.useSelect) {
  438. row.prop('disabled', true);
  439. } else {
  440. row.addClass('ui-timepicker-disabled');
  441. }
  442. }
  443. }
  444. list.append(row);
  445. }
  446. wrapped_list.data('timepicker-input', self);
  447. self.data('timepicker-list', wrapped_list);
  448. if (settings.useSelect) {
  449. if (self.val()) {
  450. list.val(_roundAndFormatTime(_time2int(self.val()), settings));
  451. }
  452. list.on('focus', function(){
  453. $(this).data('timepicker-input').trigger('showTimepicker');
  454. });
  455. list.on('blur', function(){
  456. $(this).data('timepicker-input').trigger('hideTimepicker');
  457. });
  458. list.on('change', function(){
  459. _setTimeValue(self, $(this).val(), 'select');
  460. });
  461. _setTimeValue(self, list.val(), 'initial');
  462. self.hide().after(list);
  463. } else {
  464. var appendTo = settings.appendTo;
  465. if (typeof appendTo === 'string') {
  466. appendTo = $(appendTo);
  467. } else if (typeof appendTo === 'function') {
  468. appendTo = appendTo(self);
  469. }
  470. appendTo.append(wrapped_list);
  471. _setSelected(self, list);
  472. list.on('mousedown click', 'li', function(e) {
  473. // hack: temporarily disable the focus handler
  474. // to deal with the fact that IE fires 'focus'
  475. // events asynchronously
  476. self.off('focus.timepicker');
  477. self.on('focus.timepicker-ie-hack', function(){
  478. self.off('focus.timepicker-ie-hack');
  479. self.on('focus.timepicker', methods.show);
  480. });
  481. if (!_hideKeyboard(self)) {
  482. self[0].focus();
  483. }
  484. // make sure only the clicked row is selected
  485. list.find('li').removeClass('ui-timepicker-selected');
  486. $(this).addClass('ui-timepicker-selected');
  487. if (_selectValue(self)) {
  488. self.trigger('hideTimepicker');
  489. list.on('mouseup.timepicker click.timepicker', 'li', function(e) {
  490. list.off('mouseup.timepicker click.timepicker');
  491. wrapped_list.hide();
  492. });
  493. }
  494. });
  495. }
  496. }
  497. function _generateNoneElement(optionValue, useSelect)
  498. {
  499. var label, className, value;
  500. if (typeof optionValue == 'object') {
  501. label = optionValue.label;
  502. className = optionValue.className;
  503. value = optionValue.value;
  504. } else if (typeof optionValue == 'string') {
  505. label = optionValue;
  506. } else {
  507. $.error('Invalid noneOption value');
  508. }
  509. if (useSelect) {
  510. return $('<option />', {
  511. 'value': value,
  512. 'class': className,
  513. 'text': label
  514. });
  515. } else {
  516. return $('<li />', {
  517. 'class': className,
  518. 'text': label
  519. }).data('time', String(value));
  520. }
  521. }
  522. function _roundAndFormatTime(seconds, settings)
  523. {
  524. seconds = settings.roundingFunction(seconds, settings);
  525. if (seconds !== null) {
  526. return _int2time(seconds, settings);
  527. }
  528. }
  529. // event handler to decide whether to close timepicker
  530. function _closeHandler(e)
  531. {
  532. if (e.target == window) {
  533. // mobile Chrome fires focus events against window for some reason
  534. return;
  535. }
  536. var target = $(e.target);
  537. if (target.closest('.ui-timepicker-input').length || target.closest('.ui-timepicker-wrapper').length) {
  538. // active timepicker was focused. ignore
  539. return;
  540. }
  541. methods.hide();
  542. $(document).unbind('.ui-timepicker');
  543. $(window).unbind('.ui-timepicker');
  544. }
  545. function _hideKeyboard(self)
  546. {
  547. var settings = self.data('timepicker-settings');
  548. return ((window.navigator.msMaxTouchPoints || 'ontouchstart' in document) && settings.disableTouchKeyboard);
  549. }
  550. function _findRow(self, list, value)
  551. {
  552. if (!value && value !== 0) {
  553. return false;
  554. }
  555. var settings = self.data('timepicker-settings');
  556. var out = false;
  557. var value = settings.roundingFunction(value, settings);
  558. // loop through the menu items
  559. list.find('li').each(function(i, obj) {
  560. var jObj = $(obj);
  561. if (typeof jObj.data('time') != 'number') {
  562. return;
  563. }
  564. if (jObj.data('time') == value) {
  565. out = jObj;
  566. return false;
  567. }
  568. });
  569. return out;
  570. }
  571. function _setSelected(self, list)
  572. {
  573. list.find('li').removeClass('ui-timepicker-selected');
  574. var timeValue = _time2int(_getTimeValue(self), self.data('timepicker-settings'));
  575. if (timeValue === null) {
  576. return;
  577. }
  578. var selected = _findRow(self, list, timeValue);
  579. if (selected) {
  580. var topDelta = selected.offset().top - list.offset().top;
  581. if (topDelta + selected.outerHeight() > list.outerHeight() || topDelta < 0) {
  582. list.scrollTop(list.scrollTop() + selected.position().top - selected.outerHeight());
  583. }
  584. selected.addClass('ui-timepicker-selected');
  585. }
  586. }
  587. function _formatValue(e, origin)
  588. {
  589. if (this.value === '' || origin == 'timepicker') {
  590. return;
  591. }
  592. var self = $(this);
  593. if (self.is(':focus') && (!e || e.type != 'change')) {
  594. return;
  595. }
  596. var settings = self.data('timepicker-settings');
  597. var seconds = _time2int(this.value, settings);
  598. if (seconds === null) {
  599. self.trigger('timeFormatError');
  600. return;
  601. }
  602. var rangeError = false;
  603. // check that the time in within bounds
  604. if ((settings.minTime !== null && settings.maxTime !== null)
  605. && (seconds < settings.minTime || seconds > settings.maxTime)) {
  606. rangeError = true;
  607. }
  608. // check that time isn't within disabled time ranges
  609. $.each(settings.disableTimeRanges, function(){
  610. if (seconds >= this[0] && seconds < this[1]) {
  611. rangeError = true;
  612. return false;
  613. }
  614. });
  615. if (settings.forceRoundTime) {
  616. var roundSeconds = settings.roundingFunction(seconds, settings);
  617. if (roundSeconds != seconds) {
  618. seconds = roundSeconds;
  619. origin = null;
  620. }
  621. }
  622. var prettyTime = _int2time(seconds, settings);
  623. if (rangeError) {
  624. if (_setTimeValue(self, prettyTime, 'error')) {
  625. self.trigger('timeRangeError');
  626. }
  627. } else {
  628. _setTimeValue(self, prettyTime, origin);
  629. }
  630. }
  631. function _getTimeValue(self)
  632. {
  633. if (self.is('input')) {
  634. return self.val();
  635. } else {
  636. // use the element's data attributes to store values
  637. return self.data('ui-timepicker-value');
  638. }
  639. }
  640. function _setTimeValue(self, value, source)
  641. {
  642. if (self.is('input')) {
  643. self.val(value);
  644. var settings = self.data('timepicker-settings');
  645. if (settings.useSelect && source != 'select' && source != 'initial') {
  646. self.data('timepicker-list').val(_roundAndFormatTime(_time2int(value), settings));
  647. }
  648. }
  649. if (self.data('ui-timepicker-value') != value) {
  650. self.data('ui-timepicker-value', value);
  651. if (source == 'select') {
  652. self.trigger('selectTime').trigger('changeTime').trigger('change', 'timepicker');
  653. } else if (['error', 'initial'].indexOf(source) == -1) {
  654. self.trigger('changeTime');
  655. }
  656. return true;
  657. } else {
  658. self.trigger('selectTime');
  659. return false;
  660. }
  661. }
  662. /*
  663. * Filter freeform input
  664. */
  665. function _disableTextInputHandler(e)
  666. {
  667. switch (e.keyCode) {
  668. case 13: // return
  669. case 9: //tab
  670. return;
  671. default:
  672. e.preventDefault();
  673. }
  674. }
  675. /*
  676. * Keyboard navigation via arrow keys
  677. */
  678. function _keydownhandler(e)
  679. {
  680. var self = $(this);
  681. var list = self.data('timepicker-list');
  682. if (!list || !_isVisible(list)) {
  683. if (e.keyCode == 40) {
  684. // show the list!
  685. methods.show.call(self.get(0));
  686. list = self.data('timepicker-list');
  687. if (!_hideKeyboard(self)) {
  688. self.focus();
  689. }
  690. } else {
  691. return true;
  692. }
  693. }
  694. switch (e.keyCode) {
  695. case 13: // return
  696. if (_selectValue(self)) {
  697. _formatValue.call(self.get(0), {'type':'change'});
  698. methods.hide.apply(this);
  699. }
  700. e.preventDefault();
  701. return false;
  702. case 38: // up
  703. var selected = list.find('.ui-timepicker-selected');
  704. if (!selected.length) {
  705. list.find('li').each(function(i, obj) {
  706. if ($(obj).position().top > 0) {
  707. selected = $(obj);
  708. return false;
  709. }
  710. });
  711. selected.addClass('ui-timepicker-selected');
  712. } else if (!selected.is(':first-child')) {
  713. selected.removeClass('ui-timepicker-selected');
  714. selected.prev().addClass('ui-timepicker-selected');
  715. if (selected.prev().position().top < selected.outerHeight()) {
  716. list.scrollTop(list.scrollTop() - selected.outerHeight());
  717. }
  718. }
  719. return false;
  720. case 40: // down
  721. selected = list.find('.ui-timepicker-selected');
  722. if (selected.length === 0) {
  723. list.find('li').each(function(i, obj) {
  724. if ($(obj).position().top > 0) {
  725. selected = $(obj);
  726. return false;
  727. }
  728. });
  729. selected.addClass('ui-timepicker-selected');
  730. } else if (!selected.is(':last-child')) {
  731. selected.removeClass('ui-timepicker-selected');
  732. selected.next().addClass('ui-timepicker-selected');
  733. if (selected.next().position().top + 2*selected.outerHeight() > list.outerHeight()) {
  734. list.scrollTop(list.scrollTop() + selected.outerHeight());
  735. }
  736. }
  737. return false;
  738. case 27: // escape
  739. list.find('li').removeClass('ui-timepicker-selected');
  740. methods.hide();
  741. break;
  742. case 9: //tab
  743. methods.hide();
  744. break;
  745. default:
  746. return true;
  747. }
  748. }
  749. /*
  750. * Time typeahead
  751. */
  752. function _keyuphandler(e)
  753. {
  754. var self = $(this);
  755. var list = self.data('timepicker-list');
  756. var settings = self.data('timepicker-settings');
  757. if (!list || !_isVisible(list) || settings.disableTextInput) {
  758. return true;
  759. }
  760. switch (e.keyCode) {
  761. case 96: // numpad numerals
  762. case 97:
  763. case 98:
  764. case 99:
  765. case 100:
  766. case 101:
  767. case 102:
  768. case 103:
  769. case 104:
  770. case 105:
  771. case 48: // numerals
  772. case 49:
  773. case 50:
  774. case 51:
  775. case 52:
  776. case 53:
  777. case 54:
  778. case 55:
  779. case 56:
  780. case 57:
  781. case 65: // a
  782. case 77: // m
  783. case 80: // p
  784. case 186: // colon
  785. case 8: // backspace
  786. case 46: // delete
  787. if (settings.typeaheadHighlight) {
  788. _setSelected(self, list);
  789. } else {
  790. list.hide();
  791. }
  792. break;
  793. }
  794. }
  795. function _selectValue(self)
  796. {
  797. var settings = self.data('timepicker-settings');
  798. var list = self.data('timepicker-list');
  799. var timeValue = null;
  800. var cursor = list.find('.ui-timepicker-selected');
  801. if (cursor.hasClass('ui-timepicker-disabled')) {
  802. return false;
  803. }
  804. if (cursor.length) {
  805. // selected value found
  806. timeValue = cursor.data('time');
  807. }
  808. if (timeValue !== null) {
  809. if (typeof timeValue != 'string') {
  810. timeValue = _int2time(timeValue, settings);
  811. }
  812. _setTimeValue(self, timeValue, 'select');
  813. }
  814. return true;
  815. }
  816. function _int2duration(seconds, step)
  817. {
  818. seconds = Math.abs(seconds);
  819. var minutes = Math.round(seconds/60),
  820. duration = [],
  821. hours, mins;
  822. if (minutes < 60) {
  823. // Only show (x mins) under 1 hour
  824. duration = [minutes, _lang.mins];
  825. } else {
  826. hours = Math.floor(minutes/60);
  827. mins = minutes%60;
  828. // Show decimal notation (eg: 1.5 hrs) for 30 minute steps
  829. if (step == 30 && mins == 30) {
  830. hours += _lang.decimal + 5;
  831. }
  832. duration.push(hours);
  833. duration.push(hours == 1 ? _lang.hr : _lang.hrs);
  834. // Show remainder minutes notation (eg: 1 hr 15 mins) for non-30 minute steps
  835. // and only if there are remainder minutes to show
  836. if (step != 30 && mins) {
  837. duration.push(mins);
  838. duration.push(_lang.mins);
  839. }
  840. }
  841. return duration.join(' ');
  842. }
  843. function _int2time(timeInt, settings)
  844. {
  845. if (typeof timeInt != 'number') {
  846. return null;
  847. }
  848. var seconds = parseInt(timeInt%60)
  849. , minutes = parseInt((timeInt/60)%60)
  850. , hours = parseInt((timeInt/(60*60))%24);
  851. var time = new Date(1970, 0, 2, hours, minutes, seconds, 0);
  852. if (isNaN(time.getTime())) {
  853. return null;
  854. }
  855. if ($.type(settings.timeFormat) === "function") {
  856. return settings.timeFormat(time);
  857. }
  858. var output = '';
  859. var hour, code;
  860. for (var i=0; i<settings.timeFormat.length; i++) {
  861. code = settings.timeFormat.charAt(i);
  862. switch (code) {
  863. case 'a':
  864. output += (time.getHours() > 11) ? _lang.pm : _lang.am;
  865. break;
  866. case 'A':
  867. output += (time.getHours() > 11) ? _lang.PM : _lang.AM;
  868. break;
  869. case 'g':
  870. hour = time.getHours() % 12;
  871. output += (hour === 0) ? '12' : hour;
  872. break;
  873. case 'G':
  874. hour = time.getHours();
  875. if (timeInt === _ONE_DAY) hour = settings.show2400 ? 24 : 0;
  876. output += hour;
  877. break;
  878. case 'h':
  879. hour = time.getHours() % 12;
  880. if (hour !== 0 && hour < 10) {
  881. hour = '0'+hour;
  882. }
  883. output += (hour === 0) ? '12' : hour;
  884. break;
  885. case 'H':
  886. hour = time.getHours();
  887. if (timeInt === _ONE_DAY) hour = settings.show2400 ? 24 : 0;
  888. output += (hour > 9) ? hour : '0'+hour;
  889. break;
  890. case 'i':
  891. var minutes = time.getMinutes();
  892. output += (minutes > 9) ? minutes : '0'+minutes;
  893. break;
  894. case 's':
  895. seconds = time.getSeconds();
  896. output += (seconds > 9) ? seconds : '0'+seconds;
  897. break;
  898. case '\\':
  899. // escape character; add the next character and skip ahead
  900. i++;
  901. output += settings.timeFormat.charAt(i);
  902. break;
  903. default:
  904. output += code;
  905. }
  906. }
  907. return output;
  908. }
  909. function _time2int(timeString, settings)
  910. {
  911. if (timeString === '' || timeString === null) return null;
  912. if (typeof timeString == 'object') {
  913. return timeString.getHours()*3600 + timeString.getMinutes()*60 + timeString.getSeconds();
  914. }
  915. if (typeof timeString != 'string') {
  916. return timeString;
  917. }
  918. timeString = timeString.toLowerCase().replace(/[\s\.]/g, '');
  919. // if the last character is an "a" or "p", add the "m"
  920. if (timeString.slice(-1) == 'a' || timeString.slice(-1) == 'p') {
  921. timeString += 'm';
  922. }
  923. var ampmRegex = '(' +
  924. _lang.am.replace('.', '')+'|' +
  925. _lang.pm.replace('.', '')+'|' +
  926. _lang.AM.replace('.', '')+'|' +
  927. _lang.PM.replace('.', '')+')?';
  928. // try to parse time input
  929. var pattern = new RegExp('^'+ampmRegex+'([0-9]?[0-9])\\W?([0-5][0-9])?\\W?([0-5][0-9])?'+ampmRegex+'$');
  930. var time = timeString.match(pattern);
  931. if (!time) {
  932. return null;
  933. }
  934. var hour = parseInt(time[2]*1, 10);
  935. if (hour > 24) {
  936. if (settings && settings.wrapHours === false) {
  937. return null;
  938. } else {
  939. hour = hour % 24;
  940. }
  941. }
  942. var ampm = time[1] || time[5];
  943. var hours = hour;
  944. if (hour <= 12 && ampm) {
  945. var isPm = (ampm == _lang.pm || ampm == _lang.PM);
  946. if (hour == 12) {
  947. hours = isPm ? 12 : 0;
  948. } else {
  949. hours = (hour + (isPm ? 12 : 0));
  950. }
  951. }
  952. var minutes = ( time[3]*1 || 0 );
  953. var seconds = ( time[4]*1 || 0 );
  954. var timeInt = hours*3600 + minutes*60 + seconds;
  955. // if no am/pm provided, intelligently guess based on the scrollDefault
  956. if (hour < 12 && !ampm && settings && settings._twelveHourTime && settings.scrollDefault) {
  957. var delta = timeInt - settings.scrollDefault();
  958. if (delta < 0 && delta >= _ONE_DAY / -2) {
  959. timeInt = (timeInt + (_ONE_DAY / 2)) % _ONE_DAY;
  960. }
  961. }
  962. return timeInt;
  963. }
  964. function _pad2(n) {
  965. return ("0" + n).slice(-2);
  966. }
  967. // Plugin entry
  968. $.fn.tribeTimepicker = function(method)
  969. {
  970. if (!this.length) return this;
  971. if (methods[method]) {
  972. // check if this element is a timepicker
  973. if (!this.hasClass('ui-timepicker-input')) {
  974. return this;
  975. }
  976. return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
  977. }
  978. else if(typeof method === "object" || !method) { return methods.init.apply(this, arguments); }
  979. else { $.error("Method "+ method + " does not exist on jQuery.timepicker"); }
  980. };
  981. // Global defaults
  982. $.fn.tribeTimepicker.defaults = {
  983. appendTo: 'body',
  984. className: null,
  985. closeOnWindowScroll: false,
  986. disableTextInput: false,
  987. disableTimeRanges: [],
  988. disableTouchKeyboard: false,
  989. durationTime: null,
  990. forceRoundTime: false,
  991. maxTime: null,
  992. minTime: null,
  993. noneOption: false,
  994. orientation: 'l',
  995. roundingFunction: function(seconds, settings) {
  996. if (seconds === null) {
  997. return null;
  998. } else if (typeof settings.step !== "number") {
  999. // TODO: nearest fit irregular steps
  1000. return seconds;
  1001. } else {
  1002. var offset = seconds % (settings.step*60); // step is in minutes
  1003. if (offset >= settings.step*30) {
  1004. // if offset is larger than a half step, round up
  1005. seconds += (settings.step*60) - offset;
  1006. } else {
  1007. // round down
  1008. seconds -= offset;
  1009. }
  1010. if (seconds == _ONE_DAY && settings.show2400) {
  1011. return seconds;
  1012. }
  1013. return seconds%_ONE_DAY;
  1014. }
  1015. },
  1016. scrollDefault: null,
  1017. selectOnBlur: false,
  1018. show2400: false,
  1019. showDuration: false,
  1020. showOn: ['click', 'focus'],
  1021. showOnFocus: true,
  1022. step: 30,
  1023. stopScrollPropagation: false,
  1024. timeFormat: 'g:ia',
  1025. typeaheadHighlight: true,
  1026. useSelect: false,
  1027. wrapHours: true
  1028. };
  1029. }));