event-fetcher.js

function getEventsCompanies() {
	return fetch(`${baseUrl}/events/companies`).then((response) => response.json());
}

function getEventsOther() {
	return fetch(`${baseUrl}/events/other`).then((response) => response.json());
}

function formatDateRange(start, end) {
	const startMoment = moment(start);
	const endMoment = moment(end);

	const startDate = startMoment.format("DD MMM YYYY");
	const endDate = endMoment.format("DD MMM YYYY");

	if (startMoment.whole_day || startDate !== endDate) {
		if (!endMoment || startMoment === endMoment) {
			return startDate;
		} else if (
			startMoment.year() === endMoment.year() &&
			startMoment.month() === endMoment.month()
		) {
			return `${startMoment.format("DD")} – ${endDate}`;
		} else {
			return `${startDate} – ${endDate}`;
		}
	} else if (
		!endMoment ||
		(startMoment.hour() === endMoment.hour() &&
		startMoment.minute() === endMoment.minute())
	) {
		return `${startDate}, ${startMoment.format("hh:mm")}`;
	} else {
		let timeRange = `${startMoment.format("hh:mm")} – ${endMoment.format("hh:mm")}`;
		return `${startDate}, ${timeRange}`;
	}
}

function createElements(events) {
	const container = document.querySelector(".paragraph-html");

	const row = document.createElement("div");
	row.className = "row";
	container.insertAdjacentElement("afterbegin", row);

	for (const event of events) {
		const colMd10 = document.createElement("div");
		colMd10.className = "col-md-10";
		colMd10.innerHTML = `
			<div class="event-header">
				<h3><a></a></h3>

				<ul class="list-unstyled list-inline text-muted small meta-list">
					<li>
						<span class="fa fa-calendar"></span>
						<span class="date"></span>
					</li>
				</ul>

				<p class="description"></p>
			</div>
		`;

		const link = colMd10.querySelector(".event-header a");
		link.setAttribute("href", event.website_url);
		link.innerText = event.name;

		colMd10.querySelector(".date").innerText = formatDateRange(event.start, event.end);
		colMd10.querySelector(".description").innerText = event.short;

		// <div class="col-md-12"><hr></div>
		const colMd12 = document.createElement("div");
		colMd12.className = "col-md-12";
		colMd12.append(document.createElement("hr"));

		row.append(colMd10);
		row.append(colMd12);
	}

	container.removeChild(container.querySelector("h1"));
}

if (eventType === "companies") {
	getEventsCompanies().then(createElements);
} else if (eventType === "other") {
	getEventsOther().then(createElements);
}