traveldrafter/web/drafting-board.js

import { EL } from "./dom.js";
import { displayTripDetails } from "./trip-details.js";
import { fetchTrip } from './api.js';
import { DataStore } from './datastore.js';

let element_board = document.querySelector("#drafting-board-content");

export function addJourneyToDraftingBoard(journey) {
	for (let leg of journey.legs.filter(item => !("walking" in item))) {
		DataStore.tracked_trips.remember(leg.tripId, leg.origin.id, leg.destination.id);
		fetchTrip(leg.tripId).then(result => {
			DataStore.trips.remember(result.trip);
		});
	}

	drawDraftingBoard();
}

export function drawDraftingBoard() {
	element_board.innerText = "";

	let sorted_locations = trackedTripsLocationsSorted();
	let display_locations = sorted_locations.map(item => DataStore.locations.get()[item]);

	let grid_location_indexes = {};

	let location_offset = 0;

	for (let sorted_location of sorted_locations) {

		grid_location_indexes[sorted_location] = {
			"name-start": (location_offset * 3) + 1,
			"name-end": (location_offset * 3) + 4,
			"column-start": (location_offset * 3) + 2,
			"column-end": (location_offset * 3) + 3,
		};

		location_offset += 1;

	}

	let trip_data = DataStore.trips.get();
	console.log(trip_data);

	function getStopFromTrip(tripId, location_id) {
		for (let stop of trip_data[tripId]?.stopovers || []) {
			if (stop.stop.id == location_id) {
				return stop;
			}

		}

		return undefined;

	}

	let display_trips = DataStore.tracked_trips.get().map(item => {
		item["trip_data"] = trip_data[item.trip];

		item.originStop = getStopFromTrip(item.trip, item.origin);
		item.destinationStop = getStopFromTrip(item.trip, item.destination);

		return item;
	});

	console.log(display_trips);

	let rows = display_trips.length;

	for (let display_location of display_locations) {
		let el_location_name = EL("div", {
			class: [ "station-name" ],
			style: {
				"grid-column-start": grid_location_indexes[display_location.id]["name-start"],
				"grid-column-end": grid_location_indexes[display_location.id]["name-end"],
				"grid-row-start": 1,
				"grid-row-end": 1,

			},
		});
		el_location_name.innerText = display_location?.name;
		element_board.appendChild(el_location_name);

		let el_location_column = EL("div", {
			class: [ "station-column" ],
			style: {
				"grid-column-start": grid_location_indexes[display_location.id]["column-start"],
				"grid-column-end": grid_location_indexes[display_location.id]["column-end"],
				"grid-row-start": 2,
				"grid-row-end": rows + 2,

			},
		});
		element_board.appendChild(el_location_column);
	}

	let trip_offset = 0;

	for (let display_trip of display_trips) {
		console.log(display_trip);
		let el_trip_left = EL("div", {
			class: [ "trip-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,

			},
		});
		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);

		let el_trip = EL("div", {
			class: [ "trip" ],
			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,

			},
		});
		el_trip.innerText = display_trip.trip_data?.line?.name;

		el_trip.addEventListener("click", event => {
			console.log(display_trip.tripId);
			displayTripDetails(display_trip.tripId);
		});

		element_board.appendChild(el_trip);

		let el_trip_right = EL("div", {
			class: [ "trip-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,

			},
		});
		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));

		element_board.appendChild(el_trip_right);

		trip_offset += 1;
	}
}

export function getLocationWithLeastInboundTrips(locations, trips) {
	function numberOfInboundTrips(location) {
		return trips.filter(trip => trip.destination == 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);

		if (n_a == n_b) {
			return 0;
		} else if (n_a > n_b) {
			return 1;
		} else {
			return -1;
		}
	});

	return locations_sorted_by_number_of_inbound_trips[0];
}

export function sortLocations(sorted_locations, unsorted_locations, trips) {
	if (unsorted_locations.length == 0) {
		return sorted_locations;
	}

	let selected_location = getLocationWithLeastInboundTrips(unsorted_locations, trips);

	unsorted_locations = unsorted_locations.filter(location => location != selected_location);
	trips = trips.filter(trip => trip.destination != selected_location && trip.origin != selected_location);

	return sortLocations(sorted_locations.concat([ selected_location ]), unsorted_locations, trips);
}

export function trackedTripsLocationsSorted() {
	let tracked_trips = DataStore.tracked_trips.get();
	let tracked_locations = Array.from(new Set(tracked_trips.map(trip => trip.origin).concat(tracked_trips.map(trip => trip.destination))));

	console.log(tracked_trips);
	console.log(tracked_locations);

	let sorted_locations = sortLocations([], tracked_locations, tracked_trips);

	console.log(sorted_locations);

	console.log(sorted_locations.map(item => DataStore.locations.get()[item]?.name));

	return sorted_locations;
}