From 419a929047f528d42d0263e706e20eea41ffdbff Mon Sep 17 00:00:00 2001
From: Timo Henkensiefken <timo.henkensiefken@uni-ulm.de>
Date: Fri, 6 Dec 2024 19:42:52 +0100
Subject: [PATCH] added: previous work

---
 .ratpoisonrc |  7 ++++
 fetchapi.js  | 99 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 index.html   | 14 ++++++++
 style.css    | 71 +++++++++++++++++++++++++++++++++++++
 4 files changed, 191 insertions(+)
 create mode 100644 .ratpoisonrc
 create mode 100644 fetchapi.js
 create mode 100644 index.html
 create mode 100644 style.css

diff --git a/.ratpoisonrc b/.ratpoisonrc
new file mode 100644
index 0000000..129c06f
--- /dev/null
+++ b/.ratpoisonrc
@@ -0,0 +1,7 @@
+banish
+
+#exec chromium --noerrdialogs --enable-features=OverlayScrollbar --start-maximized --kiosk ~/abfahrten-monitor/index.html --incognito --disable-translate
+
+exec chromium --noerrdialogs --enable-features=OverlayScrollbar --user-data-dir="/home/bildschirm/.config/chromium/" --kiosk "http://bus.fs-et.de/InfoDisplay2_bussued.htm"
+
+#exec chromium --noerrdialogs --enable-features=OverlayScrollbar --start-maximized --kiosk 'https://echtzeit.swu.de/' --incognito --disable-translate
\ No newline at end of file
diff --git a/fetchapi.js b/fetchapi.js
new file mode 100644
index 0000000..3d7a3a8
--- /dev/null
+++ b/fetchapi.js
@@ -0,0 +1,99 @@
+const HEADER_ROW = false;
+// Define the API URL
+// const urlStop = 'https://api.swu.de/mobility/v1/stop/attributes/BaseData?StopNumber=1240&ContentScope=extended';
+const urlDepartures = 'https://api.swu.de/mobility/v1/stop/passage/Departures?StopNumber=1240&Limit=10';
+// const apiUrl = 'Departures.json';
+
+
+// Make a GET request
+function refreshData() {
+    fetch(urlDepartures)
+	.then(response => {
+	    if (!response.ok) {
+		throw new Error('Network response was not ok');
+	    }
+	    return response.json();
+	})
+	.then(data => {
+	    showAllDepsByTime(data);
+	})
+	.catch(error => {
+	    console.error('Error:', error);
+	});
+}
+
+// Groups Departures into map by route
+function groupDepartures(data) {
+    const routes = new Map();
+    for (let x of data.StopPassage.DepartureData) {
+	if (routes.has(x.RouteNumber)) {
+	    routes.get(x.RouteNumber).push(x);
+	} else {
+	    routes.set(x.RouteNumber, [x]);
+	}
+    }
+    return routes;
+}
+
+function showAllDepsByTime(data) {
+    const date = new Date(data.StopPassage.CurrentTimestamp);
+    document.getElementById('stationName').innerHTML = data.StopPassage.StopName;
+    document.getElementById('timeBox').innerHTML = date.toLocaleTimeString('de-DE');
+
+   const table = getTable(
+	[cell => cell.innerHTML = "Linie",
+	 cell => cell.innerHTML = "Ziel",
+	 cell => cell.innerHTML = "Abfahrt"],
+        [(cell, datap) => {cell.appendChild(getRouteImage(datap.RouteName));
+			   cell.setAttribute("class", "cellRoute")},
+	 (cell, datap) => {cell.innerHTML = datap.DepartureDirectionText;
+			   cell.setAttribute("class", "cellDest")},
+	 (cell, datap) => {cell.innerHTML = "" + Math.floor((datap.DepartureCountdown + datap.DepartureDeviation) / 60);
+			   cell.setAttribute("class", "cellTime")}],
+        data.StopPassage.DepartureData.filter(departure => departure.RouteName != '-')
+
+    );
+
+    const contentSection = document.getElementById('contentSection');
+    if (contentSection.hasChildNodes()) {
+	contentSection.replaceChild(table,contentSection.firstElementChild);
+    } else {
+	contentSection.appendChild(table);
+    }
+}
+
+function getRouteImage(route) {
+    const img = document.createElement('img');
+    img.src = 'https://www.swu.de/typo3conf/ext/swu_timetables/Resources/Public/Icons/Routes/linie-' + route + '.svg';
+    img.setAttribute("class","routeImage");
+    return img;
+}
+
+function getTable(listHead, list, listData) {
+    const table = document.createElement('table');
+
+    if (HEADER_ROW) {
+	const headrow = document.createElement('tr');
+	table.appendChild(headrow);
+	for (let fn of listHead) {
+	    const cell = document.createElement('th');
+	    fn(cell);
+	    headrow.appendChild(cell);
+	}
+    }
+   
+
+    for (let dataPoint of listData) {
+	const row = document.createElement('tr');
+	for (let fn of list) {
+	    const cell = document.createElement('td');
+	    fn(cell, dataPoint);
+	    row.appendChild(cell);
+	}
+	table.appendChild(row);
+    }
+    return table;
+}
+
+refreshData();
+// setInterval(refreshData, 15000);
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e3562f5
--- /dev/null
+++ b/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" href="style.css">
+  <script src="fetchapi.js"></script> 
+</head>
+<body>
+  <div id="headerBar">
+    <span id="stationName"></span>
+    <span id="timeBox">--:--</span>
+  </div>
+  <div id="contentSection"></div>
+</body>
+</html>
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..dfe902d
--- /dev/null
+++ b/style.css
@@ -0,0 +1,71 @@
+* {
+    padding: 0;
+    margin: 0;
+}
+
+body {
+    font-family: Helvetica, sans;
+    width: 50%;
+    padding: 0;
+    margin: 0;
+}
+
+#headerBar {
+    font-size: 46px;
+    font-weight: bold;
+    color: white;
+    background-color: #444;
+    padding: 8px;
+}
+
+#stationName, #timeBox {
+}
+
+#timeBox {
+    float: right;
+}
+
+#contentSection {
+    width: 100%;
+}
+
+#contentSection table {
+    width: 100%;
+}
+
+#contentSection .routeImage {
+    width: 100%;
+}
+
+#contentSection tr:nth-child(even) {
+    background-color: #EEE;
+}
+
+#contentSection th {
+    font-size: 26px;
+    text-align: left;
+    padding: 8px;
+}
+
+#contentSection td {
+    font-size: 28px;
+    padding-left: 12px;
+    padding-right: 4px;
+    padding-top: 8px;
+}
+
+.cellRoute {
+    width: 45px;
+    height: 45px;
+}
+
+.cellDest {
+    font-size: 36px;
+}
+
+.cellTime {
+    font-size: 50px;
+    font-weight: bold;
+    text-align: right;
+    margin-right: 20px;
+}