// Run ECMAScript in strict mode.
'use strict';

jQuery( () => {

	// Check if the post-type-hdsnav is on the page.
	if ( ! jQuery( 'body' ).hasClass( 'post-type-hdsnav' ) ) {

		// If the secondary navigation "usa-accordion__button" is clicked, change "aria-expanded" to
		// true and remove "hidden" from the "usa-nav__submenu" item directly beneath it.
		jQuery(document).on( 'click', '.hds-secondary-navigation .usa-accordion__button', function() {

			// Before we do this, we need to close any other open submenus.
			// Any submenu that is not this one, and is open, should be closed.
			jQuery( '.hds-secondary-navigation .usa-accordion__button' ).not(this).attr( 'aria-expanded', 'false' );
			jQuery( '.hds-secondary-navigation .usa-accordion__button' ).not(this).next().attr( 'hidden', 'hidden' );

			// Now we can open the submenu that was clicked.
			// Toggle this in case the menu is already open.
			jQuery( this ).attr( 'aria-expanded', function(index, attr) {
				return attr === 'true' ? 'false' : 'true';
			});

			jQuery( this ).next( '.usa-nav__submenu' ).attr( 'hidden', function(index, attr) {
				return attr === 'hidden' ? null : 'hidden';
			});
		});

		// Let's make sure the .hds-secondary-navigation-menu-items is hidden but set to flex.
		jQuery( '.hds-secondary-navigation-menu-items' ).attr( 'hidden', 'hidden' );

		// If the user clicks on the mobile secondary nav trigger, let's open the mobile nav.
		jQuery(document).on( 'click', '.hds-secondary-nav-mobile-button', function() {

			// Add an "is-active" class to both.
			jQuery( this ).toggleClass( 'hds-active' );
			jQuery( '.hds-secondary-navigation-menu-items' ).toggleClass( 'hds-active' );

			// Slide toggle the secondary nav track.
			jQuery( '.hds-secondary-navigation-menu-items' ).slideToggle(300);

			// Toggle the "hidden" attribute on the "hds-secondary-nav-mobile" class.
			jQuery( '.hds-secondary-navigation-menu-items' ).attr( 'hidden', function(index, attr) {
				return attr === 'hidden' ? null : 'hidden';
			});

			// Now, toggle the "hds-secondary-nav-mobile-button" class to aria-expanded.
			jQuery( '.hds-secondary-nav-mobile-button' ).attr( 'aria-expanded', function(index, attr) {
				return attr === 'true' ? 'false' : 'true';
			}
			);
		});
	}
});
;
/**
 * NASA Mission Countdown Clock
 * 
 * This script will take any element with the class {featured-mission-countdown} and look for attribute {date} with the format {M d, Y h:i e}
 * All matching dom elements will be turned into live mission countdowns
 */

'use strict';

//Setup a global array that will hold all of our countdown intervals so there's no local scope mission setIntervals
let allMissionCountdowns = [];
function initMissionCountdowns(){
	var $ = jQuery;
	//Clear any timers that have been added before and might take up background js usage
	allMissionCountdowns.forEach(function(item) {
		clearInterval(item);
	});
	allMissionCountdowns = [];

	//Foreach item that has this class, setup a mission countdown
	$('.featured-mission-countdown').each(function(){
		var dateTime = $(this).attr('date');
		var intervalHandle = createMissionCountdown($(this), dateTime);
		allMissionCountdowns.push(intervalHandle);
	});
}

const countdownEscapeHtml = (unsafe) => {
	return unsafe.replaceAll('&', '&').replaceAll('<', '<').replaceAll('>', '>').replaceAll('"', '"').replaceAll("'", ''');
}


function createMissionCountdown(element, dateTime){
	// Set the date we're counting down to
	var countDownDate = new Date(dateTime).getTime();

	//Render the clock immediatly
	renderMissionCountdown(element, countDownDate);
	// Update the count down every 1 second
	var intervalInstance = setInterval(function() {
		renderMissionCountdown(element, countDownDate, intervalInstance);
	}, 1000);
	return intervalInstance;
}

function renderMissionCountdown(element, countDownDate, intervalInstance = null){
	// Get today's date and time
	var now = new Date().getTime();

	// Find the distance between now and the count down date
	var distance = countDownDate - now;

	// Time calculations for days, hours, minutes and seconds
	var days = countdownEscapeHtml(Math.floor(distance / (1000 * 60 * 60 * 24)).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false}));
	var hours = countdownEscapeHtml(Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false}));
	var minutes = countdownEscapeHtml(Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false}));
	var seconds = countdownEscapeHtml(Math.floor((distance % (1000 * 60)) / 1000).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false}));

	// Display the result in the element with id="demo"
	var returnHtml = `<div class='countdown-item countdown-item-days'><div class='countdown-item-inner'><p>${days}</p><span class='label'>days</span></div></div><div class='countdown-item countdown-item-hours'><div class='countdown-item-inner'><p>${hours}</p><span class='label'>hrs</span></div></div><div class='countdown-item countdown-item-minutes'><div class='countdown-item-inner'><p>${minutes}</p><span class='label'>mins</span></div></div><div class='countdown-item countdown-item-seconds'><div class='countdown-item-inner'><p>${seconds}</p><span class='label'>secs</span></div></div>`;
	element.html(returnHtml);

	// If the count down is finished, remove the counter
	if (intervalInstance != null && distance < 0) {
		clearInterval(intervalInstance);
		element.hide();
	}
}


(function($) { 
	jQuery( () => {
		initMissionCountdowns($);
	});
})(jQuery);;