import { EL } from "./dom.js";
import { fetchTrip } from './api.js';

let element_trip_details = document.querySelector("#trip-details");
let element_response = document.querySelector("#trip-details-response");

export function displayTripDetails(trip_id) {
	element_response.innerHTML = "Loading…";
	element_trip_details.popupShow();

	fetchTrip(trip_id).then(result => {
		window.dataStore.trips.remember(result.trip);
		element_response.innerText = "";

		let el_headline = EL("h1", {});
		el_headline.innerText = result.trip.line.name + ": " + result.trip.destination.name;
		element_response.appendChild(el_headline);

		for (let stopover of result.trip.stopovers) {
			let el = EL("div", {});
			el.innerText = stopover.stop.name;
			element_response.appendChild(el);
		}
	});
}