daterangepicker.js 54 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348
  1. /**
  2. * @version: 1.3.23
  3. * @author: Dan Grossman http://www.dangrossman.info/
  4. * @copyright: Copyright (c) 2012-2015 Dan Grossman. All rights reserved.
  5. * @license: Licensed under the MIT license. See http://www.opensource.org/licenses/mit-license.php
  6. * @website: https://www.improvely.com/
  7. */
  8. (function(root, factory) {
  9. if (typeof define === 'function' && define.amd) {
  10. define(['moment', 'jquery', 'exports'], function(momentjs, $, exports) {
  11. root.daterangepicker = factory(root, exports, momentjs, $);
  12. });
  13. } else if (typeof exports !== 'undefined') {
  14. var momentjs = require('moment');
  15. var jQuery;
  16. try {
  17. jQuery = require('jquery');
  18. } catch (err) {
  19. jQuery = window.jQuery;
  20. if (!jQuery) throw new Error('jQuery dependency not found');
  21. }
  22. factory(root, exports, momentjs, jQuery);
  23. // Finally, as a browser global.
  24. } else {
  25. root.daterangepicker = factory(root, {}, root.moment || moment, (root.jQuery || root.Zepto || root.ender || root.$));
  26. }
  27. }(this, function(root, daterangepicker, moment, $) {
  28. var DateRangePicker = function (element, options, cb) {
  29. // by default, the daterangepicker element is placed at the bottom of HTML body
  30. this.parentEl = 'body';
  31. //element that triggered the date range picker
  32. this.element = $(element);
  33. //tracks visible state
  34. this.isShowing = false;
  35. //create the picker HTML object
  36. var DRPTemplate = '<div class="daterangepicker dropdown-menu">' +
  37. '<div class="calendar first left"></div>' +
  38. '<div class="calendar second right"></div>' +
  39. '<div class="ranges">' +
  40. '<div class="range_inputs">' +
  41. '<div class="daterangepicker_start_input">' +
  42. '<label for="daterangepicker_start"></label>' +
  43. '<input class="input-mini" type="text" name="daterangepicker_start" value="" />' +
  44. '</div>' +
  45. '<div class="daterangepicker_end_input">' +
  46. '<label for="daterangepicker_end"></label>' +
  47. '<input class="input-mini" type="text" name="daterangepicker_end" value="" />' +
  48. '</div>' +
  49. '<button class="applyBtn" disabled="disabled" type="button"></button>&nbsp;' +
  50. '<button class="cancelBtn" type="button"></button>' +
  51. '</div>' +
  52. '</div>' +
  53. '</div>';
  54. //custom options
  55. if (typeof options !== 'object' || options === null)
  56. options = {};
  57. this.parentEl = (typeof options === 'object' && options.parentEl && $(options.parentEl).length) ? $(options.parentEl) : $(this.parentEl);
  58. this.container = $(DRPTemplate).appendTo(this.parentEl);
  59. //allow setting options with data attributes
  60. //data-api options will be overwritten with custom javascript options
  61. options = $.extend(this.element.data(), options);
  62. this.setOptions(options, cb);
  63. //event listeners
  64. this.container.find('.calendar')
  65. .on('click.daterangepicker', '.prev', $.proxy(this.clickPrev, this))
  66. .on('click.daterangepicker', '.next', $.proxy(this.clickNext, this))
  67. .on('click.daterangepicker', 'td.available', $.proxy(this.clickDate, this))
  68. .on('mouseenter.daterangepicker', 'td.available', $.proxy(this.hoverDate, this))
  69. .on('mouseleave.daterangepicker', 'td.available', $.proxy(this.updateFormInputs, this))
  70. .on('change.daterangepicker', 'select.yearselect', $.proxy(this.updateMonthYear, this))
  71. .on('change.daterangepicker', 'select.monthselect', $.proxy(this.updateMonthYear, this))
  72. .on('change.daterangepicker', 'select.hourselect,select.minuteselect,select.secondselect,select.ampmselect', $.proxy(this.updateTime, this));
  73. this.container.find('.ranges')
  74. .on('click.daterangepicker', 'button.applyBtn', $.proxy(this.clickApply, this))
  75. .on('click.daterangepicker', 'button.cancelBtn', $.proxy(this.clickCancel, this))
  76. .on('click.daterangepicker', '.daterangepicker_start_input,.daterangepicker_end_input', $.proxy(this.showCalendars, this))
  77. .on('change.daterangepicker', '.daterangepicker_start_input,.daterangepicker_end_input', $.proxy(this.inputsChanged, this))
  78. .on('keydown.daterangepicker', '.daterangepicker_start_input,.daterangepicker_end_input', $.proxy(this.inputsKeydown, this))
  79. .on('click.daterangepicker', 'li', $.proxy(this.clickRange, this))
  80. .on('mouseenter.daterangepicker', 'li', $.proxy(this.enterRange, this))
  81. .on('mouseleave.daterangepicker', 'li', $.proxy(this.updateFormInputs, this));
  82. if (this.element.is('input')) {
  83. this.element.on({
  84. 'click.daterangepicker': $.proxy(this.show, this),
  85. 'focus.daterangepicker': $.proxy(this.show, this),
  86. 'keyup.daterangepicker': $.proxy(this.updateFromControl, this),
  87. 'keydown.daterangepicker': $.proxy(this.keydown, this)
  88. });
  89. } else {
  90. this.element.on('click.daterangepicker', $.proxy(this.toggle, this));
  91. }
  92. };
  93. DateRangePicker.prototype = {
  94. constructor: DateRangePicker,
  95. setOptions: function(options, callback) {
  96. this.startDate = moment().startOf('day');
  97. this.endDate = moment().endOf('day');
  98. this.timeZone = moment().utcOffset();
  99. this.minDate = false;
  100. this.maxDate = false;
  101. this.dateLimit = false;
  102. this.showDropdowns = false;
  103. this.showWeekNumbers = false;
  104. this.timePicker = false;
  105. this.timePickerSeconds = false;
  106. this.timePickerIncrement = 30;
  107. this.timePicker12Hour = true;
  108. this.autoApply = false;
  109. this.singleDatePicker = false;
  110. this.ranges = {};
  111. this.opens = 'right';
  112. if (this.element.hasClass('pull-right'))
  113. this.opens = 'left';
  114. this.drops = 'down';
  115. if (this.element.hasClass('dropup'))
  116. this.drops = 'up';
  117. this.buttonClasses = ['btn', 'btn-small btn-sm'];
  118. this.applyClass = 'btn-success';
  119. this.cancelClass = 'btn-default';
  120. this.format = 'MM/DD/YYYY';
  121. this.separator = ' - ';
  122. this.locale = {
  123. applyLabel: 'Apply',
  124. cancelLabel: 'Cancel',
  125. fromLabel: 'From',
  126. toLabel: 'To',
  127. weekLabel: 'W',
  128. customRangeLabel: 'Custom Range',
  129. daysOfWeek: moment.weekdaysMin(),
  130. monthNames: moment.monthsShort(),
  131. firstDay: moment.localeData()._week.dow
  132. };
  133. this.cb = function () { };
  134. if (typeof options.format === 'string')
  135. this.format = options.format;
  136. if (typeof options.separator === 'string')
  137. this.separator = options.separator;
  138. if (typeof options.startDate === 'string')
  139. this.startDate = moment(options.startDate, this.format);
  140. if (typeof options.endDate === 'string')
  141. this.endDate = moment(options.endDate, this.format);
  142. if (typeof options.minDate === 'string')
  143. this.minDate = moment(options.minDate, this.format);
  144. if (typeof options.maxDate === 'string')
  145. this.maxDate = moment(options.maxDate, this.format);
  146. if (typeof options.startDate === 'object')
  147. this.startDate = moment(options.startDate);
  148. if (typeof options.endDate === 'object')
  149. this.endDate = moment(options.endDate);
  150. if (typeof options.minDate === 'object')
  151. this.minDate = moment(options.minDate);
  152. if (typeof options.maxDate === 'object')
  153. this.maxDate = moment(options.maxDate);
  154. if (typeof options.applyClass === 'string')
  155. this.applyClass = options.applyClass;
  156. if (typeof options.cancelClass === 'string')
  157. this.cancelClass = options.cancelClass;
  158. if (typeof options.dateLimit === 'object')
  159. this.dateLimit = options.dateLimit;
  160. if (typeof options.locale === 'object') {
  161. if (typeof options.locale.daysOfWeek === 'object') {
  162. // Create a copy of daysOfWeek to avoid modification of original
  163. // options object for reusability in multiple daterangepicker instances
  164. this.locale.daysOfWeek = options.locale.daysOfWeek.slice();
  165. }
  166. if (typeof options.locale.monthNames === 'object') {
  167. this.locale.monthNames = options.locale.monthNames.slice();
  168. }
  169. if (typeof options.locale.firstDay === 'number') {
  170. this.locale.firstDay = options.locale.firstDay;
  171. }
  172. if (typeof options.locale.applyLabel === 'string') {
  173. this.locale.applyLabel = options.locale.applyLabel;
  174. }
  175. if (typeof options.locale.cancelLabel === 'string') {
  176. this.locale.cancelLabel = options.locale.cancelLabel;
  177. }
  178. if (typeof options.locale.fromLabel === 'string') {
  179. this.locale.fromLabel = options.locale.fromLabel;
  180. }
  181. if (typeof options.locale.toLabel === 'string') {
  182. this.locale.toLabel = options.locale.toLabel;
  183. }
  184. if (typeof options.locale.weekLabel === 'string') {
  185. this.locale.weekLabel = options.locale.weekLabel;
  186. }
  187. if (typeof options.locale.customRangeLabel === 'string') {
  188. this.locale.customRangeLabel = options.locale.customRangeLabel;
  189. }
  190. }
  191. if (typeof options.opens === 'string')
  192. this.opens = options.opens;
  193. if (typeof options.drops === 'string')
  194. this.drops = options.drops;
  195. if (typeof options.showWeekNumbers === 'boolean') {
  196. this.showWeekNumbers = options.showWeekNumbers;
  197. }
  198. if (typeof options.buttonClasses === 'string') {
  199. this.buttonClasses = [options.buttonClasses];
  200. }
  201. if (typeof options.buttonClasses === 'object') {
  202. this.buttonClasses = options.buttonClasses;
  203. }
  204. if (typeof options.showDropdowns === 'boolean') {
  205. this.showDropdowns = options.showDropdowns;
  206. }
  207. if (typeof options.singleDatePicker === 'boolean') {
  208. this.singleDatePicker = options.singleDatePicker;
  209. if (this.singleDatePicker) {
  210. this.endDate = this.startDate.clone();
  211. }
  212. }
  213. if (typeof options.timePicker === 'boolean') {
  214. this.timePicker = options.timePicker;
  215. }
  216. if (typeof options.timePickerSeconds === 'boolean') {
  217. this.timePickerSeconds = options.timePickerSeconds;
  218. }
  219. if (typeof options.timePickerIncrement === 'number') {
  220. this.timePickerIncrement = options.timePickerIncrement;
  221. }
  222. if (typeof options.timePicker12Hour === 'boolean') {
  223. this.timePicker12Hour = options.timePicker12Hour;
  224. }
  225. if (typeof options.autoApply === 'boolean') {
  226. this.autoApply = options.autoApply;
  227. if (this.autoApply)
  228. this.container.find('.applyBtn, .cancelBtn').addClass('hide');
  229. }
  230. // update day names order to firstDay
  231. if (this.locale.firstDay != 0) {
  232. var iterator = this.locale.firstDay;
  233. while (iterator > 0) {
  234. this.locale.daysOfWeek.push(this.locale.daysOfWeek.shift());
  235. iterator--;
  236. }
  237. }
  238. var start, end, range;
  239. //if no start/end dates set, check if an input element contains initial values
  240. if (typeof options.startDate === 'undefined' && typeof options.endDate === 'undefined') {
  241. if ($(this.element).is('input[type=text]')) {
  242. var val = $(this.element).val(),
  243. split = val.split(this.separator);
  244. start = end = null;
  245. if (split.length == 2) {
  246. start = moment(split[0], this.format);
  247. end = moment(split[1], this.format);
  248. } else if (this.singleDatePicker && val !== "") {
  249. start = moment(val, this.format);
  250. end = moment(val, this.format);
  251. }
  252. if (start !== null && end !== null) {
  253. this.startDate = start;
  254. this.endDate = end;
  255. }
  256. }
  257. }
  258. // bind the time zone used to build the calendar to either the timeZone passed in through the options or the zone of the startDate (which will be the local time zone by default)
  259. if (typeof options.timeZone === 'string' || typeof options.timeZone === 'number') {
  260. if (typeof options.timeZone === 'string' && typeof moment.tz !== 'undefined') {
  261. this.timeZone = moment.tz.zone(options.timeZone).parse(new Date) * -1; // Offset is positive if the timezone is behind UTC and negative if it is ahead.
  262. } else {
  263. this.timeZone = options.timeZone;
  264. }
  265. this.startDate.utcOffset(this.timeZone);
  266. this.endDate.utcOffset(this.timeZone);
  267. } else {
  268. this.timeZone = moment(this.startDate).utcOffset();
  269. }
  270. if (typeof options.ranges === 'object') {
  271. for (range in options.ranges) {
  272. if (typeof options.ranges[range][0] === 'string')
  273. start = moment(options.ranges[range][0], this.format);
  274. else
  275. start = moment(options.ranges[range][0]);
  276. if (typeof options.ranges[range][1] === 'string')
  277. end = moment(options.ranges[range][1], this.format);
  278. else
  279. end = moment(options.ranges[range][1]);
  280. // If we have a min/max date set, bound this range
  281. // to it, but only if it would otherwise fall
  282. // outside of the min/max.
  283. if (this.minDate && start.isBefore(this.minDate))
  284. start = moment(this.minDate);
  285. if (this.maxDate && end.isAfter(this.maxDate))
  286. end = moment(this.maxDate);
  287. // If the end of the range is before the minimum (if min is set) OR
  288. // the start of the range is after the max (also if set) don't display this
  289. // range option.
  290. if ((this.minDate && end.isBefore(this.minDate)) || (this.maxDate && start.isAfter(this.maxDate))) {
  291. continue;
  292. }
  293. this.ranges[range] = [start, end];
  294. }
  295. var list = '<ul>';
  296. for (range in this.ranges) {
  297. list += '<li>' + range + '</li>';
  298. }
  299. list += '<li>' + this.locale.customRangeLabel + '</li>';
  300. list += '</ul>';
  301. this.container.find('.ranges ul').remove();
  302. this.container.find('.ranges').prepend(list);
  303. }
  304. if (typeof callback === 'function') {
  305. this.cb = callback;
  306. }
  307. if (!this.timePicker) {
  308. this.startDate = this.startDate.startOf('day');
  309. this.endDate = this.endDate.endOf('day');
  310. }
  311. if (this.singleDatePicker) {
  312. this.opens = this.opens || 'right';
  313. this.container.addClass('single');
  314. this.container.find('.calendar.right').show();
  315. this.container.find('.calendar.left').hide();
  316. if (!this.timePicker) {
  317. this.container.find('.ranges').hide();
  318. } else {
  319. this.container.find('.ranges .daterangepicker_start_input, .ranges .daterangepicker_end_input').hide();
  320. }
  321. if (!this.container.find('.calendar.right').hasClass('single'))
  322. this.container.find('.calendar.right').addClass('single');
  323. } else {
  324. this.container.removeClass('single');
  325. this.container.find('.calendar.right').removeClass('single');
  326. this.container.find('.ranges').show();
  327. }
  328. this.oldStartDate = this.startDate.clone();
  329. this.oldEndDate = this.endDate.clone();
  330. this.oldChosenLabel = this.chosenLabel;
  331. this.leftCalendar = {
  332. month: moment([this.startDate.year(), this.startDate.month(), 1, this.startDate.hour(), this.startDate.minute(), this.startDate.second()]),
  333. calendar: []
  334. };
  335. this.rightCalendar = {
  336. month: moment([this.endDate.year(), this.endDate.month(), 1, this.endDate.hour(), this.endDate.minute(), this.endDate.second()]),
  337. calendar: []
  338. };
  339. if (this.opens == 'right' || this.opens == 'center') {
  340. //swap calendar positions
  341. var first = this.container.find('.calendar.first');
  342. var second = this.container.find('.calendar.second');
  343. if (second.hasClass('single')) {
  344. second.removeClass('single');
  345. first.addClass('single');
  346. }
  347. first.removeClass('left').addClass('right');
  348. second.removeClass('right').addClass('left');
  349. if (this.singleDatePicker) {
  350. first.show();
  351. second.hide();
  352. }
  353. }
  354. if (typeof options.ranges === 'undefined' && !this.singleDatePicker) {
  355. this.container.addClass('show-calendar');
  356. }
  357. this.container.removeClass('opensleft opensright').addClass('opens' + this.opens);
  358. this.updateView();
  359. this.updateCalendars();
  360. //apply CSS classes and labels to buttons
  361. var c = this.container;
  362. $.each(this.buttonClasses, function (idx, val) {
  363. c.find('button').addClass(val);
  364. });
  365. this.container.find('.daterangepicker_start_input label').html(this.locale.fromLabel);
  366. this.container.find('.daterangepicker_end_input label').html(this.locale.toLabel);
  367. if (this.applyClass.length)
  368. this.container.find('.applyBtn').addClass(this.applyClass);
  369. if (this.cancelClass.length)
  370. this.container.find('.cancelBtn').addClass(this.cancelClass);
  371. this.container.find('.applyBtn').html(this.locale.applyLabel);
  372. this.container.find('.cancelBtn').html(this.locale.cancelLabel);
  373. },
  374. setStartDate: function(startDate) {
  375. if (typeof startDate === 'string')
  376. this.startDate = moment(startDate, this.format).utcOffset(this.timeZone);
  377. if (typeof startDate === 'object')
  378. this.startDate = moment(startDate);
  379. if (!this.timePicker)
  380. this.startDate = this.startDate.startOf('day');
  381. this.oldStartDate = this.startDate.clone();
  382. this.updateView();
  383. this.updateCalendars();
  384. this.updateInputText();
  385. },
  386. setEndDate: function(endDate) {
  387. if (typeof endDate === 'string')
  388. this.endDate = moment(endDate, this.format).utcOffset(this.timeZone);
  389. if (typeof endDate === 'object')
  390. this.endDate = moment(endDate);
  391. if (!this.timePicker)
  392. this.endDate = this.endDate.endOf('day');
  393. this.oldEndDate = this.endDate.clone();
  394. this.updateView();
  395. this.updateCalendars();
  396. this.updateInputText();
  397. },
  398. updateView: function () {
  399. this.leftCalendar.month.month(this.startDate.month()).year(this.startDate.year()).hour(this.startDate.hour()).minute(this.startDate.minute());
  400. this.rightCalendar.month.month(this.endDate.month()).year(this.endDate.year()).hour(this.endDate.hour()).minute(this.endDate.minute());
  401. this.updateFormInputs();
  402. },
  403. updateFormInputs: function () {
  404. this.container.find('input[name=daterangepicker_start]').val(this.startDate.format(this.format));
  405. this.container.find('input[name=daterangepicker_end]').val(this.endDate.format(this.format));
  406. if (this.startDate.isSame(this.endDate) || this.startDate.isBefore(this.endDate)) {
  407. this.container.find('button.applyBtn').removeAttr('disabled');
  408. } else {
  409. this.container.find('button.applyBtn').attr('disabled', 'disabled');
  410. }
  411. },
  412. updateFromControl: function () {
  413. if (!this.element.is('input')) return;
  414. if (!this.element.val().length) return;
  415. var dateString = this.element.val().split(this.separator),
  416. start = null,
  417. end = null;
  418. if(dateString.length === 2) {
  419. start = moment(dateString[0], this.format).utcOffset(this.timeZone);
  420. end = moment(dateString[1], this.format).utcOffset(this.timeZone);
  421. }
  422. if (this.singleDatePicker || start === null || end === null) {
  423. start = moment(this.element.val(), this.format).utcOffset(this.timeZone);
  424. end = start;
  425. }
  426. if (end.isBefore(start)) return;
  427. this.oldStartDate = this.startDate.clone();
  428. this.oldEndDate = this.endDate.clone();
  429. this.startDate = start;
  430. this.endDate = end;
  431. if (!this.startDate.isSame(this.oldStartDate) || !this.endDate.isSame(this.oldEndDate))
  432. this.notify();
  433. this.updateCalendars();
  434. },
  435. keydown: function (e) {
  436. //hide on tab or enter
  437. if ((e.keyCode === 9) || (e.keyCode === 13)) {
  438. this.hide();
  439. }
  440. },
  441. notify: function () {
  442. this.updateView();
  443. this.updateInputText();
  444. this.cb(this.startDate, this.endDate, this.chosenLabel);
  445. },
  446. move: function () {
  447. var parentOffset = { top: 0, left: 0 },
  448. containerTop;
  449. var parentRightEdge = $(window).width();
  450. if (!this.parentEl.is('body')) {
  451. parentOffset = {
  452. top: this.parentEl.offset().top - this.parentEl.scrollTop(),
  453. left: this.parentEl.offset().left - this.parentEl.scrollLeft()
  454. };
  455. parentRightEdge = this.parentEl[0].clientWidth + this.parentEl.offset().left;
  456. }
  457. if (this.drops == 'up')
  458. containerTop = this.element.offset().top - this.container.outerHeight() - parentOffset.top;
  459. else
  460. containerTop = this.element.offset().top + this.element.outerHeight() - parentOffset.top;
  461. this.container[this.drops == 'up' ? 'addClass' : 'removeClass']('dropup');
  462. if (this.opens == 'left') {
  463. this.container.css({
  464. top: containerTop,
  465. right: parentRightEdge - this.element.offset().left - this.element.outerWidth(),
  466. left: 'auto'
  467. });
  468. if (this.container.offset().left < 0) {
  469. this.container.css({
  470. right: 'auto',
  471. left: 9
  472. });
  473. }
  474. } else if (this.opens == 'center') {
  475. this.container.css({
  476. top: containerTop,
  477. left: this.element.offset().left - parentOffset.left + this.element.outerWidth() / 2
  478. - this.container.outerWidth() / 2,
  479. right: 'auto'
  480. });
  481. if (this.container.offset().left < 0) {
  482. this.container.css({
  483. right: 'auto',
  484. left: 9
  485. });
  486. }
  487. } else {
  488. this.container.css({
  489. top: containerTop,
  490. left: this.element.offset().left - parentOffset.left,
  491. right: 'auto'
  492. });
  493. if (this.container.offset().left + this.container.outerWidth() > $(window).width()) {
  494. this.container.css({
  495. left: 'auto',
  496. right: 0
  497. });
  498. }
  499. }
  500. },
  501. toggle: function (e) {
  502. if (this.element.hasClass('active')) {
  503. this.hide();
  504. } else {
  505. this.show();
  506. }
  507. },
  508. show: function (e) {
  509. if (this.isShowing) return;
  510. this.element.addClass('active');
  511. this.container.show();
  512. this.move();
  513. // Create a click proxy that is private to this instance of datepicker, for unbinding
  514. this._outsideClickProxy = $.proxy(function (e) { this.outsideClick(e); }, this);
  515. // Bind global datepicker mousedown for hiding and
  516. $(document)
  517. .on('mousedown.daterangepicker', this._outsideClickProxy)
  518. // also support mobile devices
  519. .on('touchend.daterangepicker', this._outsideClickProxy)
  520. // also explicitly play nice with Bootstrap dropdowns, which stopPropagation when clicking them
  521. .on('click.daterangepicker', '[data-toggle=dropdown]', this._outsideClickProxy)
  522. // and also close when focus changes to outside the picker (eg. tabbing between controls)
  523. .on('focusin.daterangepicker', this._outsideClickProxy);
  524. this.isShowing = true;
  525. this.element.trigger('show.daterangepicker', this);
  526. },
  527. outsideClick: function (e) {
  528. var target = $(e.target);
  529. // if the page is clicked anywhere except within the daterangerpicker/button
  530. // itself then call this.hide()
  531. if (
  532. // ie modal dialog fix
  533. e.type == "focusin" ||
  534. target.closest(this.element).length ||
  535. target.closest(this.container).length ||
  536. target.closest('.calendar-date').length
  537. ) return;
  538. this.hide();
  539. },
  540. hide: function (e) {
  541. if (!this.isShowing) return;
  542. $(document)
  543. .off('.daterangepicker');
  544. this.element.removeClass('active');
  545. this.container.hide();
  546. if (!this.startDate.isSame(this.oldStartDate) || !this.endDate.isSame(this.oldEndDate))
  547. this.notify();
  548. this.oldStartDate = this.startDate.clone();
  549. this.oldEndDate = this.endDate.clone();
  550. this.isShowing = false;
  551. this.element.trigger('hide.daterangepicker', this);
  552. },
  553. enterRange: function (e) {
  554. // mouse pointer has entered a range label
  555. var label = e.target.innerHTML;
  556. if (label == this.locale.customRangeLabel) {
  557. this.updateView();
  558. } else {
  559. var dates = this.ranges[label];
  560. this.container.find('input[name=daterangepicker_start]').val(dates[0].format(this.format));
  561. this.container.find('input[name=daterangepicker_end]').val(dates[1].format(this.format));
  562. }
  563. },
  564. showCalendars: function() {
  565. this.container.addClass('show-calendar');
  566. this.move();
  567. this.element.trigger('showCalendar.daterangepicker', this);
  568. },
  569. hideCalendars: function() {
  570. this.container.removeClass('show-calendar');
  571. this.element.trigger('hideCalendar.daterangepicker', this);
  572. },
  573. // when a date is typed into the start to end date textboxes
  574. inputsChanged: function (e) {
  575. var el = $(e.target);
  576. var date = moment(el.val(), this.format);
  577. if (!date.isValid()) return;
  578. var startDate, endDate;
  579. if (el.attr('name') === 'daterangepicker_start') {
  580. startDate = (false !== this.minDate && date.isBefore(this.minDate)) ? this.minDate : date;
  581. endDate = this.endDate;
  582. if (typeof this.dateLimit === 'object') {
  583. var maxDate = moment(startDate).add(this.dateLimit).endOf('day');
  584. if (endDate.isAfter(maxDate)) {
  585. endDate = maxDate;
  586. }
  587. }
  588. } else {
  589. startDate = this.startDate;
  590. endDate = (false !== this.maxDate && date.isAfter(this.maxDate)) ? this.maxDate : date.endOf('day');
  591. if (typeof this.dateLimit === 'object') {
  592. var minDate = moment(endDate).subtract(this.dateLimit).startOf('day');
  593. if (startDate.isBefore(minDate)) {
  594. startDate = minDate;
  595. }
  596. }
  597. }
  598. this.setCustomDates(startDate, endDate);
  599. },
  600. inputsKeydown: function(e) {
  601. if (e.keyCode === 13) {
  602. this.inputsChanged(e);
  603. this.notify();
  604. }
  605. },
  606. updateInputText: function() {
  607. if (this.element.is('input') && !this.singleDatePicker) {
  608. this.element.val(this.startDate.format(this.format) + this.separator + this.endDate.format(this.format));
  609. this.element.trigger('change');
  610. } else if (this.element.is('input')) {
  611. this.element.val(this.endDate.format(this.format));
  612. this.element.trigger('change');
  613. }
  614. },
  615. clickRange: function (e) {
  616. var label = e.target.innerHTML;
  617. this.chosenLabel = label;
  618. if (label == this.locale.customRangeLabel) {
  619. this.showCalendars();
  620. } else {
  621. var dates = this.ranges[label];
  622. this.startDate = dates[0];
  623. this.endDate = dates[1];
  624. if (!this.timePicker) {
  625. this.startDate.startOf('day');
  626. this.endDate.endOf('day');
  627. }
  628. this.leftCalendar.month.month(this.startDate.month()).year(this.startDate.year()).hour(this.startDate.hour()).minute(this.startDate.minute());
  629. this.rightCalendar.month.month(this.endDate.month()).year(this.endDate.year()).hour(this.endDate.hour()).minute(this.endDate.minute());
  630. this.updateCalendars();
  631. this.updateInputText();
  632. this.hideCalendars();
  633. this.hide();
  634. this.element.trigger('apply.daterangepicker', this);
  635. if (this.autoApply) {
  636. this.notify();
  637. }
  638. }
  639. },
  640. clickPrev: function (e) {
  641. var cal = $(e.target).parents('.calendar');
  642. if (cal.hasClass('left')) {
  643. this.leftCalendar.month.subtract(1, 'month');
  644. } else {
  645. this.rightCalendar.month.subtract(1, 'month');
  646. }
  647. this.updateCalendars();
  648. },
  649. clickNext: function (e) {
  650. var cal = $(e.target).parents('.calendar');
  651. if (cal.hasClass('left')) {
  652. this.leftCalendar.month.add(1, 'month');
  653. } else {
  654. this.rightCalendar.month.add(1, 'month');
  655. }
  656. this.updateCalendars();
  657. },
  658. hoverDate: function (e) {
  659. var title = $(e.target).attr('data-title');
  660. var row = title.substr(1, 1);
  661. var col = title.substr(3, 1);
  662. var cal = $(e.target).parents('.calendar');
  663. if (cal.hasClass('left')) {
  664. this.container.find('input[name=daterangepicker_start]').val(this.leftCalendar.calendar[row][col].format(this.format));
  665. } else {
  666. this.container.find('input[name=daterangepicker_end]').val(this.rightCalendar.calendar[row][col].format(this.format));
  667. }
  668. },
  669. setCustomDates: function(startDate, endDate) {
  670. this.chosenLabel = this.locale.customRangeLabel;
  671. if (startDate.isAfter(endDate)) {
  672. var difference = this.endDate.diff(this.startDate);
  673. endDate = moment(startDate).add(difference, 'ms');
  674. if (this.maxDate && endDate.isAfter(this.maxDate)) {
  675. endDate = this.maxDate.clone();
  676. }
  677. }
  678. this.startDate = startDate;
  679. this.endDate = endDate;
  680. this.updateView();
  681. this.updateCalendars();
  682. if (this.autoApply) {
  683. this.notify();
  684. this.element.trigger('apply.daterangepicker', this);
  685. }
  686. },
  687. clickDate: function (e) {
  688. var title = $(e.target).attr('data-title');
  689. var row = title.substr(1, 1);
  690. var col = title.substr(3, 1);
  691. var cal = $(e.target).parents('.calendar');
  692. var startDate, endDate;
  693. if (cal.hasClass('left')) {
  694. startDate = this.leftCalendar.calendar[row][col];
  695. endDate = this.endDate;
  696. if (typeof this.dateLimit === 'object') {
  697. var maxDate = moment(startDate).add(this.dateLimit).endOf('day');
  698. if (endDate.isAfter(maxDate)) {
  699. endDate = maxDate;
  700. }
  701. }
  702. } else {
  703. startDate = this.startDate;
  704. endDate = this.rightCalendar.calendar[row][col];
  705. if (typeof this.dateLimit === 'object') {
  706. var minDate = moment(endDate).subtract(this.dateLimit).startOf('day');
  707. if (startDate.isBefore(minDate)) {
  708. startDate = minDate;
  709. }
  710. }
  711. }
  712. if (this.singleDatePicker && cal.hasClass('left')) {
  713. endDate = startDate.clone();
  714. } else if (this.singleDatePicker && cal.hasClass('right')) {
  715. startDate = endDate.clone();
  716. }
  717. cal.find('td').removeClass('active');
  718. $(e.target).addClass('active');
  719. this.setCustomDates(startDate, endDate);
  720. if (!this.timePicker)
  721. endDate.endOf('day');
  722. if (this.singleDatePicker && !this.timePicker)
  723. this.clickApply();
  724. },
  725. clickApply: function (e) {
  726. this.updateInputText();
  727. this.hide();
  728. this.element.trigger('apply.daterangepicker', this);
  729. },
  730. clickCancel: function (e) {
  731. this.startDate = this.oldStartDate;
  732. this.endDate = this.oldEndDate;
  733. this.chosenLabel = this.oldChosenLabel;
  734. this.updateView();
  735. this.updateCalendars();
  736. this.hide();
  737. this.element.trigger('cancel.daterangepicker', this);
  738. },
  739. updateMonthYear: function (e) {
  740. var isLeft = $(e.target).closest('.calendar').hasClass('left'),
  741. leftOrRight = isLeft ? 'left' : 'right',
  742. cal = this.container.find('.calendar.'+leftOrRight);
  743. // Month must be Number for new moment versions
  744. var month = parseInt(cal.find('.monthselect').val(), 10);
  745. var year = cal.find('.yearselect').val();
  746. if (!isLeft && !this.singleDatePicker) {
  747. if (year < this.startDate.year() || (year == this.startDate.year() && month < this.startDate.month())) {
  748. month = this.startDate.month();
  749. year = this.startDate.year();
  750. }
  751. }
  752. if (this.minDate) {
  753. if (year < this.minDate.year() || (year == this.minDate.year() && month < this.minDate.month())) {
  754. month = this.minDate.month();
  755. year = this.minDate.year();
  756. }
  757. }
  758. if (this.maxDate) {
  759. if (year > this.maxDate.year() || (year == this.maxDate.year() && month > this.maxDate.month())) {
  760. month = this.maxDate.month();
  761. year = this.maxDate.year();
  762. }
  763. }
  764. this[leftOrRight+'Calendar'].month.month(month).year(year);
  765. this.updateCalendars();
  766. },
  767. updateTime: function(e) {
  768. var cal = $(e.target).closest('.calendar'),
  769. isLeft = cal.hasClass('left');
  770. var hour = parseInt(cal.find('.hourselect').val(), 10);
  771. var minute = parseInt(cal.find('.minuteselect').val(), 10);
  772. var second = 0;
  773. if (this.timePickerSeconds) {
  774. second = parseInt(cal.find('.secondselect').val(), 10);
  775. }
  776. if (this.timePicker12Hour) {
  777. var ampm = cal.find('.ampmselect').val();
  778. if (ampm === 'PM' && hour < 12)
  779. hour += 12;
  780. if (ampm === 'AM' && hour === 12)
  781. hour = 0;
  782. }
  783. if (isLeft) {
  784. var start = this.startDate.clone();
  785. start.hour(hour);
  786. start.minute(minute);
  787. start.second(second);
  788. this.startDate = start;
  789. this.leftCalendar.month.hour(hour).minute(minute).second(second);
  790. if (this.singleDatePicker)
  791. this.endDate = start.clone();
  792. } else {
  793. var end = this.endDate.clone();
  794. end.hour(hour);
  795. end.minute(minute);
  796. end.second(second);
  797. this.endDate = end;
  798. if (this.singleDatePicker)
  799. this.startDate = end.clone();
  800. this.rightCalendar.month.hour(hour).minute(minute).second(second);
  801. }
  802. this.updateView();
  803. this.updateCalendars();
  804. if (this.autoApply) {
  805. this.notify();
  806. this.element.trigger('apply.daterangepicker', this);
  807. }
  808. },
  809. updateCalendars: function () {
  810. this.leftCalendar.calendar = this.buildCalendar(this.leftCalendar.month.month(), this.leftCalendar.month.year(), this.leftCalendar.month.hour(), this.leftCalendar.month.minute(), this.leftCalendar.month.second(), 'left');
  811. this.rightCalendar.calendar = this.buildCalendar(this.rightCalendar.month.month(), this.rightCalendar.month.year(), this.rightCalendar.month.hour(), this.rightCalendar.month.minute(), this.rightCalendar.month.second(), 'right');
  812. this.container.find('.calendar.left').empty().html(this.renderCalendar(this.leftCalendar.calendar, this.startDate, this.minDate, this.maxDate, 'left'));
  813. this.container.find('.calendar.right').empty().html(this.renderCalendar(this.rightCalendar.calendar, this.endDate, this.singleDatePicker ? this.minDate : this.startDate, this.maxDate, 'right'));
  814. this.container.find('.ranges li').removeClass('active');
  815. var customRange = true;
  816. var i = 0;
  817. for (var range in this.ranges) {
  818. if (this.timePicker) {
  819. if (this.startDate.isSame(this.ranges[range][0]) && this.endDate.isSame(this.ranges[range][1])) {
  820. customRange = false;
  821. this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')')
  822. .addClass('active').html();
  823. }
  824. } else {
  825. //ignore times when comparing dates if time picker is not enabled
  826. if (this.startDate.format('YYYY-MM-DD') == this.ranges[range][0].format('YYYY-MM-DD') && this.endDate.format('YYYY-MM-DD') == this.ranges[range][1].format('YYYY-MM-DD')) {
  827. customRange = false;
  828. this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')')
  829. .addClass('active').html();
  830. }
  831. }
  832. i++;
  833. }
  834. if (customRange) {
  835. this.chosenLabel = this.container.find('.ranges li:last').addClass('active').html();
  836. this.showCalendars();
  837. }
  838. },
  839. buildCalendar: function (month, year, hour, minute, second, side) {
  840. var daysInMonth = moment([year, month]).daysInMonth();
  841. var firstDay = moment([year, month, 1]);
  842. var lastDay = moment([year, month, daysInMonth]);
  843. var lastMonth = moment(firstDay).subtract(1, 'month').month();
  844. var lastYear = moment(firstDay).subtract(1, 'month').year();
  845. var daysInLastMonth = moment([lastYear, lastMonth]).daysInMonth();
  846. var dayOfWeek = firstDay.day();
  847. var i;
  848. //initialize a 6 rows x 7 columns array for the calendar
  849. var calendar = [];
  850. calendar.firstDay = firstDay;
  851. calendar.lastDay = lastDay;
  852. for (i = 0; i < 6; i++) {
  853. calendar[i] = [];
  854. }
  855. //populate the calendar with date objects
  856. var startDay = daysInLastMonth - dayOfWeek + this.locale.firstDay + 1;
  857. if (startDay > daysInLastMonth)
  858. startDay -= 7;
  859. if (dayOfWeek == this.locale.firstDay)
  860. startDay = daysInLastMonth - 6;
  861. // Possible patch for issue #626 https://github.com/dangrossman/bootstrap-daterangepicker/issues/626
  862. var curDate = moment([lastYear, lastMonth, startDay, 12, minute, second]); // .utcOffset(this.timeZone);
  863. var col, row;
  864. for (i = 0, col = 0, row = 0; i < 42; i++, col++, curDate = moment(curDate).add(24, 'hour')) {
  865. if (i > 0 && col % 7 === 0) {
  866. col = 0;
  867. row++;
  868. }
  869. calendar[row][col] = curDate.clone().hour(hour);
  870. curDate.hour(12);
  871. if (this.minDate && calendar[row][col].format('YYYY-MM-DD') == this.minDate.format('YYYY-MM-DD') && calendar[row][col].isBefore(this.minDate) && side == 'left') {
  872. calendar[row][col] = this.minDate.clone();
  873. }
  874. if (this.maxDate && calendar[row][col].format('YYYY-MM-DD') == this.maxDate.format('YYYY-MM-DD') && calendar[row][col].isAfter(this.maxDate) && side == 'right') {
  875. calendar[row][col] = this.maxDate.clone();
  876. }
  877. }
  878. return calendar;
  879. },
  880. renderDropdowns: function (selected, minDate, maxDate) {
  881. var currentMonth = selected.month();
  882. var currentYear = selected.year();
  883. var maxYear = (maxDate && maxDate.year()) || (currentYear + 5);
  884. var minYear = (minDate && minDate.year()) || (currentYear - 50);
  885. var monthHtml = '<select class="monthselect">';
  886. var inMinYear = currentYear == minYear;
  887. var inMaxYear = currentYear == maxYear;
  888. for (var m = 0; m < 12; m++) {
  889. if ((!inMinYear || m >= minDate.month()) && (!inMaxYear || m <= maxDate.month())) {
  890. monthHtml += "<option value='" + m + "'" +
  891. (m === currentMonth ? " selected='selected'" : "") +
  892. ">" + this.locale.monthNames[m] + "</option>";
  893. }
  894. }
  895. monthHtml += "</select>";
  896. var yearHtml = '<select class="yearselect">';
  897. for (var y = minYear; y <= maxYear; y++) {
  898. yearHtml += '<option value="' + y + '"' +
  899. (y === currentYear ? ' selected="selected"' : '') +
  900. '>' + y + '</option>';
  901. }
  902. yearHtml += '</select>';
  903. return monthHtml + yearHtml;
  904. },
  905. renderCalendar: function (calendar, selected, minDate, maxDate, side) {
  906. var html = '<div class="calendar-date">';
  907. html += '<table class="table-condensed">';
  908. html += '<thead>';
  909. html += '<tr>';
  910. // add empty cell for week number
  911. if (this.showWeekNumbers)
  912. html += '<th></th>';
  913. if (!minDate || minDate.isBefore(calendar.firstDay)) {
  914. html += '<th class="prev available"><i class="fa fa-arrow-left icon icon-arrow-left glyphicon glyphicon-arrow-left"></i></th>';
  915. } else {
  916. html += '<th></th>';
  917. }
  918. var dateHtml = this.locale.monthNames[calendar[1][1].month()] + calendar[1][1].format(" YYYY");
  919. if (this.showDropdowns) {
  920. dateHtml = this.renderDropdowns(calendar[1][1], minDate, maxDate);
  921. }
  922. html += '<th colspan="5" class="month">' + dateHtml + '</th>';
  923. if (!maxDate || maxDate.isAfter(calendar.lastDay)) {
  924. html += '<th class="next available"><i class="fa fa-arrow-right icon icon-arrow-right glyphicon glyphicon-arrow-right"></i></th>';
  925. } else {
  926. html += '<th></th>';
  927. }
  928. html += '</tr>';
  929. html += '<tr>';
  930. // add week number label
  931. if (this.showWeekNumbers)
  932. html += '<th class="week">' + this.locale.weekLabel + '</th>';
  933. $.each(this.locale.daysOfWeek, function (index, dayOfWeek) {
  934. html += '<th>' + dayOfWeek + '</th>';
  935. });
  936. html += '</tr>';
  937. html += '</thead>';
  938. html += '<tbody>';
  939. for (var row = 0; row < 6; row++) {
  940. html += '<tr>';
  941. // add week number
  942. if (this.showWeekNumbers)
  943. html += '<td class="week">' + calendar[row][0].week() + '</td>';
  944. for (var col = 0; col < 7; col++) {
  945. var cname = 'available ';
  946. cname += (calendar[row][col].month() == calendar[1][1].month()) ? '' : 'off';
  947. if(calendar[row][col].isSame(new Date(), "day") ) {
  948. cname += ' today ';
  949. }
  950. if ((minDate && calendar[row][col].isBefore(minDate, 'day')) || (maxDate && calendar[row][col].isAfter(maxDate, 'day'))) {
  951. cname = ' off disabled ';
  952. } else if (calendar[row][col].format('YYYY-MM-DD') == selected.format('YYYY-MM-DD')) {
  953. cname += ' active ';
  954. if (calendar[row][col].format('YYYY-MM-DD') == this.startDate.format('YYYY-MM-DD')) {
  955. cname += ' start-date ';
  956. }
  957. if (calendar[row][col].format('YYYY-MM-DD') == this.endDate.format('YYYY-MM-DD')) {
  958. cname += ' end-date ';
  959. }
  960. } else if (calendar[row][col] >= this.startDate && calendar[row][col] <= this.endDate) {
  961. cname += ' in-range ';
  962. if (calendar[row][col].isSame(this.startDate)) { cname += ' start-date '; }
  963. if (calendar[row][col].isSame(this.endDate)) { cname += ' end-date '; }
  964. }
  965. var title = 'r' + row + 'c' + col;
  966. html += '<td class="' + cname.replace(/\s+/g, ' ').replace(/^\s?(.*?)\s?$/, '$1') + '" data-title="' + title + '">' + calendar[row][col].date() + '</td>';
  967. }
  968. html += '</tr>';
  969. }
  970. html += '</tbody>';
  971. html += '</table>';
  972. html += '</div>';
  973. var i;
  974. if (this.timePicker) {
  975. html += '<div class="calendar-time">';
  976. html += '<select class="hourselect">';
  977. // Disallow selections before the minDate or after the maxDate
  978. var min_hour = 0;
  979. var max_hour = 23;
  980. if (minDate && (side == 'left' || this.singleDatePicker) && selected.format('YYYY-MM-DD') == minDate.format('YYYY-MM-DD')) {
  981. min_hour = minDate.hour();
  982. if (selected.hour() < min_hour)
  983. selected.hour(min_hour);
  984. if (this.timePicker12Hour && min_hour >= 12 && selected.hour() >= 12)
  985. min_hour -= 12;
  986. if (this.timePicker12Hour && min_hour == 12)
  987. min_hour = 1;
  988. }
  989. if (maxDate && (side == 'right' || this.singleDatePicker) && selected.format('YYYY-MM-DD') == maxDate.format('YYYY-MM-DD')) {
  990. max_hour = maxDate.hour();
  991. if (selected.hour() > max_hour)
  992. selected.hour(max_hour);
  993. if (this.timePicker12Hour && max_hour >= 12 && selected.hour() >= 12)
  994. max_hour -= 12;
  995. }
  996. var start = 0;
  997. var end = 23;
  998. var selected_hour = selected.hour();
  999. if (this.timePicker12Hour) {
  1000. start = 1;
  1001. end = 12;
  1002. if (selected_hour >= 12)
  1003. selected_hour -= 12;
  1004. if (selected_hour === 0)
  1005. selected_hour = 12;
  1006. }
  1007. for (i = start; i <= end; i++) {
  1008. if (i == selected_hour) {
  1009. html += '<option value="' + i + '" selected="selected">' + i + '</option>';
  1010. } else if (i < min_hour || i > max_hour) {
  1011. html += '<option value="' + i + '" disabled="disabled" class="disabled">' + i + '</option>';
  1012. } else {
  1013. html += '<option value="' + i + '">' + i + '</option>';
  1014. }
  1015. }
  1016. html += '</select> : ';
  1017. html += '<select class="minuteselect">';
  1018. // Disallow selections before the minDate or after the maxDate
  1019. var min_minute = 0;
  1020. var max_minute = 59;
  1021. if (minDate && (side == 'left' || this.singleDatePicker) && selected.format('YYYY-MM-DD h A') == minDate.format('YYYY-MM-DD h A')) {
  1022. min_minute = minDate.minute();
  1023. if (selected.minute() < min_minute)
  1024. selected.minute(min_minute);
  1025. }
  1026. if (maxDate && (side == 'right' || this.singleDatePicker) && selected.format('YYYY-MM-DD h A') == maxDate.format('YYYY-MM-DD h A')) {
  1027. max_minute = maxDate.minute();
  1028. if (selected.minute() > max_minute)
  1029. selected.minute(max_minute);
  1030. }
  1031. for (i = 0; i < 60; i += this.timePickerIncrement) {
  1032. var num = i;
  1033. if (num < 10)
  1034. num = '0' + num;
  1035. if (i == selected.minute()) {
  1036. html += '<option value="' + i + '" selected="selected">' + num + '</option>';
  1037. } else if (i < min_minute || i > max_minute) {
  1038. html += '<option value="' + i + '" disabled="disabled" class="disabled">' + num + '</option>';
  1039. } else {
  1040. html += '<option value="' + i + '">' + num + '</option>';
  1041. }
  1042. }
  1043. html += '</select> ';
  1044. if (this.timePickerSeconds) {
  1045. html += ': <select class="secondselect">';
  1046. for (i = 0; i < 60; i += this.timePickerIncrement) {
  1047. var num = i;
  1048. if (num < 10)
  1049. num = '0' + num;
  1050. if (i == selected.second()) {
  1051. html += '<option value="' + i + '" selected="selected">' + num + '</option>';
  1052. } else {
  1053. html += '<option value="' + i + '">' + num + '</option>';
  1054. }
  1055. }
  1056. html += '</select>';
  1057. }
  1058. if (this.timePicker12Hour) {
  1059. html += '<select class="ampmselect">';
  1060. // Disallow selection before the minDate or after the maxDate
  1061. var am_html = '';
  1062. var pm_html = '';
  1063. if (minDate && (side == 'left' || this.singleDatePicker) && selected.format('YYYY-MM-DD') == minDate.format('YYYY-MM-DD') && minDate.hour() >= 12) {
  1064. am_html = ' disabled="disabled" class="disabled"';
  1065. }
  1066. if (maxDate && (side == 'right' || this.singleDatePicker) && selected.format('YYYY-MM-DD') == maxDate.format('YYYY-MM-DD') && maxDate.hour() < 12) {
  1067. pm_html = ' disabled="disabled" class="disabled"';
  1068. }
  1069. if (selected.hour() >= 12) {
  1070. html += '<option value="AM"' + am_html + '>AM</option><option value="PM" selected="selected"' + pm_html + '>PM</option>';
  1071. } else {
  1072. html += '<option value="AM" selected="selected"' + am_html + '>AM</option><option value="PM"' + pm_html + '>PM</option>';
  1073. }
  1074. html += '</select>';
  1075. }
  1076. html += '</div>';
  1077. }
  1078. return html;
  1079. },
  1080. remove: function() {
  1081. this.container.remove();
  1082. this.element.off('.daterangepicker');
  1083. this.element.removeData('daterangepicker');
  1084. }
  1085. };
  1086. $.fn.daterangepicker = function (options, cb) {
  1087. this.each(function () {
  1088. var el = $(this);
  1089. if (el.data('daterangepicker'))
  1090. el.data('daterangepicker').remove();
  1091. el.data('daterangepicker', new DateRangePicker(el, options, cb));
  1092. });
  1093. return this;
  1094. };
  1095. }));