|
@@ -4,7 +4,7 @@
|
|
|
// <input type="text" class="vTimeField">
|
|
|
(function() {
|
|
|
'use strict';
|
|
|
- var DateTimeShortcuts = {
|
|
|
+ const DateTimeShortcuts = {
|
|
|
calendars: [],
|
|
|
calendarInputs: [],
|
|
|
clockInputs: [],
|
|
@@ -28,16 +28,16 @@
|
|
|
timezoneWarningClass: 'timezonewarning', // class of the warning for timezone mismatch
|
|
|
timezoneOffset: 0,
|
|
|
init: function() {
|
|
|
- var body = document.getElementsByTagName('body')[0];
|
|
|
- var serverOffset = body.dataset.adminUtcOffset;
|
|
|
+ const body = document.getElementsByTagName('body')[0];
|
|
|
+ const serverOffset = body.dataset.adminUtcOffset;
|
|
|
if (serverOffset) {
|
|
|
- var localOffset = new Date().getTimezoneOffset() * -60;
|
|
|
+ const localOffset = new Date().getTimezoneOffset() * -60;
|
|
|
DateTimeShortcuts.timezoneOffset = localOffset - serverOffset;
|
|
|
}
|
|
|
|
|
|
- var inputs = document.getElementsByTagName('input');
|
|
|
- for (var i = 0; i < inputs.length; i++) {
|
|
|
- var inp = inputs[i];
|
|
|
+ const inputs = document.getElementsByTagName('input');
|
|
|
+ for (let i = 0; i < inputs.length; i++) {
|
|
|
+ const inp = inputs[i];
|
|
|
if (inp.type === 'text' && inp.classList.contains('vTimeField')) {
|
|
|
DateTimeShortcuts.addClock(inp);
|
|
|
DateTimeShortcuts.addTimezoneWarning(inp);
|
|
@@ -50,11 +50,11 @@
|
|
|
},
|
|
|
// Return the current time while accounting for the server timezone.
|
|
|
now: function() {
|
|
|
- var body = document.getElementsByTagName('body')[0];
|
|
|
- var serverOffset = body.dataset.adminUtcOffset;
|
|
|
+ const body = document.getElementsByTagName('body')[0];
|
|
|
+ const serverOffset = body.dataset.adminUtcOffset;
|
|
|
if (serverOffset) {
|
|
|
- var localNow = new Date();
|
|
|
- var localOffset = localNow.getTimezoneOffset() * -60;
|
|
|
+ const localNow = new Date();
|
|
|
+ const localOffset = localNow.getTimezoneOffset() * -60;
|
|
|
localNow.setTime(localNow.getTime() + 1000 * (serverOffset - localOffset));
|
|
|
return localNow;
|
|
|
} else {
|
|
@@ -63,8 +63,8 @@
|
|
|
},
|
|
|
// Add a warning when the time zone in the browser and backend do not match.
|
|
|
addTimezoneWarning: function(inp) {
|
|
|
- var warningClass = DateTimeShortcuts.timezoneWarningClass;
|
|
|
- var timezoneOffset = DateTimeShortcuts.timezoneOffset / 3600;
|
|
|
+ const warningClass = DateTimeShortcuts.timezoneWarningClass;
|
|
|
+ let timezoneOffset = DateTimeShortcuts.timezoneOffset / 3600;
|
|
|
|
|
|
// Only warn if there is a time zone mismatch.
|
|
|
if (!timezoneOffset) {
|
|
@@ -76,7 +76,7 @@
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
- var message;
|
|
|
+ let message;
|
|
|
if (timezoneOffset > 0) {
|
|
|
message = ngettext(
|
|
|
'Note: You are %s hour ahead of server time.',
|
|
@@ -94,7 +94,7 @@
|
|
|
}
|
|
|
message = interpolate(message, [timezoneOffset]);
|
|
|
|
|
|
- var warning = document.createElement('span');
|
|
|
+ const warning = document.createElement('span');
|
|
|
warning.className = warningClass;
|
|
|
warning.textContent = message;
|
|
|
inp.parentNode.appendChild(document.createElement('br'));
|
|
@@ -102,22 +102,22 @@
|
|
|
},
|
|
|
// Add clock widget to a given field
|
|
|
addClock: function(inp) {
|
|
|
- var num = DateTimeShortcuts.clockInputs.length;
|
|
|
+ const num = DateTimeShortcuts.clockInputs.length;
|
|
|
DateTimeShortcuts.clockInputs[num] = inp;
|
|
|
DateTimeShortcuts.dismissClockFunc[num] = function() { DateTimeShortcuts.dismissClock(num); return true; };
|
|
|
|
|
|
// Shortcut links (clock icon and "Now" link)
|
|
|
- var shortcuts_span = document.createElement('span');
|
|
|
+ const shortcuts_span = document.createElement('span');
|
|
|
shortcuts_span.className = DateTimeShortcuts.shortCutsClass;
|
|
|
inp.parentNode.insertBefore(shortcuts_span, inp.nextSibling);
|
|
|
- var now_link = document.createElement('a');
|
|
|
+ const now_link = document.createElement('a');
|
|
|
now_link.href = "#";
|
|
|
now_link.textContent = gettext('Now');
|
|
|
now_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.handleClockQuicklink(num, -1);
|
|
|
});
|
|
|
- var clock_link = document.createElement('a');
|
|
|
+ const clock_link = document.createElement('a');
|
|
|
clock_link.href = '#';
|
|
|
clock_link.id = DateTimeShortcuts.clockLinkName + num;
|
|
|
clock_link.addEventListener('click', function(e) {
|
|
@@ -152,7 +152,7 @@
|
|
|
// <p class="calendar-cancel"><a href="#">Cancel</a></p>
|
|
|
// </div>
|
|
|
|
|
|
- var clock_box = document.createElement('div');
|
|
|
+ const clock_box = document.createElement('div');
|
|
|
clock_box.style.display = 'none';
|
|
|
clock_box.style.position = 'absolute';
|
|
|
clock_box.className = 'clockbox module';
|
|
@@ -161,23 +161,23 @@
|
|
|
clock_box.addEventListener('click', function(e) { e.stopPropagation(); });
|
|
|
|
|
|
quickElement('h2', clock_box, gettext('Choose a time'));
|
|
|
- var time_list = quickElement('ul', clock_box);
|
|
|
+ const time_list = quickElement('ul', clock_box);
|
|
|
time_list.className = 'timelist';
|
|
|
// The list of choices can be overridden in JavaScript like this:
|
|
|
// DateTimeShortcuts.clockHours.name = [['3 a.m.', 3]];
|
|
|
// where name is the name attribute of the <input>.
|
|
|
- var name = typeof DateTimeShortcuts.clockHours[inp.name] === 'undefined' ? 'default_' : inp.name;
|
|
|
+ const name = typeof DateTimeShortcuts.clockHours[inp.name] === 'undefined' ? 'default_' : inp.name;
|
|
|
DateTimeShortcuts.clockHours[name].forEach(function(element) {
|
|
|
- var time_link = quickElement('a', quickElement('li', time_list), gettext(element[0]), 'href', '#');
|
|
|
+ const time_link = quickElement('a', quickElement('li', time_list), gettext(element[0]), 'href', '#');
|
|
|
time_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.handleClockQuicklink(num, element[1]);
|
|
|
});
|
|
|
});
|
|
|
|
|
|
- var cancel_p = quickElement('p', clock_box);
|
|
|
+ const cancel_p = quickElement('p', clock_box);
|
|
|
cancel_p.className = 'calendar-cancel';
|
|
|
- var cancel_link = quickElement('a', cancel_p, gettext('Cancel'), 'href', '#');
|
|
|
+ const cancel_link = quickElement('a', cancel_p, gettext('Cancel'), 'href', '#');
|
|
|
cancel_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.dismissClock(num);
|
|
@@ -192,8 +192,8 @@
|
|
|
});
|
|
|
},
|
|
|
openClock: function(num) {
|
|
|
- var clock_box = document.getElementById(DateTimeShortcuts.clockDivName + num);
|
|
|
- var clock_link = document.getElementById(DateTimeShortcuts.clockLinkName + num);
|
|
|
+ const clock_box = document.getElementById(DateTimeShortcuts.clockDivName + num);
|
|
|
+ const clock_link = document.getElementById(DateTimeShortcuts.clockLinkName + num);
|
|
|
|
|
|
// Recalculate the clockbox position
|
|
|
// is it left-to-right or right-to-left layout ?
|
|
@@ -216,7 +216,7 @@
|
|
|
document.removeEventListener('click', DateTimeShortcuts.dismissClockFunc[num]);
|
|
|
},
|
|
|
handleClockQuicklink: function(num, val) {
|
|
|
- var d;
|
|
|
+ let d;
|
|
|
if (val === -1) {
|
|
|
d = DateTimeShortcuts.now();
|
|
|
}
|
|
@@ -229,23 +229,23 @@
|
|
|
},
|
|
|
// Add calendar widget to a given field.
|
|
|
addCalendar: function(inp) {
|
|
|
- var num = DateTimeShortcuts.calendars.length;
|
|
|
+ const num = DateTimeShortcuts.calendars.length;
|
|
|
|
|
|
DateTimeShortcuts.calendarInputs[num] = inp;
|
|
|
DateTimeShortcuts.dismissCalendarFunc[num] = function() { DateTimeShortcuts.dismissCalendar(num); return true; };
|
|
|
|
|
|
// Shortcut links (calendar icon and "Today" link)
|
|
|
- var shortcuts_span = document.createElement('span');
|
|
|
+ const shortcuts_span = document.createElement('span');
|
|
|
shortcuts_span.className = DateTimeShortcuts.shortCutsClass;
|
|
|
inp.parentNode.insertBefore(shortcuts_span, inp.nextSibling);
|
|
|
- var today_link = document.createElement('a');
|
|
|
+ const today_link = document.createElement('a');
|
|
|
today_link.href = '#';
|
|
|
today_link.appendChild(document.createTextNode(gettext('Today')));
|
|
|
today_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.handleCalendarQuickLink(num, 0);
|
|
|
});
|
|
|
- var cal_link = document.createElement('a');
|
|
|
+ const cal_link = document.createElement('a');
|
|
|
cal_link.href = '#';
|
|
|
cal_link.id = DateTimeShortcuts.calendarLinkName + num;
|
|
|
cal_link.addEventListener('click', function(e) {
|
|
@@ -281,7 +281,7 @@
|
|
|
// </div>
|
|
|
// <p class="calendar-cancel"><a href="#">Cancel</a></p>
|
|
|
// </div>
|
|
|
- var cal_box = document.createElement('div');
|
|
|
+ const cal_box = document.createElement('div');
|
|
|
cal_box.style.display = 'none';
|
|
|
cal_box.style.position = 'absolute';
|
|
|
cal_box.className = 'calendarbox module';
|
|
@@ -290,15 +290,15 @@
|
|
|
cal_box.addEventListener('click', function(e) { e.stopPropagation(); });
|
|
|
|
|
|
// next-prev links
|
|
|
- var cal_nav = quickElement('div', cal_box);
|
|
|
- var cal_nav_prev = quickElement('a', cal_nav, '<', 'href', '#');
|
|
|
+ const cal_nav = quickElement('div', cal_box);
|
|
|
+ const cal_nav_prev = quickElement('a', cal_nav, '<', 'href', '#');
|
|
|
cal_nav_prev.className = 'calendarnav-previous';
|
|
|
cal_nav_prev.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.drawPrev(num);
|
|
|
});
|
|
|
|
|
|
- var cal_nav_next = quickElement('a', cal_nav, '>', 'href', '#');
|
|
|
+ const cal_nav_next = quickElement('a', cal_nav, '>', 'href', '#');
|
|
|
cal_nav_next.className = 'calendarnav-next';
|
|
|
cal_nav_next.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
@@ -306,15 +306,15 @@
|
|
|
});
|
|
|
|
|
|
// main box
|
|
|
- var cal_main = quickElement('div', cal_box, '', 'id', DateTimeShortcuts.calendarDivName2 + num);
|
|
|
+ const cal_main = quickElement('div', cal_box, '', 'id', DateTimeShortcuts.calendarDivName2 + num);
|
|
|
cal_main.className = 'calendar';
|
|
|
DateTimeShortcuts.calendars[num] = new Calendar(DateTimeShortcuts.calendarDivName2 + num, DateTimeShortcuts.handleCalendarCallback(num));
|
|
|
DateTimeShortcuts.calendars[num].drawCurrent();
|
|
|
|
|
|
// calendar shortcuts
|
|
|
- var shortcuts = quickElement('div', cal_box);
|
|
|
+ const shortcuts = quickElement('div', cal_box);
|
|
|
shortcuts.className = 'calendar-shortcuts';
|
|
|
- var day_link = quickElement('a', shortcuts, gettext('Yesterday'), 'href', '#');
|
|
|
+ let day_link = quickElement('a', shortcuts, gettext('Yesterday'), 'href', '#');
|
|
|
day_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.handleCalendarQuickLink(num, -1);
|
|
@@ -333,9 +333,9 @@
|
|
|
});
|
|
|
|
|
|
// cancel bar
|
|
|
- var cancel_p = quickElement('p', cal_box);
|
|
|
+ const cancel_p = quickElement('p', cal_box);
|
|
|
cancel_p.className = 'calendar-cancel';
|
|
|
- var cancel_link = quickElement('a', cancel_p, gettext('Cancel'), 'href', '#');
|
|
|
+ const cancel_link = quickElement('a', cancel_p, gettext('Cancel'), 'href', '#');
|
|
|
cancel_link.addEventListener('click', function(e) {
|
|
|
e.preventDefault();
|
|
|
DateTimeShortcuts.dismissCalendar(num);
|
|
@@ -349,18 +349,18 @@
|
|
|
});
|
|
|
},
|
|
|
openCalendar: function(num) {
|
|
|
- var cal_box = document.getElementById(DateTimeShortcuts.calendarDivName1 + num);
|
|
|
- var cal_link = document.getElementById(DateTimeShortcuts.calendarLinkName + num);
|
|
|
- var inp = DateTimeShortcuts.calendarInputs[num];
|
|
|
+ const cal_box = document.getElementById(DateTimeShortcuts.calendarDivName1 + num);
|
|
|
+ const cal_link = document.getElementById(DateTimeShortcuts.calendarLinkName + num);
|
|
|
+ const inp = DateTimeShortcuts.calendarInputs[num];
|
|
|
|
|
|
// Determine if the current value in the input has a valid date.
|
|
|
// If so, draw the calendar with that date's year and month.
|
|
|
if (inp.value) {
|
|
|
- var format = get_format('DATE_INPUT_FORMATS')[0];
|
|
|
- var selected = inp.value.strptime(format);
|
|
|
- var year = selected.getUTCFullYear();
|
|
|
- var month = selected.getUTCMonth() + 1;
|
|
|
- var re = /\d{4}/;
|
|
|
+ const format = get_format('DATE_INPUT_FORMATS')[0];
|
|
|
+ const selected = inp.value.strptime(format);
|
|
|
+ const year = selected.getUTCFullYear();
|
|
|
+ const month = selected.getUTCMonth() + 1;
|
|
|
+ const re = /\d{4}/;
|
|
|
if (re.test(year.toString()) && month >= 1 && month <= 12) {
|
|
|
DateTimeShortcuts.calendars[num].drawDate(month, year, selected);
|
|
|
}
|
|
@@ -392,7 +392,7 @@
|
|
|
DateTimeShortcuts.calendars[num].drawNextMonth();
|
|
|
},
|
|
|
handleCalendarCallback: function(num) {
|
|
|
- var format = get_format('DATE_INPUT_FORMATS')[0];
|
|
|
+ let format = get_format('DATE_INPUT_FORMATS')[0];
|
|
|
// the format needs to be escaped a little
|
|
|
format = format.replace('\\', '\\\\')
|
|
|
.replace('\r', '\\r')
|
|
@@ -406,7 +406,7 @@
|
|
|
};
|
|
|
},
|
|
|
handleCalendarQuickLink: function(num, offset) {
|
|
|
- var d = DateTimeShortcuts.now();
|
|
|
+ const d = DateTimeShortcuts.now();
|
|
|
d.setDate(d.getDate() + offset);
|
|
|
DateTimeShortcuts.calendarInputs[num].value = d.strftime(get_format('DATE_INPUT_FORMATS')[0]);
|
|
|
DateTimeShortcuts.calendarInputs[num].focus();
|