forked from XimeX/usrspace-browser-addon
84 lines
3.1 KiB
JavaScript
84 lines
3.1 KiB
JavaScript
async function linkElementClickListener(event) {
|
|
try {
|
|
const tab = await browser.tabs.create({url: event.currentTarget.dataset.url});
|
|
// console.log(tab);
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
}
|
|
|
|
async function init() {
|
|
const linkElements = Array.from(document.getElementsByClassName('link'));
|
|
linkElements.forEach((linkElement) => {
|
|
linkElement.addEventListener('click', linkElementClickListener);
|
|
});
|
|
|
|
try {
|
|
const page = await browser.runtime.getBackgroundPage();
|
|
|
|
updateNextEvent(page.calendar);
|
|
updateSpaceApiJson(page.spaceApi);
|
|
updateState(page.spaceApi);
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
}
|
|
init();
|
|
|
|
function 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([], {dateStyle: "medium", timeStyle: "short"}));
|
|
// 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);
|
|
});
|
|
}
|
|
|
|
function updateSpaceApiJson(spaceApi) {
|
|
const spaceApiElement = document.querySelector('#space-api code');
|
|
const json = JSON.stringify(spaceApi, null, 2).replace(/ /g, ' ').replace(/\n/g, '<br/>');
|
|
spaceApiElement.innerHTML = json;
|
|
// const jsonNode = document.createTextNode(json);
|
|
// spaceApiElement.innerText = '';
|
|
// spaceApiElement.append(jsonNode);
|
|
}
|
|
|
|
function updateState(spaceApi) {
|
|
const stateElement = document.getElementById('state');
|
|
const since = new Date(spaceApi.state.lastchange * 1000);
|
|
const sinceStr = ` seit <time datetime="${since.toISOString()}">${since.toLocaleString([], {dateStyle: "medium", timeStyle: "short"})}</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}`;
|
|
}
|
|
}
|