[Task] #138, show ETA & EDA in Status

Type-Style · Sep 11, 2024 · 59eff9d · 59eff9d
1 parent 188aeee
commit 59eff9d
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 3 deletions.
diff --git a/src/client/components/Map.tsx b/src/client/components/Map.tsx
@@ -41,7 +41,7 @@ const MultiColorPolyline = ({ cleanEntries }: { cleanEntries: Models.IEntry[] })
 
 		let strokeDashArray = null;
 
-		if (entry.time.diff > 100) { strokeDashArray = "4 8"; }
+		if (entry.time.diff > 100 || entry.time.diff < 25) { strokeDashArray = "4 8"; }
 		return (<Polyline
 			key={entry.time.created * 1.1 + Math.random()} // random to force rerender while new data is incoming (maxSpeed might have changed)
 			positions={[[previousEntry.lat, previousEntry.lon], [entry.lat, entry.lon]]}

diff --git a/src/client/components/Status.tsx b/src/client/components/Status.tsx
@@ -7,6 +7,8 @@ import SpeedIcon from '@mui/icons-material/Speed';
 import BoltIcon from '@mui/icons-material/Bolt';
 import ShowChartIcon from '@mui/icons-material/ShowChart';
 import EastIcon from '@mui/icons-material/East';
+import WatchIcon from '@mui/icons-material/WatchLaterOutlined';
+import Finish from '@mui/icons-material/SportsScore';
 
 function getStatusData(entries) {
 	const cleanEntries = entries.filter((entry: Models.IEntry) => !entry.ignore);
@@ -60,13 +62,24 @@ function getStatusData(entries) {
 		}, 0) / 1000;
 	}
 
+	function getEta() {
+		const lastEntry = cleanEntries.at(-1);
+		const eta = lastEntry.eta;
+		if (!eta) { return undefined }
+
+		const diffMinutes = (eta - lastEntry.time.created) / 60000;
+		return diffMinutes >= 60 ? (diffMinutes / 60).toFixed(1) + ' hours' : diffMinutes.toFixed(1) + ' minutes';
+	}
+
 	const ignoredEntries = entries.length - cleanEntries.length;
 	const uploadMean = getMean("time.uploadDuration").toFixed(3);
 	const speedGPSMean = (getMean("speed.gps") * 3.6).toFixed(1);
 	const speedCalcMean = (getMean("speed.horizontal") * 3.6).toFixed(1);
 	const verticalCalc = getVertical();
 	const maxSpeed = getMaxSpeed(cleanEntries);
 	const distance = getDistance().toFixed(2);
+	const eta = getEta();
+	const eda = cleanEntries.at(-1).eda ? (cleanEntries.at(-1).eda / 1000).toFixed(2) : undefined;
 
 	return {
 		ignoredEntries,
@@ -75,7 +88,9 @@ function getStatusData(entries) {
 		speedCalcMean,
 		maxSpeed,
 		verticalCalc,
-		distance
+		distance,
+		eta,
+		eda
 	}
 }
 
@@ -136,6 +151,27 @@ function Status({ entries }: { entries: Models.IEntry[] }) {
 						<span>{statusData.distance}km</span>
 					</td>
 				</tr>
+
+				{statusData.eda &&
+					<tr>
+						<td><Finish /></td>
+						<th>EDA</th>
+						<td>
+							<span>{statusData.eda}km</span>
+						</td>
+					</tr>
+				}
+
+				{statusData.eta &&
+					<tr>
+						<td><WatchIcon /></td>
+						<th>ETA</th>
+						<td>
+							<span>{statusData.eta}</span>
+						</td>
+					</tr>
+				}
+
 			</tbody>
 		</table>
 	)

diff --git a/src/testData/createTestData.test.ts b/src/testData/createTestData.test.ts
@@ -46,6 +46,7 @@ describe('test Data', () => {
   const start = { lat: 52.51625, lon: 13.37661 };
   const end = { lat: 52.50960, lon: 13.27457 };
   const diff = {lat: end.lat - start.lat, lon: end.lon - start.lon};
+  const eta = Date.now() + 180 * 1000;
 
   // eslint-disable-next-line jest/expect-expect
   it('create ' + entries + ' entries', () => {
@@ -55,7 +56,7 @@ describe('test Data', () => {
         const lat = (start.lat + (diff.lat / (entries - 1) * i)).toFixed(8);
         const lon = (start.lon + (diff.lon / (entries - 1) * i)).toFixed(8);
         setTimeout(async () => {
-          await callServer(undefined, `user=xx&lat=${lat}&lon=${lon}&timestamp=R3Pl4C3&hdop=${Math.floor(Math.random() * 15) + 1}&altitude=${i+1}&speed=${39 + i*2.5}&heading=${262 + Math.floor(Math.random() * 20) - 10}&key=${key}`, 200, "GET");
+          await callServer(undefined, `user=xx&lat=${lat}&lon=${lon}&timestamp=R3Pl4C3&hdop=${Math.floor(Math.random() * 15) + 1}&altitude=${i+1}&speed=${39 + i*2.5}&heading=${262 + Math.floor(Math.random() * 20) - 10}&eta=${eta + Math.round(Math.random() * 10000)}&eda=${(6.94*1000 * ((entries - i) / entries)).toFixed(1)}&key=${key}`, 200, "GET");
           console.log("called server " + (i + 1) + "/" + entries);
 
         }, 1000 * 30 * i);