usrspace-browser-addon/popup/index.js

78 lines
3.0 KiB
JavaScript

Array.from(document.getElementsByClassName('link')).forEach((element) => {
element.addEventListener('click', (event) => {
const newTab = browser.tabs.create({
url: event.currentTarget.dataset.url
});
newTab.then((data) => {
// console.log(data);
}).catch((error) => {
console.error(error);
});
});
});
browser.runtime.getBackgroundPage().then((page) => {
updateNextEvent(page.calendar);
updateSpaceApiJson(page.spaceApi);
updateState(page.spaceApi);
}).catch((error) => {
console.error(error);
});
const updateNextEvent = (nextEvents) => {
const calendarElement = document.getElementById('calendar');
calendarElement.innerText = '';
if (nextEvents.length === 0) {
const hintNode = document.createTextNode('Keine Termine in den nächsten 4 Wochen!');
const strongElement = document.createElement('strong');
strongElement.append(hintNode);
calendarElement.append(strongElement);
return;
}
const nextEventDate = nextEvents[0].begin.substr(0, 10);
const nextEventDateEvents = nextEvents.filter((nextEvent) => (nextEvent.begin.startsWith(nextEventDate)));
nextEventDateEvents.forEach((nextEventDateEvent) => {
const divElement = document.createElement('div');
divElement.innerHTML = '<img src="../icons/font-awesome/clock-regular.svg" width="19" height="19" alt="Clock" />';
const beginDate = new Date(nextEventDateEvent.begin);
const strongElement = document.createElement('strong');
const timeElement = document.createElement('time');
strongElement.textContent = nextEventDateEvent.name;
timeElement.datetime = beginDate.toISOString();
const dateNode = document.createTextNode(beginDate.toLocaleString());
// divElement.innerText = '';
divElement.append(strongElement);
divElement.append(document.createTextNode(' '));
divElement.append(timeElement);
timeElement.append(dateNode);
if (nextEventDateEvent.location) {
const locationNode = document.createTextNode(' (' + nextEventDateEvent.location + ')');
divElement.append(locationNode);
}
calendarElement.append(divElement);
});
};
const updateSpaceApiJson = (spaceApi) => {
const spaceApiElement = document.querySelector('#space-api code');
const json = JSON.stringify(spaceApi, null, 2).replace(/ /g, '&nbsp;').replace(/\n/g, '<br/>');
spaceApiElement.innerHTML = json;
// const jsonNode = document.createTextNode(json);
// spaceApiElement.innerText = '';
// spaceApiElement.append(jsonNode);
};
const updateState = (spaceApi) => {
const stateElement = document.getElementById('state');
const since = new Date(spaceApi.state.lastchange * 1000);
const sinceStr = ' seit <time datetime="' + since.toISOString() + '">' + since.toLocaleString() + '</time>';
if (spaceApi.state.open) {
stateElement.innerHTML = '<img src="../icons/font-awesome/lock-open-solid.svg" width="19" height="19" alt="Offen" />Offen' + sinceStr;
} else {
stateElement.innerHTML = '<img src="../icons/font-awesome/lock-solid.svg" width="19" height="19" alt="Geschlossen" />Geschlossen' + sinceStr;
}
};