Skip to content

Instantly share code, notes, and snippets.

@damiencarbery

damiencarbery/public-holidays.html

Created October 8, 2025 17:03
Show Gist options
  • Save damiencarbery/b3d231316a7d1a664e8a88d29ab9bfc6 to your computer and use it in GitHub Desktop.
Save damiencarbery/b3d231316a7d1a664e8a88d29ab9bfc6 to your computer and use it in GitHub Desktop.
Download ZIP
Irish Public Holidays - some AJAX - Playing around with Javascript and AJAX to display a list of Irish public holidays. https://www.damiencarbery.com/2025/10/irish-public-holidays-some-ajax/
Raw
public-holidays.html
<!DOCTYPE html>
<html lang='en-GB'>
<head>
<meta charset='UTF-8'>
<meta name='robots' content='noindex',' nofollow' />
<meta name='viewport' content='width=device-width',' initial-scale=1'>
<title>Public Holidays</title>
<link href='https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css' rel='stylesheet' crossorigin='anonymous'>
<style>
.container { padding-top: 50px; }
</style>
<script src='./public-holidays.js' crossorigin='anonymous'></script>
</head>
<div class="container">
<h1>Public Holidays</h1>
<p>Data is from <a href="https://www.openholidaysapi.org/en/">OpenHolidays API</a>.</p>
<h3 id="intro">Display <a href="https://openholidaysapi.org/PublicHolidays?countryIsoCode=IE&languageIsoCode=EN&validFrom=2025-01-01&validTo=2025-12-31">Irish public holidays</a> for the rest of the year.</h3>
<div id="holiday-list">
<p><em>Loading...</em></p>
</div>
</div>
</body>
</html>
Raw
public-holidays.js
window.addEventListener('DOMContentLoaded', (event) => {
const earliest_year = 2020; // The OpenHolidays API does not go earlier than 2020.
const latest_year = 2030; // This is a randomly chosen latest date.
let start_date_obj = new Date( Date.now() );
// Look for a '?year=' parameter.
const urlParams = new URLSearchParams(window.location.search);
let year = 0;
if ( urlParams.size ) {
year = parseInt( urlParams.get( 'year' ) );
// Keep the year within the earliest/latest range.
if ( year >= earliest_year && year <= latest_year ) {
start_date_obj.setYear( year );
start_date_obj.setDate( 1 );
start_date_obj.setMonth( 0 ); // January.
const intro = document.getElementById( 'intro' );
if ( intro ) { intro.innerHTML = '<p>Irish public holidays for <strong>' + year + '</strong>.</p>'; }
}
}
const start_date = start_date_obj.toISOString().slice( 0, 10 ); // Get yyyy-mm-dd format.
const end_of_year = start_date_obj.getFullYear() + '-12-31';
const prev_year = start_date_obj.getFullYear() - 1;
const next_year = start_date_obj.getFullYear() + 1;
let holidays_url = 'https://openholidaysapi.org/PublicHolidays?countryIsoCode=IE&languageIsoCode=EN&validFrom=' + start_date + '&validTo=' + end_of_year;
const holiday_list_div = document.getElementById( 'holiday-list' );
if ( !holiday_list_div ) {
alert( 'Could not find the div for the response.' );
}
else {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
if ( 200 == this.status ) {
const response = JSON.parse( this.responseText );
if ( response.length ) {
// Use Intl.DateTimeFormat as it is more efficient than Date.toLocaleDateString().
const dateFormatter = new Intl.DateTimeFormat('en-IE', { dateStyle: "full" });
let holiday_list = [];
const options = { weekday: "long", year: "numeric", month: "long", day: "numeric", };
for ( const x in response ) {
let start_date = new Date( response[x].startDate );
holiday_list.push( dateFormatter.format( start_date ) + ': ' + response[x].name[0].text );
}
holiday_list_div.innerHTML = '<p>' + holiday_list.join( '<br>' ) + '</p>';
// Change links to prev/next years to keep when within the earliest/latest range.
if ( prev_year < earliest_year ) {
holiday_list_div.innerHTML += '<p>See holidays for <a href="?year=' + next_year + '">' + next_year + '</a>.</p>';
}
else if ( next_year > latest_year ) {
holiday_list_div.innerHTML += '<p>See holidays for <a href="?year=' + prev_year + '">' + prev_year + '</a>.</p>';
}
else {
holiday_list_div.innerHTML += '<p>See holidays for <a href="?year=' + prev_year + '">' + prev_year + '</a> or <a href="?year=' + next_year + '">' + next_year + '</a>.</p>';
}
}
else {
// This will only be run if the current year is being shown and the current date is very late in the year.
holiday_list_div.innerHTML = '<p>There are no more holidays for <strong>' + start_date_obj.getFullYear() + '</strong>.</p>';
}
}
else {
holiday_list_div.innerHTML = '<p><em>There was an error retrieving the list of public holidays</em>.</p>'
}
}
xhttp.open( 'GET', holidays_url );
xhttp.send();
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment