diff --git a/web/datastore.js b/web/datastore.js index 822a48d..f3bc375 100644 --- a/web/datastore.js +++ b/web/datastore.js @@ -55,25 +55,25 @@ export class RecentLocationsDataStore { } } -export class TrackedTripsDataStore { +export class LegsDataStore { constructor() { this.data = []; this.read(); } read() { - this.data = DataStore.get("tracked-trips") || []; + this.data = DataStore.get("legs") || []; } write() { - DataStore.set("tracked-trips", this.data); + DataStore.set("legs", this.data); } remember(trip_id, origin_id, destination_id) { this.data.push({ - trip: trip_id, - origin: origin_id, - destination: destination_id, + trip_id: trip_id, + origin_location_id: origin_id, + destination_location_id: destination_id, }); this.write(); @@ -119,7 +119,7 @@ export class DataStore { constructor() { this.locations = new LocationsDataStore(); this.recent_locations = new RecentLocationsDataStore(); - this.tracked_trips = new TrackedTripsDataStore(); + this.legs = new LegsDataStore(); this.trips = new TripsDataStore(); } } diff --git a/web/drafting-board.js b/web/drafting-board.js index 1513a63..43c0b9b 100644 --- a/web/drafting-board.js +++ b/web/drafting-board.js @@ -6,7 +6,7 @@ let element_board = document.querySelector("#drafting-board-content"); export function addJourneyToDraftingBoard(journey) { for (let leg of journey.legs.filter(item => !("walking" in item))) { - window.dataStore.tracked_trips.remember(leg.tripId, leg.origin.id, leg.destination.id); + window.dataStore.legs.remember(leg.tripId, leg.origin.id, leg.destination.id); fetchTrip(leg.tripId).then(result => { window.dataStore.trips.remember(result.trip); }); @@ -38,11 +38,8 @@ export function drawDraftingBoard() { } - let trip_data = window.dataStore.trips.data; - console.log(trip_data); - - function getStopFromTrip(tripId, location_id) { - for (let stop of trip_data[tripId]?.stopovers || []) { + function getStopFromTrip(trip_id, location_id) { + for (let stop of window.dataStore.trips.data[trip_id]?.stopovers || []) { if (stop.stop.id == location_id) { return stop; } @@ -53,18 +50,16 @@ export function drawDraftingBoard() { } - let display_trips = window.dataStore.tracked_trips.data.map(item => { - item["trip_data"] = trip_data[item.trip]; + let display_legs = window.dataStore.legs.data.map(leg => { + leg.trip = window.dataStore.trips.data[leg.trip_id]; - item.originStop = getStopFromTrip(item.trip, item.origin); - item.destinationStop = getStopFromTrip(item.trip, item.destination); + leg.origin_location = getStopFromTrip(leg.trip_id, leg.origin_location_id); + leg.destination_location = getStopFromTrip(leg.trip_id, leg.destination_location_id); - return item; + return leg; }); - console.log(display_trips); - - let rows = display_trips.length; + let rows = display_legs.length; for (let display_location of display_locations) { let el_location_name = EL("div", { @@ -93,72 +88,72 @@ export function drawDraftingBoard() { element_board.appendChild(el_location_column); } - let trip_offset = 0; + let leg_offset = 0; - for (let display_trip of display_trips) { - console.log(display_trip); - let el_trip_left = EL("div", { - class: [ "trip-left" ], + for (let display_leg of display_legs) { + console.log(display_leg); + let el_leg_left = EL("div", { + class: [ "leg-left" ], style: { - "grid-column-start": grid_location_indexes[display_trip.origin]["name-start"], - "grid-column-end": grid_location_indexes[display_trip.origin]["column-start"], - "grid-row-start": trip_offset + 2, - "grid-row-end": trip_offset + 2, + "grid-column-start": grid_location_indexes[display_leg.origin_location_id]["name-start"], + "grid-column-end": grid_location_indexes[display_leg.origin_location_id]["column-start"], + "grid-row-start": leg_offset + 2, + "grid-row-end": leg_offset + 2, }, }); - el_trip_left.appendChild(document.createTextNode(new Date(display_trip.originStop.departure).toLocaleTimeString())); - el_trip_left.appendChild(EL("br", {})); - el_trip_left.appendChild(document.createTextNode("Gleis " + display_trip.originStop.departurePlatform)); - element_board.appendChild(el_trip_left); + el_leg_left.appendChild(document.createTextNode(new Date(display_leg.origin_location.departure).toLocaleTimeString())); + el_leg_left.appendChild(EL("br", {})); + el_leg_left.appendChild(document.createTextNode("Gleis " + display_leg.origin_location.departurePlatform)); + element_board.appendChild(el_leg_left); - let el_trip = EL("div", { - class: [ "trip" ], + let el_leg = EL("div", { + class: [ "leg" ], style: { - "grid-column-start": grid_location_indexes[display_trip.origin]["column-end"], - "grid-column-end": grid_location_indexes[display_trip.destination]["column-start"], - "grid-row-start": trip_offset + 2, - "grid-row-end": trip_offset + 2, + "grid-column-start": grid_location_indexes[display_leg.origin_location_id]["column-end"], + "grid-column-end": grid_location_indexes[display_leg.destination_location_id]["column-start"], + "grid-row-start": leg_offset + 2, + "grid-row-end": leg_offset + 2, }, }); - el_trip.innerText = display_trip.trip_data?.line?.name; + el_leg.innerText = display_leg.trip?.line?.name; - el_trip.addEventListener("click", event => { - console.log(display_trip.tripId); - displayTripDetails(display_trip.tripId); + el_leg.addEventListener("click", event => { + console.log(display_leg.trip_id); + displayTripDetails(display_leg.trip_id); }); - element_board.appendChild(el_trip); + element_board.appendChild(el_leg); - let el_trip_right = EL("div", { - class: [ "trip-right" ], + let el_leg_right = EL("div", { + class: [ "leg-right" ], style: { - "grid-column-start": grid_location_indexes[display_trip.destination]["column-end"], - "grid-column-end": grid_location_indexes[display_trip.destination]["name-end"], - "grid-row-start": trip_offset + 2, - "grid-row-end": trip_offset + 2, + "grid-column-start": grid_location_indexes[display_leg.destination_location_id]["column-end"], + "grid-column-end": grid_location_indexes[display_leg.destination_location_id]["name-end"], + "grid-row-start": leg_offset + 2, + "grid-row-end": leg_offset + 2, }, }); - el_trip_right.appendChild(document.createTextNode(new Date(display_trip.destinationStop.arrival).toLocaleTimeString())); - el_trip_right.appendChild(EL("br", {})); - el_trip_right.appendChild(document.createTextNode("Gleis " + display_trip.destinationStop.arrivalPlatform)); + el_leg_right.appendChild(document.createTextNode(new Date(display_leg.destination_location.arrival).toLocaleTimeString())); + el_leg_right.appendChild(EL("br", {})); + el_leg_right.appendChild(document.createTextNode("Gleis " + display_leg.destination_location.arrivalPlatform)); - element_board.appendChild(el_trip_right); + element_board.appendChild(el_leg_right); - trip_offset += 1; + leg_offset += 1; } } -export function getLocationWithLeastInboundTrips(locations, trips) { - function numberOfInboundTrips(location) { - return trips.filter(trip => trip.destination == location).length; +export function getLocationWithLeastInboundTrips(locations, legs) { + function numberOfInboundLegs(location) { + return legs.filter(leg => leg.destination_location_id == location).length; } - let locations_sorted_by_number_of_inbound_trips = locations.toSorted((location_a, location_b) => { - let n_a = numberOfInboundTrips(location_a); - let n_b = numberOfInboundTrips(location_b); + let locations_sorted_by_number_of_inbound_legs = locations.toSorted((location_a, location_b) => { + let n_a = numberOfInboundLegs(location_a); + let n_b = numberOfInboundLegs(location_b); if (n_a == n_b) { return 0; @@ -169,30 +164,31 @@ export function getLocationWithLeastInboundTrips(locations, trips) { } }); - return locations_sorted_by_number_of_inbound_trips[0]; + return locations_sorted_by_number_of_inbound_legs[0]; } -export function sortLocations(sorted_locations, unsorted_locations, trips) { +export function sortLocations(sorted_locations, unsorted_locations, legs) { if (unsorted_locations.length == 0) { return sorted_locations; } - let selected_location = getLocationWithLeastInboundTrips(unsorted_locations, trips); + let selected_location_id = getLocationWithLeastInboundTrips(unsorted_locations, legs); - unsorted_locations = unsorted_locations.filter(location => location != selected_location); - trips = trips.filter(trip => trip.destination != selected_location && trip.origin != selected_location); + unsorted_locations = unsorted_locations.filter(location_id => location_id != selected_location_id); + legs = legs.filter(leg => leg.destination_id != selected_location_id && leg.origin_id != selected_location_id); - return sortLocations(sorted_locations.concat([ selected_location ]), unsorted_locations, trips); + return sortLocations(sorted_locations.concat([ selected_location_id ]), unsorted_locations, legs); } export function trackedTripsLocationsSorted() { - let tracked_trips = window.dataStore.tracked_trips.data; - let tracked_locations = Array.from(new Set(tracked_trips.map(trip => trip.origin).concat(tracked_trips.map(trip => trip.destination)))); + let passed_locations = Array.from(new Set( + window.dataStore.legs.data.map(leg => leg.origin_location_id) + .concat( + window.dataStore.legs.data.map(leg => leg.destination_location_id) + ) + )); - console.log(tracked_trips); - console.log(tracked_locations); - - let sorted_locations = sortLocations([], tracked_locations, tracked_trips); + let sorted_locations = sortLocations([], passed_locations, window.dataStore.legs.data); console.log(sorted_locations); diff --git a/web/style.css b/web/style.css index e5415dc..9f3c69e 100644 --- a/web/style.css +++ b/web/style.css @@ -104,14 +104,14 @@ input.form-control { background-color: black; } -#drafting-board .trip-left { +#drafting-board .leg-left { margin-top: auto; margin-bottom: auto; margin-right: 10px; text-align: right; } -#drafting-board .trip { +#drafting-board .leg { margin: 10px; border-style: solid; @@ -124,7 +124,7 @@ input.form-control { background-color: #ff4bb0; } -#drafting-board .trip-right { +#drafting-board .leg-right { margin-top: auto; margin-bottom: auto; margin-left: 10px;