|
Lines 5-11
Link Here
|
| 5 |
[% INCLUDE 'doc-head-open.inc' %] |
5 |
[% INCLUDE 'doc-head-open.inc' %] |
| 6 |
<title>[% Branches.GetName( branch ) | html %] calendar; Tools › Koha &rsaquo</title> |
6 |
<title>[% Branches.GetName( branch ) | html %] calendar; Tools › Koha &rsaquo</title> |
| 7 |
[% INCLUDE 'doc-head-close.inc' %] |
7 |
[% INCLUDE 'doc-head-close.inc' %] |
| 8 |
[% Asset.css("css/discretecalendar.css") | $raw %] |
8 |
[% Asset.css("css/calendar.css") | $raw %] |
| 9 |
</head> |
9 |
</head> |
| 10 |
|
10 |
|
| 11 |
<body id="tools_holidays" class="tools"> |
11 |
<body id="tools_holidays" class="tools"> |
|
Lines 80-86
Link Here
|
| 80 |
|
80 |
|
| 81 |
<h3>Calendar information</h3> |
81 |
<h3>Calendar information</h3> |
| 82 |
|
82 |
|
| 83 |
<div id="jcalendar-container"></div> |
83 |
<span id="calendar-anchor"></span> |
| 84 |
|
84 |
|
| 85 |
<!-- ***************************** Panel to deal with new holidays ********************** --> |
85 |
<!-- ***************************** Panel to deal with new holidays ********************** --> |
| 86 |
<div class="panel newHoliday" id="newHoliday"> |
86 |
<div class="panel newHoliday" id="newHoliday"> |
|
Lines 110-116
Link Here
|
| 110 |
</li> |
110 |
</li> |
| 111 |
<li class="dateinsert"> |
111 |
<li class="dateinsert"> |
| 112 |
<strong>To date:</strong> |
112 |
<strong>To date:</strong> |
| 113 |
<input type="text" id="to_date_datepicker" size="20" class="datepicker" /> |
113 |
<input type="text" id="to_date_flatpickr" size="20" /> |
| 114 |
</li> |
114 |
</li> |
| 115 |
<li> |
115 |
<li> |
| 116 |
<label for="title">Title: </label> |
116 |
<label for="title">Title: </label> |
|
Lines 162-170
Link Here
|
| 162 |
</li> |
162 |
</li> |
| 163 |
<li class="CopyDatePanel"> |
163 |
<li class="CopyDatePanel"> |
| 164 |
<label>From:</label> |
164 |
<label>From:</label> |
| 165 |
<input type="text" id="copyto_from_datepicker" size="20" class="datepicker"/> |
165 |
<input type="text" id="copyto_from_flatpickr" size="20"/> |
| 166 |
<label>To:</label> |
166 |
<label>To:</label> |
| 167 |
<input type="text" id="copyto_to_datepicker" size="20" class="datepicker"/> |
167 |
<input type="text" id="copyto_to_flatpickr" size="20"/> |
| 168 |
</li> |
168 |
</li> |
| 169 |
</ol> |
169 |
</ol> |
| 170 |
|
170 |
|
|
Lines 214-224
Link Here
|
| 214 |
<div id="holiday-list"> |
214 |
<div id="holiday-list"> |
| 215 |
[% IF ( NEED_VALIDATION_HOLIDAYS ) %] |
215 |
[% IF ( NEED_VALIDATION_HOLIDAYS ) %] |
| 216 |
<h3>Need validation holidays</h3> |
216 |
<h3>Need validation holidays</h3> |
| 217 |
<table id="holidaysunique"> |
217 |
<table id="holidaysvalidation"> |
| 218 |
<thead> |
218 |
<thead> |
| 219 |
<tr> |
219 |
<tr> |
| 220 |
<th class="exception">Date</th> |
220 |
<th class="validation">Date</th> |
| 221 |
<th class="exception">Title</th> |
221 |
<th class="validation">Title</th> |
| 222 |
</tr> |
222 |
</tr> |
| 223 |
</thead> |
223 |
</thead> |
| 224 |
<tbody> |
224 |
<tbody> |
|
Lines 302-308
Link Here
|
| 302 |
|
302 |
|
| 303 |
[% IF ( FLOAT_HOLIDAYS ) %] |
303 |
[% IF ( FLOAT_HOLIDAYS ) %] |
| 304 |
<h3>Floating holidays</h3> |
304 |
<h3>Floating holidays</h3> |
| 305 |
<table id="holidaysunique"> |
305 |
<table id="holidaysfloat"> |
| 306 |
<thead> |
306 |
<thead> |
| 307 |
<tr> |
307 |
<tr> |
| 308 |
<th class="float">Date</th> |
308 |
<th class="float">Date</th> |
|
Lines 336-342
Link Here
|
| 336 |
[% MACRO jsinclude BLOCK %] |
336 |
[% MACRO jsinclude BLOCK %] |
| 337 |
[% INCLUDE 'calendar.inc' %] |
337 |
[% INCLUDE 'calendar.inc' %] |
| 338 |
[% INCLUDE 'datatables.inc' %] |
338 |
[% INCLUDE 'datatables.inc' %] |
| 339 |
[% Asset.js("lib/jquery/plugins/jquery-ui-timepicker-addon.min.js") | $raw %] |
|
|
| 340 |
[% Asset.js("js/tools-menu.js") | $raw %] |
339 |
[% Asset.js("js/tools-menu.js") | $raw %] |
| 341 |
<script> |
340 |
<script> |
| 342 |
var weekdays = new Array(_("Sundays"),_("Mondays"),_("Tuesdays"),_("Wednesdays"),_("Thursdays"),_("Fridays"),_("Saturdays")); |
341 |
var weekdays = new Array(_("Sundays"),_("Mondays"),_("Tuesdays"),_("Wednesdays"),_("Thursdays"),_("Fridays"),_("Saturdays")); |
|
Lines 426-456
Link Here
|
| 426 |
} |
425 |
} |
| 427 |
|
426 |
|
| 428 |
// This function gives css classes to each kind of day |
427 |
// This function gives css classes to each kind of day |
| 429 |
function dateStatusHandler(date) { |
428 |
function dateStatusHandler(dayElem) { |
| 430 |
date = getSeparetedDate(date); |
429 |
date = getSeparetedDate(dayElem.dateObj); |
| 431 |
var dateString = date.dateString; |
430 |
var dateString = date.dateString; |
| 432 |
var today = new Date(); |
431 |
var today = new Date(); |
| 433 |
today.setHours(0, 0, 0, 0); |
432 |
today.setHours(0, 0, 0, 0); |
| 434 |
|
433 |
|
| 435 |
if (datesInfos[dateString] && datesInfos[dateString].holiday_type =='W') { |
434 |
if (datesInfos[dateString] && datesInfos[dateString].holiday_type =='W') { |
| 436 |
return [true, "repeatableweekly", _("Weekly holiday: %s").format(datesInfos[dateString].title)]; |
435 |
formatDay( [ "repeatableweekly", _("Weekly holiday: %s").format(datesInfos[dateString].title)], dayElem ); |
| 437 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'R') { |
436 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'R') { |
| 438 |
return [true, "repeatableyearly", _("Yearly holiday: %s").format(datesInfos[dateString].title)]; |
437 |
formatDay( [ "repeatableyearly", _("Yearly holiday: %s").format(datesInfos[dateString].title)], dayElem ); |
| 439 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'N') { |
438 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'N') { |
| 440 |
return [true, "exception", _("Need validation: %s").format(datesInfos[dateString].title)]; |
439 |
formatDay( [ "exception", _("Need validation: %s").format(datesInfos[dateString].title)], dayElem ); |
| 441 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'F') { |
440 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'F') { |
| 442 |
return [true, "float", _("Floating holiday: %s").format(datesInfos[dateString].title)]; |
441 |
formatDay( [ "float", _("Floating holiday: %s").format(datesInfos[dateString].title)], dayElem ); |
| 443 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'E') { |
442 |
} else if (datesInfos[dateString] && datesInfos[dateString].holiday_type == 'E') { |
| 444 |
return [true, "holiday", _("Single holiday: %s").format(datesInfos[dateString].title)]; |
443 |
formatDay( [ "holiday", _("Single holiday: %s").format(datesInfos[dateString].title)], dayElem ); |
| 445 |
} else { |
444 |
} else { |
| 446 |
if (date.date_obj < today) { |
445 |
if (date.date_obj < today) { |
| 447 |
return [true, "past-date", _("Past day")]; |
446 |
formatDay( [ "past-date", _("Past day")], dayElem ); |
| 448 |
}else { |
447 |
}else { |
| 449 |
return [true, "normalday", _("Normal day")]; |
448 |
formatDay( [ "normalday", _("Normal day")], dayElem ); |
| 450 |
} |
449 |
} |
| 451 |
} |
450 |
} |
| 452 |
} |
451 |
} |
| 453 |
|
452 |
|
|
|
453 |
function formatDay( settings, dayElem ){ |
| 454 |
$(dayElem).attr("title", settings[1]).addClass( settings[0]); |
| 455 |
} |
| 456 |
|
| 454 |
/* |
457 |
/* |
| 455 |
* This function separate a given date object and returns an array containing all needed information about the date. |
458 |
* This function separate a given date object and returns an array containing all needed information about the date. |
| 456 |
*/ |
459 |
*/ |
|
Lines 479-492
Link Here
|
| 479 |
*/ |
482 |
*/ |
| 480 |
function validateForm(form) { |
483 |
function validateForm(form) { |
| 481 |
if (form =='newHoliday-form' && $('#CopyRadioButton').is(':checked')) { |
484 |
if (form =='newHoliday-form' && $('#CopyRadioButton').is(':checked')) { |
| 482 |
if ($('#copyto_from_datepicker').val() =='' || $('#copyto_to_datepicker').val() =='') { |
485 |
if ($('#copyto_from_flatpickr').val() =='' || $('#copyto_to_flatpickr').val() =='') { |
| 483 |
alert("You have to pick a FROM and TO in the Copy to different dates."); |
486 |
alert("You have to pick a FROM and TO in the Copy to different dates."); |
| 484 |
return false; |
487 |
return false; |
| 485 |
} else if ($('#to_date_datepicker').val()) { |
488 |
} else if ($('#to_date_flatpickr').val()) { |
| 486 |
var from_DateFrom = new Date($("#jcalendar-container").datepicker("getDate")); |
489 |
var from_DateFrom = new Date(document.querySelector("#calendar-anchor")._flatpickr.selectedDates[0]); |
| 487 |
var from_DateTo = new Date($('#to_date_datepicker').datepicker("getDate")); |
490 |
var from_DateTo = new Date(document.querySelector('#to_date_flatpickr')._flatpickr.selectedDates[0]); |
| 488 |
var to_DateFrom = new Date($('#copyto_from_datepicker').datepicker("getDate")); |
491 |
var to_DateFrom = new Date(document.querySelector('#copyto_from_flatpickr')._flatpickr.selectedDates[0]); |
| 489 |
var to_DateTo = new Date($('#copyto_to_datepicker').datepicker("getDate")); |
492 |
var to_DateTo = new Date(document.querySelector('#copyto_to_flatpickr')._flatpickr.selectedDates[0]); |
| 490 |
|
493 |
|
| 491 |
var from_start = Math.round( from_DateFrom.getTime() / (3600*24*1000)); // days as integer from.. |
494 |
var from_start = Math.round( from_DateFrom.getTime() / (3600*24*1000)); // days as integer from.. |
| 492 |
var from_end = Math.round( from_DateTo.getTime() / (3600*24*1000)); |
495 |
var from_end = Math.round( from_DateTo.getTime() / (3600*24*1000)); |
|
Lines 526-532
Link Here
|
| 526 |
var dateString = date.dateString; |
529 |
var dateString = date.dateString; |
| 527 |
var date_obj = date.date_obj; |
530 |
var date_obj = date.date_obj; |
| 528 |
|
531 |
|
| 529 |
$("#jcalendar-container").datepicker("setDate", date_obj); |
532 |
document.querySelector("#calendar-anchor")._flatpickr.setDate(date_obj); |
| 530 |
showHoliday(date_obj, dateString, dayName, day, month, year, weekDay, datesInfos[dateString].title, datesInfos[dateString].holiday_type); |
533 |
showHoliday(date_obj, dateString, dayName, day, month, year, weekDay, datesInfos[dateString].title, datesInfos[dateString].holiday_type); |
| 531 |
} |
534 |
} |
| 532 |
|
535 |
|
|
Lines 536-542
Link Here
|
| 536 |
function checkRange(date) { |
539 |
function checkRange(date) { |
| 537 |
date = new Date(date); |
540 |
date = new Date(date); |
| 538 |
$('#to_date').val(getSeparetedDate(date).dateString); |
541 |
$('#to_date').val(getSeparetedDate(date).dateString); |
| 539 |
var fromDate = new Date($("#jcalendar-container").datepicker("getDate")); |
542 |
var fromDate = new Date(document.querySelector("#calendar-anchor")._flatpickr.selectedDates[0]); |
| 540 |
var sameHoliday =true; |
543 |
var sameHoliday =true; |
| 541 |
var sameOpenHours =true; |
544 |
var sameOpenHours =true; |
| 542 |
var sameCloseHours =true; |
545 |
var sameCloseHours =true; |
|
Lines 600-674
Link Here
|
| 600 |
return validateForm($(this).attr("id")); |
603 |
return validateForm($(this).attr("id")); |
| 601 |
}); |
604 |
}); |
| 602 |
|
605 |
|
| 603 |
// Set the correct coloring, default date and the date ranges for all datepickers |
606 |
flatpickr.setDefaults({ |
| 604 |
[% IF (dateformat == 'metric') %][% datepickerformat = 'dd/mm/yy' %] |
607 |
onDayCreate: function( dObj, dStr, fp, dayElem ){ |
| 605 |
[% ELSIF (dateformat == 'us' ) %][% datepickerformat = 'mm/dd/yy' %] |
608 |
/* for each day on the calendar, get the |
| 606 |
[% ELSIF (dateformat == 'iso' ) %][% datepickerformat = 'yy-mm-dd' %] |
609 |
correct status information for the date */ |
| 607 |
[% ELSIF (dateformat == 'dmydot') %][% datepickerformat = 'dd.mm.yy' %] |
610 |
dateStatusHandler( dayElem ); |
| 608 |
[% END %] |
|
|
| 609 |
|
| 610 |
$.datepicker.setDefaults({ |
| 611 |
beforeShowDay: function(thedate) { |
| 612 |
return dateStatusHandler(thedate); |
| 613 |
}, |
611 |
}, |
| 614 |
defaultDate: new Date("[% keydate | html %]"), |
|
|
| 615 |
minDate: new Date("[% minDate | html %]"), |
612 |
minDate: new Date("[% minDate | html %]"), |
| 616 |
maxDate: new Date("[% maxDate | html %]"), |
613 |
maxDate: new Date("[% maxDate | html %]") |
| 617 |
dateFormat: "[% datepickerformat | html %]" |
|
|
| 618 |
}); |
614 |
}); |
| 619 |
|
615 |
|
| 620 |
// Main datepicker |
616 |
// Main flatpickr |
| 621 |
$("#jcalendar-container").datepicker({ |
617 |
$("#calendar-anchor").flatpickr({ |
| 622 |
onSelect: function(dateText, inst) { |
618 |
inline: true, |
|
|
619 |
onReady: function( selectedDates, dateStr, instance ){ |
| 620 |
// We do not want to display the 'close' icon in this case |
| 621 |
$(instance.input).siblings('.flatpickr-input').hide(); |
| 622 |
}, |
| 623 |
onChange: function(selectedDates, dateStr, instance) { |
| 623 |
[% IF datesInfos %] |
624 |
[% IF datesInfos %] |
| 624 |
var date = getSeparetedDate($(this).datepicker("getDate")); |
625 |
var date = getSeparetedDate(selectedDates[0]); |
| 625 |
var weekDay = date.weekDay; |
626 |
var weekDay = date.weekDay; |
| 626 |
var dayName = weekdays[weekDay]; |
627 |
var dayName = weekdays[weekDay]; |
| 627 |
var dateString = date.dateString; |
628 |
var dateString = date.dateString; |
| 628 |
|
629 |
|
| 629 |
// set value of form hidden field |
630 |
// set value of form hidden field |
| 630 |
$('#from_date').val(dateText); |
631 |
$('#from_date').val(dateStr); |
| 631 |
|
|
|
| 632 |
showHoliday(date.date_obj, dateString, dayName, date.day, date.month, date.year, weekDay, datesInfos[dateString].title, datesInfos[dateString].holiday_type); |
632 |
showHoliday(date.date_obj, dateString, dayName, date.day, date.month, date.year, weekDay, datesInfos[dateString].title, datesInfos[dateString].holiday_type); |
| 633 |
[% END %] |
633 |
[% END %] |
| 634 |
}, |
634 |
} |
| 635 |
}); |
635 |
}); |
| 636 |
|
636 |
|
| 637 |
$('#to_date_datepicker').datepicker(); |
637 |
$('#to_date_flatpickr').flatpickr(); |
| 638 |
$("#to_date_datepicker").change(function() { |
638 |
$("#to_date_flatpickr").change(function() { |
| 639 |
checkRange($(this).datepicker("getDate")); |
639 |
checkRange(document.querySelector("#to_date_flatpickr")._flatpickr.selectedDates[0]); |
| 640 |
$('#to_date').val(($(this).val())); |
640 |
$('#to_date').val(($("#to_date_flatpickr").val())); |
| 641 |
if ($('#to_date_datepicker').val()) { |
641 |
if ($('#to_date_flatpickr').val()) { |
| 642 |
$('#days_of_week').show("fast"); |
642 |
$('#days_of_week').show("fast"); |
| 643 |
} else { |
643 |
} else { |
| 644 |
$('#days_of_week').hide("fast"); |
644 |
$('#days_of_week').hide("fast"); |
| 645 |
} |
645 |
} |
| 646 |
}); |
646 |
}); |
| 647 |
|
647 |
|
| 648 |
// Datepickers for copy dates feature |
648 |
// Flatpickrs for copy dates feature |
| 649 |
$('#copyto_from_datepicker').datepicker(); |
649 |
$('#copyto_from_flatpickr').flatpickr(); |
| 650 |
$("#copyto_from_datepicker").change(function() { |
650 |
$("#copyto_from_flatpickr").change(function() { |
| 651 |
$('#copyto_from').val(($(this).val())); |
651 |
$('#copyto_from').val(($(this).val())); |
| 652 |
}); |
652 |
}); |
| 653 |
|
653 |
|
| 654 |
$('#copyto_to_datepicker').datepicker(); |
654 |
$('#copyto_to_flatpickr').flatpickr(); |
| 655 |
$("#copyto_to_datepicker").change(function() { |
655 |
$("#copyto_to_flatpickr").change(function() { |
| 656 |
$('#copyto_to').val(($(this).val())); |
656 |
$('#copyto_to').val(($(this).val())); |
| 657 |
}); |
657 |
}); |
| 658 |
|
658 |
|
| 659 |
// Timepickers for open and close hours |
659 |
// Flatpickrs for open and close hours |
| 660 |
$('#openHour').timepicker({ |
660 |
timeoptions = { |
| 661 |
showOn : 'focus', |
661 |
plugins: [], |
| 662 |
timeFormat: 'HH:mm:ss', |
662 |
enableTime: true, |
| 663 |
showSecond: false, |
663 |
noCalendar: true, |
| 664 |
stepMinute: 5, |
664 |
dateFormat: "H:i:S", |
| 665 |
}); |
665 |
altInput: false, |
| 666 |
$('#closeHour').timepicker({ |
666 |
defaultHour: 12, |
| 667 |
showOn : 'focus', |
667 |
defaultMinute: 0, |
| 668 |
timeFormat: 'HH:mm:ss', |
668 |
onOpen: function( selectedDates, dateStr, instance ) { |
| 669 |
showSecond: false, |
669 |
instance.setDate(instance.input.value, false); |
| 670 |
stepMinute: 5, |
670 |
} |
| 671 |
}); |
671 |
} |
|
|
672 |
$('#openHour').flatpickr(timeoptions); |
| 673 |
$('#closeHour').flatpickr(timeoptions); |
| 672 |
|
674 |
|
| 673 |
$('.newHoliday input[type="radio"]').click(function() { |
675 |
$('.newHoliday input[type="radio"]').click(function() { |
| 674 |
if ($(this).attr("id") == "CopyRadioButton") { |
676 |
if ($(this).attr("id") == "CopyRadioButton") { |
|
Lines 696-702
Link Here
|
| 696 |
$("#holidayType select").on("change", function() { |
698 |
$("#holidayType select").on("change", function() { |
| 697 |
if ($("#holidayType select").val() == "R") { |
699 |
if ($("#holidayType select").val() == "R") { |
| 698 |
$('#days_of_week').hide("fast"); |
700 |
$('#days_of_week').hide("fast"); |
| 699 |
} else if ($('#to_date_datepicker').val()) { |
701 |
} else if ($('#to_date_flatpickr').val()) { |
| 700 |
$('#days_of_week').show("fast"); |
702 |
$('#days_of_week').show("fast"); |
| 701 |
} |
703 |
} |
| 702 |
}); |
704 |
}); |
| 703 |
- |
|
|