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 = [% IF ( dateformat == "us" ) %]"mm/dd/yy"[% ELSIF ( dateformat == "metric" ) %]"dd/mm/yy"[% ELSIF ( dateformat == "dmydot" ) %]"dd.mm.yy"[% ELSE %]"yy-mm-dd"[% END %];
  10     var flatpickr_dateformat_string = [% IF ( dateformat == "us" ) %]"m/d/Y"[% ELSIF ( dateformat == "metric" ) %]"d/m/Y"[% ELSIF ( dateformat == "dmydot" ) %]"d.m.Y"[% ELSE %]"Y-m-d"[% END %];
  11     var sentmsg = 0;
  12     var bidi = [% IF(bidi) %] true[% ELSE %] false[% END %];
  13     var calendarFirstDayOfWeek = '[% Koha.Preference('CalendarFirstDayOfWeek') | html %]';
  14     var flatpickr_timeformat_string = [% IF Koha.Preference('TimeFormat') == '12hr' %]"G:i K"[% ELSE %]"H:i"[% END %];
  15     var flatpickr_timeformat = [% IF Koha.Preference('TimeFormat') == '12hr' %]false[% ELSE %]true[% END %];
  16 </script>
  17 <!-- / calendar.inc -->
  18 [% Asset.js("js/calendar.js") | $raw %]
  19 [% Asset.js("lib/flatpickr/flatpickr.min.js") | $raw %]
  20 <script>
  21     flatpickr.l10ns.default.weekdays = flatpickr_weekdays;
  22     flatpickr.l10ns.default.months   = flatpickr_months;
  23     flatpickr.setDefaults({
  24         allowInput: true,
  25         dateFormat: flatpickr_dateformat_string,
  26         nextArrow: '<i class="fa fa-fw fa-arrow-right"></i>',
  27         prevArrow: '<i class="fa fa-fw fa-arrow-left"></i>',
  28         time_24hr: flatpickr_timeformat,
  29         locale: {
  30             "firstDayOfWeek": calendarFirstDayOfWeek
  31         },
  32         onReady: function( selectedDates, dateStr, instance ){
  33             /* When flatpickr instance is created, automatically append a "clear date" link */
  34             if( $(instance.input).hasClass("futuredate") ){
  35                 instance.set("minDate", new Date().fp_incr(1));
  36             }
  37             if( $(instance.input).hasClass("pastdate") ){
  38                 instance.set("maxDate", new Date().fp_incr(-1));
  39             }
  40             $(instance.input)
  41                 /* Add a wrapper element so that we can prevent the clear button from wrapping */
  42                 .wrap("<span class='flatpickr_wrapper'></span>")
  43                 .after( $("<a/>")
  44                     .attr("href","#")
  45                     .addClass("clear_date")
  46                     .on("click", function(e){
  47                         e.preventDefault();
  48                         instance.clear();
  49                     })
  50                     .addClass("fa fa-fw fa-remove")
  51                     .attr("aria-hidden", true)
  52                     .attr("aria-label", _("Clear date") )
  53                 ).keydown(function(e) {
  54                     var key = (event.keyCode ? event.keyCode : event.which);
  55                     if ( key == 40 ) {
  56                         instance.set('allowInput',false);
  57                     }
  58                 });
  59         },
  60         onClose: function( selectedDates, dateText, instance) {
  61             validate_date( selectedDates, instance );
  62         },
  63     });
  64     $(document).ready(function(){
  65         $(".flatpickr").flatpickr();
  66         var startPicker = $(".flatpickrfrom").flatpickr({
  67             onClose: function( selectedDates, dateText, instance) {
  68                 validate_date( selectedDates, instance );
  69                 endPicker.set('minDate', selectedDates[0]);
  70             }
  71         });
  72         var endPicker = $(".flatpickrto").flatpickr({
  73             onClose: function( selectedDates, dateText, instance) {
  74                 validate_date( selectedDates, instance );
  75             },
  76         });
  77
  78     });
  79 </script>
  80 [% END %]