koha-tmpl/intranet-tmpl/prog/en/includes/calendar.inc

   1 [% USE Asset %]
   2 [% USE Koha %]
   3 [% USE raw %]
   4 <!-- calendar.inc -->
   5 [% FILTER collapse %]
   6 <script>
   7     var debug    = "[% debug | html %]";
   8     var dateformat_pref = "[% Koha.Preference('dateformat ') | html %]";
   9     var dateformat_string = "";
  10     var flatpickr_dateformat_string = "";
  11     switch ( dateformat_pref ){
  12         case "us":
  13             dateformat_string = "mm/dd/yy";
  14             flatpickr_dateformat_string = "m/d/Y";
  15             break;
  16         case "metric":
  17             dateformat_string = "dd/mm/yy";
  18             flatpickr_dateformat_string = "d/m/Y";
  19             break;
  20         case "dmydot":
  21             dateformat_string = "dd.mm.yy";
  22             flatpickr_dateformat_string = "d.m.Y";
  23             break;
  24         default:
  25             dateformat_string = "yy-mm-dd";
  26             flatpickr_dateformat_string = "Y-m-d";
  27     }
  28     var sentmsg = 0;
  29     var bidi = [% IF(bidi) %] true[% ELSE %] false[% END %];
  30     var calendarFirstDayOfWeek = '[% Koha.Preference('CalendarFirstDayOfWeek') | html %]';
  31     var flatpickr_timeformat_string = [% IF Koha.Preference('TimeFormat') == '12hr' %]"G:i K"[% ELSE %]"H:i"[% END %];
  32     var flatpickr_timeformat = [% IF Koha.Preference('TimeFormat') == '12hr' %]false[% ELSE %]true[% END %];
  33 </script>
  34 <!-- / calendar.inc -->
  35 [% Asset.js("js/calendar.js") | $raw %]
  36 [% Asset.js("lib/flatpickr/flatpickr.min.js") | $raw %]
  37 <script>
  38     flatpickr.l10ns.default.weekdays = flatpickr_weekdays;
  39     flatpickr.l10ns.default.months   = flatpickr_months;
  40     flatpickr.setDefaults({
  41         allowInput: true,
  42         dateFormat: flatpickr_dateformat_string,
  43         nextArrow: '<i class="fa fa-fw fa-arrow-right"></i>',
  44         prevArrow: '<i class="fa fa-fw fa-arrow-left"></i>',
  45         time_24hr: flatpickr_timeformat,
  46         defaultHour: 23,
  47         defaultMinute: 59,
  48         locale: {
  49             "firstDayOfWeek": calendarFirstDayOfWeek
  50         },
  51         onReady: function( selectedDates, dateStr, instance ){
  52             /* When flatpickr instance is created, automatically append a "clear date" link */
  53             $(instance.input)
  54                 /* Add a wrapper element so that we can prevent the clear button from wrapping */
  55                 .wrap("<span class='flatpickr_wrapper'></span>")
  56                 .attr("autocomplete", "off")
  57                 .after( $("<a/>")
  58                     .attr("href","#")
  59                     .addClass("clear_date")
  60                     .on("click", function(e){
  61                         e.preventDefault();
  62                         instance.clear();
  63                     })
  64                     .addClass("fa fa-fw fa-remove")
  65                     .attr("aria-hidden", true)
  66                     .attr("aria-label", _("Clear date") )
  67                 ).keydown(function(e) {
  68                     var key = (event.keyCode ? event.keyCode : event.which);
  69                     if ( key == 40 ) {
  70                         instance.set('allowInput',false);
  71                     }
  72                 });
  73         },
  74         onClose: function( selectedDates, dateText, instance) {
  75             validate_date( dateText, instance );
  76             var thisInput = instance.input;
  77             if ( thisInput.hasAttribute('data-date_to') ) {
  78                 var endPicker = document.querySelector("#"+thisInput.dataset.date_to)._flatpickr;
  79                 endPicker.set('minDate', selectedDates[0]);
  80             }
  81
  82             let = on_close_focus = $(thisInput).data('flatpickr-on-close-focus');
  83             if ( on_close_focus ) {
  84                 $(on_close_focus).focus();
  85             }
  86         },
  87     });
  88     $(document).ready(function(){
  89         $(".flatpickr").each(function(){
  90             let options = {};
  91
  92             if( $(this).data("flatpickr-futuredate") === true ) {
  93                 let original_date = $(this).val();
  94                 if ( original_date ) {
  95                     original_date = Date_from_syspref( original_date ).getTime();
  96                     let tomorrow = new Date().fp_incr(1).getTime();
  97
  98                     options['enable'] = [function(date){
  99                         date = date.getTime();
 100                         if ( date == original_date ) return true;
 101                         if ( date >= tomorrow)       return true;
 102                     }];
 103                 }
 104                 else {
 105                     options['minDate'] = new Date().fp_incr(1);
 106                 }
 107             }
 108             if( $(this).data("flatpickr-pastinclusive") === true ) {
 109                 options['maxDate'] = "today";
 110             }
 111             if( $(this).data("flatpickr-pastdate") === true ) {
 112                 options['maxDate'] = new Date().fp_incr(-1);
 113             }
 114             if ( $(this).data('flatpickr-enable-time') === true ) {
 115                 options['enableTime'] = true;
 116                 options['dateFormat'] = flatpickr_dateformat_string + " " + flatpickr_timeformat_string;
 117             }
 118
 119             $(this).flatpickr(options);
 120         });
 121     });
 122 </script>
 123 [% END %]