https://altdorfs.com/js/calendar.js

1$(function () {
2	const path = window.location.pathname.toString();
3	const url = window.location.href.toString();
4	const pathProto = path.split("/");
5	const pathUrl = url.split("//");
6	const protoBefore = pathUrl[1].split(".");
7	let proto;
8	if (pathProto[2] === "designs" || protoBefore[1] === "roma" || protoBefore[0] === "roma" || pathProto[3] === "roma") {
9		proto = "murdochsirishpub";
10	} else if (pathProto[2] === "proto") {
11		proto = pathProto[3];
12	} else {
13		proto = protoBefore[0];
14	}
15
16	function start() {
17		const today = new Date();
18		const dd = String(today.getDate()).padStart(2, "0");
19		const mm = String(today.getMonth() + 1).padStart(2, "0");
20		const yyyy = today.getFullYear();
21		return `${yyyy}-${mm}-${dd}`;
22	}
23
24	function end() {
25		const end = new Date();
26		end.setDate(end.getDate() + 6);
27		const dd = String(end.getDate()).padStart(2, "0");
28		const mm = String(end.getMonth() + 1).padStart(2, "0");
29		const yyyy = end.getFullYear();
30		return `${yyyy}-${mm}-${dd}`;
31	}
32
33	var cardHeight = 0;
34	let eventNumber = 0;
35
36	$(function () {
37		$.ajax({
38			url: `https://rails-admin.spillover.com/esites-api/v1/${proto}/calendar_events?start=${start()}T00:00:00Z&end=${end()}T00:00:00-01Z&include_recurrences=true`,
39			success: function (content) {
40				$.each(content, function (index, calendar) {
41					eventNumber++;
42
43					function leftDate() {
44						const correctedTime = timeZoneCorrection(calendar.start);
45						const [date] = correctedTime.split("T");
46						const [yyyy, mm, dd] = date.split("-");
47						const textDate = new Date(`${mm}/${dd}/${yyyy}`);
48
49						const weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
50						const dayOfWeek = weekday[textDate.getDay()];

51						const month = ["Jan", "Feb", "Mar", "Apr", "May", "June", "July", "Aug", "Sept", "Oct", "Nov", "Dec"];
52						const monthAbbr = month[textDate.getMonth()];
53
54						const formattedDay = dd.replace(/^0/, ""); // remove leading 0
55						const formattedDate = `<h3>${monthAbbr}</h3><h2>${formattedDay}</h2><h3>${yyyy}</h3>`;
56						return calendar.allDay ? undefined : formattedDate;
57					}
58
59					function timeZoneCorrection(time) {
60						const timezoneMap = {
61							"America/Los_Angeles": "America/Los_Angeles",
62							"America/Denver": "America/Denver",
63							"America/Chicago": "America/Chicago",
64							"America/New_York": "America/New_York",
65						};
66
67						const timezone = timezoneMap[calendar.timezone_IANA] || "UTC";
68						const timeCorrected = moment.tz(time, timezone).format();
69
70						return timeCorrected;
71					}
72
73					function startDate() {
74						const correctedTime = timeZoneCorrection(calendar.start);
75						const date = new Date(correctedTime);
76						const weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
77						const dayOfWeek = weekday[date.getDay()];
78
79						return calendar.allDay ? undefined : dayOfWeek;
80					}
81
82					function startTime() {
83						const timeCorrected = timeZoneCorrection(calendar.start);
84						const date = new Date(timeCorrected);
85						const hours = date.getHours();
86						const minutes = date.getMinutes();
87						const ampm = hours >= 12 ? "pm" : "am";
88						const formattedHours = hours % 12 || 12;
89
90						const startTime = `${formattedHours}:${minutes.toString().padStart(2, "0")}${ampm}`;
91						const wholeDay = "All Day";
92
93						return calendar.allDay ? wholeDay : startTime;
94					}
95
96					function endTime() {
97						const timeCorrected = timeZoneCorrection(calendar.end);
98						const date = new Date(timeCorrected);
99						const hours = date.getHours();
100						const minutes = date.getMinutes();
101						const ampm = hours >= 12 ? "pm" : "am";
102						const formattedHours = hours % 12 || 12;
103
104						const endTime = `${formattedHours}:${minutes.toString().padStart(2, "0")}${ampm}`;
105
106						return calendar.allDay ? undefined : endTime;
107					}
108
109					function timeZone() {
110						const timezoneMap = {
111							Central: "(CST)",
112							Eastern: "(EST)",
113							Mountain: "(MST)",
114							Pacific: "(PST)",
115							Alaska: "(AKST)",
116							Yukon: "(YST)",
117							"Alaska-Hawaii": "(AHST)",
118						};
119
120						const zoneSplit = calendar.timezone_name.split("(");
121						const zone = zoneSplit[0].slice(0, -1);
122						const timezone = timezoneMap[zone] || "";
123
124						return timezone;
125					}
126
127					let calendarID = calendar.id + "-" + eventNumber;
128					let hasImage = $(calendar.description).find("img").length > 0;
129					let col = hasImage ? "col-md-6 p-0 my-auto" : "col-md-10 p-0 my-auto";
130					let imgShow = hasImage ? '<div class="col-md-4 text-md-right text-center p-0"><div class="h-100"><span id="card-i"></span></div></div>' : "";
131					let bodyMargins = "";
132					// Only assign value to bodyMargins if hasImage is true
133					if (hasImage) {
134						bodyMargins = "";
135					}
136					const $calendar = $("#calendar-events");
137
138					const calendarHTML = `
139						<div class="col-md-12 mb-4">
140							<div class="card h-100 p-0" id="${calendarID}">
141								<div class="row h-100 m-0">
142									<div class="col-md-2 p-0 m-0 text-center date-bg" style="background-color:${calendar.color} !important;">
143										<div class="h-100 d-flex">
144											<div class="m-auto">${leftDate()}</div>
145										</div>
146									</div>
147									<div class="${col} text-center">
148										<div class="card-body ${bodyMargins}">
149											<div class="h-100">
150												<h2 class="card-title h3 text-center" id="title-${calendarID}">${calendar.title}</h2>
151												<h5 class="card-subtitle d-block mb-3 text-center">${startDate()} @ ${startTime()}${calendar.end == null ? "" : " - " + endTime()}${timeZone()}</h5>
152												<hr>
153												<div class="card-text">${calendar.description}</div>
154											</div>
155										</div>
156									</div>
157									${imgShow}
158								</div>
159								${calendar.url == null || calendar.url == "" ? "" : `<div class="card-footer"><div id="cta-button-${calendarID}"><a class="cta-button btn btn-template" target="_blank" href="${calendar.url}">Learn More</a></div></div>`}
160							</div>
161						</div>
162					`;
163
164					$calendar.append(calendarHTML);
165
166					const $calendarID = $("#" + calendarID);
167					if ($calendarID.find("img").length > 0) {
168						const $cardI = $calendarID.find("#card-i");
169						const $img = $calendarID.find("img");
170
171						$img.clone().appendTo($cardI);
172						$img.remove();
173
174						$cardI.find("img").addClass("card-img-top h-100");
175					}
176
177					const $ctaButton = $calendarID.find("#cta-button-" + calendarID);
178					if ($ctaButton.length > 1) {
179						const $title = $calendarID.find("#title-" + calendarID);
180						$ctaButton.clone().insertBefore($title);
181						$ctaButton.remove();
182					}
183
184					const $calendarIDDiv = $("#calendar > div > #" + calendarID);
185					if ($calendarIDDiv.height() > cardHeight) {
186						cardHeight = $calendarIDDiv.height();
187					}
188				});
189			},
190		});
191	});
192});