Skip to content

Commit 0545264

Browse files
devksingh4devksingh4
committed
Pull resources page from ACM events API
1 parent e4a3ae6 commit 0545264

File tree

3 files changed

+51
-117
lines changed

3 files changed

+51
-117
lines changed

‎_data/events.yml

-29
This file was deleted.

‎assets/css/dist-main.css

+16
Original file line numberDiff line numberDiff line change
@@ -1051,12 +1051,28 @@ video {
10511051
transition-duration: 150ms;
10521052
}
10531053

1054+
.transition-transform {
1055+
transition-property: transform;
1056+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1057+
transition-duration: 150ms;
1058+
}
1059+
1060+
.duration-150 {
1061+
transition-duration: 150ms;
1062+
}
1063+
10541064
.announcement-content a {
10551065
--tw-text-opacity: 1;
10561066
color: rgb(96 165 250 / var(--tw-text-opacity, 1));
10571067
text-decoration-line: underline;
10581068
}
10591069

1070+
.hover\:scale-110:hover {
1071+
--tw-scale-x: 1.1;
1072+
--tw-scale-y: 1.1;
1073+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1074+
}
1075+
10601076
.hover\:scale-\[1\.01\]:hover {
10611077
--tw-scale-x: 1.01;
10621078
--tw-scale-y: 1.01;

‎resources.html

+35-88
Original file line numberDiff line numberDiff line change
@@ -29,78 +29,39 @@ <h1 class="text-4xl font-bold mb-8 dark:text-white">Resources</h1>
2929

3030
async function loadEventResources() {
3131
try {
32-
// Get the events data from Jekyll
33-
const eventsWithResources = [];
34-
35-
{% for event in site.data.events %}
36-
{% if event.resources %}
37-
eventsWithResources.push({
38-
id: "{{ event.id }}",
39-
name: "{{ event.name }}",
40-
resources: {
41-
{% if event.resources.empty_slides %}
42-
empty_slides: "{{ event.resources.empty_slides }}",
43-
{% endif %}
44-
{% if event.resources.filled_slides %}
45-
filled_slides: "{{ event.resources.filled_slides }}",
46-
{% endif %}
47-
{% if event.resources.recording %}
48-
recording: "{{ event.resources.recording }}"
49-
{% endif %}
50-
}
51-
});
52-
{% endif %}
53-
{% endfor %}
54-
55-
// Create a map to store API responses by event ID
56-
const eventDetailsMap = {};
57-
58-
// First, start all API requests in parallel for events without names
59-
const apiRequests = eventsWithResources
60-
.filter(event => !event.name && event.id) // Only fetch for events without names
61-
.map(async event => {
62-
try {
63-
const response = await fetch(`https://core.acm.illinois.edu/api/v1/events/${event.id}`);
64-
if (response.ok) {
65-
const eventDetails = await response.json();
66-
// Store the result in our map
67-
eventDetailsMap[event.id] = eventDetails;
68-
}
69-
} catch (error) {
70-
console.error(`Error fetching details for event ${event.id}:`, error);
71-
}
72-
});
73-
74-
// Wait for all API requests to complete
75-
await Promise.all(apiRequests);
76-
77-
// Now process all events with the API data we've collected
78-
const eventsWithDetails = eventsWithResources.map(event => {
79-
// Check if we have API data for this event
80-
const apiData = event.id ? eventDetailsMap[event.id] : null;
81-
82-
// Determine the title (prioritize existing name, then API data, then fallback)
83-
const title = event.name || (apiData ? apiData.title : null) || 'Unknown Event';
84-
85-
return {
86-
...event,
87-
title: title,
88-
calendarLink: event.id ? `https://www.acm.illinois.edu/calendar?id=${event.id}&host=Academic+Committee` : null
89-
};
90-
});
91-
92-
// Render the events table
93-
renderResourcesTable(eventsWithDetails);
32+
const response = await fetch('https://core.acm.illinois.edu/api/v1/events?host=Academic%20Committee&includeMetadata=true');
33+
if (!response.ok) throw new Error('Failed to fetch events');
34+
35+
const allEvents = await response.json();
36+
37+
// Filter only events with resources in metadata
38+
const eventsWithResources = allEvents.filter(event => {
39+
const m = event.metadata || {};
40+
return m.empty_slides || m.filled_slides || m.recording;
41+
}).map(event => {
42+
return {
43+
id: event.id,
44+
title: event.title || 'Untitled Event',
45+
calendarLink: `https://www.acm.illinois.edu/calendar?id=${event.id}&host=Academic+Committee`,
46+
resources: {
47+
empty_slides: event.metadata?.empty_slides || null,
48+
filled_slides: event.metadata?.filled_slides || null,
49+
recording: event.metadata?.recording || null,
50+
}
51+
};
52+
});
53+
54+
renderResourcesTable(eventsWithResources);
9455
} catch (error) {
95-
console.error('Error loading resources:', error);
96-
document.getElementById('resources-body').innerHTML = `
56+
console.error('Error loading resources:', error);
57+
document.getElementById('resources-body').innerHTML = `
9758
<tr>
9859
<td colspan="2" class="px-6 py-4 text-center text-red-500">
9960
Failed to load resources. Please try again later.
10061
</td>
10162
</tr>
10263
`;
103-
}
64+
}
10465
}
10566

10667
function renderResourcesTable(events) {
@@ -117,15 +78,13 @@ <h1 class="text-4xl font-bold mb-8 dark:text-white">Resources</h1>
11778
return;
11879
}
11980

120-
// Create table rows for each event
12181
resourcesBody.innerHTML = events.map(event => {
12282
return `
12383
<tr class="text-gray-900 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-600 bg-white dark:bg-gray-700 transition-colors ">
12484
<td class="px-6 py-4 dark:text-gray-200">
125-
${event.calendarLink
126-
? `<a href="${event.calendarLink}" target="_blank" class="hover:underline text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300">${event.title}</a>`
127-
: event.title
128-
}
85+
<a href="${event.calendarLink}" target="_blank" class="hover:underline text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300">
86+
${event.title}
87+
</a>
12988
</td>
13089
<td class="px-6 py-4">
13190
<div class="flex flex-wrap justify-center gap-4">
@@ -142,36 +101,24 @@ <h1 class="text-4xl font-bold mb-8 dark:text-white">Resources</h1>
142101

143102
if (resources.empty_slides) {
144103
icons.push(`
145-
<a href="${resources.empty_slides}"
146-
class="text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 transition-colors "
147-
title="Empty Slides">
148-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
149-
<path fill="currentColor" d="M6 22q-.825 0-1.412-.587T4 20V4q0-.825.588-1.412T6 2h8l6 6v12q0 .825-.587 1.413T18 22zm7-13V4H6v16h12V9zM6 4v5zv16z" />
150-
</svg>
104+
<a href="${resources.empty_slides}" title="Empty Slides" class="text-blue-600 hover:text-blue-800 dark:text-blue-400 dark:hover:text-blue-300 transition-colors duration-150">
105+
<svg xmlns="http://www.w3.org/2000/svg" class="hover:scale-110 transition-transform duration-150" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M5 21q-.825 0-1.412-.587T3 19V5q0-.825.588-1.412T5 3h4.2q.325-.9 1.088-1.45T12 1t1.713.55T14.8 3H19q.825 0 1.413.588T21 5v14q0 .825-.587 1.413T19 21zm0-2h14V5H5zm3-2h5q.425 0 .713-.288T14 16t-.288-.712T13 15H8q-.425 0-.712.288T7 16t.288.713T8 17m0-4h8q.425 0 .713-.288T17 12t-.288-.712T16 11H8q-.425 0-.712.288T7 12t.288.713T8 13m0-4h8q.425 0 .713-.288T17 8t-.288-.712T16 7H8q-.425 0-.712.288T7 8t.288.713T8 9m4-4.75q.325 0 .538-.213t.212-.537t-.213-.537T12 2.75t-.537.213t-.213.537t.213.538t.537.212M5 19V5z"/></svg>
151106
</a>
152107
`);
153108
}
154109

155110
if (resources.filled_slides) {
156111
icons.push(`
157-
<a href="${resources.filled_slides}"
158-
class="text-green-600 hover:text-green-800 dark:text-green-400 dark:hover:text-green-300 transition-colors "
159-
title="Filled Slides">
160-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
161-
<path fill="currentColor" d="m10.95 18l5.65-5.65l-1.45-1.45l-4.225 4.225l-2.1-2.1L7.4 14.45zM6 22q-.825 0-1.412-.587T4 20V4q0-.825.588-1.412T6 2h8l6 6v12q0 .825-.587 1.413T18 22zm7-13V4H6v16h12V9zM6 4v5zv16z" />
162-
</svg>
112+
<a href="${resources.filled_slides}" title="Filled Slides" class="text-green-600 hover:text-green-800 dark:text-green-400 dark:hover:text-green-300 transition-colors duration-150">
113+
<svg xmlns="http://www.w3.org/2000/svg" class="hover:scale-110 transition-transform duration-150" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="m10.6 13.8l-2.15-2.15q-.275-.275-.7-.275t-.7.275t-.275.7t.275.7L9.9 15.9q.3.3.7.3t.7-.3l5.65-5.65q.275-.275.275-.7t-.275-.7t-.7-.275t-.7.275zM12 22q-2.075 0-3.9-.788t-3.175-2.137T2.788 15.9T2 12t.788-3.9t2.137-3.175T8.1 2.788T12 2t3.9.788t3.175 2.137T21.213 8.1T22 12t-.788 3.9t-2.137 3.175t-3.175 2.138T12 22m0-2q3.35 0 5.675-2.325T20 12t-2.325-5.675T12 4T6.325 6.325T4 12t2.325 5.675T12 20m0-8"/></svg>
163114
</a>
164115
`);
165116
}
166117

167118
if (resources.recording) {
168119
icons.push(`
169-
<a href="${resources.recording}"
170-
class="text-red-600 hover:text-red-800 dark:text-red-400 dark:hover:text-red-300 transition-colors "
171-
title="Recording">
172-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
173-
<path fill="currentColor" d="M4 20q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h12q.825 0 1.413.588T18 6v4.5l4-4v11l-4-4V18q0 .825-.587 1.413T16 20zm0-2h12V6H4zm0 0V6z" />
174-
</svg>
120+
<a href="${resources.recording}" title="Recording" class="text-red-600 hover:text-red-800 dark:text-red-400 dark:hover:text-red-300 transition-colors duration-150">
121+
<svg xmlns="http://www.w3.org/2000/svg" class="hover:scale-110 transition-transform duration-150" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M4 20q-.825 0-1.412-.587T2 18V6q0-.825.588-1.412T4 4h12q.825 0 1.413.588T18 6v4.5l3.15-3.15q.25-.25.55-.125t.3.475v8.6q0 .35-.3.475t-.55-.125L18 13.5V18q0 .825-.587 1.413T16 20z"/></svg>
175122
</a>
176123
`);
177124
}

0 commit comments

Comments
 (0)