-
Notifications
You must be signed in to change notification settings - Fork 8
/
Copy pathdb-wagenreihung.html
92 lines (77 loc) · 3.99 KB
/
db-wagenreihung.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!---
This is an sample HTML file to try out the db-wagenreihung Graphic generation script.
The script below will later be moved to the trips.html
*KNOWN ISSUES*
- Only the first element in "allFahrzeugaustattung" for each carriage will be shown
- If the train contains an locomotive nothing will be displayed (I really don't know why)
- Some Icons are missing: You can try to draw icons based on the already existing ones,
or just open a Issue on GitHub if you find one missing.
-->
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wagenreihung</title>
<link rel="stylesheet" href="./assets/css/styles.css">
<link rel="stylesheet" href="./assets/css/line-colors.css">
<link rel="shortcut icon" type="image/x-icon" href="./assets/branding/favicon.ico">
<link rel="manifest" href="/manifest.json" type="application/json" >
<meta name="theme-color" content="#000">
</head>
<body>
<div id="blocksContainer" class="coachescontent"></div>
<script>
//Change these vars to try out different trains (Must be an currently running train)
var zugnummer = "1000";//Train Nr (Zugnummer)
var datetime = "202404201751";//Planned Departing time at the first station YYYYMMDDHHMM
fetch(`https://ist-wr.noncd.db.de/wagenreihung/1.0/${zugnummer}/${datetime}`)
.then(response => response.json())
.then(data => {
// Check for valid JSON
if (data.error) {
const fehlermeldung = document.createElement('span');
fehlermeldung.classList.add('fehlermeldung');
fehlermeldung.textContent = `Wagenreihung für diesen Zug nicht verfügbar.`;
document.body.appendChild(fehlermeldung);
}
const allFahrzeuggruppe = data.data.istformation.allFahrzeuggruppe;
const firstElementsMap = new Map();
allFahrzeuggruppe.forEach(gruppe => {
gruppe.allFahrzeug.forEach(fahrzeug => {
const positioningruppe = fahrzeug.positioningruppe;
if (!firstElementsMap.has(positioningruppe)) {
firstElementsMap.set(positioningruppe, fahrzeug);
}
});
});
// Sort elements
const sortedFahrzeuge = Array.from(firstElementsMap.values()).sort((a, b) => {
return parseInt(a.positioningruppe) - parseInt(b.positioningruppe);
});
const blocksContainer = document.getElementById('blocksContainer');
sortedFahrzeuge.forEach(fahrzeug => {
const positioningruppe = fahrzeug.positioningruppe;
const wagenordnungsnummer = fahrzeug.wagenordnungsnummer;
const ausstattung = fahrzeug.allFahrzeugausstattung[0];
const ausstattungsart = ausstattung.ausstattungsart;
const anzahl = ausstattung.anzahl;
const bezeichnung = ausstattung.bezeichnung;
const status = ausstattung.status;
const kategorie = fahrzeug.kategorie;
const ausstattungsDiv = document.createElement('div');
ausstattungsDiv.classList.add('coach');
if (ausstattungsart !== 'KLIMA') {
ausstattungsDiv.innerHTML = `${wagenordnungsnummer}<br><img src="assets/icons/${kategorie}.svg"><img src="assets/icons/${ausstattungsart}.svg">`;
} else {
ausstattungsDiv.innerHTML = `${wagenordnungsnummer}<br><img src="assets/icons/${kategorie}.svg">`;
}
blocksContainer.appendChild(ausstattungsDiv);
});
})
.catch(error => {
console.error('Fehler beim Abrufen der Daten:', error);
});
</script>
</body>
</html>