main.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. require('../../daterangepicker.js');
  2. var $ = require('jquery'),
  3. moment = require('moment');
  4. $(document).ready(function() {
  5. $('#config-text').keyup(function() {
  6. eval($(this).val());
  7. });
  8. $('.configurator input, .configurator select').change(function() {
  9. updateConfig();
  10. });
  11. $('.demo i').click(function() {
  12. $(this).parent().find('input').click();
  13. });
  14. $('#startDate').daterangepicker({
  15. singleDatePicker: true,
  16. startDate: moment().subtract(6, 'days')
  17. });
  18. $('#endDate').daterangepicker({
  19. singleDatePicker: true,
  20. startDate: moment()
  21. });
  22. updateConfig();
  23. function updateConfig() {
  24. var options = {};
  25. if ($('#singleDatePicker').is(':checked'))
  26. options.singleDatePicker = true;
  27. if ($('#showDropdowns').is(':checked'))
  28. options.showDropdowns = true;
  29. if ($('#showWeekNumbers').is(':checked'))
  30. options.showWeekNumbers = true;
  31. if ($('#showISOWeekNumbers').is(':checked'))
  32. options.showISOWeekNumbers = true;
  33. if ($('#timePicker').is(':checked'))
  34. options.timePicker = true;
  35. if ($('#timePicker24Hour').is(':checked'))
  36. options.timePicker24Hour = true;
  37. if ($('#timePickerIncrement').val().length && $('#timePickerIncrement').val() != 1)
  38. options.timePickerIncrement = parseInt($('#timePickerIncrement').val(), 10);
  39. if ($('#timePickerSeconds').is(':checked'))
  40. options.timePickerSeconds = true;
  41. if ($('#autoApply').is(':checked'))
  42. options.autoApply = true;
  43. if ($('#dateLimit').is(':checked'))
  44. options.dateLimit = { days: 7 };
  45. if ($('#ranges').is(':checked')) {
  46. options.ranges = {
  47. 'Today': [moment(), moment()],
  48. 'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
  49. 'Last 7 Days': [moment().subtract(6, 'days'), moment()],
  50. 'Last 30 Days': [moment().subtract(29, 'days'), moment()],
  51. 'This Month': [moment().startOf('month'), moment().endOf('month')],
  52. 'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
  53. };
  54. }
  55. if ($('#locale').is(':checked')) {
  56. options.locale = {
  57. format: 'MM/DD/YYYY HH:mm',
  58. separator: ' - ',
  59. applyLabel: 'Apply',
  60. cancelLabel: 'Cancel',
  61. fromLabel: 'From',
  62. toLabel: 'To',
  63. customRangeLabel: 'Custom',
  64. daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr','Sa'],
  65. monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
  66. firstDay: 1
  67. };
  68. }
  69. if (!$('#linkedCalendars').is(':checked'))
  70. options.linkedCalendars = false;
  71. if (!$('#autoUpdateInput').is(':checked'))
  72. options.autoUpdateInput = false;
  73. if ($('#alwaysShowCalendars').is(':checked'))
  74. options.alwaysShowCalendars = true;
  75. if ($('#parentEl').val().length)
  76. options.parentEl = $('#parentEl').val();
  77. if ($('#startDate').val().length)
  78. options.startDate = $('#startDate').val();
  79. if ($('#endDate').val().length)
  80. options.endDate = $('#endDate').val();
  81. if ($('#minDate').val().length)
  82. options.minDate = $('#minDate').val();
  83. if ($('#maxDate').val().length)
  84. options.maxDate = $('#maxDate').val();
  85. if ($('#opens').val().length && $('#opens').val() != 'right')
  86. options.opens = $('#opens').val();
  87. if ($('#drops').val().length && $('#drops').val() != 'down')
  88. options.drops = $('#drops').val();
  89. if ($('#buttonClasses').val().length && $('#buttonClasses').val() != 'btn btn-sm')
  90. options.buttonClasses = $('#buttonClasses').val();
  91. if ($('#applyClass').val().length && $('#applyClass').val() != 'btn-success')
  92. options.applyClass = $('#applyClass').val();
  93. if ($('#cancelClass').val().length && $('#cancelClass').val() != 'btn-default')
  94. options.cancelClass = $('#cancelClass').val();
  95. $('#config-text').val("$('#demo').daterangepicker(" + JSON.stringify(options, null, ' ') + ", function(start, end, label) {\n console.log(\"New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')\");\n});");
  96. $('#config-demo').daterangepicker(options, function(start, end, label) { console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')'); });
  97. }
  98. });