kritzl/hvvstuhl.de
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity

reposition some buttons

Browse source
This commit is contained in:
kritzl 2024-06-05 11:08:32 +02:00
parent 470b3e2336
commit 0639aeae6f
6 changed files with 120 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

57
elevators.js
View file

@ -4,6 +4,7 @@ const internalData = {
};
let geolocationPermission = false;
let geolocation = [null, null];
const openStations = new Set();
Object.defineProperty(String.prototype, 'capitalize', {
@ -229,7 +230,10 @@ function renderData() {
return;
}
document.querySelector('#loadElevators').innerHTML = 'Daten aktualisieren';
document.querySelector('#updateInfo').classList.remove('hidden');
document.querySelector('#loadElevators').classList.remove('hidden');
document.querySelector('#filters').classList.remove('hidden');
document.querySelector('#initialLoad').classList.add('hidden');
const dateContainer = document.querySelector('#lastUpdated');
dateContainer.innerHTML = dateTimeStyle.format(new Date(internalData.lastUpdate));
@ -245,6 +249,8 @@ function renderData() {
let elevatorsTemplate = '';
let previewTemplate = '';
let templateHasOsmButton = false;
for (const elevator of station.elevators) {
let linesTemplate = '<div class="lineList">Linien: ';
for (const line of elevator.lines) {
@ -342,9 +348,14 @@ Auf Karte anzeigen
${osmTemplate ? `<div class="osm" data-nodeid="${elevator.osmNodeId}">
<h4>Daten von OpenStreetMap</h4>
${osmTemplate}
</div>` : ''}
</div>` : `<button class="loadOSM">
Zusätzliche Daten von OpenStreetMap abrufen
<span data-icon="load" class="size-s spinner hidden"></span>
</button>`}
</div>
</li>`;
templateHasOsmButton = templateHasOsmButton || !osmTemplate;
}
const template = `<li class="station" id="station_${stationIndex}">
@ -362,7 +373,7 @@ ${station.state.unavailable ? `Bei ${station.state.unavailable} ${station.state.
</div>
</div>
</div>
<details>
<details data-stationid="${stationIndex}" ${openStations.has(stationIndex) ? 'open' : ''}>
<summary>
Aufzüge anzeigen
</summary>
@ -373,28 +384,52 @@ ${station.state.unavailable ? `Bei ${station.state.unavailable} ${station.state.
</li>`;
listContainer.insertAdjacentHTML('beforeend', template);
// immediate invocation
// (function () {
// const stationId = stationIndex;
// listContainer.querySelector(`#station_${stationIndex}`)
// .addEventListener('click', () => toggleElevatorList(stationId))
// }());
if (templateHasOsmButton) {
//immediate invocation
(function () {
listContainer.querySelectorAll(`#station_${stationIndex} .loadOSM`).forEach(e => {
e.addEventListener('click', (ev) => {
ev.target.querySelector('.spinner').classList.remove('hidden');
loadOsmData().then(() => {
ev.target.classList.add('hidden');
renderData();
});
})
})
}());
}
}
listContainer.querySelectorAll(`details`).forEach(e => {
e.addEventListener("toggle", (event) => {
const stationId = event.target.dataset['stationid'];
if (event.target.open) {
openStations.add(stationId);
} else {
openStations.delete(stationId);
}
});
})
}
document.querySelector('#loadElevators')
.addEventListener('click', (e) => {
e.target.querySelector('.spinner').classList.remove('hidden');
loadElevators().then(() => {
e.target.querySelector('.spinner').classList.add('hidden');
renderData();
filterData();
});
})
document.querySelector('#loadOSM')
document.querySelector('#initialLoad')
.addEventListener('click', (e) => {
loadOsmData().then(() => {
e.target.querySelector('.spinner').classList.remove('hidden');
loadElevators().then(() => {
e.target.classList.add('hidden');
renderData();
filterData();
});
})