"use strict";

!function(c,h,i,m,p){m=c.createElement(h),p=c.getElementsByTagName(h)[0],m.async=1,m.src=i,p.parentNode.insertBefore(m,p)}(document,"script","https://chimpstatic.com/mcjs-connected/js/users/f7d772573ec353c6ae7ca4aba/d415ec88a66087896c390023c.js");

let header = document.querySelector(".site-header");
let headerActive;
let navBlock = document.querySelector('.nav-block');
let headerHeight, navHeight, headerTopHeight;

let mobileToggle = document.getElementById('mobileToggle');
let menu = document.getElementById('mainMenu');
let mobileIcon = document.querySelector('.mobile-button .button-icon');

// Create a condition that targets viewports at least 1024px wide
const mediaQuery = window.matchMedia('(min-width: 1024px)');

function handleTabletChange(e) {
  // Check if the media query is true
  if (e.matches) {
    // Then log the following message to the console
    console.log('Media Query Matched!');
    headerHeight = header.offsetHeight;
    navHeight = navBlock.offsetHeight;
    headerTopHeight = headerHeight - navHeight;
    document.documentElement.style.setProperty('--header-height', headerHeight + 'px');
    document.documentElement.style.setProperty('--header-top-height', headerTopHeight + 'px');
    document.documentElement.style.setProperty('--nav-block-height', navHeight + 'px');
    headerActive = header.classList.contains('is-active');
    console.log('Header Height: ' + headerHeight + '\n' + 'Nav Height: ' + navHeight);
    if(headerActive) {
        mobileToggle.click();
    }
  } else {
    console.log('Screensize is smaller than media query.');
    headerHeight = header.offsetHeight;
    navHeight = navBlock.offsetHeight;
    headerTopHeight = headerHeight - navHeight;
    document.documentElement.style.setProperty('--header-height', headerHeight + 'px');
    document.documentElement.style.setProperty('--header-top-height', headerTopHeight + 'px');
    document.documentElement.style.setProperty('--nav-block-height', navHeight + 'px');
    headerActive = header.classList.contains('is-active');
    console.log('Header Height: ' + headerHeight + '\n' + 'Nav Height: ' + navHeight);
    if(headerActive) {
        mobileToggle.click();
    }
  }
}

// Register event listener
// mediaQuery.addListener(handleTabletChange);
mediaQuery.addEventListener('change', handleTabletChange);

// Initial check
handleTabletChange(mediaQuery);


// Hide Header on on scroll down
let didScroll = false;
let lastScrollTop = 0;
let delta = headerHeight;

$(window).scroll(function(event){
    didScroll = true;
    /* hasScrolled(); */
});

setInterval(function() {
    if (didScroll) {
        hasScrolled();
        didScroll = false;
    }
}, 150);

function hasScrolled() {
    let pageY = window.scrollY;
    let pageHeight = window.innerHeight;
    let documentHeight = document.documentElement.scrollHeight;
    
    // Make sure they scroll more than delta
    if(Math.abs(lastScrollTop - pageY) <= delta)
        return;

    if (pageY > lastScrollTop && pageY > headerHeight) {
        // Scroll Down
        console.log('UNPINNNED!!!!!!!');
        header.classList.remove('pinned');
        header.classList.add('unpinned');
        // reset target here
    } else {
        // Scroll Up
        // If did not scroll past the document (possible on mac)...
        if(Math.abs(pageY + pageHeight) <= documentHeight) { 
            header.classList.remove('unpinned');
            header.classList.add('pinned');
            // reset target here
        }
    }
    
    // Remove all pinning classes
    if (pageY <= headerHeight) {
        console.log('AT TOP!!!!!!!');
        header.classList.remove('pinned');
        header.classList.remove('unpinned');
        return;
    }
    
    lastScrollTop = pageY;
}

// Update custom side nav to match system generated side nav
let $contentWindow = $('#content-window');
let $sideNav = $('#side-nav');
let $sideNavTemplate = `
    

















<div class="side-nav"></div>
`;
let $sideNavUl = $('#side-nav-ul');
let $readingPane = $('#readingPane');
let pageTitle = $("#desktop-page-title").text();
let closeSideNav = `
    

















<div class="side-section side-callout">
    <button class="button subtle side-button expanded" type="button">
        <span class="button-icon fas fa-times" aria-hidden="true"></span>
        <span class="button-text">Close Navigation</span>
    </button>
</div>
`;

let sections = document.querySelectorAll('section[id]');
let sideItems = document.querySelectorAll('.side-item');


if($sideNav.length > 0) {
    $contentWindow.addClass('custom-side-nav');
    $sideNav.removeClass();
    $readingPane.removeClass();
    $sideNav.addClass('side-nav-container off-canvas');
    $readingPane.addClass('page-content');
    $sideNavUl.wrap($sideNavTemplate);
    $sideNav.detach().prependTo('.main > .section-content');
    $sideNavUl.addClass('side-section side-nav-list');
    $('.side-nav').prepend(closeSideNav);
    $('.side-nav-list li').addClass('side-item');
    $('.side-item > a').addClass('side-link');
    $('.side-item.has-secondary > ul, .side-item.has-secondary + ul').addClass('side-section secondary-menu');
    $('.secondary-menu > .side-item').addClass('secondary-item');
    $('.secondary-item > .side-link').addClass('secondary-link');
    // $('.body-container').css({'max-width': '100%', 'padding': '0'});

    function activeLink(li) {
        sideItems.forEach((item) => item.classList.remove('active'));
        li.classList.remove('active');
        li.classList.add('active');
    }

    sideItems.forEach((item) => item.addEventListener('a', 'click', function() {
        activeLink(item);
    }));

    // Side Nav
    window.onscroll = () => {
        let sticky = $('.side-nav');
        let pageY = window.scrollY;
        // let unpinned = $('.site-header:has(.unpinned)');
    
        if (pageY > headerHeight) {
            sticky.addClass('fixed');
        } else {
            sticky.removeClass('fixed');
        }
    
        sections.forEach(section => {
            let windowTop = window.scrollY;
            let sectionOffset = section.offsetTop;
            let sectionHeight = section.offsetHeight;
            let sectionId = section.getAttribute('id');
            let target = document.querySelector(`[href='#${sectionId}']`).parentElement;
    
            if (windowTop >= sectionOffset && windowTop < sectionOffset + sectionHeight) {
                activeLink(target);
            } else {
                target.classList.remove('active');
            }
        });
    };
} else {
    $('.item-side-nav').remove();
}



$(window).on('load', function(){
  $(".init").removeClass("init");
});

$(document).ready(function () {

    mobileToggle.addEventListener('click', function(){
        if (menu.classList.contains('is-active')) {
            this.setAttribute('aria-expanded', 'false');
            menu.classList.remove('is-active');
            mobileIcon.classList.remove('fa-times');
            mobileIcon.classList.add('fa-bars');
        } else {
            menu.classList.add('is-active'); 
            this.setAttribute('aria-expanded', 'true');
            mobileIcon.classList.remove('fa-bars');
            mobileIcon.classList.add('fa-times');
        }
    });

    // Update Copyright year
    let currentYear = new Date().getFullYear();
    $('#currentYear').text(currentYear);

    // Parse URL and split to make a class for body and set active nav items

    //let pageURL = window.location.href;
    let pathName = window.location.pathname;
    let siteSections = pathName.split('/');
    let sectionName = siteSections[1]; // First item is always an empty string, we want the first value;
    sectionName = sectionName.replace(/-/g, ' ');
    $('#mobile-page-title').text(sectionName);



    let pageClass = pathName.toLowerCase().split('/');
    let $body = $('body');
    let navArray = $(".site-nav-list li a").map(function (i, el) {
        return $(el).text().replace(/\s+/g, "-").toLowerCase();
    }).get();

    if (pathName === '/' || pathName === '/home' || pathName === '/iowa-farm-bureau') {
        $body.addClass('home');
    } else {
        for (let i = 0; i < pageClass.length; i++) {
            let currentPath = pageClass[i];
            let navIndex = navArray.indexOf(currentPath);

            $body.addClass(currentPath);

            if (currentPath != "" && navIndex != -1) {
                // switch (currentPath) {
                //     case 'news':
                //     currentPath = 'news-&-resources';
                //     $(".site-nav-list li").removeClass("active");
                //     break;
                //     default:
                // }

                $(".site-nav-list li").eq(navIndex).addClass("active");
            }
        }
    }

    if ($(".admin-navigation").length > 0) {
        $body.addClass("admin");
    }

    $('.login-button .button-icon').remove();
    $('.login-button').addClass('button');
    $('.contact-fb-state .address-line:first').addClass('line-name');
    $('.page-content .button').removeClass('tiny green');
    $('.side-nav .button').removeClass('tiny green').addClass('primary');
    $('.side-nav-list > div').detach().appendTo(".side-nav").removeClass().removeAttr('style').addClass('side-section side-callout');
    $('.side-callout > span').replaceWith(function(){
        let sideTitle = `
            

















<h2 class='side-title' />
        `;
        return $(sideTitle).append($(this).contents());
    });

    $('span.protected').addClass('protected-icon').removeClass('protected');

    $('.ra-img').addClass('thumbnail');

    $('.benefit-subtitle').remove();

    $('.fr-img-caption .fr-inner').addClass('caption');

    $("a:not([href^='javascript:'])").each(function() {
        var e = new RegExp("/" + window.location.host + "/");
        e.test(this.href) || "" == this.href || $(this).click(function(e) {
            e.preventDefault(), e.stopPropagation(), window.open(this.href, "_blank")
        })
    });

    $('a[href*="#"]:not([href="#"])').click(function() {
        $(".side-item").removeClass('active');
        $(this).parent("li").addClass("active");
    });

    $('.side-button').click(function() {
        $('#side-nav').toggleClass('is-open');
    });

    $('.article-details').removeClass('grid-x grid-margin-x');
    $('.article-details > div').removeClass('cell shrink');


    let $contentTables = $('.body-container table');
    let cellWidth = $contentTables.find('[width]');
    let tableResponsive = `

















<div class="table-responsive"></div>`;
    let tableHelpText = `

















<p class="help-text">
    <span class="fa-fw fas fa-arrows-left-right" aria-hidden="true"></span> Depending on your device this table may scroll horizontally.

















</p>`

    cellWidth.removeAttr('width');
    $contentTables.attr('width', '100%').wrap(tableResponsive);
    $('.table-responsive').after(tableHelpText);
    if (pathName === '/join') {
  $('label[for="accountSourceComments"]').text('HOW DID YOU HEAR ABOUT US? (example: Member Referral, FS Patronage, Insurance Agent)');
      }
  $('.fa-twitter').addClass('fa-x-twitter').removeClass('fa-twitter');
});