zerocalcare/frontend/frontend.js

152 lines
7.0 KiB
JavaScript
Raw Normal View History

2020-09-21 19:27:25 +00:00
"use strict"
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
function zerocalcareDisplay(xhr) {
let zerocalcareOutput = document.getElementById('zerocalcareOutput');
2020-10-30 11:35:09 +00:00
2018-11-23 19:58:13 +00:00
if (xhr.readyState == 4 && xhr.status == 200) {
2020-09-21 19:27:25 +00:00
let json_obj = JSON.parse(xhr.responseText);
2020-10-30 11:35:09 +00:00
let atLeastOne = false;
2020-09-21 19:27:25 +00:00
for (let i in json_obj) {
2020-04-17 20:35:46 +00:00
// Do not display private events
if (typeof json_obj[i]['CLASS'] === 'string' && json_obj[i]['CLASS'] == 'PRIVATE') {
continue;
}
2018-11-23 19:58:13 +00:00
// Future improvements needed for a better backend output date in ISO format
// Now we have to parse the string :( very very ugly
2020-09-21 19:27:25 +00:00
let date = new Date(json_obj[i]['DATETIME']);
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
let m = new moment(date);
2018-11-24 12:10:33 +00:00
m.locale('it');
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
let eventElement = document.createElement('div');
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
let titleElement = document.createElement('h5');
titleElement.appendChild(document.createTextNode(decodeURI(json_obj[i]['SUMMARY'])));
2018-11-23 19:58:13 +00:00
titleElement.style.fontStyle = 'italic';
titleElement.classList.add('widget-title');
eventElement.appendChild(titleElement);
2020-09-21 19:27:25 +00:00
let contentEventElement = document.createElement('div');
eventElement.appendChild(contentEventElement);
// Check if event is not confirmed
if (typeof json_obj[i]['STATUS'] === 'string') {
if (json_obj[i]['STATUS'] == 'TENTATIVE') {
// Make the text a bit lighter and italic
contentEventElement.style.fontStyle = 'italic';
contentEventElement.style.color = 'gray';
// Add note
2020-09-21 19:27:25 +00:00
let unconfirmedElement = document.createElement('div');
unconfirmedElement.style.fontWeight = 'bold';
unconfirmedElement.appendChild(document.createTextNode('⚠️ Non confermato!'));
contentEventElement.appendChild(unconfirmedElement);
}
else if (json_obj[i]['STATUS'] == 'CANCELLED') {
// Strike time, date and location to remark this concept
dateText.style.textDecoration = 'line-through';
timeText.style.textDecoration = 'line-through';
locationText.style.textDecoration = 'line-through';
// Add note
2020-09-21 19:27:25 +00:00
let unconfirmedElement = document.createElement('div');
unconfirmedElement.style.fontWeight = 'bold';
unconfirmedElement.appendChild(document.createTextNode('⚠️ Cancellato!'));
contentEventElement.appendChild(unconfirmedElement);
}
}
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
let dateElement = document.createElement('div');
let dateText = document.createElement('span');
2020-04-17 19:12:26 +00:00
dateText.appendChild(document.createTextNode(m.format('dddd D MMMM YYYY')));
2020-04-17 19:10:11 +00:00
dateElement.appendChild(document.createTextNode('📅 '));
dateElement.appendChild(dateText);
contentEventElement.appendChild(dateElement);
2018-11-23 19:58:13 +00:00
2020-09-21 19:27:25 +00:00
let timeElement = document.createElement('div');
let timeText = document.createElement('span');
let timeString = (json_obj[i]['ALLDAY'] == true) ? 'Tutto il giorno' : ('ore ' + m.format('HH:mm'));
2020-04-17 19:10:11 +00:00
timeText.appendChild(document.createTextNode(timeString));
timeElement.appendChild(document.createTextNode('⏰ '));
timeElement.appendChild(timeText);
contentEventElement.appendChild(timeElement);
2018-11-23 19:58:13 +00:00
// add if location is not empty -- default location should be selected by backend
2020-09-21 19:27:25 +00:00
let locationElement = document.createElement('div');
let locationText = document.createElement('span');
if (json_obj[i]['LOCATION'] !== undefined && json_obj[i]['LOCATION'] != '') {
2020-10-30 11:35:09 +00:00
let text = decodeURI(json_obj[i]['LOCATION']);
let textNode = document.createTextNode(text);
if (text.match("^(http|https):\\/\\/.*$")) {
let anchorElement = document.createElement('a');
anchorElement.href = text;
anchorElement.appendChild(textNode);
locationText.appendChild(anchorElement);
} else {
locationText.appendChild(textNode);
}
2018-11-23 19:58:13 +00:00
}
else {
2020-04-17 19:10:11 +00:00
locationText.appendChild(document.createTextNode('Officina Informatica'));
2018-11-23 19:58:13 +00:00
}
2020-04-17 19:10:11 +00:00
locationElement.appendChild(document.createTextNode('📍 '));
locationElement.appendChild(locationText);
contentEventElement.appendChild(locationElement);
2020-09-20 20:30:09 +00:00
if (json_obj[i]['DESCRIPTION'] !== undefined && json_obj[i]['DESCRIPTION'] != '') {
2020-09-21 19:27:25 +00:00
let descriptionElement = document.createElement('div');
let descriptionText = document.createElement('span');
2020-09-20 21:02:46 +00:00
descriptionText.appendChild(document.createTextNode(decodeURI(json_obj[i]['DESCRIPTION'])));
2020-09-20 20:30:09 +00:00
descriptionElement.appendChild(document.createTextNode('📝 '));
descriptionElement.appendChild(descriptionText);
2020-09-21 19:14:59 +00:00
descriptionElement.style.display = "none";
// Display a clickable "..." button.
2020-09-21 19:27:25 +00:00
let moreElement = document.createElement('div');
let moreShowText = document.createElement('a');
let moreHideText = document.createElement('a');
2020-10-30 11:35:09 +00:00
2020-09-21 19:20:46 +00:00
moreShowText.appendChild(document.createTextNode('⬇️ Più informazioni...'));
moreElement.appendChild(moreShowText);
moreHideText.appendChild(document.createTextNode('⬆️ Nascondi informazioni...'));
moreHideText.style.display = "none";
moreElement.appendChild(moreHideText);
2020-09-21 19:14:59 +00:00
moreElement.onclick = () => {
if (descriptionElement.style.display == "none") {
2020-09-21 19:20:46 +00:00
descriptionElement.style.display =
moreHideText.style.display = "block";
moreShowText.style.display = "none";
2020-09-21 19:14:59 +00:00
} else {
2020-09-21 19:20:46 +00:00
descriptionElement.style.display =
moreHideText.style.display = "none";
moreShowText.style.display = "block";
2020-09-21 19:14:59 +00:00
}
};
contentEventElement.appendChild(moreElement);
2020-09-21 19:20:46 +00:00
contentEventElement.appendChild(descriptionElement);
2020-09-20 20:30:09 +00:00
}
2020-10-30 11:35:09 +00:00
2018-11-23 19:58:13 +00:00
zerocalcareOutput.appendChild(eventElement);
2020-07-27 19:38:21 +00:00
atLeastOne = true;
}
if (atLeastOne == false) {
zerocalcareOutput.childNodes[0].textContent = 'Nessun appuntamento in programma';
2018-11-23 19:58:13 +00:00
}
}
else {
zerocalcareOutput.childNodes[0].textContent = 'API Error: Calendario non disponibile';
}
2018-11-18 18:18:45 +00:00
}
2020-09-20 21:45:22 +00:00
function zerocalcareTrigger(url) {
if (typeof url !== "string")
return
2020-09-21 19:27:25 +00:00
let xhr = new XMLHttpRequest();
xhr.onload = () => { zerocalcareDisplay(xhr) };
2020-09-20 21:45:22 +00:00
xhr.open('GET', url, true);
2018-11-23 19:58:13 +00:00
xhr.send(null);
2020-09-21 19:27:25 +00:00
}