Koha/koha-tmpl/intranet-tmpl/prog/en/modules/tools/holidays.tt
Owen Leonard 0111632f1e Bug 28963: Use Flatpickr on calendar page
This patch replaces the use of jQueryUI's datepicker widget on the
Calendar page.

In order to ease customization of the static calendar which shows the
current calendar, I've converted the calendar.css file to SCSS. This
allows us to define new SCSS variables to pass to the Flatpickr SCSS.

Also changed: Removed some unecessary comments in the template.

To test, apply the patch and rebuild the staff interface CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

- Go to Tools -> Calendar.
- Confirm that entering holidays works correctly for all types: Single,
  weekly, yearly, ranges, repeated ranges.
- Confirm that holidays are deleted as expected.
- Confirm that the colors of each type of holiday is correct.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
2021-10-12 11:15:32 +02:00

652 lines
40 KiB
Text

[% USE raw %]
[% USE Asset %]
[% USE Branches %]
[% SET footerjs = 1 %]
[% INCLUDE 'doc-head-open.inc' %]
<title>[% Branches.GetName( branch ) | html %] calendar &rsaquo; Tools &rsaquo; Koha</title>
[% INCLUDE 'doc-head-close.inc' %]
[% Asset.css("css/calendar.css") | $raw %]
</head>
<body id="tools_holidays" class="tools">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a>
</li>
<li>
<a href="#" aria-current="page">
[% Branches.GetName( branch ) | html %] calendar
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">
<div class="col-sm-10 col-sm-push-2">
<main>
<h2>[% Branches.GetName( branch ) | html %] calendar</h2>
<div class="row">
<div class="col-sm-6">
<label for="branch">Define the holidays for:</label>
<select id="branch" name="branch">
[% PROCESS options_for_libraries libraries => Branches.all( selected => branch ) %]
</select>
<div class="panel" id="showHoliday">
<form action="/cgi-bin/koha/tools/exceptionHolidays.pl" method="post">
<input type="hidden" id="showHolidayType" name="showHolidayType" value="" />
<fieldset class="brief">
<h3>Edit this holiday</h3>
<span id="holtype"></span>
<ol>
<li>
<strong>Library:</strong> <span id="showBranchNameOutput"></span>
<input type="hidden" id="showBranchName" name="showBranchName" />
</li>
<li>
<strong>From date:</strong>
<span id="showDaynameOutput"></span>,
[% IF ( dateformat == "us" ) %]
<span id="showMonthOutput"></span>/<span id="showDayOutput"></span>/<span id="showYearOutput"></span>
[% ELSIF ( dateformat == "metric") %]
<span id="showDayOutput"></span>/<span id="showMonthOutput"></span>/<span id="showYearOutput"></span>
[% ELSIF ( dateformat == "dmydot") %]
<span id="showDayOutput"></span>.<span id="showMonthOutput"></span>.<span id="showYearOutput"></span>[% ELSE %]<span id="showYearOutput"></span>/<span id="showMonthOutput"></span>/<span id="showDayOutput"></span>
[% END %]
<input type="hidden" id="showDayname" name="showDayname" />
<input type="hidden" id="showWeekday" name="showWeekday" />
<input type="hidden" id="showDay" name="showDay" />
<input type="hidden" id="showMonth" name="showMonth" />
<input type="hidden" id="showYear" name="showYear" />
</li>
<li class="dateinsert">
<strong>To date: </strong>
<input type="text" id="datecancelrange" name="datecancelrange" size="20" value="[% datecancelrange | html %]" />
</li>
<li>
<label for="showTitle">Title: </label><input type="text" name="showTitle" id="showTitle" size="35" />
</li>
<!-- showTitle is necessary for exception radio button to work properly -->
<li>
<label for="showDescription">Description:</label>
<textarea rows="2" cols="40" id="showDescription" name="showDescription"></textarea>
</li>
<li class="radio">
<div class="exceptionPossibility" style="position:static">
<input type="radio" name="showOperation" id="showOperationExc" value="exception" /> <label for="showOperationExc">Generate an exception for this repeated holiday.</label>
<a href="#" class="helptext">[?]</a>
<div class="hint">You can make an exception for this holiday rule. This means that you will be able to say that for a repeatable holiday there is one day which is going to be an exception.</div>
</div>
</li>
<li class="radio">
<div class="exceptionPossibility" style="position:static">
<input type="radio" name="showOperation" id="showOperationExcRange" value="exceptionrange" />
<label for="showOperationExcRange">Generate exceptions on a range of dates.</label>
<a href="#" class="helptext">[?]</a>
<div class="hint">You can make an exception on a range of dates repeated yearly.</div>
</div>
</li>
<li class="radio">
<input type="radio" name="showOperation" id="showOperationDel" value="delete" />
<label for="showOperationDel" id="showOperationDelLabel">Delete this holiday</label>
<a href="#" class="helptext">[?]</a>
<div class="hint">This will delete this holiday rule. If it is a repeatable holiday, this option checks for possible exceptions. If an exception exists, this option will remove the exception and set the date to a regular holiday.</div>
</li>
<li class="radio">
<input type="radio" name="showOperation" id="showOperationDelRange" value="deleterange" /> <label for="showOperationDelRange" id="showOperationDelLabelRange">Delete the single holidays on a range</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">This will delete the single holidays rules only. The repeatable holidays and exceptions will not be deleted.</div>
</li>
<li class="radio">
<input type="radio" name="showOperation" id="showOperationDelRangeRepeat" value="deleterangerepeat" /> <label for="showOperationDelRangeRepeat" id="showOperationDelLabelRangeRepeat">Delete the repeated holidays on a range</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">This will delete the repeated holidays rules only. The repeatable holidays will be deleted but not the exceptions.</div>
</li>
<li class="radio">
<input type="radio" name="showOperation" id="showOperationDelRangeRepeatExcept" value="deleterangerepeatexcept" /> <label for="showOperationDelRangeRepeatExcept" id="showOperationDelLabelRangeRepeatExcept">Delete the exceptions on a range</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">This will delete the exceptions inside a given range. Be careful about your scope range; if it is oversized you could slow down Koha.</div>
</li>
<li class="radio">
<input type="radio" name="showOperation" id="showOperationEdit" value="edit" checked="checked" /> <label for="showOperationEdit">Edit this holiday</label>
<a href="#" class="helptext">[?]</a>
<div class="hint">This will save changes to the holiday's title and description. If the information for a repeatable holiday is modified, it affects all of the dates on which the holiday is repeated.</div></li>
<li class="checkbox">
<input type="checkbox" name="allBranches" id="allBranches" />
<label for="allBranches">Copy changes to all libraries</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">If checked, changes for this holiday will be copied to all libraries. If the holiday doesn't exists for a library, no change is made.</div>
</li>
</ol>
<fieldset class="action">
<input type="submit" name="submit" value="Save" />
<a href="#" class="cancel hidePanel showHoliday">Cancel</a>
</fieldset>
</fieldset> <!-- /.brief -->
</form>
</div> <!-- /#showHoliday -->
<!-- Panel to deal with new holidays -->
<div class="panel" id="newHoliday">
<form action="/cgi-bin/koha/tools/newHolidays.pl" method="post">
<fieldset class="brief">
<h3>Add new holiday</h3>
<ol>
<li>
<strong>Library:</strong>
<span id="newBranchNameOutput"></span>
<input type="hidden" id="newBranchName" name="newBranchName" />
</li>
<li>
<strong>From date:</strong>
<span id="newDaynameOutput"></span>,
[% IF ( dateformat == "us" ) %]
<span id="newMonthOutput"></span>/<span id="newDayOutput"></span>/<span id="newYearOutput"></span>
[% ELSIF ( dateformat == "metric" ) %]
<span id="newDayOutput"></span>/<span id="newMonthOutput"></span>/<span id="newYearOutput"></span>
[% ELSIF ( dateformat == "dmydot" ) %]
<span id="newDayOutput"></span>.<span id="newMonthOutput"></span>.<span id="newYearOutput"></span>
[% ELSE %]
<span id="newYearOutput"></span>/<span id="newMonthOutput"></span>/<span id="newDayOutput"></span>
[% END %]
<input type="hidden" id="newDayname" name="showDayname" />
<input type="hidden" id="newWeekday" name="newWeekday" />
<input type="hidden" id="newDay" name="newDay" />
<input type="hidden" id="newMonth" name="newMonth" />
<input type="hidden" id="newYear" name="newYear" />
</li>
<li class="dateinsert">
<strong>To date: </strong>
<input type="text" id="dateofrange" name="dateofrange" size="20" value="[% dateofrange | html %]" />
</li>
<li>
<label for="title">Title: </label>
<input type="text" name="newTitle" id="title" size="35" /></li>
<li>
<label for="newDescription">Description:</label>
<textarea rows="2" cols="40" id="newDescription" name="newDescription"></textarea>
</li>
<li class="radio">
<input type="radio" name="newOperation" id="newOperationOnce" value="holiday" checked="checked" />
<label for="newOperationOnce">Holiday only on this day</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">Make a single holiday. For example, selecting August 1, 2012 will make it a holiday, but will not affect August 1 in other years.</div>
</li>
<li class="radio">
<input type="radio" name="newOperation" id="newOperationDay" value="weekday" />
<label for="newOperationDay">Holiday repeated every same day of the week</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">Make this weekday a holiday, every week. For example, if your library is closed on Saturdays, use this option to make every Saturday a holiday.</div>
</li>
<li class="radio">
<input type="radio" name="newOperation" id="newOperationYear" value="repeatable" />
<label for="newOperationYear">Holiday repeated yearly on the same date</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">This will take this day and month as a reference to make it a holiday. Through this option, you can repeat this rule for every year. For example, selecting August 1 will make August 1 a holiday every year.</div>
</li>
<li class="radio">
<input type="radio" name="newOperation" id="newOperationField" value="holidayrange" />
<label for="newOperationField">Holidays on a range</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">Make a single holiday on a range. For example, selecting August 1, 2012 and August 10, 2012 will make all days between August 1 and 10 a holiday, but will not affect August 1-10 in other years.</div>
</li>
<li class="radio">
<input type="radio" name="newOperation" id="newOperationFieldyear" value="holidayrangerepeat" />
<label for="newOperationFieldyear">Holidays repeated yearly on a range</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">Make a single holiday on a range repeated yearly. For example, selecting August 1, 2012 and August 10, 2012 will make all days between August 1 and 10 a holiday, and will affect August 1-10 in other years.</div>
</li>
<li class="checkbox">
<input type="checkbox" name="allBranches" id="allBranches" />
<label for="allBranches">Copy to all libraries</label>.
<a href="#" class="helptext">[?]</a>
<div class="hint">If checked, this holiday will be copied to all libraries. If the holiday already exists for a library, no change is made.</div>
</li>
</ol>
<fieldset class="action">
<input type="submit" name="submit" value="Save" />
<a href="#" class="cancel hidePanel newHoliday">Cancel</a>
</fieldset>
</fieldset> <!-- /.brief -->
</form>
</div> <!-- /#newHoliday -->
<div id="calendar-container">
<h3>Calendar information</h3>
<span id="calendar-anchor"></span>
</div>
<div style="margin-top: 2em;">
<form action="copy-holidays.pl" method="post">
<input type="hidden" name="from_branchcode" value="[% branch | html %]" />
<label for="branchcode">Copy holidays to:</label>
<select id="branchcode" name="branchcode">
<option value=""></option>
[% FOREACH l IN Branches.all() %]
<option value="[% l.branchcode | html %]">[% l.branchname | html %]</option>
[% END %]
</select>
<input type="submit" value="Copy" />
</form>
</div>
</div> <!-- /.col-sm-6 -->
<div class="col-sm-6">
<div class="help">
<h4>Hints</h4>
<ul>
<li>Search in the calendar the day you want to set as holiday.</li>
<li>Click the date to add or edit a holiday.</li>
<li>Enter a title and description for the holiday.</li>
<li>Specify how the holiday should repeat.</li>
<li>Click Save to finish.</li>
</ul>
<h4>Key</h4>
<p>
<span class="key normalday">Working day</span>
<span class="key holiday">Unique holiday</span>
<span class="key repeatableweekly">Holiday repeating weekly</span>
<span class="key repeatableyearly">Holiday repeating yearly</span>
<span class="key exception">Holiday exception</span>
</p>
</div> <!-- /#help -->
<div id="holiday-list">
<!-- Exceptions First -->
<!-- this will probably always have the least amount of data -->
[% IF ( EXCEPTION_HOLIDAYS_LOOP ) %]
<h3>Exceptions</h3>
<label class="controls">
<input type="checkbox" name="show_past" id="show_past_holidayexceptions" class="show_past" />
Show past entries
</label>
<table id="holidayexceptions">
<thead>
<tr>
<th class="exception">Date</th>
<th class="exception">Title</th>
<th class="exception">Description</th>
</tr>
</thead>
<tbody>
[% FOREACH EXCEPTION_HOLIDAYS_LOO IN EXCEPTION_HOLIDAYS_LOOP %]
<tr data-date="[% EXCEPTION_HOLIDAYS_LOO.DATE_SORT | html %]">
<td data-order="[% EXCEPTION_HOLIDAYS_LOO.DATE_SORT | html %]">
<a href="/cgi-bin/koha/tools/holidays.pl?branch=[% branch | uri %]&amp;calendardate=[% EXCEPTION_HOLIDAYS_LOO.DATE | uri %]">
[% EXCEPTION_HOLIDAYS_LOO.DATE | html %]
</a>
</td>
<td>[% EXCEPTION_HOLIDAYS_LOO.TITLE | html %]</td>
<td>[% EXCEPTION_HOLIDAYS_LOO.DESCRIPTION | html %]</td>
</tr>
[% END %]
</tbody>
</table> <!-- /#holidayexceptions -->
[% END # /IF ( EXCEPTION_HOLIDAYS_LOOP ) %]
[% IF ( WEEK_DAYS_LOOP ) %]
<h3>Weekly - Repeatable holidays</h3>
<table id="holidayweeklyrepeatable">
<thead>
<tr>
<th class="repeatableweekly">Day of week</th>
<th class="repeatableweekly">Title</th>
<th class="repeatableweekly">Description</th>
</tr>
</thead>
<tbody>
[% FOREACH WEEK_DAYS_LOO IN WEEK_DAYS_LOOP %]
<tr>
<td>[% WEEK_DAYS_LOO.KEY | html %]</td>
<td>[% WEEK_DAYS_LOO.TITLE | html %]</td>
<td>[% WEEK_DAYS_LOO.DESCRIPTION | html %]</td>
</tr>
[% END %]
</tbody>
</table> <!-- /#holidayweeklyrepeatable -->
[% END # / IF ( WEEK_DAYS_LOOP ) %]
[% IF ( DAY_MONTH_HOLIDAYS_LOOP ) %]
<h3>Yearly - Repeatable holidays</h3>
<table id="holidaysyearlyrepeatable">
<thead>
<tr>
[% IF ( dateformat == "metric" ) %]
<th class="repeatableyearly">Day/month</th>
[% ELSE %]
<th class="repeatableyearly">Month/day</th>
[% END %]
<th class="repeatableyearly">Title</th>
<th class="repeatableyearly">Description</th>
</tr>
</thead>
<tbody>
[% FOREACH DAY_MONTH_HOLIDAYS_LOO IN DAY_MONTH_HOLIDAYS_LOOP %]
<tr>
<td data-order="[% DAY_MONTH_HOLIDAYS_LOO.DATE_SORT | html %]">
[% DAY_MONTH_HOLIDAYS_LOO.DATE | html %]
</td>
<td>[% DAY_MONTH_HOLIDAYS_LOO.TITLE | html %]</td>
<td>[% DAY_MONTH_HOLIDAYS_LOO.DESCRIPTION | html %]</td>
</tr>
[% END %]
</tbody>
</table> <!-- /#holidaysyearlyrepeatable -->
[% END # /IF ( DAY_MONTH_HOLIDAYS_LOOP ) %]
[% IF ( HOLIDAYS_LOOP ) %]
<h3>Unique holidays</h3>
<label class="controls">
<input type="checkbox" name="show_past" id="show_past_holidaysunique" class="show_past" />
Show past entries
</label>
<table id="holidaysunique">
<thead>
<tr>
<th class="holiday">Date</th>
<th class="holiday">Title</th>
<th class="holiday">Description</th>
</tr>
</thead>
<tbody>
[% FOREACH HOLIDAYS_LOO IN HOLIDAYS_LOOP %]
<tr data-date="[% HOLIDAYS_LOO.DATE_SORT | html %]">
<td data-order="[% HOLIDAYS_LOO.DATE_SORT | html %]">
<a href="/cgi-bin/koha/tools/holidays.pl?branch=[% branch | uri %]&amp;calendardate=[% HOLIDAYS_LOO.DATE | uri %]">
[% HOLIDAYS_LOO.DATE | html %]
</a>
</td>
<td>[% HOLIDAYS_LOO.TITLE | html %]</td>
<td>[% HOLIDAYS_LOO.DESCRIPTION.replace('\\\r\\\n', '<br />') | html %]</td>
</tr>
[% END %]
</tbody>
</table> <!-- #holidaysunique -->
[% END # /IF ( HOLIDAYS_LOOP ) %]
</div> <!-- /#holiday-list -->
</div> <!-- /.col-sm-6 -->
</div> <!-- /.row -->
</main>
</div> <!-- /.col-sm-10.col-sm-push-2 -->
<div class="col-sm-2 col-sm-pull-10">
<aside>
[% INCLUDE 'tools-menu.inc' %]
</aside>
</div> <!-- .col-sm-2.col-sm-pull-10 -->
</div> <!-- /.row -->
[% MACRO jsinclude BLOCK %]
[% INCLUDE 'calendar.inc' %]
[% INCLUDE 'datatables.inc' %]
[% Asset.js("js/tools-menu.js") | $raw %]
<script>
var weekdays = new Array(_("Sundays"),_("Mondays"),_("Tuesdays"),_("Wednesdays"),_("Thursdays"),_("Fridays"),_("Saturdays"));
/* Creates all the structures to deal with all different kinds of holidays */
var week_days = new Array();
var holidays = new Array();
var holidates = new Array();
var exception_holidays = new Array();
var day_month_holidays = new Array();
var hola= "[% code | html %]";
[% FOREACH WEEK_DAYS_LOO IN WEEK_DAYS_LOOP %]
week_days["[% WEEK_DAYS_LOO.KEY | html %]"] = {title:"[% WEEK_DAYS_LOO.TITLE | replace('"','\"') | html %]", description:"[% WEEK_DAYS_LOO.DESCRIPTION | replace('"','\"') | html %]"};
[% END %]
[% FOREACH HOLIDAYS_LOO IN HOLIDAYS_LOOP %]
holidates.push("[% HOLIDAYS_LOO.KEY | html %]");
holidays["[% HOLIDAYS_LOO.KEY | html %]"] = {title:"[% HOLIDAYS_LOO.TITLE | replace('"','\"') | html %]", description:"[% HOLIDAYS_LOO.DESCRIPTION | replace('"','\"') | html %]"};
[% END %]
[% FOREACH EXCEPTION_HOLIDAYS_LOO IN EXCEPTION_HOLIDAYS_LOOP %]
exception_holidays["[% EXCEPTION_HOLIDAYS_LOO.KEY | html %]"] = {title:"[% EXCEPTION_HOLIDAYS_LOO.TITLE | replace('"','\"') | html %]", description:"[% EXCEPTION_HOLIDAYS_LOO.DESCRIPTION | replace('"','\"') | html %]"};
[% END %]
[% FOREACH DAY_MONTH_HOLIDAYS_LOO IN DAY_MONTH_HOLIDAYS_LOOP %]
day_month_holidays["[% DAY_MONTH_HOLIDAYS_LOO.KEY | html %]"] = {title:"[% DAY_MONTH_HOLIDAYS_LOO.TITLE | replace('"','\"') | html %]", description:"[% DAY_MONTH_HOLIDAYS_LOO.DESCRIPTION | replace('"','\"') | html %]"};
[% END %]
function holidayOperation(formObject, opType) {
var op = document.getElementsByName('operation');
op[0].value = opType;
formObject.submit();
}
// This function shows the "Show Holiday" panel //
function showHoliday (exceptionPossibility, dayName, day, month, year, weekDay, title, description, holidayType) {
$("#newHoliday").slideUp("fast");
$("#showHoliday").slideDown("fast");
$('#showDaynameOutput').html(dayName);
$('#showDayname').val(dayName);
$('#showBranchNameOutput').html($("#branch :selected").text());
$('#showBranchName').val($("#branch").val());
$('#showDayOutput').html(day);
$('#showDay').val(day);
$('#showMonthOutput').html(month);
$('#showMonth').val(month);
$('#showYearOutput').html(year);
$('#showYear').val(year);
$('#showDescription').val(description);
$('#showWeekday:first').val(weekDay);
$('#showTitle').val(title);
$('#showHolidayType').val(holidayType);
if (holidayType == 'exception') {
$("#showOperationDelLabel").html(_("Delete this exception."));
$("#holtype").attr("class","key exception").html(_("Holiday exception"));
} else if(holidayType == 'weekday') {
$("#showOperationDelLabel").html(_("Delete this holiday."));
$("#holtype").attr("class","key repeatableweekly").html(_("Holiday repeating weekly"));
} else if(holidayType == 'daymonth') {
$("#showOperationDelLabel").html(_("Delete this holiday."));
$("#holtype").attr("class","key repeatableyearly").html(_("Holiday repeating yearly"));
} else {
$("#showOperationDelLabel").html(_("Delete this holiday."));
$("#holtype").attr("class","key holiday").html(_("Unique holiday"));
}
if (exceptionPossibility == 1) {
$(".exceptionPossibility").parent().show();
} else {
$(".exceptionPossibility").parent().hide();
}
}
// This function shows the "Add Holiday" panel //
function newHoliday (dayName, day, month, year, weekDay) {
$("#showHoliday").slideUp("fast");
$("#newHoliday").slideDown("fast");
$("#newDaynameOutput").html(dayName);
$("#newDayname").val(dayName);
$("#newBranchNameOutput").html($('#branch :selected').text());
$("#newBranchName").val($('#branch').val());
$("#newDayOutput").html(day);
$("#newDay").val(day);
$("#newMonthOutput").html(month);
$("#newMonth").val(month);
$("#newYearOutput").html(year);
$("#newYear").val(year);
$("#newWeekday:first").val(weekDay);
}
function hidePanel(aPanelName) {
$("#"+aPanelName).slideUp("fast");
}
function changeBranch () {
var branch = $("#branch option:selected").val();
location.href='/cgi-bin/koha/tools/holidays.pl?branch=' + branch + '&calendardate=' + "[% calendardate | html %]";
}
/**
* Build settings to be passed to the formatDay function for each day in the calendar
* @param {object} dayElem - HTML node passed from Flatpickr
* @return {void}
*/
function dateStatusHandler( dayElem ) {
var day = dayElem.dateObj.getDate();
var month = dayElem.dateObj.getMonth() + 1;
var year = dayElem.dateObj.getFullYear();
var weekDay = dayElem.dateObj.getDay();
var dayMonth = month + '/' + day;
var dateString = year + '/' + month + '/' + day;
if (exception_holidays[dateString] != null) {
formatDay( [ "exception", _("Exception: %s").format(exception_holidays[dateString].title)], dayElem );
} else if ( week_days[weekDay] != null ){
formatDay( [ "repeatableweekly", _("Weekly holiday: %s").format(week_days[weekDay].title)], dayElem );
} else if ( day_month_holidays[dayMonth] != null ) {
formatDay( [ "repeatableyearly", _("Yearly holiday: %s").format(day_month_holidays[dayMonth].title)], dayElem );
} else if (holidays[dateString] != null) {
formatDay( [ "holiday", _("Single holiday: %s").format(holidays[dateString].title)], dayElem );
} else {
formatDay( [ "normalday", _("Normal day")], dayElem );
}
}
/**
* Adds style and title attribute to a day on the calendar
* @param {object} settings - span class attribute ([0]) and title attribute ([1])
* @param {node} dayElem - HTML node passed from Flatpickr
* @return {void}
*/
function formatDay( settings, dayElem ){
$(dayElem).attr("title", settings[1]).addClass( settings[0]);
}
/**
* Triggers an action based on a click on a calendar day: If a holiday exists on
* that day it loads an edit form. If there is no existing holiday one can be created
* @param {object} calendar - a Date object corresponding to the clicked day
* @return {void}
*/
function dateChanged( calendar ) {
var day = calendar.getDate();
var month = calendar.getMonth() + 1;
var year = calendar.getFullYear();
var weekDay = calendar.getDay();
var dayName = weekdays[weekDay];
var dayMonth = month + '/' + day;
var dateString = year + '/' + month + '/' + day;
if (holidays[dateString] != null) {
showHoliday(0, dayName, day, month, year, weekDay, holidays[dateString].title, holidays[dateString].description, 'ymd');
} else if (exception_holidays[dateString] != null) {
showHoliday(0, dayName, day, month, year, weekDay, exception_holidays[dateString].title, exception_holidays[dateString].description, 'exception');
} else if (week_days[weekDay] != null) {
showHoliday(1, dayName, day, month, year, weekDay, week_days[weekDay].title, week_days[weekDay].description, 'weekday');
} else if (day_month_holidays[dayMonth] != null) {
showHoliday(1, dayName, day, month, year, weekDay, day_month_holidays[dayMonth].title, day_month_holidays[dayMonth].description, 'daymonth');
} else {
newHoliday(dayName, day, month, year, weekDay);
}
};
/* Custom table search configuration: If a table row
has an "expired" class, hide it UNLESS the
show_expired checkbox is checked */
$.fn.dataTable.ext.search.push(
function( settings, searchData, index, rowData, counter ) {
var table = settings.nTable.id;
var row = $(settings.aoData[index].nTr);
if( row.hasClass("date_past") && !$("#show_past_" + table ).prop("checked") ){
return false;
} else {
return true;
}
}
);
// Create current date variable
var date = new Date();
var datestring = date.toISOString().substring(0, 10);
$(document).ready(function() {
$(".hint").hide();
$("#branch").change(function(){
changeBranch();
});
$("#holidayweeklyrepeatable>tbody>tr").each(function(){
var first_td = $(this).find('td').first();
first_td.html(weekdays[first_td.html()]);
});
$("#holidayweeklyrepeatable").dataTable($.extend(true, {}, dataTablesDefaults, {
"sDom": 't',
"bPaginate": false
}));
var tables = $("#holidayexceptions, #holidaysyearlyrepeatable, #holidaysunique").DataTable($.extend(true, {}, dataTablesDefaults, {
"sDom": 't',
"bPaginate": false,
"createdRow": function( row, data, dataIndex ) {
var holiday = $(row).data("date");
if( holiday < datestring ){
$(row).addClass("date_past");
}
}
}));
$(".show_past").on("change", function(){
tables.draw();
});
$("a.helptext").click(function(){
$(this).parent().find(".hint").toggle(); return false;
});
var dateofrange = $("#dateofrange").flatpickr();
var datecancelrange = $("#datecancelrange").flatpickr();
$("#dateofrange").each(function () { this.value = "" });
$("#datecancelrange").each(function () { this.value = "" });
var maincalendar = $("#calendar-anchor").flatpickr({
inline: true,
onReady: function(){
return;
},
onDayCreate: function( dObj, dStr, fp, dayElem ){
/* for each day on the calendar, get the
correct status information for the date */
dateStatusHandler( dayElem );
},
onChange: function( selectedDates, dateStr, instance ){
var fromdate = selectedDates[0];
var enddate = dateofrange.selectedDates[0];
dateChanged( fromdate );
dateofrange.set( 'defaultDate', fromdate );
dateofrange.set( 'minDate', fromdate );
if ( enddate != undefined ) {
if ( enddate < fromdate ) {
dateofrange.set("defaultDate", fromdate);
dateofrange.setDate(fromdate);
}
}
},
defaultDate: new Date("[% keydate | html %]")
});
$(".hidePanel").on("click",function(){
if( $(this).hasClass("showHoliday") ){
hidePanel("showHoliday");
} else {
hidePanel("newHoliday");
}
})
});
</script>
[% END %]
[% INCLUDE 'intranet-bottom.inc' %]