From 78a4398dde80d8ce086bc272b62b26ed0b8fec6f Mon Sep 17 00:00:00 2001 From: Farid Inawan Date: Sun, 15 Jul 2018 04:04:14 +0700 Subject: [PATCH] Update Timepicker (#1354) With the new one, the widget is not hidden in scrolling container --- plugins/timepicker/bootstrap-timepicker.css | 37 +- plugins/timepicker/bootstrap-timepicker.js | 722 ++++++++++++------ .../timepicker/bootstrap-timepicker.min.css | 2 +- .../timepicker/bootstrap-timepicker.min.js | 6 +- 4 files changed, 533 insertions(+), 234 deletions(-) diff --git a/plugins/timepicker/bootstrap-timepicker.css b/plugins/timepicker/bootstrap-timepicker.css index 873e0c723..64f781b26 100644 --- a/plugins/timepicker/bootstrap-timepicker.css +++ b/plugins/timepicker/bootstrap-timepicker.css @@ -23,16 +23,16 @@ left: auto; right: 13px; } -.bootstrap-timepicker .add-on { +.bootstrap-timepicker .input-group-addon { cursor: pointer; } -.bootstrap-timepicker .add-on i { +.bootstrap-timepicker .input-group-addon i { display: inline-block; width: 16px; height: 16px; } .bootstrap-timepicker-widget.dropdown-menu { - padding: 2px 3px 2px 2px; + padding: 4px; } .bootstrap-timepicker-widget.dropdown-menu.open { display: inline-block; @@ -43,9 +43,7 @@ border-right: 7px solid transparent; content: ""; display: inline-block; - left: 9px; position: absolute; - top: -7px; } .bootstrap-timepicker-widget.dropdown-menu:after { border-bottom: 6px solid #FFFFFF; @@ -53,10 +51,36 @@ border-right: 6px solid transparent; content: ""; display: inline-block; - left: 10px; position: absolute; +} +.bootstrap-timepicker-widget.timepicker-orient-left:before { + left: 6px; +} +.bootstrap-timepicker-widget.timepicker-orient-left:after { + left: 7px; +} +.bootstrap-timepicker-widget.timepicker-orient-right:before { + right: 6px; +} +.bootstrap-timepicker-widget.timepicker-orient-right:after { + right: 7px; +} +.bootstrap-timepicker-widget.timepicker-orient-top:before { + top: -7px; +} +.bootstrap-timepicker-widget.timepicker-orient-top:after { top: -6px; } +.bootstrap-timepicker-widget.timepicker-orient-bottom:before { + bottom: -7px; + border-bottom: 0; + border-top: 7px solid #999; +} +.bootstrap-timepicker-widget.timepicker-orient-bottom:after { + bottom: -6px; + border-bottom: 0; + border-top: 6px solid #ffffff; +} .bootstrap-timepicker-widget a.btn, .bootstrap-timepicker-widget input { border-radius: 4px; @@ -96,6 +120,7 @@ } .bootstrap-timepicker-widget table td a i { margin-top: 2px; + font-size: 18px; } .bootstrap-timepicker-widget table td input { width: 25px; diff --git a/plugins/timepicker/bootstrap-timepicker.js b/plugins/timepicker/bootstrap-timepicker.js index 3068c940c..bbb923c5e 100644 --- a/plugins/timepicker/bootstrap-timepicker.js +++ b/plugins/timepicker/bootstrap-timepicker.js @@ -1,16 +1,14 @@ -//TODO: move arrow styles and button click code into configurable items, with defaults matching the existing code - /*! -* Timepicker Component for Twitter Bootstrap -* -* Copyright 2013 Joris de Wit -* -* Contributors https://github.com/jdewit/bootstrap-timepicker/graphs/contributors -* -* For the full copyright and license information, please view the LICENSE -* file that was distributed with this source code. -*/ -(function($, window, document, undefined) { + * Timepicker Component for Twitter Bootstrap + * + * Copyright 2013 Joris de Wit and bootstrap-timepicker contributors + * + * Contributors https://github.com/jdewit/bootstrap-timepicker/graphs/contributors + * + * For the full copyright and license information, please view the LICENSE + * file that was distributed with this source code. + */ +(function($, window, document) { 'use strict'; // TIMEPICKER PUBLIC CLASS DEFINITION @@ -19,18 +17,33 @@ this.$element = $(element); this.defaultTime = options.defaultTime; this.disableFocus = options.disableFocus; + this.disableMousewheel = options.disableMousewheel; this.isOpen = options.isOpen; this.minuteStep = options.minuteStep; this.modalBackdrop = options.modalBackdrop; + this.orientation = options.orientation; this.secondStep = options.secondStep; + this.snapToStep = options.snapToStep; this.showInputs = options.showInputs; this.showMeridian = options.showMeridian; this.showSeconds = options.showSeconds; this.template = options.template; this.appendWidgetTo = options.appendWidgetTo; - this.upArrowStyle = options.upArrowStyle; - this.downArrowStyle = options.downArrowStyle; - this.containerClass = options.containerClass; + this.showWidgetOnAddonClick = options.showWidgetOnAddonClick; + this.icons = options.icons; + this.maxHours = options.maxHours; + this.explicitMode = options.explicitMode; // If true 123 = 1:23, 12345 = 1:23:45, else invalid. + + this.handleDocumentClick = function (e) { + var self = e.data.scope; + // This condition was inspired by bootstrap-datepicker. + // The element the timepicker is invoked on is the input but it has a sibling for addon/button. + if (!(self.$element.parent().find(e.target).length || + self.$widget.is(e.target) || + self.$widget.find(e.target).length)) { + self.hideWidget(); + } + }; this._init(); }; @@ -38,46 +51,41 @@ Timepicker.prototype = { constructor: Timepicker, - _init: function() { var self = this; - if (this.$element.parent().hasClass('input-append') || this.$element.parent().hasClass('input-prepend')) { - if (this.$element.parent('.input-append, .input-prepend').find('.add-on').length) { - this.$element.parent('.input-append, .input-prepend').find('.add-on').on({ - 'click.timepicker': $.proxy(this.showWidget, this) - }); - } else { - this.$element.closest(this.containerClass).find('.add-on').on({ - 'click.timepicker': $.proxy(this.showWidget, this) - }); - } - + if (this.showWidgetOnAddonClick && (this.$element.parent().hasClass('input-group') && this.$element.parent().hasClass('bootstrap-timepicker'))) { + this.$element.parent('.input-group.bootstrap-timepicker').find('.input-group-addon').on({ + 'click.timepicker': $.proxy(this.showWidget, this) + }); this.$element.on({ 'focus.timepicker': $.proxy(this.highlightUnit, this), 'click.timepicker': $.proxy(this.highlightUnit, this), 'keydown.timepicker': $.proxy(this.elementKeydown, this), - 'blur.timepicker': $.proxy(this.blurElement, this) + 'blur.timepicker': $.proxy(this.blurElement, this), + 'mousewheel.timepicker DOMMouseScroll.timepicker': $.proxy(this.mousewheel, this) }); } else { if (this.template) { this.$element.on({ 'focus.timepicker': $.proxy(this.showWidget, this), 'click.timepicker': $.proxy(this.showWidget, this), - 'blur.timepicker': $.proxy(this.blurElement, this) + 'blur.timepicker': $.proxy(this.blurElement, this), + 'mousewheel.timepicker DOMMouseScroll.timepicker': $.proxy(this.mousewheel, this) }); } else { this.$element.on({ 'focus.timepicker': $.proxy(this.highlightUnit, this), 'click.timepicker': $.proxy(this.highlightUnit, this), 'keydown.timepicker': $.proxy(this.elementKeydown, this), - 'blur.timepicker': $.proxy(this.blurElement, this) + 'blur.timepicker': $.proxy(this.blurElement, this), + 'mousewheel.timepicker DOMMouseScroll.timepicker': $.proxy(this.mousewheel, this) }); } } if (this.template !== false) { - this.$widget = $(this.getTemplate()).prependTo(this.$element.parents(this.appendWidgetTo)).on('click', $.proxy(this.widgetClick, this)); + this.$widget = $(this.getTemplate()).on('click', $.proxy(this.widgetClick, this)); } else { this.$widget = false; } @@ -86,7 +94,8 @@ this.$widget.find('input').each(function() { $(this).on({ 'click.timepicker': function() { $(this).select(); }, - 'keydown.timepicker': $.proxy(self.widgetKeydown, self) + 'keydown.timepicker': $.proxy(self.widgetKeydown, self), + 'keyup.timepicker': $.proxy(self.widgetKeyup, self) }); }); } @@ -95,10 +104,19 @@ }, blurElement: function() { - this.highlightedUnit = undefined; + this.highlightedUnit = null; this.updateFromElementVal(); }, + clear: function() { + this.hour = ''; + this.minute = ''; + this.second = ''; + this.meridian = ''; + + this.$element.val(''); + }, + decrementHour: function() { if (this.showMeridian) { if (this.hour === 1) { @@ -115,13 +133,12 @@ this.hour--; } } else { - if (this.hour === 0) { - this.hour = 23; + if (this.hour <= 0) { + this.hour = this.maxHours - 1; } else { this.hour--; } } - this.update(); }, decrementMinute: function(step) { @@ -139,7 +156,6 @@ } else { this.minute = newVal; } - this.update(); }, decrementSecond: function() { @@ -151,32 +167,25 @@ } else { this.second = newVal; } - this.update(); }, elementKeydown: function(e) { - switch (e.keyCode) { + switch (e.which) { case 9: //tab - this.updateFromElementVal(); - - switch (this.highlightedUnit) { - case 'hour': - e.preventDefault(); + if (e.shiftKey) { + if (this.highlightedUnit === 'hour') { + this.hideWidget(); + break; + } + this.highlightPrevUnit(); + } else if ((this.showMeridian && this.highlightedUnit === 'meridian') || (this.showSeconds && this.highlightedUnit === 'second') || (!this.showMeridian && !this.showSeconds && this.highlightedUnit ==='minute')) { + this.hideWidget(); + break; + } else { this.highlightNextUnit(); - break; - case 'minute': - if (this.showMeridian || this.showSeconds) { - e.preventDefault(); - this.highlightNextUnit(); - } - break; - case 'second': - if (this.showMeridian) { - e.preventDefault(); - this.highlightNextUnit(); - } - break; } + e.preventDefault(); + this.updateFromElementVal(); break; case 27: // escape this.updateFromElementVal(); @@ -206,11 +215,12 @@ this.highlightMeridian(); break; } + this.update(); break; case 39: // right arrow e.preventDefault(); - this.updateFromElementVal(); this.highlightNextUnit(); + this.updateFromElementVal(); break; case 40: // down arrow e.preventDefault(); @@ -232,18 +242,12 @@ this.highlightMeridian(); break; } + + this.update(); break; } }, - formatTime: function(hour, minute, second, meridian) { - hour = hour < 10 ? '0' + hour : hour; - minute = minute < 10 ? '0' + minute : minute; - second = second < 10 ? '0' + second : second; - - return hour + ':' + minute + (this.showSeconds ? ':' + second : '') + (this.showMeridian ? ' ' + meridian : ''); - }, - getCursorPosition: function() { var input = this.$element.get(0); @@ -270,10 +274,10 @@ templateContent; if (this.showInputs) { - hourTemplate = ''; - minuteTemplate = ''; - secondTemplate = ''; - meridianTemplate = ''; + hourTemplate = ''; + minuteTemplate = ''; + secondTemplate = ''; + meridianTemplate = ''; } else { hourTemplate = ''; minuteTemplate = ''; @@ -283,16 +287,16 @@ templateContent = ''+ ''+ - ''+ + ''+ ''+ - ''+ + ''+ (this.showSeconds ? ''+ - '' + '' : '') + (this.showMeridian ? ''+ - '' + '' : '') + ''+ ''+ @@ -309,16 +313,16 @@ : '') + ''+ ''+ - ''+ + ''+ ''+ - ''+ + ''+ (this.showSeconds ? ''+ - '' + '' : '') + (this.showMeridian ? ''+ - '' + '' : '') + ''+ '
   
  
'; @@ -327,7 +331,7 @@ case 'modal': template = '
'+ '
'+ - '×'+ + '×'+ '

Pick a Time

'+ '
'+ '
'+ @@ -347,7 +351,11 @@ }, getTime: function() { - return this.formatTime(this.hour, this.minute, this.second, this.meridian); + if (this.hour === '') { + return ''; + } + + return this.hour + ':' + (this.minute.toString().length === 1 ? '0' + this.minute : this.minute) + (this.showSeconds ? ':' + (this.second.toString().length === 1 ? '0' + this.second : this.second) : '') + (this.showMeridian ? ' ' + this.meridian : ''); }, hideWidget: function() { @@ -355,10 +363,6 @@ return; } - if (this.showInputs) { - this.updateFromWidgetInputs(); - } - this.$element.trigger({ 'type': 'hide.timepicker', 'time': { @@ -376,9 +380,11 @@ this.$widget.removeClass('open'); } - $(document).off('mousedown.timepicker'); + $(document).off('mousedown.timepicker, touchend.timepicker', this.handleDocumentClick); this.isOpen = false; + // show/hide approach taken by datepicker + this.$widget.detach(); }, highlightUnit: function() { @@ -428,7 +434,13 @@ highlightPrevUnit: function() { switch (this.highlightedUnit) { case 'hour': - this.highlightMeridian(); + if(this.showMeridian){ + this.highlightMeridian(); + } else if (this.showSeconds) { + this.highlightSecond(); + } else { + this.highlightMinute(); + } break; case 'minute': this.highlightHour(); @@ -447,57 +459,81 @@ }, highlightHour: function() { - var $element = this.$element.get(0); + var $element = this.$element.get(0), + self = this; this.highlightedUnit = 'hour'; - if ($element.setSelectionRange) { - setTimeout(function() { - $element.setSelectionRange(0,2); - }, 0); - } + if ($element.setSelectionRange) { + setTimeout(function() { + if (self.hour < 10) { + $element.setSelectionRange(0,1); + } else { + $element.setSelectionRange(0,2); + } + }, 0); + } }, highlightMinute: function() { - var $element = this.$element.get(0); + var $element = this.$element.get(0), + self = this; this.highlightedUnit = 'minute'; - if ($element.setSelectionRange) { - setTimeout(function() { - $element.setSelectionRange(3,5); - }, 0); - } + if ($element.setSelectionRange) { + setTimeout(function() { + if (self.hour < 10) { + $element.setSelectionRange(2,4); + } else { + $element.setSelectionRange(3,5); + } + }, 0); + } }, highlightSecond: function() { - var $element = this.$element.get(0); + var $element = this.$element.get(0), + self = this; this.highlightedUnit = 'second'; - if ($element.setSelectionRange) { - setTimeout(function() { - $element.setSelectionRange(6,8); - }, 0); - } + if ($element.setSelectionRange) { + setTimeout(function() { + if (self.hour < 10) { + $element.setSelectionRange(5,7); + } else { + $element.setSelectionRange(6,8); + } + }, 0); + } }, highlightMeridian: function() { - var $element = this.$element.get(0); + var $element = this.$element.get(0), + self = this; this.highlightedUnit = 'meridian'; - if ($element.setSelectionRange) { - if (this.showSeconds) { - setTimeout(function() { - $element.setSelectionRange(9,11); - }, 0); - } else { - setTimeout(function() { - $element.setSelectionRange(6,8); - }, 0); - } - } + if ($element.setSelectionRange) { + if (this.showSeconds) { + setTimeout(function() { + if (self.hour < 10) { + $element.setSelectionRange(8,10); + } else { + $element.setSelectionRange(9,11); + } + }, 0); + } else { + setTimeout(function() { + if (self.hour < 10) { + $element.setSelectionRange(5,7); + } else { + $element.setSelectionRange(6,8); + } + }, 0); + } + } }, incrementHour: function() { @@ -509,13 +545,12 @@ this.hour = 0; } } - if (this.hour === 23) { + if (this.hour === this.maxHours - 1) { this.hour = 0; return; } this.hour++; - this.update(); }, incrementMinute: function(step) { @@ -533,7 +568,6 @@ } else { this.minute = newVal; } - this.update(); }, incrementSecond: function() { @@ -545,7 +579,136 @@ } else { this.second = newVal; } - this.update(); + }, + + mousewheel: function(e) { + if (this.disableMousewheel) { + return; + } + + e.preventDefault(); + e.stopPropagation(); + + var delta = e.originalEvent.wheelDelta || -e.originalEvent.detail, + scrollTo = null; + + if (e.type === 'mousewheel') { + scrollTo = (e.originalEvent.wheelDelta * -1); + } + else if (e.type === 'DOMMouseScroll') { + scrollTo = 40 * e.originalEvent.detail; + } + + if (scrollTo) { + e.preventDefault(); + $(this).scrollTop(scrollTo + $(this).scrollTop()); + } + + switch (this.highlightedUnit) { + case 'minute': + if (delta > 0) { + this.incrementMinute(); + } else { + this.decrementMinute(); + } + this.highlightMinute(); + break; + case 'second': + if (delta > 0) { + this.incrementSecond(); + } else { + this.decrementSecond(); + } + this.highlightSecond(); + break; + case 'meridian': + this.toggleMeridian(); + this.highlightMeridian(); + break; + default: + if (delta > 0) { + this.incrementHour(); + } else { + this.decrementHour(); + } + this.highlightHour(); + break; + } + + return false; + }, + + /** + * Given a segment value like 43, will round and snap the segment + * to the nearest "step", like 45 if step is 15. Segment will + * "overflow" to 0 if it's larger than 59 or would otherwise + * round up to 60. + */ + changeToNearestStep: function (segment, step) { + if (segment % step === 0) { + return segment; + } + if (Math.round((segment % step) / step)) { + return (segment + (step - segment % step)) % 60; + } else { + return segment - segment % step; + } + }, + + // This method was adapted from bootstrap-datepicker. + place : function() { + if (this.isInline) { + return; + } + var widgetWidth = this.$widget.outerWidth(), widgetHeight = this.$widget.outerHeight(), visualPadding = 10, windowWidth = + $(window).width(), windowHeight = $(window).height(), scrollTop = $(window).scrollTop(); + + var zIndex = parseInt(this.$element.parents().filter(function() { return $(this).css('z-index') !== 'auto'; }).first().css('z-index'), 10) + 10; + var offset = this.component ? this.component.parent().offset() : this.$element.offset(); + var height = this.component ? this.component.outerHeight(true) : this.$element.outerHeight(false); + var width = this.component ? this.component.outerWidth(true) : this.$element.outerWidth(false); + var left = offset.left, top = offset.top; + + this.$widget.removeClass('timepicker-orient-top timepicker-orient-bottom timepicker-orient-right timepicker-orient-left'); + + if (this.orientation.x !== 'auto') { + this.$widget.addClass('timepicker-orient-' + this.orientation.x); + if (this.orientation.x === 'right') { + left -= widgetWidth - width; + } + } else{ + // auto x orientation is best-placement: if it crosses a window edge, fudge it sideways + // Default to left + this.$widget.addClass('timepicker-orient-left'); + if (offset.left < 0) { + left -= offset.left - visualPadding; + } else if (offset.left + widgetWidth > windowWidth) { + left = windowWidth - widgetWidth - visualPadding; + } + } + // auto y orientation is best-situation: top or bottom, no fudging, decision based on which shows more of the widget + var yorient = this.orientation.y, topOverflow, bottomOverflow; + if (yorient === 'auto') { + topOverflow = -scrollTop + offset.top - widgetHeight; + bottomOverflow = scrollTop + windowHeight - (offset.top + height + widgetHeight); + if (Math.max(topOverflow, bottomOverflow) === bottomOverflow) { + yorient = 'top'; + } else { + yorient = 'bottom'; + } + } + this.$widget.addClass('timepicker-orient-' + yorient); + if (yorient === 'top'){ + top += height; + } else{ + top -= widgetHeight + parseInt(this.$widget.css('padding-top'), 10); + } + + this.$widget.css({ + top : top, + left : left, + zIndex : zIndex + }); }, remove: function() { @@ -556,15 +719,31 @@ delete this.$element.data().timepicker; }, - setDefaultTime: function(defaultTime){ + setDefaultTime: function(defaultTime) { if (!this.$element.val()) { if (defaultTime === 'current') { var dTime = new Date(), hours = dTime.getHours(), - minutes = Math.floor(dTime.getMinutes() / this.minuteStep) * this.minuteStep, - seconds = Math.floor(dTime.getSeconds() / this.secondStep) * this.secondStep, + minutes = dTime.getMinutes(), + seconds = dTime.getSeconds(), meridian = 'AM'; + if (seconds !== 0) { + seconds = Math.ceil(dTime.getSeconds() / this.secondStep) * this.secondStep; + if (seconds === 60) { + minutes += 1; + seconds = 0; + } + } + + if (minutes !== 0) { + minutes = Math.ceil(dTime.getMinutes() / this.minuteStep) * this.minuteStep; + if (minutes === 60) { + hours += 1; + minutes = 0; + } + } + if (this.showMeridian) { if (hours === 0) { hours = 12; @@ -598,70 +777,135 @@ } }, - setTime: function(time) { - var arr, - timeArray; - - if (this.showMeridian) { - arr = time.split(' '); - timeArray = arr[0].split(':'); - this.meridian = arr[1]; - } else { - timeArray = time.split(':'); + setTime: function(time, ignoreWidget) { + if (!time) { + this.clear(); + return; } - this.hour = parseInt(timeArray[0], 10); - this.minute = parseInt(timeArray[1], 10); - this.second = parseInt(timeArray[2], 10); + var timeMode, + timeArray, + hour, + minute, + second, + meridian; - if (isNaN(this.hour)) { - this.hour = 0; - } - if (isNaN(this.minute)) { - this.minute = 0; - } + if (typeof time === 'object' && time.getMonth){ + // this is a date object + hour = time.getHours(); + minute = time.getMinutes(); + second = time.getSeconds(); - if (this.showMeridian) { - if (this.hour > 12) { - this.hour = 12; - } else if (this.hour < 1) { - this.hour = 12; - } + if (this.showMeridian){ + meridian = 'AM'; + if (hour > 12){ + meridian = 'PM'; + hour = hour % 12; + } - if (this.meridian === 'am' || this.meridian === 'a') { - this.meridian = 'AM'; - } else if (this.meridian === 'pm' || this.meridian === 'p') { - this.meridian = 'PM'; - } - - if (this.meridian !== 'AM' && this.meridian !== 'PM') { - this.meridian = 'AM'; + if (hour === 12){ + meridian = 'PM'; + } } } else { - if (this.hour >= 24) { - this.hour = 23; - } else if (this.hour < 0) { - this.hour = 0; + timeMode = ((/a/i).test(time) ? 1 : 0) + ((/p/i).test(time) ? 2 : 0); // 0 = none, 1 = AM, 2 = PM, 3 = BOTH. + if (timeMode > 2) { // If both are present, fail. + this.clear(); + return; + } + + timeArray = time.replace(/[^0-9\:]/g, '').split(':'); + + hour = timeArray[0] ? timeArray[0].toString() : timeArray.toString(); + + if(this.explicitMode && hour.length > 2 && (hour.length % 2) !== 0 ) { + this.clear(); + return; + } + + minute = timeArray[1] ? timeArray[1].toString() : ''; + second = timeArray[2] ? timeArray[2].toString() : ''; + + // adaptive time parsing + if (hour.length > 4) { + second = hour.slice(-2); + hour = hour.slice(0, -2); + } + + if (hour.length > 2) { + minute = hour.slice(-2); + hour = hour.slice(0, -2); + } + + if (minute.length > 2) { + second = minute.slice(-2); + minute = minute.slice(0, -2); + } + + hour = parseInt(hour, 10); + minute = parseInt(minute, 10); + second = parseInt(second, 10); + + if (isNaN(hour)) { + hour = 0; + } + if (isNaN(minute)) { + minute = 0; + } + if (isNaN(second)) { + second = 0; + } + + // Adjust the time based upon unit boundary. + // NOTE: Negatives will never occur due to time.replace() above. + if (second > 59) { + second = 59; + } + + if (minute > 59) { + minute = 59; + } + + if (hour >= this.maxHours) { + // No day/date handling. + hour = this.maxHours - 1; + } + + if (this.showMeridian) { + if (hour > 12) { + // Force PM. + timeMode = 2; + hour -= 12; + } + if (!timeMode) { + timeMode = 1; + } + if (hour === 0) { + hour = 12; // AM or PM, reset to 12. 0 AM = 12 AM. 0 PM = 12 PM, etc. + } + meridian = timeMode === 1 ? 'AM' : 'PM'; + } else if (hour < 12 && timeMode === 2) { + hour += 12; + } else { + if (hour >= this.maxHours) { + hour = this.maxHours - 1; + } else if ((hour < 0) || (hour === 12 && timeMode === 1)){ + hour = 0; + } } } - if (this.minute < 0) { - this.minute = 0; - } else if (this.minute >= 60) { - this.minute = 59; + this.hour = hour; + if (this.snapToStep) { + this.minute = this.changeToNearestStep(minute, this.minuteStep); + this.second = this.changeToNearestStep(second, this.secondStep); + } else { + this.minute = minute; + this.second = second; } + this.meridian = meridian; - if (this.showSeconds) { - if (isNaN(this.second)) { - this.second = 0; - } else if (this.second < 0) { - this.second = 0; - } else if (this.second >= 60) { - this.second = 59; - } - } - - this.update(); + this.update(ignoreWidget); }, showWidget: function() { @@ -673,13 +917,9 @@ return; } - var self = this; - $(document).on('mousedown.timepicker', function (e) { - // Clicked outside the timepicker, hide it - if ($(e.target).closest('.bootstrap-timepicker-widget').length === 0) { - self.hideWidget(); - } - }); + // show/hide approach taken by datepicker + this.$widget.appendTo(this.appendWidgetTo); + $(document).on('mousedown.timepicker, touchend.timepicker', {scope: this}, this.handleDocumentClick); this.$element.trigger({ 'type': 'show.timepicker', @@ -692,11 +932,19 @@ } }); + this.place(); if (this.disableFocus) { this.$element.blur(); } - this.updateFromElementVal(); + // widget shouldn't be empty on open + if (this.hour === '') { + if (this.defaultTime) { + this.setDefaultTime(this.defaultTime); + } else { + this.setTime('0:0:0'); + } + } if (this.template === 'modal' && this.$widget.modal) { this.$widget.modal('show').on('hidden', $.proxy(this.hideWidget, this)); @@ -711,10 +959,14 @@ toggleMeridian: function() { this.meridian = this.meridian === 'AM' ? 'PM' : 'AM'; - this.update(); }, - update: function() { + update: function(ignoreWidget) { + this.updateElement(); + if (!ignoreWidget) { + this.updateWidget(); + } + this.$element.trigger({ 'type': 'changeTime.timepicker', 'time': { @@ -725,9 +977,6 @@ 'meridian': this.meridian } }); - - this.updateElement(); - this.updateWidget(); }, updateElement: function() { @@ -735,11 +984,7 @@ }, updateFromElementVal: function() { - var val = this.$element.val(); - - if (val) { - this.setTime(val); - } + this.setTime(this.$element.val()); }, updateWidget: function() { @@ -747,9 +992,9 @@ return; } - var hour = this.hour < 10 ? '0' + this.hour : this.hour, - minute = this.minute < 10 ? '0' + this.minute : this.minute, - second = this.second < 10 ? '0' + this.second : this.second; + var hour = this.hour, + minute = this.minute.toString().length === 1 ? '0' + this.minute : this.minute, + second = this.second.toString().length === 1 ? '0' + this.second : this.second; if (this.showInputs) { this.$widget.find('input.bootstrap-timepicker-hour').val(hour); @@ -778,47 +1023,46 @@ if (this.$widget === false) { return; } - var time = $('input.bootstrap-timepicker-hour', this.$widget).val() + ':' + - $('input.bootstrap-timepicker-minute', this.$widget).val() + - (this.showSeconds ? ':' + $('input.bootstrap-timepicker-second', this.$widget).val() : '') + - (this.showMeridian ? ' ' + $('input.bootstrap-timepicker-meridian', this.$widget).val() : ''); - this.setTime(time); + var t = this.$widget.find('input.bootstrap-timepicker-hour').val() + ':' + + this.$widget.find('input.bootstrap-timepicker-minute').val() + + (this.showSeconds ? ':' + this.$widget.find('input.bootstrap-timepicker-second').val() : '') + + (this.showMeridian ? this.$widget.find('input.bootstrap-timepicker-meridian').val() : '') + ; + + this.setTime(t, true); }, widgetClick: function(e) { e.stopPropagation(); e.preventDefault(); - var action = $(e.target).closest('a').data('action'); + var $input = $(e.target), + action = $input.closest('a').data('action'); + if (action) { this[action](); } + this.update(); + + if ($input.is('input')) { + $input.get(0).setSelectionRange(0,2); + } }, widgetKeydown: function(e) { - var $input = $(e.target).closest('input'), - name = $input.attr('name'); + var $input = $(e.target), + name = $input.attr('class').replace('bootstrap-timepicker-', ''); - switch (e.keyCode) { + switch (e.which) { case 9: //tab - if (this.showMeridian) { - if (name === 'meridian') { + if (e.shiftKey) { + if (name === 'hour') { return this.hideWidget(); } - } else { - if (this.showSeconds) { - if (name === 'second') { - return this.hideWidget(); - } - } else { - if (name === 'minute') { - return this.hideWidget(); - } - } + } else if ((this.showMeridian && name === 'meridian') || (this.showSeconds && name === 'second') || (!this.showMeridian && !this.showSeconds && name === 'minute')) { + return this.hideWidget(); } - - this.updateFromWidgetInputs(); break; case 27: // escape this.hideWidget(); @@ -839,6 +1083,8 @@ this.toggleMeridian(); break; } + this.setTime(this.getTime()); + $input.get(0).setSelectionRange(0,2); break; case 40: // down arrow e.preventDefault(); @@ -856,12 +1102,19 @@ this.toggleMeridian(); break; } + this.setTime(this.getTime()); + $input.get(0).setSelectionRange(0,2); break; } + }, + + widgetKeyup: function(e) { + if ((e.which === 65) || (e.which === 77) || (e.which === 80) || (e.which === 46) || (e.which === 8) || (e.which >= 48 && e.which <= 57) || (e.which >= 96 && e.which <= 105)) { + this.updateFromWidgetInputs(); + } } }; - //TIMEPICKER PLUGIN DEFINITION $.fn.timepicker = function(option) { var args = Array.apply(null, arguments); @@ -884,20 +1137,41 @@ $.fn.timepicker.defaults = { defaultTime: 'current', disableFocus: false, + disableMousewheel: false, isOpen: false, minuteStep: 15, modalBackdrop: false, + orientation: { x: 'auto', y: 'auto'}, secondStep: 15, + snapToStep: false, showSeconds: false, showInputs: true, showMeridian: true, template: 'dropdown', - appendWidgetTo: '.bootstrap-timepicker', - upArrowStyle: 'glyphicon glyphicon-chevron-up', - downArrowStyle: 'glyphicon glyphicon-chevron-down', - containerClass: 'bootstrap-timepicker' + appendWidgetTo: 'body', + showWidgetOnAddonClick: true, + icons: { + up: 'glyphicon glyphicon-chevron-up', + down: 'glyphicon glyphicon-chevron-down' + }, + maxHours: 24, + explicitMode: false }; $.fn.timepicker.Constructor = Timepicker; + $(document).on( + 'focus.timepicker.data-api click.timepicker.data-api', + '[data-provide="timepicker"]', + function(e){ + var $this = $(this); + if ($this.data('timepicker')) { + return; + } + e.preventDefault(); + // component click requires us to explicitly show it + $this.timepicker(); + } + ); + })(jQuery, window, document); diff --git a/plugins/timepicker/bootstrap-timepicker.min.css b/plugins/timepicker/bootstrap-timepicker.min.css index b59d6f76c..cd81b0226 100644 --- a/plugins/timepicker/bootstrap-timepicker.min.css +++ b/plugins/timepicker/bootstrap-timepicker.min.css @@ -7,4 +7,4 @@ * * For the full copyright and license information, please view the LICENSE * file that was distributed with this source code. - */.bootstrap-timepicker{position:relative}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu{left:auto;right:0}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:before{left:auto;right:12px}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:after{left:auto;right:13px}.bootstrap-timepicker .add-on{cursor:pointer}.bootstrap-timepicker .add-on i{display:inline-block;width:16px;height:16px}.bootstrap-timepicker-widget.dropdown-menu{padding:2px 3px 2px 2px}.bootstrap-timepicker-widget.dropdown-menu.open{display:inline-block}.bootstrap-timepicker-widget.dropdown-menu:before{border-bottom:7px solid rgba(0,0,0,0.2);border-left:7px solid transparent;border-right:7px solid transparent;content:"";display:inline-block;left:9px;position:absolute;top:-7px}.bootstrap-timepicker-widget.dropdown-menu:after{border-bottom:6px solid #fff;border-left:6px solid transparent;border-right:6px solid transparent;content:"";display:inline-block;left:10px;position:absolute;top:-6px}.bootstrap-timepicker-widget a.btn,.bootstrap-timepicker-widget input{border-radius:4px}.bootstrap-timepicker-widget table{width:100%;margin:0}.bootstrap-timepicker-widget table td{text-align:center;height:30px;margin:0;padding:2px}.bootstrap-timepicker-widget table td:not(.separator){min-width:30px}.bootstrap-timepicker-widget table td span{width:100%}.bootstrap-timepicker-widget table td a{border:1px transparent solid;width:100%;display:inline-block;margin:0;padding:8px 0;outline:0;color:#333}.bootstrap-timepicker-widget table td a:hover{text-decoration:none;background-color:#eee;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;border-color:#ddd}.bootstrap-timepicker-widget table td a i{margin-top:2px}.bootstrap-timepicker-widget table td input{width:25px;margin:0;text-align:center}.bootstrap-timepicker-widget .modal-content{padding:4px}@media(min-width:767px){.bootstrap-timepicker-widget.modal{width:200px;margin-left:-100px}}@media(max-width:767px){.bootstrap-timepicker{width:100%}.bootstrap-timepicker .dropdown-menu{width:100%}} \ No newline at end of file + */.bootstrap-timepicker{position:relative}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu{left:auto;right:0}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:before{left:auto;right:12px}.bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:after{left:auto;right:13px}.bootstrap-timepicker .input-group-addon{cursor:pointer}.bootstrap-timepicker .input-group-addon i{display:inline-block;width:16px;height:16px}.bootstrap-timepicker-widget.dropdown-menu{padding:4px}.bootstrap-timepicker-widget.dropdown-menu.open{display:inline-block}.bootstrap-timepicker-widget.dropdown-menu:before{border-bottom:7px solid rgba(0,0,0,0.2);border-left:7px solid transparent;border-right:7px solid transparent;content:"";display:inline-block;position:absolute}.bootstrap-timepicker-widget.dropdown-menu:after{border-bottom:6px solid #fff;border-left:6px solid transparent;border-right:6px solid transparent;content:"";display:inline-block;position:absolute}.bootstrap-timepicker-widget.timepicker-orient-left:before{left:6px}.bootstrap-timepicker-widget.timepicker-orient-left:after{left:7px}.bootstrap-timepicker-widget.timepicker-orient-right:before{right:6px}.bootstrap-timepicker-widget.timepicker-orient-right:after{right:7px}.bootstrap-timepicker-widget.timepicker-orient-top:before{top:-7px}.bootstrap-timepicker-widget.timepicker-orient-top:after{top:-6px}.bootstrap-timepicker-widget.timepicker-orient-bottom:before{bottom:-7px;border-bottom:0;border-top:7px solid #999}.bootstrap-timepicker-widget.timepicker-orient-bottom:after{bottom:-6px;border-bottom:0;border-top:6px solid #fff}.bootstrap-timepicker-widget a.btn,.bootstrap-timepicker-widget input{border-radius:4px}.bootstrap-timepicker-widget table{width:100%;margin:0}.bootstrap-timepicker-widget table td{text-align:center;height:30px;margin:0;padding:2px}.bootstrap-timepicker-widget table td:not(.separator){min-width:30px}.bootstrap-timepicker-widget table td span{width:100%}.bootstrap-timepicker-widget table td a{border:1px transparent solid;width:100%;display:inline-block;margin:0;padding:8px 0;outline:0;color:#333}.bootstrap-timepicker-widget table td a:hover{text-decoration:none;background-color:#eee;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;border-color:#ddd}.bootstrap-timepicker-widget table td a i{margin-top:2px;font-size:18px}.bootstrap-timepicker-widget table td input{width:25px;margin:0;text-align:center}.bootstrap-timepicker-widget .modal-content{padding:4px}@media(min-width:767px){.bootstrap-timepicker-widget.modal{width:200px;margin-left:-100px}}@media(max-width:767px){.bootstrap-timepicker{width:100%}.bootstrap-timepicker .dropdown-menu{width:100%}} \ No newline at end of file diff --git a/plugins/timepicker/bootstrap-timepicker.min.js b/plugins/timepicker/bootstrap-timepicker.min.js index 3c78d5c91..fe73e7461 100644 --- a/plugins/timepicker/bootstrap-timepicker.min.js +++ b/plugins/timepicker/bootstrap-timepicker.min.js @@ -1,5 +1,5 @@ -/*! bootstrap-timepicker v0.2.3 +/*! bootstrap-timepicker v0.5.2 * http://jdewit.github.com/bootstrap-timepicker -* Copyright (c) 2013 Joris de Wit +* Copyright (c) 2016 Joris de Wit and bootstrap-timepicker contributors * MIT License -*/(function(e,t,n,r){"use strict";var i=function(t,n){this.widget="";this.$element=e(t);this.defaultTime=n.defaultTime;this.disableFocus=n.disableFocus;this.isOpen=n.isOpen;this.minuteStep=n.minuteStep;this.modalBackdrop=n.modalBackdrop;this.secondStep=n.secondStep;this.showInputs=n.showInputs;this.showMeridian=n.showMeridian;this.showSeconds=n.showSeconds;this.template=n.template;this.appendWidgetTo=n.appendWidgetTo;this.upArrowStyle=n.upArrowStyle;this.downArrowStyle=n.downArrowStyle;this.containerClass=n.containerClass;this._init()};i.prototype={constructor:i,_init:function(){var t=this;if(this.$element.parent().hasClass("input-append")||this.$element.parent().hasClass("input-prepend")){if(this.$element.parent(".input-append, .input-prepend").find(".add-on").length){this.$element.parent(".input-append, .input-prepend").find(".add-on").on({"click.timepicker":e.proxy(this.showWidget,this)})}else{this.$element.closest(this.containerClass).find(".add-on").on({"click.timepicker":e.proxy(this.showWidget,this)})}this.$element.on({"focus.timepicker":e.proxy(this.highlightUnit,this),"click.timepicker":e.proxy(this.highlightUnit,this),"keydown.timepicker":e.proxy(this.elementKeydown,this),"blur.timepicker":e.proxy(this.blurElement,this)})}else{if(this.template){this.$element.on({"focus.timepicker":e.proxy(this.showWidget,this),"click.timepicker":e.proxy(this.showWidget,this),"blur.timepicker":e.proxy(this.blurElement,this)})}else{this.$element.on({"focus.timepicker":e.proxy(this.highlightUnit,this),"click.timepicker":e.proxy(this.highlightUnit,this),"keydown.timepicker":e.proxy(this.elementKeydown,this),"blur.timepicker":e.proxy(this.blurElement,this)})}}if(this.template!==false){this.$widget=e(this.getTemplate()).prependTo(this.$element.parents(this.appendWidgetTo)).on("click",e.proxy(this.widgetClick,this))}else{this.$widget=false}if(this.showInputs&&this.$widget!==false){this.$widget.find("input").each(function(){e(this).on({"click.timepicker":function(){e(this).select()},"keydown.timepicker":e.proxy(t.widgetKeydown,t)})})}this.setDefaultTime(this.defaultTime)},blurElement:function(){this.highlightedUnit=r;this.updateFromElementVal()},decrementHour:function(){if(this.showMeridian){if(this.hour===1){this.hour=12}else if(this.hour===12){this.hour--;return this.toggleMeridian()}else if(this.hour===0){this.hour=11;return this.toggleMeridian()}else{this.hour--}}else{if(this.hour===0){this.hour=23}else{this.hour--}}this.update()},decrementMinute:function(e){var t;if(e){t=this.minute-e}else{t=this.minute-this.minuteStep}if(t<0){this.decrementHour();this.minute=t+60}else{this.minute=t}this.update()},decrementSecond:function(){var e=this.second-this.secondStep;if(e<0){this.decrementMinute(true);this.second=e+60}else{this.second=e}this.update()},elementKeydown:function(e){switch(e.keyCode){case 9:this.updateFromElementVal();switch(this.highlightedUnit){case"hour":e.preventDefault();this.highlightNextUnit();break;case"minute":if(this.showMeridian||this.showSeconds){e.preventDefault();this.highlightNextUnit()}break;case"second":if(this.showMeridian){e.preventDefault();this.highlightNextUnit()}break}break;case 27:this.updateFromElementVal();break;case 37:e.preventDefault();this.highlightPrevUnit();this.updateFromElementVal();break;case 38:e.preventDefault();switch(this.highlightedUnit){case"hour":this.incrementHour();this.highlightHour();break;case"minute":this.incrementMinute();this.highlightMinute();break;case"second":this.incrementSecond();this.highlightSecond();break;case"meridian":this.toggleMeridian();this.highlightMeridian();break}break;case 39:e.preventDefault();this.updateFromElementVal();this.highlightNextUnit();break;case 40:e.preventDefault();switch(this.highlightedUnit){case"hour":this.decrementHour();this.highlightHour();break;case"minute":this.decrementMinute();this.highlightMinute();break;case"second":this.decrementSecond();this.highlightSecond();break;case"meridian":this.toggleMeridian();this.highlightMeridian();break}break}},formatTime:function(e,t,n,r){e=e<10?"0"+e:e;t=t<10?"0"+t:t;n=n<10?"0"+n:n;return e+":"+t+(this.showSeconds?":"+n:"")+(this.showMeridian?" "+r:"")},getCursorPosition:function(){var e=this.$element.get(0);if("selectionStart"in e){return e.selectionStart}else if(n.selection){e.focus();var t=n.selection.createRange(),r=n.selection.createRange().text.length;t.moveStart("character",-e.value.length);return t.text.length-r}},getTemplate:function(){var e,t,n,r,i,s;if(this.showInputs){t='';n='';r='';i=''}else{t='';n='';r='';i=''}s=""+""+''+''+''+(this.showSeconds?''+'':"")+(this.showMeridian?''+'':"")+""+""+" "+''+" "+(this.showSeconds?''+"":"")+(this.showMeridian?''+"":"")+""+""+''+''+''+(this.showSeconds?''+'':"")+(this.showMeridian?''+'':"")+""+"
   
"+t+":"+n+":"+r+" "+i+"
  
";switch(this.template){case"modal":e='
'+'
'+'×'+"

Pick a Time

"+"
"+'
'+s+"
"+'
'+'OK'+"
"+"
";break;case"dropdown":e='
'+s+"
";break}return e},getTime:function(){return this.formatTime(this.hour,this.minute,this.second,this.meridian)},hideWidget:function(){if(this.isOpen===false){return}if(this.showInputs){this.updateFromWidgetInputs()}this.$element.trigger({type:"hide.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}});if(this.template==="modal"&&this.$widget.modal){this.$widget.modal("hide")}else{this.$widget.removeClass("open")}e(n).off("mousedown.timepicker");this.isOpen=false},highlightUnit:function(){this.position=this.getCursorPosition();if(this.position>=0&&this.position<=2){this.highlightHour()}else if(this.position>=3&&this.position<=5){this.highlightMinute()}else if(this.position>=6&&this.position<=8){if(this.showSeconds){this.highlightSecond()}else{this.highlightMeridian()}}else if(this.position>=9&&this.position<=11){this.highlightMeridian()}},highlightNextUnit:function(){switch(this.highlightedUnit){case"hour":this.highlightMinute();break;case"minute":if(this.showSeconds){this.highlightSecond()}else if(this.showMeridian){this.highlightMeridian()}else{this.highlightHour()}break;case"second":if(this.showMeridian){this.highlightMeridian()}else{this.highlightHour()}break;case"meridian":this.highlightHour();break}},highlightPrevUnit:function(){switch(this.highlightedUnit){case"hour":this.highlightMeridian();break;case"minute":this.highlightHour();break;case"second":this.highlightMinute();break;case"meridian":if(this.showSeconds){this.highlightSecond()}else{this.highlightMinute()}break}},highlightHour:function(){var e=this.$element.get(0);this.highlightedUnit="hour";if(e.setSelectionRange){setTimeout(function(){e.setSelectionRange(0,2)},0)}},highlightMinute:function(){var e=this.$element.get(0);this.highlightedUnit="minute";if(e.setSelectionRange){setTimeout(function(){e.setSelectionRange(3,5)},0)}},highlightSecond:function(){var e=this.$element.get(0);this.highlightedUnit="second";if(e.setSelectionRange){setTimeout(function(){e.setSelectionRange(6,8)},0)}},highlightMeridian:function(){var e=this.$element.get(0);this.highlightedUnit="meridian";if(e.setSelectionRange){if(this.showSeconds){setTimeout(function(){e.setSelectionRange(9,11)},0)}else{setTimeout(function(){e.setSelectionRange(6,8)},0)}}},incrementHour:function(){if(this.showMeridian){if(this.hour===11){this.hour++;return this.toggleMeridian()}else if(this.hour===12){this.hour=0}}if(this.hour===23){this.hour=0;return}this.hour++;this.update()},incrementMinute:function(e){var t;if(e){t=this.minute+e}else{t=this.minute+this.minuteStep-this.minute%this.minuteStep}if(t>59){this.incrementHour();this.minute=t-60}else{this.minute=t}this.update()},incrementSecond:function(){var e=this.second+this.secondStep-this.second%this.secondStep;if(e>59){this.incrementMinute(true);this.second=e-60}else{this.second=e}this.update()},remove:function(){e("document").off(".timepicker");if(this.$widget){this.$widget.remove()}delete this.$element.data().timepicker},setDefaultTime:function(e){if(!this.$element.val()){if(e==="current"){var t=new Date,n=t.getHours(),r=Math.floor(t.getMinutes()/this.minuteStep)*this.minuteStep,i=Math.floor(t.getSeconds()/this.secondStep)*this.secondStep,s="AM";if(this.showMeridian){if(n===0){n=12}else if(n>=12){if(n>12){n=n-12}s="PM"}else{s="AM"}}this.hour=n;this.minute=r;this.second=i;this.meridian=s;this.update()}else if(e===false){this.hour=0;this.minute=0;this.second=0;this.meridian="AM"}else{this.setTime(e)}}else{this.updateFromElementVal()}},setTime:function(e){var t,n;if(this.showMeridian){t=e.split(" ");n=t[0].split(":");this.meridian=t[1]}else{n=e.split(":")}this.hour=parseInt(n[0],10);this.minute=parseInt(n[1],10);this.second=parseInt(n[2],10);if(isNaN(this.hour)){this.hour=0}if(isNaN(this.minute)){this.minute=0}if(this.showMeridian){if(this.hour>12){this.hour=12}else if(this.hour<1){this.hour=12}if(this.meridian==="am"||this.meridian==="a"){this.meridian="AM"}else if(this.meridian==="pm"||this.meridian==="p"){this.meridian="PM"}if(this.meridian!=="AM"&&this.meridian!=="PM"){this.meridian="AM"}}else{if(this.hour>=24){this.hour=23}else if(this.hour<0){this.hour=0}}if(this.minute<0){this.minute=0}else if(this.minute>=60){this.minute=59}if(this.showSeconds){if(isNaN(this.second)){this.second=0}else if(this.second<0){this.second=0}else if(this.second>=60){this.second=59}}this.update()},showWidget:function(){if(this.isOpen){return}if(this.$element.is(":disabled")){return}var t=this;e(n).on("mousedown.timepicker",function(n){if(e(n.target).closest(".bootstrap-timepicker-widget").length===0){t.hideWidget()}});this.$element.trigger({type:"show.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}});if(this.disableFocus){this.$element.blur()}this.updateFromElementVal();if(this.template==="modal"&&this.$widget.modal){this.$widget.modal("show").on("hidden",e.proxy(this.hideWidget,this))}else{if(this.isOpen===false){this.$widget.addClass("open")}}this.isOpen=true},toggleMeridian:function(){this.meridian=this.meridian==="AM"?"PM":"AM";this.update()},update:function(){this.$element.trigger({type:"changeTime.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}});this.updateElement();this.updateWidget()},updateElement:function(){this.$element.val(this.getTime()).change()},updateFromElementVal:function(){var e=this.$element.val();if(e){this.setTime(e)}},updateWidget:function(){if(this.$widget===false){return}var e=this.hour<10?"0"+this.hour:this.hour,t=this.minute<10?"0"+this.minute:this.minute,n=this.second<10?"0"+this.second:this.second;if(this.showInputs){this.$widget.find("input.bootstrap-timepicker-hour").val(e);this.$widget.find("input.bootstrap-timepicker-minute").val(t);if(this.showSeconds){this.$widget.find("input.bootstrap-timepicker-second").val(n)}if(this.showMeridian){this.$widget.find("input.bootstrap-timepicker-meridian").val(this.meridian)}}else{this.$widget.find("span.bootstrap-timepicker-hour").text(e);this.$widget.find("span.bootstrap-timepicker-minute").text(t);if(this.showSeconds){this.$widget.find("span.bootstrap-timepicker-second").text(n)}if(this.showMeridian){this.$widget.find("span.bootstrap-timepicker-meridian").text(this.meridian)}}},updateFromWidgetInputs:function(){if(this.$widget===false){return}var t=e("input.bootstrap-timepicker-hour",this.$widget).val()+":"+e("input.bootstrap-timepicker-minute",this.$widget).val()+(this.showSeconds?":"+e("input.bootstrap-timepicker-second",this.$widget).val():"")+(this.showMeridian?" "+e("input.bootstrap-timepicker-meridian",this.$widget).val():"");this.setTime(t)},widgetClick:function(t){t.stopPropagation();t.preventDefault();var n=e(t.target).closest("a").data("action");if(n){this[n]()}},widgetKeydown:function(t){var n=e(t.target).closest("input"),r=n.attr("name");switch(t.keyCode){case 9:if(this.showMeridian){if(r==="meridian"){return this.hideWidget()}}else{if(this.showSeconds){if(r==="second"){return this.hideWidget()}}else{if(r==="minute"){return this.hideWidget()}}}this.updateFromWidgetInputs();break;case 27:this.hideWidget();break;case 38:t.preventDefault();switch(r){case"hour":this.incrementHour();break;case"minute":this.incrementMinute();break;case"second":this.incrementSecond();break;case"meridian":this.toggleMeridian();break}break;case 40:t.preventDefault();switch(r){case"hour":this.decrementHour();break;case"minute":this.decrementMinute();break;case"second":this.decrementSecond();break;case"meridian":this.toggleMeridian();break}break}}};e.fn.timepicker=function(t){var n=Array.apply(null,arguments);n.shift();return this.each(function(){var r=e(this),s=r.data("timepicker"),o=typeof t==="object"&&t;if(!s){r.data("timepicker",s=new i(this,e.extend({},e.fn.timepicker.defaults,o,e(this).data())))}if(typeof t==="string"){s[t].apply(s,n)}})};e.fn.timepicker.defaults={defaultTime:"current",disableFocus:false,isOpen:false,minuteStep:15,modalBackdrop:false,secondStep:15,showSeconds:false,showInputs:true,showMeridian:true,template:"dropdown",appendWidgetTo:".bootstrap-timepicker",upArrowStyle:"glyphicon glyphicon-chevron-up",downArrowStyle:"glyphicon glyphicon-chevron-down",containerClass:"bootstrap-timepicker"};e.fn.timepicker.Constructor=i})(jQuery,window,document) \ No newline at end of file +*/!function(a,b,c){"use strict";var d=function(b,c){this.widget="",this.$element=a(b),this.defaultTime=c.defaultTime,this.disableFocus=c.disableFocus,this.disableMousewheel=c.disableMousewheel,this.isOpen=c.isOpen,this.minuteStep=c.minuteStep,this.modalBackdrop=c.modalBackdrop,this.orientation=c.orientation,this.secondStep=c.secondStep,this.snapToStep=c.snapToStep,this.showInputs=c.showInputs,this.showMeridian=c.showMeridian,this.showSeconds=c.showSeconds,this.template=c.template,this.appendWidgetTo=c.appendWidgetTo,this.showWidgetOnAddonClick=c.showWidgetOnAddonClick,this.icons=c.icons,this.maxHours=c.maxHours,this.explicitMode=c.explicitMode,this.handleDocumentClick=function(a){var b=a.data.scope;b.$element.parent().find(a.target).length||b.$widget.is(a.target)||b.$widget.find(a.target).length||b.hideWidget()},this._init()};d.prototype={constructor:d,_init:function(){var b=this;this.showWidgetOnAddonClick&&this.$element.parent().hasClass("input-group")&&this.$element.parent().hasClass("bootstrap-timepicker")?(this.$element.parent(".input-group.bootstrap-timepicker").find(".input-group-addon").on({"click.timepicker":a.proxy(this.showWidget,this)}),this.$element.on({"focus.timepicker":a.proxy(this.highlightUnit,this),"click.timepicker":a.proxy(this.highlightUnit,this),"keydown.timepicker":a.proxy(this.elementKeydown,this),"blur.timepicker":a.proxy(this.blurElement,this),"mousewheel.timepicker DOMMouseScroll.timepicker":a.proxy(this.mousewheel,this)})):this.template?this.$element.on({"focus.timepicker":a.proxy(this.showWidget,this),"click.timepicker":a.proxy(this.showWidget,this),"blur.timepicker":a.proxy(this.blurElement,this),"mousewheel.timepicker DOMMouseScroll.timepicker":a.proxy(this.mousewheel,this)}):this.$element.on({"focus.timepicker":a.proxy(this.highlightUnit,this),"click.timepicker":a.proxy(this.highlightUnit,this),"keydown.timepicker":a.proxy(this.elementKeydown,this),"blur.timepicker":a.proxy(this.blurElement,this),"mousewheel.timepicker DOMMouseScroll.timepicker":a.proxy(this.mousewheel,this)}),this.template!==!1?this.$widget=a(this.getTemplate()).on("click",a.proxy(this.widgetClick,this)):this.$widget=!1,this.showInputs&&this.$widget!==!1&&this.$widget.find("input").each(function(){a(this).on({"click.timepicker":function(){a(this).select()},"keydown.timepicker":a.proxy(b.widgetKeydown,b),"keyup.timepicker":a.proxy(b.widgetKeyup,b)})}),this.setDefaultTime(this.defaultTime)},blurElement:function(){this.highlightedUnit=null,this.updateFromElementVal()},clear:function(){this.hour="",this.minute="",this.second="",this.meridian="",this.$element.val("")},decrementHour:function(){if(this.showMeridian)if(1===this.hour)this.hour=12;else{if(12===this.hour)return this.hour--,this.toggleMeridian();if(0===this.hour)return this.hour=11,this.toggleMeridian();this.hour--}else this.hour<=0?this.hour=this.maxHours-1:this.hour--},decrementMinute:function(a){var b;b=a?this.minute-a:this.minute-this.minuteStep,0>b?(this.decrementHour(),this.minute=b+60):this.minute=b},decrementSecond:function(){var a=this.second-this.secondStep;0>a?(this.decrementMinute(!0),this.second=a+60):this.second=a},elementKeydown:function(a){switch(a.which){case 9:if(a.shiftKey){if("hour"===this.highlightedUnit){this.hideWidget();break}this.highlightPrevUnit()}else{if(this.showMeridian&&"meridian"===this.highlightedUnit||this.showSeconds&&"second"===this.highlightedUnit||!this.showMeridian&&!this.showSeconds&&"minute"===this.highlightedUnit){this.hideWidget();break}this.highlightNextUnit()}a.preventDefault(),this.updateFromElementVal();break;case 27:this.updateFromElementVal();break;case 37:a.preventDefault(),this.highlightPrevUnit(),this.updateFromElementVal();break;case 38:switch(a.preventDefault(),this.highlightedUnit){case"hour":this.incrementHour(),this.highlightHour();break;case"minute":this.incrementMinute(),this.highlightMinute();break;case"second":this.incrementSecond(),this.highlightSecond();break;case"meridian":this.toggleMeridian(),this.highlightMeridian()}this.update();break;case 39:a.preventDefault(),this.highlightNextUnit(),this.updateFromElementVal();break;case 40:switch(a.preventDefault(),this.highlightedUnit){case"hour":this.decrementHour(),this.highlightHour();break;case"minute":this.decrementMinute(),this.highlightMinute();break;case"second":this.decrementSecond(),this.highlightSecond();break;case"meridian":this.toggleMeridian(),this.highlightMeridian()}this.update()}},getCursorPosition:function(){var a=this.$element.get(0);if("selectionStart"in a)return a.selectionStart;if(c.selection){a.focus();var b=c.selection.createRange(),d=c.selection.createRange().text.length;return b.moveStart("character",-a.value.length),b.text.length-d}},getTemplate:function(){var a,b,c,d,e,f;switch(this.showInputs?(b='',c='',d='',e=''):(b='',c='',d='',e=''),f=''+(this.showSeconds?'':"")+(this.showMeridian?'':"")+" "+(this.showSeconds?'":"")+(this.showMeridian?'":"")+''+(this.showSeconds?'':"")+(this.showMeridian?'':"")+"
   
"+b+' :'+c+":'+d+" '+e+"
  
",this.template){case"modal":a='
×

Pick a Time

'+f+'
OK
';break;case"dropdown":a='
'+f+"
"}return a},getTime:function(){return""===this.hour?"":this.hour+":"+(1===this.minute.toString().length?"0"+this.minute:this.minute)+(this.showSeconds?":"+(1===this.second.toString().length?"0"+this.second:this.second):"")+(this.showMeridian?" "+this.meridian:"")},hideWidget:function(){this.isOpen!==!1&&(this.$element.trigger({type:"hide.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}}),"modal"===this.template&&this.$widget.modal?this.$widget.modal("hide"):this.$widget.removeClass("open"),a(c).off("mousedown.timepicker, touchend.timepicker",this.handleDocumentClick),this.isOpen=!1,this.$widget.detach())},highlightUnit:function(){this.position=this.getCursorPosition(),this.position>=0&&this.position<=2?this.highlightHour():this.position>=3&&this.position<=5?this.highlightMinute():this.position>=6&&this.position<=8?this.showSeconds?this.highlightSecond():this.highlightMeridian():this.position>=9&&this.position<=11&&this.highlightMeridian()},highlightNextUnit:function(){switch(this.highlightedUnit){case"hour":this.highlightMinute();break;case"minute":this.showSeconds?this.highlightSecond():this.showMeridian?this.highlightMeridian():this.highlightHour();break;case"second":this.showMeridian?this.highlightMeridian():this.highlightHour();break;case"meridian":this.highlightHour()}},highlightPrevUnit:function(){switch(this.highlightedUnit){case"hour":this.showMeridian?this.highlightMeridian():this.showSeconds?this.highlightSecond():this.highlightMinute();break;case"minute":this.highlightHour();break;case"second":this.highlightMinute();break;case"meridian":this.showSeconds?this.highlightSecond():this.highlightMinute()}},highlightHour:function(){var a=this.$element.get(0),b=this;this.highlightedUnit="hour",a.setSelectionRange&&setTimeout(function(){b.hour<10?a.setSelectionRange(0,1):a.setSelectionRange(0,2)},0)},highlightMinute:function(){var a=this.$element.get(0),b=this;this.highlightedUnit="minute",a.setSelectionRange&&setTimeout(function(){b.hour<10?a.setSelectionRange(2,4):a.setSelectionRange(3,5)},0)},highlightSecond:function(){var a=this.$element.get(0),b=this;this.highlightedUnit="second",a.setSelectionRange&&setTimeout(function(){b.hour<10?a.setSelectionRange(5,7):a.setSelectionRange(6,8)},0)},highlightMeridian:function(){var a=this.$element.get(0),b=this;this.highlightedUnit="meridian",a.setSelectionRange&&(this.showSeconds?setTimeout(function(){b.hour<10?a.setSelectionRange(8,10):a.setSelectionRange(9,11)},0):setTimeout(function(){b.hour<10?a.setSelectionRange(5,7):a.setSelectionRange(6,8)},0))},incrementHour:function(){if(this.showMeridian){if(11===this.hour)return this.hour++,this.toggleMeridian();12===this.hour&&(this.hour=0)}return this.hour===this.maxHours-1?void(this.hour=0):void this.hour++},incrementMinute:function(a){var b;b=a?this.minute+a:this.minute+this.minuteStep-this.minute%this.minuteStep,b>59?(this.incrementHour(),this.minute=b-60):this.minute=b},incrementSecond:function(){var a=this.second+this.secondStep-this.second%this.secondStep;a>59?(this.incrementMinute(!0),this.second=a-60):this.second=a},mousewheel:function(b){if(!this.disableMousewheel){b.preventDefault(),b.stopPropagation();var c=b.originalEvent.wheelDelta||-b.originalEvent.detail,d=null;switch("mousewheel"===b.type?d=-1*b.originalEvent.wheelDelta:"DOMMouseScroll"===b.type&&(d=40*b.originalEvent.detail),d&&(b.preventDefault(),a(this).scrollTop(d+a(this).scrollTop())),this.highlightedUnit){case"minute":c>0?this.incrementMinute():this.decrementMinute(),this.highlightMinute();break;case"second":c>0?this.incrementSecond():this.decrementSecond(),this.highlightSecond();break;case"meridian":this.toggleMeridian(),this.highlightMeridian();break;default:c>0?this.incrementHour():this.decrementHour(),this.highlightHour()}return!1}},changeToNearestStep:function(a,b){return a%b===0?a:Math.round(a%b/b)?(a+(b-a%b))%60:a-a%b},place:function(){if(!this.isInline){var c=this.$widget.outerWidth(),d=this.$widget.outerHeight(),e=10,f=a(b).width(),g=a(b).height(),h=a(b).scrollTop(),i=parseInt(this.$element.parents().filter(function(){return"auto"!==a(this).css("z-index")}).first().css("z-index"),10)+10,j=this.component?this.component.parent().offset():this.$element.offset(),k=this.component?this.component.outerHeight(!0):this.$element.outerHeight(!1),l=this.component?this.component.outerWidth(!0):this.$element.outerWidth(!1),m=j.left,n=j.top;this.$widget.removeClass("timepicker-orient-top timepicker-orient-bottom timepicker-orient-right timepicker-orient-left"),"auto"!==this.orientation.x?(this.$widget.addClass("timepicker-orient-"+this.orientation.x),"right"===this.orientation.x&&(m-=c-l)):(this.$widget.addClass("timepicker-orient-left"),j.left<0?m-=j.left-e:j.left+c>f&&(m=f-c-e));var o,p,q=this.orientation.y;"auto"===q&&(o=-h+j.top-d,p=h+g-(j.top+k+d),q=Math.max(o,p)===p?"top":"bottom"),this.$widget.addClass("timepicker-orient-"+q),"top"===q?n+=k:n-=d+parseInt(this.$widget.css("padding-top"),10),this.$widget.css({top:n,left:m,zIndex:i})}},remove:function(){a("document").off(".timepicker"),this.$widget&&this.$widget.remove(),delete this.$element.data().timepicker},setDefaultTime:function(a){if(this.$element.val())this.updateFromElementVal();else if("current"===a){var b=new Date,c=b.getHours(),d=b.getMinutes(),e=b.getSeconds(),f="AM";0!==e&&(e=Math.ceil(b.getSeconds()/this.secondStep)*this.secondStep,60===e&&(d+=1,e=0)),0!==d&&(d=Math.ceil(b.getMinutes()/this.minuteStep)*this.minuteStep,60===d&&(c+=1,d=0)),this.showMeridian&&(0===c?c=12:c>=12?(c>12&&(c-=12),f="PM"):f="AM"),this.hour=c,this.minute=d,this.second=e,this.meridian=f,this.update()}else a===!1?(this.hour=0,this.minute=0,this.second=0,this.meridian="AM"):this.setTime(a)},setTime:function(a,b){if(!a)return void this.clear();var c,d,e,f,g,h;if("object"==typeof a&&a.getMonth)e=a.getHours(),f=a.getMinutes(),g=a.getSeconds(),this.showMeridian&&(h="AM",e>12&&(h="PM",e%=12),12===e&&(h="PM"));else{if(c=(/a/i.test(a)?1:0)+(/p/i.test(a)?2:0),c>2)return void this.clear();if(d=a.replace(/[^0-9\:]/g,"").split(":"),e=d[0]?d[0].toString():d.toString(),this.explicitMode&&e.length>2&&e.length%2!==0)return void this.clear();f=d[1]?d[1].toString():"",g=d[2]?d[2].toString():"",e.length>4&&(g=e.slice(-2),e=e.slice(0,-2)),e.length>2&&(f=e.slice(-2),e=e.slice(0,-2)),f.length>2&&(g=f.slice(-2),f=f.slice(0,-2)),e=parseInt(e,10),f=parseInt(f,10),g=parseInt(g,10),isNaN(e)&&(e=0),isNaN(f)&&(f=0),isNaN(g)&&(g=0),g>59&&(g=59),f>59&&(f=59),e>=this.maxHours&&(e=this.maxHours-1),this.showMeridian?(e>12&&(c=2,e-=12),c||(c=1),0===e&&(e=12),h=1===c?"AM":"PM"):12>e&&2===c?e+=12:e>=this.maxHours?e=this.maxHours-1:(0>e||12===e&&1===c)&&(e=0)}this.hour=e,this.snapToStep?(this.minute=this.changeToNearestStep(f,this.minuteStep),this.second=this.changeToNearestStep(g,this.secondStep)):(this.minute=f,this.second=g),this.meridian=h,this.update(b)},showWidget:function(){this.isOpen||this.$element.is(":disabled")||(this.$widget.appendTo(this.appendWidgetTo),a(c).on("mousedown.timepicker, touchend.timepicker",{scope:this},this.handleDocumentClick),this.$element.trigger({type:"show.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}}),this.place(),this.disableFocus&&this.$element.blur(),""===this.hour&&(this.defaultTime?this.setDefaultTime(this.defaultTime):this.setTime("0:0:0")),"modal"===this.template&&this.$widget.modal?this.$widget.modal("show").on("hidden",a.proxy(this.hideWidget,this)):this.isOpen===!1&&this.$widget.addClass("open"),this.isOpen=!0)},toggleMeridian:function(){this.meridian="AM"===this.meridian?"PM":"AM"},update:function(a){this.updateElement(),a||this.updateWidget(),this.$element.trigger({type:"changeTime.timepicker",time:{value:this.getTime(),hours:this.hour,minutes:this.minute,seconds:this.second,meridian:this.meridian}})},updateElement:function(){this.$element.val(this.getTime()).change()},updateFromElementVal:function(){this.setTime(this.$element.val())},updateWidget:function(){if(this.$widget!==!1){var a=this.hour,b=1===this.minute.toString().length?"0"+this.minute:this.minute,c=1===this.second.toString().length?"0"+this.second:this.second;this.showInputs?(this.$widget.find("input.bootstrap-timepicker-hour").val(a),this.$widget.find("input.bootstrap-timepicker-minute").val(b),this.showSeconds&&this.$widget.find("input.bootstrap-timepicker-second").val(c),this.showMeridian&&this.$widget.find("input.bootstrap-timepicker-meridian").val(this.meridian)):(this.$widget.find("span.bootstrap-timepicker-hour").text(a),this.$widget.find("span.bootstrap-timepicker-minute").text(b),this.showSeconds&&this.$widget.find("span.bootstrap-timepicker-second").text(c),this.showMeridian&&this.$widget.find("span.bootstrap-timepicker-meridian").text(this.meridian))}},updateFromWidgetInputs:function(){if(this.$widget!==!1){var a=this.$widget.find("input.bootstrap-timepicker-hour").val()+":"+this.$widget.find("input.bootstrap-timepicker-minute").val()+(this.showSeconds?":"+this.$widget.find("input.bootstrap-timepicker-second").val():"")+(this.showMeridian?this.$widget.find("input.bootstrap-timepicker-meridian").val():"");this.setTime(a,!0)}},widgetClick:function(b){b.stopPropagation(),b.preventDefault();var c=a(b.target),d=c.closest("a").data("action");d&&this[d](),this.update(),c.is("input")&&c.get(0).setSelectionRange(0,2)},widgetKeydown:function(b){var c=a(b.target),d=c.attr("class").replace("bootstrap-timepicker-","");switch(b.which){case 9:if(b.shiftKey){if("hour"===d)return this.hideWidget()}else if(this.showMeridian&&"meridian"===d||this.showSeconds&&"second"===d||!this.showMeridian&&!this.showSeconds&&"minute"===d)return this.hideWidget();break;case 27:this.hideWidget();break;case 38:switch(b.preventDefault(),d){case"hour":this.incrementHour();break;case"minute":this.incrementMinute();break;case"second":this.incrementSecond();break;case"meridian":this.toggleMeridian()}this.setTime(this.getTime()),c.get(0).setSelectionRange(0,2);break;case 40:switch(b.preventDefault(),d){case"hour":this.decrementHour();break;case"minute":this.decrementMinute();break;case"second":this.decrementSecond();break;case"meridian":this.toggleMeridian()}this.setTime(this.getTime()),c.get(0).setSelectionRange(0,2)}},widgetKeyup:function(a){(65===a.which||77===a.which||80===a.which||46===a.which||8===a.which||a.which>=48&&a.which<=57||a.which>=96&&a.which<=105)&&this.updateFromWidgetInputs()}},a.fn.timepicker=function(b){var c=Array.apply(null,arguments);return c.shift(),this.each(function(){var e=a(this),f=e.data("timepicker"),g="object"==typeof b&&b;f||e.data("timepicker",f=new d(this,a.extend({},a.fn.timepicker.defaults,g,a(this).data()))),"string"==typeof b&&f[b].apply(f,c)})},a.fn.timepicker.defaults={defaultTime:"current",disableFocus:!1,disableMousewheel:!1,isOpen:!1,minuteStep:15,modalBackdrop:!1,orientation:{x:"auto",y:"auto"},secondStep:15,snapToStep:!1,showSeconds:!1,showInputs:!0,showMeridian:!0,template:"dropdown",appendWidgetTo:"body",showWidgetOnAddonClick:!0,icons:{up:"glyphicon glyphicon-chevron-up",down:"glyphicon glyphicon-chevron-down"},maxHours:24,explicitMode:!1},a.fn.timepicker.Constructor=d,a(c).on("focus.timepicker.data-api click.timepicker.data-api",'[data-provide="timepicker"]',function(b){var c=a(this);c.data("timepicker")||(b.preventDefault(),c.timepicker())})}(jQuery,window,document); \ No newline at end of file