Widget:UPDEvents: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
<includeonly> | <includeonly> | ||
<div id="upd-events-widget"> | <div id="upd-events-widget"> | ||
<div class="upd-events-loading">Loading upcoming events...</div> | <div class="upd-events-loading"> | ||
Loading upcoming events... | |||
</div> | |||
<ul class="upd-events-list" style="display:none;"></ul> | <ul class="upd-events-list" style="display:none;"></ul> | ||
</div> | </div> | ||
| Line 14: | Line 16: | ||
var list = container.querySelector('.upd-events-list'); | var list = container.querySelector('.upd-events-list'); | ||
var | var pageUrl = 'https://upd.edu.ph/events-list/'; | ||
function | function showError() { | ||
loading.textContent = | |||
. | 'Unable to load events automatically. '; | ||
var link = document.createElement('a'); | |||
link.href = pageUrl; | |||
link.textContent = 'View all UP Diliman events'; | |||
link.target = '_blank'; | |||
link.rel = 'noopener noreferrer'; | |||
loading.appendChild(link); | |||
} | } | ||
function | function cleanTitle(text) { | ||
if (! | return text | ||
.replace(/\s+/g, ' ') | |||
.replace(/\s+(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)[a-z]*\s+\d{1,2}\s*\|[\s\S]*$/i, '') | |||
.trim(); | |||
} | |||
function getEventDate(text) { | |||
var match = text.match( | |||
/\b(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)[a-z]*\s+(\d{1,2})\b/i | |||
); | |||
if (!match) return null; | |||
var months = { | |||
jan:0, feb:1, mar:2, apr:3, may:4, jun:5, | |||
jul:6, aug:7, sep:8, oct:9, nov:10, dec:11 | |||
}; | |||
var month = months[match[1].slice(0,3).toLowerCase()]; | |||
var day = Number(match[2]); | |||
var now = new Date(); | |||
var year = now.getFullYear(); | |||
var date = new Date(year, month, day, 23, 59, 59); | |||
// | // Handle events listed around the New Year. | ||
if ( | if (date < now && now.getMonth() === 11 && month === 0) { | ||
date.setFullYear(year + 1); | |||
} else if (date < now && now.getMonth() === 0 && month === 11) { | |||
return null; | |||
} | } | ||
return | return date; | ||
} | } | ||
fetch(pageUrl) | |||
fetch( | |||
.then(function (response) { | .then(function (response) { | ||
if (!response.ok) throw new Error(' | if (!response.ok) throw new Error('Could not retrieve event page'); | ||
return response.text(); | return response.text(); | ||
}) | }) | ||
.then(function ( | .then(function (html) { | ||
var doc = new DOMParser().parseFromString(html, 'text/html'); | |||
var anchors = doc.querySelectorAll('a[href]'); | |||
var | |||
var events = []; | var events = []; | ||
var seen = {}; | var seen = {}; | ||
anchors.forEach(function (anchor) { | |||
var | var url = new URL(anchor.getAttribute('href'), pageUrl); | ||
if (url.hostname !== 'upd.edu.ph') return; | |||
if (!/^\/events\/[^/]+\/?$/.test(url.pathname)) return; | |||
var rawText = (anchor.textContent || '') | |||
.replace(/\s+/g, ' ') | |||
.trim(); | |||
var | var date = getEventDate(rawText); | ||
var title = | var title = cleanTitle(rawText); | ||
if (! | if (!date || date < new Date() || !title) return; | ||
var key = url.href; | |||
var key = url | |||
if (seen[key]) return; | if (seen[key]) return; | ||
seen[key] = true; | seen[key] = true; | ||
| Line 111: | Line 97: | ||
events.push({ | events.push({ | ||
title: title, | title: title, | ||
url: url, | url: url.href, | ||
date: date | |||
}); | }); | ||
}); | }); | ||
events.sort(function (a, b) { | events.sort(function (a, b) { | ||
return a. | return a.date - b.date; | ||
}); | }); | ||
| Line 123: | Line 109: | ||
if (!events.length) { | if (!events.length) { | ||
loading.textContent = ' | loading.textContent = | ||
'No upcoming events were found.'; | |||
return; | return; | ||
} | } | ||
| Line 144: | Line 131: | ||
}) | }) | ||
.catch(function (error) { | .catch(function (error) { | ||
console.error(' | console.error('UPEvents widget:', error); | ||
showError(); | showError(); | ||
}); | }); | ||