PRO150-Group/Project
3
2
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'backend' of https://git.nathanspackman.com/PRO150-Group/Project into backend
Some checks failed
Deploy Express API / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
thenatespack
2025-12-01 23:02:26 -07:00
parent 75581a9ddc 2771b5ea74
commit c5abf60bff
4 changed files with 31 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
public/app.js
View File

@@ -3,23 +3,10 @@ var streets = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
attribution: '© OpenStreetMap contributors' attribution: '© OpenStreetMap contributors'
}); });
var satellite = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/' + L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
'World_Imagery/MapServer/tile/{z}/{y}/{x}', { attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
attribution: 'Tiles &copy; Esri' }).addTo(map);
});
var map = L.map('map', {
center: [40.7608, -111.8910],
zoom: 13,
layers: [streets]
});
var baseMaps = { "Streets": streets, "Satellite": satellite };
L.control.layers(baseMaps).addTo(map);
const MJR_LINES = ["701", "703", "704", "720", "750"];
const LRT_LINES = ["701", "703", "704", "720"];
const FRONTRUNNER = ["750"];
const API_URL = "http://localhost:7653/api/v0/"; const API_URL = "http://localhost:7653/api/v0/";
const ROUTE_STYLES = { const ROUTE_STYLES = {
"701": { color: "#0074D9", train: "🔵", stop: "🔹" }, "701": { color: "#0074D9", train: "🔵", stop: "🔹" },
@@ -52,11 +39,11 @@ function buildIcon(emoji, bearing) {
function addMarker(lat, lon, content, icon) { function addMarker(lat, lon, content, icon) {
if (!isNaN(lat) && !isNaN(lon)) { if (!isNaN(lat) && !isNaN(lon)) {
const marker = L.marker([lat, lon], { icon }); const marker = L.marker([lat, lon], { icon: icon }).addTo(map);
if (content) marker.bindPopup(content); if (content) marker.bindPopup(content);
return marker; } else {
console.warn("Invalid coordinates:", latitude, longitude);
} }
console.warn("Invalid coordinates:", lat, lon);
} }
@@ -68,26 +55,13 @@ function drawLine(route) {
fetch(API_URL + "routepaths/" + route) fetch(API_URL + "routepaths/" + route)
.then(res => res.json()) .then(res => res.json())
.then(data => { .then(data => {
const points = data.data; const trains = data.data;
if (!points || points.length === 0) return; const filtered = route ? trains.filter(t => t.routeId == route) : trains;
const color = ROUTE_STYLES[route].color; filtered.forEach(t => {
addMarker(t.location.latitude, t.location.longitude, t.routeName + ": Vehicle " + t.vehicleId, trainEmojiIcon);
let polylinePoints = [];
let currentShape = points[0].shape_id;
points.forEach(p => {
if (p.shape_id === currentShape) {
polylinePoints.push([p.lat, p.lng]);
} else {
drawPolyLine(polylinePoints, color);
polylinePoints = [[p.lat, p.lng]];
currentShape = p.shape_id;
}
}); });
if (polylinePoints.length > 0) drawPolyLine(polylinePoints, color);
}) })
.catch(err => console.error("Error drawing line:", err)); .catch(err => console.error("Error fetching trains:", err));
} }
function drawLines() { function drawLines() {
@@ -97,22 +71,14 @@ function drawLines() {
let stopMarkers = {}; let stopMarkers = {};
function getStopsByRoute(route) { function getStopsByRoute(route) {
if (stopMarkers[route]) return; fetch(API_URL + 'stops/' + route)
stopMarkers[route] = [];
const stopIcon = buildIcon(ROUTE_STYLES[route].stop);
fetch(API_URL + "stops/" + route)
.then(res => res.json()) .then(res => res.json())
.then(data => { .then(data => {
data.data.forEach(s => { const stops = data.data;
const lat = parseFloat(s.location.latitude); stops.forEach(s => {
const lon = parseFloat(s.location.longitude); const lat = parseFloat(s.stop_lat);
const marker = addMarker( const lon = parseFloat(s.stop_lon);
lat, lon, addMarker(lat,lon, s.stop_name + " - " + s.stop_desc, stopsEmojiIcon);
`${s.stop_name}<br>${s.stop_desc}`,
stopIcon
).addTo(map);
stopMarkers[route].push(marker);
}); });
}) })
.catch(err => console.error("Error fetching stops:", err)); .catch(err => console.error("Error fetching stops:", err));

28
public/index.html
View File

@@ -1,9 +1,9 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Traxer Transit Map</title> <title>Traxer</title>
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
<link <link
rel="stylesheet" rel="stylesheet"
@@ -14,25 +14,11 @@
src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
crossorigin="" crossorigin=""
></script> ></script>
<!-- SlideTo plugin -->
<script src='https://unpkg.com/leaflet.marker.slideto@0.2.0/Leaflet.Marker.SlideTo.js'></script>
</head> </head>
<body class="h-full"> <body>
<div id="map" class="w-full h-screen"></div>
<!-- Filter UI -->
<div class="p-4 bg-gray-100">
<label class="mr-2 font-semibold">Show Vehicles:</label>
<select id="filterSelect" class="border p-1 rounded">
<option value="all">All Routes</option>
<option value="lrt">LRT + FrontRunner</option>
</select>
</div>
<!-- Map -->
<div id="map" class="w-full h-[70vh]"></div>
<!-- App JS -->
<script src="app.js"></script>
</body> </body>
<script src="app.js"></script>
</html> </html>

6
src/routes/routes.js
View File

@@ -3,8 +3,8 @@ import * as dal from "../dal/staticDal.js";
const router = express.Router(); const router = express.Router();
router.get("/routes",async (req, res) => { router.get("/routes", (req, res) => {
const routes = await dal.getRoutes(); const routes = dal.getRoutes();
res.json({meta: {returned: routes.length}, data: routes}); res.json({meta: {returned: routes.length}, data: routes});
}); });
@@ -47,7 +47,7 @@ router.get("/routes/:routeId/stations", (req, res) => {
router.get("/stops/:routeId", (req, res) => { router.get("/stops/:routeId", (req, res) => {
const routeId = req.params.routeId; const routeId = req.params.routeId;
const stations = dal.getStopsByRoute(routeId); const stations = dal.getStopsByRoute(routeId);
console.log(stations);
res.json({meta: {routeId: String(routeId), returned: stations.length}, data: stations}); res.json({meta: {routeId: String(routeId), returned: stations.length}, data: stations});
}); });

6
src/routes/vehicles.js
View File

@@ -1,10 +1,10 @@
import express from "express"; import express from "express";
import * as dal from "../dal/postgresDAL.js"; import * as dal from "../dal/staticDal.js";
const router = express.Router(); const router = express.Router();
router.get("/", async (req, res) => { router.get("/", (req, res) => {
let vehicles = await dal.getVehicles(); let vehicles = dal.getVehicles();
const {routeNum, routeName, destination, minLat, maxLat, minLng, maxLng, limit} = req.query; const {routeNum, routeName, destination, minLat, maxLat, minLng, maxLng, limit} = req.query;