3-js edit

wm-secondary-js  edit

/atomic-docs/wm/js/wm-secondary-js.js

Copy
Edit
<!-- components/3-js/wm-secondary-js.php --> <p>/atomic-docs/wm/js/wm-secondary-js.js</p>
Copy
Copy
Edit
/* scss/3-js/_wm-secondary-js.scss */
Copy
Edit
// synced with Test and Prod 12-5-2022 NE /* ============================================================= VARIABLE SECTION #1: - Variables used in - bodyWidth - get the width of a viewport function adjustPageNav() DOMContentLoaded Resize Flex Slider Lightboxes - mobileView - if mobile is used as a device, true is assigned to it; otherwise, false. DOMContentLoaded Resize Lightboxes Directory Photo Grid ================================================================= */ var bodyWidth = viewport().width; var mobileView = true; /* ============================================================= FUNCTION viewport() - innerWidth returns width of window. - client finds the inner width and height of a window. ================================================================= */ function viewport() { var e = window, a = 'inner'; if (!('innerWidth' in window)) { a = 'client'; e = document.documentElement || document.body; } return { width: e[a + 'Width'], height: e[a + 'Height'] }; } /* ============================================================= FUNCTION getURLParam() - Get a URL parameter and return it ================================================================= */ function getURLParam(strParamName) { var strReturn = ""; var strHref = window.location.href; if (strHref.indexOf("?") > -1) { var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase(); var aQueryString = strQueryString.split("&"); for (var iParam = 0; iParam < aQueryString.length; iParam++) { if (aQueryString[iParam].indexOf(strParamName + "=") > -1) { var aParam = aQueryString[iParam].split("="); strReturn = aParam[1]; break; } } } return strReturn; } function adjustContentHeight() { // if (bodyWidth >= 720) { // maxColHeight = $("#main").height(); // if ($("#page_nav").length > 0) { // maxColHeight = $("#page_nav").height(); // } // if (bodyWidth > 999) { // // adjust main content height if sidebar is longer // if ($("#sidebar").length > 0) { // if ($("#sidebar").height() > maxColHeight) { // maxColHeight = $("#sidebar").height(); // } // } // } // if (maxColHeight > $("#main").height()) { // $('#main').css('min-height',maxColHeight); // //$('#main').animate({ height: maxColHeight }, 700); // } else { // $('#main').height("auto"); // if (bodyWidth < 1000) { // if right column is under main // if ($("#main").height() > $("#page_nav").height()) { // and main is taller than page nav // $('#main').css('min-height',''); // turn off min-height // } // } // } // } else { // $('#main').css('min-height',''); // $('#main').height("auto"); // } } function pageNavBackCompatibility() { // $("#page_nav h4").css("font-size", "18px"); // $("#page_nav h4").css("line-height", "1.5em"); // $("#page_nav h4").css("margin-bottom", "15px"); // $("#qn_sitemenu a[href='#site_menu']").css("padding", "15px 0"); // $("#qn_sitemenu a[href='#site_menu']").css("display", "block"); // $("#qn_sitemenu a[href='#site_menu']").css("text-align", "center"); // $("#qn_sitemenu a[href='#site_menu']").css("background-color", "#d0d3d4"); // $("#qn_sitemenu a[href='#site_menu']").css("text-transform", "uppercase"); // $("#qn_sitemenu a[href='#site_menu']").css("margin", "0 !important"); // $("#qn_sitemenu a[href='#site_menu']").css("font-size", "14px"); // $("#qn_sitemenu").css("border-bottom", "none"); // $("#qn_sitemenu").css("margin-top", "15px"); // $("#page_nav").removeClass("open").removeClass("closed"); // $("#page_nav").css("background-color", "transparent"); // $("#page_nav").css("left","10px"); // $("#page_nav").height("auto !important"); // if (!mobileView) { // $("#page_nav h4").hide(); // } else { // $("#page_nav h4").show(); // } } /* ============================================================= FUNCTION adjustPageNav() - If body width is greater than 930, adjust page navigation's height; otherwise, set content's minimum height as zero. ================================================================= */ function adjustPageNav() { // this variable should match the $maincontent-bottom-spacing // found in wm_spacing.scss var maincontent_bottom_spacing = 44; var initcontent = document.getElementById("content"); if (initcontent) { if (bodyWidth > 930) { var pagenav = document.querySelector(".page_nav"); if (pagenav) { var pagenavheight = pagenav.offsetHeight; document.getElementById("content").style.minHeight = pagenavheight + maincontent_bottom_spacing + "px"; } } else { initcontent.style.minHeight = 0; } } // var pageNav = document.getElementById("page_nav"); // var mobileBtn = document.getElementById("qn_sitemenu"); // var pageLinks = document.querySelectorAll(".wm-page_menu"); // mobileBtn.addEventListener("click", function(e) { // e.preventDefault(); // if (pageNav.classList.contains("open")) { // pageNav.classList.remove("open"); // } else { // pageNav.classList.add("open"); // } // return false; // }); // if (($('#qn_sitemenu').css('display') != 'none') && // (!$('#page_nav').hasClass('open'))) { // if on mobile and nav isn't already opened manually, close it // $('#page_nav').addClass('closed'); // $("#page_nav").height($("#page_nav").css("min-height")); // } // if ($("#page_nav h4").length > 0) { // pageNavBackCompatibility(); // } } /* ============================================================= FUNCTION loadWPStories() - Load WP stories in news listings - Conditionally import load external news ltems JS FILE - https://javascript.info/modules-dynamic-imports ================================================================= */ // <![CDATA[ async function loadWPStories() { let { default: newslistmodule } = await import("./modules/news.wm.edu-list-items.js"); newslistmodule(); } if (document.querySelector("*[data-wpsrc^='http']")) { loadWPStories(); } // ]]> /* ============================================================= FUNCTION adjustContentButtonArrows() - Depending on the number of lines, adjust the content buttons in order to vertically center the arrow ================================================================= */ function adjustContentButtonArrows() { // for multi-line content buttons, adjust so the arrow is vertically centered $(".content_button_with_arrow").each(function () { var buttonItem = this; if ($(this).children("a").length > 0) { buttonItem = $(this).children("a").first(); } if ($(buttonItem).find('span').length == 0) { $(buttonItem).append('<span class="fa fa-angle-right" aria-hidden="true"></span>'); } var buttonArrowIcon = $(buttonItem).find('span'); // single line - 18px, 2 line - 36px, 3 line - 50px if ($(buttonItem).height() > 36) { // three lines $(buttonArrowIcon).css('top', '32%'); } else if ($(buttonItem).height() > 18) { // two lines $(buttonArrowIcon).css('top', '28%'); } else { $(buttonArrowIcon).css('top', '23%'); } }); } /* ============================================================= FUNCTION applyCollapsibleStyle() - Collapse tables to display content ================================================================= */ function applyCollapsibleStyle() { if ($("table.collapsible").hasClass('tablespecial')) { // remove tablespecial formatting $("table.collapsible").removeClass('tablespecial'); } $("table.collapsible").removeAttr("border"); // remove any borders $("table.collapsible").css("border", "none").css("border-color", "#ffffff"); $("table.collapsible tr").css("border", "none").css("border-color", "#ffffff"); $("table.collapsible td").css("border", "none").css("border-color", "#ffffff"); $("table.collapsible tr td").each(function (index) { if ($(this).closest("table").hasClass("collapsible")) { var headerNode = null; var myId = 'collapsible-' + index; $(this).children().each(function () { if ($(this).is(":first-child")) { if (($(this).is("h5") || $(this).is("h6")) && headerNode == null) { // $(this).wrapInner("<span></span>"); // $(this).prepend('<i class="fas fa-caret-right" />'); $(this).wrapInner('<button class="collapsible_title_text" aria-expanded="false" aria-controls="' + myId + '"></button>'); headerNode = $(this).addClass("collapsible_title").detach(); } // removed when updating heading style and spacing, Mar 2021 // else if ($(this).is("h6")) { // $(this).css("margin-top", "1.2em"); // } } if ($(this).is(":last-child")) { if ($(this).is("p") || $(this).is("ol") || $(this).is("ul")) { // do nothing } else { $(this).parent().addClass("extra-space"); } } }); $(this).wrapInner('<div class="collapsible_content" id="' + myId + '"></div>'); $(".collapsible_content").attr("aria-hidden", "true"); if (headerNode != null) { $(this).children(".collapsible_content").before(headerNode); } } }); $(".collapsible_title_text").mousedown(function () { $(this).removeClass('key-focus'); }); $(".collapsible_title_text").keyup(function () { $(this).addClass('key-focus'); }); $(".collapsible_title_text").click(function () { if ($(this).parent('.collapsible_title').hasClass("open")) { $(this).parent('.collapsible_title').removeClass("open"); $(this).parent('.collapsible_title').siblings('.collapsible_content').slideUp(300, function () { adjustContentHeight(); $(this).attr("aria-hidden", "true"); }); $(this).attr("aria-expanded", "false"); } else { $(this).parent('.collapsible_title').addClass("open"); $(this).parent('.collapsible_title').siblings('.collapsible_content').slideUp(0, function () { $(this).attr("aria-hidden", "false"); $(this).slideDown(300, function () { adjustContentHeight(); if ($(".content_button_with_arrow").length > 0) { adjustContentButtonArrows(); } }); }); $(this).attr("aria-expanded", "true"); // add scrolltip if tablespecial is found. $(this) .parent(".collapsible_title") .siblings(".collapsible_content") .find(".tablewrap") .each(function () { var div = this; var mytable = $(this).find("table"); if (div.scrollWidth > div.clientWidth) { mytable.css({ "margin-top": "1.4em", "max-width": "100%" }); $(this).find(".scroll-message").show(); } else { $(this).find(".scroll-message").hide(); mytable.css("margin-top", ""); } }); } }); $("table.collapsible").css("display", "table"); // show table after all modifications have been made } /* ============================================================= FUNCTION DisableVertScroll() - Lightbox: disable the keyboard up/down arrows and pageup/pagedown ================================================================= */ var DisableVertScroll = function (e) { var vertscroll_ar = new Array(40, 38, 34, 33); if ($.inArray(e.keyCode, vertscroll_ar) >= 0) { e.preventDefault(); } }; /* ============================================================= addEventListener DOMContentLoaded - Changed to vanilla js because for whatever reason the jQuery document.ready is not working for content row previews ================================================================= */ //$(document).ready(function(){ document.addEventListener("DOMContentLoaded", function () { if (bodyWidth < 650) { mobileView = true; } else { mobileView = false; } /* ============================================================= addEventListener DOMContentLoaded - adjusts min-height of page based on height of page nav ================================================================= */ adjustPageNav(); /* ============================================================= addEventListener DOMContentLoaded - On people pages, darken banner image on scroll - This animation performance optimization using requestAnimationFrame is based on - https://www.html5rocks.com/en/tutorials/speed/animations/ ================================================================= */ if (document.querySelector('.m-header.-tall.-text-bl .m-header__photo')) { // wait until image is loaded before adding black background // otherwise it's just a big black rectangle while waiting for the image to load. // Because it's a background image we need to load the image in a // js placeholder image so the load event can fire var imgUrlSrc = document.querySelector('.m-header.-tall .m-header__photo').style.backgroundImage; var imgUrl = imgUrlSrc.match(/\((.*?)\)/)[1].replace(/('|")/g, ''); let placeholderImg = document.createElement("img"); placeholderImg.addEventListener('load', (e) => { document.querySelector(".m-header.-tall").style.backgroundColor = "black"; // Listen for scroll events and call function that calls function lol window.addEventListener('scroll', onScroll, false); placeholderImg = null; }); placeholderImg.src = imgUrl; } // else if (document.querySelector('.m-header.-tall')) { // document.querySelector('.m-title-card').style.opacity = 1; // } /* ============================================================= addEventListener DOMContentLoaded - Set base variables for scroll event ================================================================= */ var lastScrollY = 0, ticking = false; /* ============================================================= FUNCTION onScroll() - onScroll() function keeps track of scroll value - called by scroll event listener down below - requestTick runs on scroll which calls update function ================================================================= */ function onScroll() { lastScrollY = window.scrollY; requestTick(); } /* ============================================================= FUNCTION requestTick() - requestTick() function calls rAF (which calls our update function) if it's not already been done ================================================================= */ function requestTick() { if (!ticking) { requestAnimationFrame(fadeOnScroll); ticking = true; } } /* ============================================================= FUNCTION fadeOnScroll() - Reduce opacity of an element based on scroll height and start height best used for small areas of the screen due to performance issues - @param {string} el - @param {number} fulltransparencyHeight - @param {number} maxblur in pixels - @return {void} Nothing ================================================================= */ function fadeOnScroll() { var currentScroll = lastScrollY, el = ".m-header.-tall .m-header__photo", maxtransparency = .3, fulltransparencyHeight = 900; if (currentScroll <= fulltransparencyHeight && (1 - currentScroll / fulltransparencyHeight) > maxtransparency) { opacity = 1 - currentScroll / fulltransparencyHeight; } else { opacity = maxtransparency; } document.querySelector(el).style.opacity = opacity; // allow further rAFs to be called ticking = false; } /* ============================================================= addEventListener DOMContentLoaded - Find links with long url text and allow to break ================================================================= */ var all_links = document.querySelectorAll("a"); for (let i = 0; i < all_links.length; i++) { const link = all_links[i]; if (link.text.match("http://") != null || link.text.match("https://") != null) { link.classList.add("long-url"); } } /* ============================================================= addEventListener DOMContentLoaded - Fix for mobile vh issues - Custom variables in: banner.scss - Only apply if there's a tall banner - St the value in the --vh custom property to the root of the document ================================================================= */ if (document.querySelector(".m-header.-tall") && document.querySelector("html").classList.contains("touch")) { let vh = window.innerHeight * 0.01; document.documentElement.style.setProperty("--vh", vh + "px"); } // DigitalDFAS 2021 (Please don't remove) if ($("figure.desktop").length > 0) { //$("figure.desktop").wrap('<a class="ddfas-desktop" aria-label="Meet Your Tribe" href="https://www.wm.edu/admission/undergraduateadmission/welcome/visit/ddfas/meet-your-tribe/index.php"></a>'); $("figure.desktop").each(function () { var myurl = $(this).data("url"); $(this).wrap('<a class="ddfas-desktop" href="' + myurl + '"></a>'); }); } if ($("figure.mobile").length > 0) { //$("figure.mobile").wrap('<a class="ddfas-mobile" aria-label="Meet Your Tribe" href="https://www.wm.edu/admission/undergraduateadmission/welcome/visit/ddfas/meet-your-tribe/index.php"></a>'); $("figure.mobile").each(function () { var myurl = $(this).data("url"); $(this).wrap('<a class="ddfas-mobile" href="' + myurl + '"></a>'); }); } /* ============================================================= addEventListener DOMContentLoaded - Page Menu: duplicate page nav into user_content for mobile view - If there is no menu content just delete the button ================================================================= */ var page_nav = document.querySelector(".page_nav"); if (page_nav != null) { var page_nav_button = document.getElementById("qn_sitemenu"); var wm_page_menu = document.querySelector('.wm-page_menu'); var social_media_nav = document.querySelector('.social-media-nav'); var extra_nav_empty = document.querySelector(".extra-nav.empty"); if ((wm_page_menu && wm_page_menu.innerHTML.trim() == "") && !social_media_nav && extra_nav_empty) { page_nav.removeChild(page_nav_button); } // else clone // else { // var mobile_page_nav = page_nav.cloneNode(true); // mobile_page_nav.id = "page_nav_mobile"; // for button aria-controls // // insert after header.m-title or before .directory // var headerTitle = document.querySelector("header.m-title"); // var directoryHeader = document.querySelector(".directory"); // if (headerTitle != null && directoryHeader == null) { // referenceNode = headerTitle; // referenceNode.parentNode.insertBefore( // mobile_page_nav, // referenceNode.nextSibling // ); // if (page_nav_button) { // page_nav.removeChild(page_nav_button); // } else { // console.log("Can't remove page_nav_button it's: " + page_nav_button); // } // } // if (directoryHeader != null) { // referenceNode = directoryHeader; // referenceNode.parentNode.insertBefore(mobile_page_nav, referenceNode); // if (page_nav_button) { // page_nav.removeChild(page_nav_button); // } else { // console.log("Can't remove page_nav_button it's: " + page_nav_button); // } // } // } } var mobileBtn = document.getElementById("qn_sitemenu"); var pageLinks = document.querySelectorAll(".wm-page_menu"); if (mobileBtn) { var contentPageNav = mobileBtn.parentElement; mobileBtn.addEventListener("click", function (e) { e.preventDefault(); if (contentPageNav.classList.contains("open")) { contentPageNav.classList.remove("open"); mobileBtn.setAttribute("aria-expanded", "false"); } else { contentPageNav.classList.add("open"); mobileBtn.setAttribute("aria-expanded", "true"); } return false; }); } /* ============================================================= addEventListener DOMContentLoaded - A&S Department Dropdown: chosen is a jQuery plugin ================================================================= */ if ($(".departmentDropdownMenu").length > 0) { if ($("html").hasClass("no-touch")) { $(".departmentDropdownMenu option:first").html(""); $(".departmentDropdownMenu").chosen({ disable_search: true }); } $(".departmentDropdownMenu").change(function () { window.location.href = $( ".departmentDropdownMenu option:selected" ).attr("value"); }); } /* ============================================================= addEventListener DOMContentLoaded - hide .extra-navs with no children - add observer to page nav divs and run adjustPageNav() again when the a div size changes (this can happen when custom fonts finish) ================================================================= */ // hide .extra-navs with no children var extranav = document.querySelectorAll(".extra-nav"); if (extranav.length > 0) { for (let i = 0; i < extranav.length; i++) { const el = extranav[i]; var children = el.children; if (children.length == 0) { var className = "empty"; if (el.classList) { el.classList.add(className); } else if (!hasClass(el, className)) { el.className += " " + className; } } } adjustPageNav(); } // add observer to page nav divs and run adjustPageNav() again when the a div size changes (this can happen when custom fonts finish) const myObserver = new ResizeObserver(entries => { entries.forEach(entry => { adjustPageNav(); }); }); const pmenu = document.querySelector('.wm-page_menu'); const smnav = document.querySelector('.social-media-nav'); const enav = document.querySelector('.extra-nav'); if (pmenu) { myObserver.observe(pmenu); } if (smnav) { myObserver.observe(smnav); } if (enav) { myObserver.observe(enav); } /* ============================================================= addEventListener DOMContentLoaded - Popup media - TODO: DELETE THIS WHEN POPUP PAGES HAVE BEEN CLEANED OUT ================================================================= */ var myfcn = "window.open(this.href,'mediawindow','resizable=yes,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,fullscreen=no,dependent=no,width=450,height=430,status');return false"; $('a[href$="#popup"]').attr('onclick', myfcn); /*** Page layout adjustments ***/ /*** Collapse page nav on mobile ***/ // if ($('#page_nav').length > 0) { // if ($("#page_nav h4").length > 0) { // pageNavBackCompatibility(); // } else { // $("#page_nav").css('max-height', $("#page_nav").height()); // if ( $('#qn_sitemenu').css('display') != 'none') { // $('#page_nav').addClass('closed'); // $("#page_nav").height($("#page_nav").css("min-height")); // } else { // include space for the quick nav button on mobile (if on desktop to start) // $("#page_nav").css('max-height', $("#page_nav").height() + parseInt($("#page_nav").css("min-height"))); // } // $("#qn_sitemenu").click(function(){ // if ($("#page_nav").hasClass('closed')) { // $("#page_nav").removeClass('closed'); // $("#page_nav").addClass('open'); // $("#page_nav").height($("#page_nav").css("max-height")); // } else { // $("#page_nav").removeClass("open"); // $("#page_nav").addClass("closed"); // $("#page_nav").height($("#page_nav").css("min-height")); // } // }); // } // } /* ============================================================= addEventListener DOMContentLoaded - Hide the sidebar if needed ================================================================= */ if ($('input:hidden[name="hasSidebar"]').val() == "N") { $('#sidebar').remove(); $('#main_content').removeClass('hasSidebar'); // make user content on grid page narrower if no sidebar var content = document.getElementById("content"); var userContent = document.querySelectorAll(".user_content"); var grid = document.querySelectorAll(".grid"); // if (grid.length != 0) { // content.style.display = "block"; // userContent[0].style.maxWidth = "720px"; // userContent[0].style.flex = "1 1 100%"; // userContent[0].style.paddingRight = "0"; // } } /* ============================================================= addEventListener DOMContentLoaded - Secondary page search toggle ================================================================= */ $("#search_site .search_site_submit").on('click', function (e) { if ($("#search_site").hasClass("open")) { $("#search_site").submit(); } else { $("#search_site").addClass("open"); setTimeout(function () { $("#search_site #q").focus(); }, 500); } e.preventDefault(); return false; }); $("#search_site .search_site_close").on('click', function (e) { e.preventDefault(); $("#search_site").removeClass("open"); return false; }); /* ============================================================= addEventListener DOMContentLoaded - Adjust scroll for #anchor tag LINKS - If URL has hash ================================================================= */ if (location.hash) { if (navigator.userAgent.match(/firefox/i)) { /* scroll to anchor (Firefox is missing it if direct linking to an anchor from another page) */ var anc = location.href; var cleanhash = anc.substr(anc.indexOf("#") + 1); var target = $('[name="' + cleanhash + '"],[id="' + cleanhash + '"]'); if (target.length) { $("html,body").animate( { scrollTop: target.offset().top - 10, }, 0, "linear" ); } } else { var term = $(window.location.hash); var linkElem = $(term); var navHeight = $(".wm-topbar").outerHeight() + 30; setTimeout(function () { window.scrollTo(0, linkElem.offset().top - navHeight); }, 700); } } /* ============================================================= addEventListener DOMContentLoaded - Preventing default click on links with an anchor ================================================================= */ $('a[href^="#"]:not([class*="fancybox"]):not([class^="wm-topbar"])').click( function (e) { e.preventDefault(); var navHeight = $(".wm-topbar").outerHeight() + 30; var cleanhash = this.href.substr(this.href.indexOf("#") + 1); var target = $('[name="' + cleanhash + '"],[id="' + cleanhash + '"]'); var term = $(target); if (term.length) { var scrollto = term.offset().top - navHeight; speed = 450; window.history.pushState("#test", "", "#" + cleanhash); $("html, body").animate({ scrollTop: scrollto }, speed); } } ); /* ============================================================= addEventListener DOMContentLoaded - Handle SVGs ================================================================= */ if ($(".no-svg").length != 0) { $("img[src$='.svg']").each(function () { origSrc = $(this).attr("src"); $(this).attr("src", origSrc.replace("svg", "png")); }); } /* ============================================================= addEventListener DOMContentLoaded - Adjust arrow position on content buttons if two lines ================================================================= */ if ($(".content_button_with_arrow").length > 0) { adjustContentButtonArrows(); } if ($(".extra-nav-button").length > 0) { $(".extra-nav-button").each(function () { // single line - 18px, 2 line - 36px, 3 line - 50px var buttonArrowIcon = $(this).find('span'); if ($(this).height() > 36) { // three lines $(buttonArrowIcon).css('top', '32%'); } else if ($(this).height() > 18) { // two lines $(buttonArrowIcon).css('top', '28%'); } else { $(buttonArrowIcon).css('top', '23%'); } }); } /* ============================================================= addEventListener DOMContentLoaded - Emergency alert styling ================================================================= */ if ($(".user_content .emergency").length > 0) { $(".user_content .emergency").last().css("border-bottom", "2px solid #8f0614").css("margin-bottom", "20px").css("padding-bottom", "20px"); $(".user_content .emergency").first().css("border-top", "2px solid #8f0614"); } /* ============================================================= addEventListener DOMContentLoaded - Setcopyright year in footer ================================================================= */ $("#footercopyyear").text((new Date).getFullYear()); // TR FORMS, HANDLE MORE INFO LINKS if ($("div[id$='_more_js']").length > 0) { // close "more info boxes" $("div[id$='_more_js']").hide(); $("a[id$='_more_trigger']").click(function () { // get connected more_js box var arr = $(this).attr('id').split('_'); var moreid = 'q_' + arr[1] + '_more_js'; $("div[id=" + moreid + "]").slideToggle("fast"); return false; }); } /* ============================================================= addEventListener DOMContentLoaded - Captioned Images - an attempt to convert this to plain js is below. - it lead to an odd bug in Chrome and Firefox - where 1/10 times the captions wouldn't be applied ================================================================= */ var wysiwygImgArray = new Array( 'centerwithcaption', 'rightwithcaption', 'leftwithcaption', 'photowithcaption' ); wysiwygImgArray.forEach(imageClass => { var thisImage = $("img." + imageClass); if (thisImage.length > 0) { thisImage.imagesLoaded(function () { thisImage.each(function () { // use html defined width on image if available, // otherwise use actual width of image var myWidth = $(this).attr('width') ? $(this).attr('width') : $(this).prop("naturalWidth"); /* Check for tags in alt text */ var oldAlt = $(this).attr("alt"); var newAlt = oldAlt; newAlt = newAlt.replace(/\{(\/?)em\}/g, "<$1em>"); newAlt = newAlt.replace(/\{(\/?)strong\}/g, "<$1strong>"); newAlt = newAlt.replace(/\{br\/?\}/g, "<br/>"); $(this) .wrap('<figure class="' + imageClass + '-wrapper"></figure>') .after("<figcaption>" + newAlt + "</figcaption>"); // max-width is fallback for older browsers $(this).parent("figure").css("max-width", "100%"); $(this).parent("figure").css("width", "min(100%," + myWidth + "px)"); // remove left/right margins on wide images myWidth > 830 ? $(this).parent("figure").css("margin-left", "0") : null; myWidth > 830 ? $(this).parent("figure").css("margin-right", "0") : null; }); }); } }); /* ============================================================= addEventListener DOMContentLoaded - Google Analytics link tracking (documents and external links) ================================================================= */ if (typeof pageTracker !== "undefined") { $("a[href*='.pdf']").addClass("document-link"); $("a[href*='.txt']").addClass("document-link"); $("a[href*='.csv']").addClass("document-link"); $("a[href*='.doc'], a[href*='.docx']").addClass("document-link"); $("a[href*='.ppt'], a[href*='.pptx']").addClass("document-link"); $("a[href*='.xls'], a[href*='.xlsx']").addClass("document-link"); $(".document-link").click(function () { pageTracker._trackEvent('Document Link', this.href, $(this).html()); }); $(".external-link").click(function () { pageTracker._trackEvent('External Link', this.href, $(this).html()); }); } // /* RRSSB email popup */ // // Google Analytics link tracking // myhostname = window.location.hostname; // if(!myhostname.match(/^cascade/) && !myhostname.match(/tst\.wm\.edu/)) { // // ***** In Google Tag Manager ****/ // // Footer - Social Links // // For the Bold ribbon/button // // Footer - Contact Area (wordmark and "contact us") // // Mobile Header - logo, menu and search buttons // // Main Logo (desktop) // // Homepage - Events // // Homepage - Right Now // // Homepage - Blogs // // Homepage - Featuring // // Homepage - News // // Homepage - Slideshow // // Homepage - pagination clicks // // Main content - external link (anything not www.wm.edu) // // Share buttons - Facebook, Twitter, LinkedIn, G+ NOT email since we need to do extra stuff and prevent click default event // // Documents and External Links // // Tactical Nav Links // // Global Nav Links // // Side Menu - Tactical Nav // // Side Menu - Global Nav // // Footer - Audience Links // // Footer - General Links // // Admission Nav // // Visit Nav // // Gateways // // Share Button - Email // $('.rrssb-email a').on('click', function(e) { // // popup share.wm.edu // e.preventDefault(); // var NWin = window.open($(this).attr("href"),'emailshare','resizable=yes,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,fullscreen=no,dependent=no,width=525,height=720,status'); // if (window.focus){ // NWin.focus(); // } // try { // if (typeof(pageTracker) !== undefined) { // pageTracker._trackEvent('Share', 'Email', document.title); // } else if (typeof(ga) !== undefined) { // ga('send', 'event', 'Share', 'Email', document.title); // } // } catch (e) { // // was a ReferenceError, either pageTracker or ga not defined. // } // }); // } // end if not in a Cascade instance /* ============================================================= addEventListener DOMContentLoaded - Subsite Search - append the specified subsite URL to the search query ================================================================= */ if ($("#search_cascade_subsite").length > 0) { $("#search_cascade_subsite").submit(function () { if ($("#search_cascade_subsite input[name='subsite']").val() != "") { $("#search_cascade_subsite input[name='q']").val($("#search_cascade_subsite input[name='q']").val() + " site:" + $("#search_cascade_subsite input[name='subsite']").val()); } }); $("#search_cascade_subsite input[name='q']").blur(function () { if ($(this).val() == "") { $(this).val("Search this site"); } }); $("#search_cascade_subsite input[name='q']").focus(function () { if ($(this).val() == "Search this site") { $(this).val(""); } }); } /* ============================================================= addEventListener DOMContentLoaded - BxSlider ================================================================= */ var buttonTopMargin = 4; // code for new classes May 2021 - Nissa if ($(".js-bxslider-widget").length > 0) { $(".js-bxslider-widget").imagesLoaded(function () { $(".js-bxslider-widget").each(function () { var oneSlider = $(this).children().length < 2; if (oneSlider) { $(this).addClass("no-controls"); } var slider = $(this).bxSlider({ mode: "fade", pager: false, adaptiveHeight: true, randomStart: true, nextText: '<i class="fa fa-chevron-right" aria-hidden="true"></i><span class="visuallyhidden">Next</span>', prevText: '<i class="fa fa-chevron-left" aria-hidden="true"></i><span class="visuallyhidden">Previous</span>', touchEnabled: false, //(!oneSlider), controls: !oneSlider, onSliderLoad: function () { $(this).find("li a").attr("tabindex", "-1"); $(this) .find('li[aria-hidden="false"] a') .not(".notab") .removeAttr("tabindex"); imageHeight = $(this) .find('li[aria-hidden="false"]') .find("img") .height(); thisWrapper = $(this).closest(".bx-wrapper"); // if YouTube and hasn't loaded yet if (!imageHeight || imageHeight == 0) { imageHeight = 200; } thisWrapper .find(".bx-controls-direction") .css("top", imageHeight + buttonTopMargin + "px"); }, onSlideAfter: function () { $(this).find("li a").attr("tabindex", "-1"); $(this) .find('li[aria-hidden="false"] a') .not(".notab") .removeAttr("tabindex"); imageHeight = $(this) .find('li[aria-hidden="false"]') .find("img") .height(); // if no image height, set height for video if (!imageHeight || imageHeight == 0) { imageHeight = 200; } thisWrapper = $(this).closest(".bx-wrapper"); thisWrapper .find(".bx-controls-direction") .css("top", imageHeight + buttonTopMargin + "px"); } }); // add swipe using TouchSwipe in plugins.js, since BxSLider's touchEnabled setting is buggy in Chrome $(this).swipe({ swipeLeft: function (e, direction, distance, duration, fingerCount) { e.stopPropagation(); slider.goToNextSlide(); return false; }, swipeRight: function (e, direction, distance, duration, fingerCount) { e.stopPropagation(); slider.goToPrevSlide(); return false; } }); }); }); } // code for old classes (remove after class changes are up on Production) if ($(".bxslider-widget").length > 0) { $(".bxslider-widget").imagesLoaded(function () { $(".bxslider-widget").each(function () { var oneSlider = $(this).children().length < 2; if (oneSlider) { $(this).addClass("no-controls"); } var slider = $(this).bxSlider({ mode: "fade", pager: false, adaptiveHeight: true, randomStart: true, nextText: '<i class="fa fa-chevron-right" aria-hidden="true"></i><span class="visuallyhidden">Next</span>', prevText: '<i class="fa fa-chevron-left" aria-hidden="true"></i><span class="visuallyhidden">Previous</span>', touchEnabled: false, //(!oneSlider), controls: !oneSlider, onSliderLoad: function () { $(this).find("li a").attr("tabindex", "-1"); $(this) .find('li[aria-hidden="false"] a') .not(".notab") .removeAttr("tabindex"); imageHeight = $(this) .find('li[aria-hidden="false"]') .find("img") .height(); thisWrapper = $(this).closest(".bx-wrapper"); // if YouTube and hasn't loaded yet if (!imageHeight || imageHeight == 0) { imageHeight = 200; } thisWrapper .find(".bx-controls-direction") .css("top", imageHeight + buttonTopMargin + "px"); }, onSlideAfter: function () { $(this).find("li a").attr("tabindex", "-1"); $(this) .find('li[aria-hidden="false"] a') .not(".notab") .removeAttr("tabindex"); imageHeight = $(this) .find('li[aria-hidden="false"]') .find("img") .height(); // if no image height, set height for video if (!imageHeight || imageHeight == 0) { imageHeight = 200; } thisWrapper = $(this).closest(".bx-wrapper"); thisWrapper .find(".bx-controls-direction") .css("top", imageHeight + buttonTopMargin + "px"); }, }); // add swipe using TouchSwipe in plugins.js, since BxSLider's touchEnabled setting is buggy in Chrome $(this).swipe({ swipeLeft: function (e, direction, distance, duration, fingerCount) { e.stopPropagation(); slider.goToNextSlide(); return false; }, swipeRight: function (e, direction, distance, duration, fingerCount) { e.stopPropagation(); slider.goToPrevSlide(); return false; }, }); }); }); } /* ============================================================= addEventListener DOMContentLoaded - Flex Slider ================================================================= */ /** Flex Slider **/ if ($('#sidebar .widget.flexslider').length > 0) { $('#sidebar .widget.flexslider').imagesLoaded(function () { $('#sidebar .widget.flexslider').flexslider({ slideshow: false, controlNav: false, animation: "fade", randomize: true, start: function (slider) { // remove the # from button href $('.widget .flex-prev, .widget .flex-next').attr('href', ''); // widget title height plus 2px padding titleHeight = slider.container.prev("h4").height(); if (titleHeight == null) { titleHeight = 17; } else { titleHeight = titleHeight + 2; } slider.animate({ "height": slider.slides.eq(slider.currentSlide).height() + titleHeight }, 0); dirNavContainer = slider.directionNav.parents(".flex-direction-nav"); slideEltHeight = slider.slides.eq(slider.currentSlide).find("img").height(); // If there isn't an image, it's a YouTube embed if (slideEltHeight == 0 || slideEltHeight == null) { slideEltHeight = 165; // height of YouTube embed // if the video isn't loaded yet (no iframe), allow for enough space to accomodate it videoSlideEltHeight = slider.slides.eq(slider.currentSlide).find("iframe").height(); if (videoSlideEltHeight == 0 || videoSlideEltHeight == null) { // account for height of widget title +35 to account for height of navigation plus YouTube embed and caption height slider.animate({ "height": slider.slides.eq(slider.currentSlide).height() + slideEltHeight + titleHeight + 35 }, 0); } } // place navigation at height of media + widget title and + 9 to add some spacing away from bottom of image or video dirNavContainer.animate({ "top": (slideEltHeight + titleHeight + 9) }, 0); if (bodyWidth < 510) { dirNavContainer.css("left", ((slider.outerWidth() - 240) / 2)); } else if (bodyWidth > 999) { // adjust main content height if sidebar after going to new slide is taller adjustContentHeight(); } }, before: function (slider) { // widget title height plus 2px padding titleHeight = slider.container.prev("h4").height(); if (titleHeight == null) { titleHeight = 17; } else { titleHeight = titleHeight + 2; } slider.animate({ "height": slider.slides.eq(slider.animatingTo).height() + titleHeight }, 600); dirNavContainer = slider.directionNav.parents(".flex-direction-nav"); slideEltHeight = slider.slides.eq(slider.animatingTo).find("img").height(); if (slideEltHeight == 0 || slideEltHeight == null) { slideEltHeight = 165; // height of YouTube embed var ytPlayerId = slider.slides.eq(slider.currentSlide).find("iframe").attr("id"); $("#" + ytPlayerId)[0].contentWindow.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}', '*'); } // place navigation at height of media + widget title and + 9 to add some spacing away from bottom of image or video dirNavContainer.animate({ "top": (slideEltHeight + titleHeight + 9) }, 600); }, after: function (slider) { if (bodyWidth < 510) { dirNavContainer = slider.directionNav.parents(".flex-direction-nav"); dirNavContainer.css("left", ((slider.outerWidth() - 240) / 2)); } else if (bodyWidth > 999) { // adjust main content height if sidebar after going to new slide is taller adjustContentHeight(); } } }); }); } if ($('#wm-photoset').length > 0) { $('#wm-photoset').imagesLoaded(function () { $('#wm-photoset').flexslider({ slideshow: false, controlNav: false, directionNav: true, animation: "fade", animationLoop: false, start: function (slider) { if (slider.count == 1) { $("#wm-photoset-position").hide(); } $("#wm-photoset-position").text("Photo " + (slider.currentSlide + 1) + " of " + slider.count); slider.animate({ "height": slider.slides.eq(slider.currentSlide).height() }, 0); }, before: function (slider) { $("#wm-photoset-position").text("Photo " + (slider.animatingTo + 1) + " of " + slider.count); wmSlideHeight = slider.slides.eq(slider.animatingTo).outerHeight(); slider.animate({ "height": wmSlideHeight }, 400); } }); $("#wm-photoset-caption-toggle").click(function () { $(this).toggleClass("hide-caption"); activeSlideCaptionHeight = $("#wm-photoset .flex-active-slide .wmphotoset-caption").outerHeight(); $("#wm-photoset .wmphotoset-caption").fadeToggle(400); if ($(this).hasClass("hide-caption")) { $("#wm-photoset-caption-toggle-text").html("Hide Caption"); $("#wm-photoset-caption-toggle-indicator").removeClass("fa-plus").addClass("fa-minus"); $("#wm-photoset").animate({ "height": $("#wm-photoset .flex-active-slide").outerHeight() }, 400); } else { $("#wm-photoset-caption-toggle-text").html("Show Caption"); $("#wm-photoset-caption-toggle-indicator").removeClass("fa-minus").addClass("fa-plus"); $("#wm-photoset").animate({ "height": $("#wm-photoset .flex-active-slide").height() - activeSlideCaptionHeight }, 400); } }); }); } /* ============================================================= addEventListener DOMContentLoaded - Collapsible lists/accordion functionality ================================================================= */ if ($("table.collapsible").length > 0) { applyCollapsibleStyle(); } /*** Rearranging layout based on screen width ***/ // if (bodyWidth >= 720 && ($("#sidebar").length > 0 || $("#page_nav").length > 0)) { // make sure nav and sidebar are not taller than main content area // imagesLoaded('#main_content', function() { // adjustContentHeight(); // }); // } var resizeTimer; $(window).on('resize', function (e) { clearTimeout(resizeTimer); resizeTimer = setTimeout(function () { /*if (addFancyScroll) { $(menuLeft).height($(window).height()-topbarHeight+1); }*/ bodyWidth = viewport().width; //$("body").width(); if (bodyWidth >= 1000) { // if side menu is visible, hide it if ($("#menu_btn").hasClass("active")) { $("#menu_btn").removeClass("active"); $("#search_btn").removeClass("active"); $("#topbar").removeClass("topbar-background"); $("#side_menu").removeClass("menu-open"); // restore original zoom //$(metaViewport).attr("content", originalMeta); } // handle oversized tables // if ($(".user_content table").length > 0) { // $(".user_content table").each(function(){ // if ($(this).width() > 720) { // $(this).width("auto"); // } // }); // } } /* ============================================================= addEventListener DOMContentLoaded - Rearranging layout based on screen width ================================================================= */ adjustContentHeight(); adjustPageNav(); /* ============================================================= addEventListener DOMContentLoaded - Adjust arrow position on content buttons if two lines ================================================================= */ if ($(".content_button_with_arrow").length > 0) { adjustContentButtonArrows(); } if ($("#wm-photoset").length > 0) { $("#wm-photoset").stop(true, true).animate({ "height": $("#wm-photoset .flex-active-slide").height() }, 400); } if ($("#sidebar .widget.flexslider").length > 0) { //$("#sidebar .widget.flexslider").stop(true,true).animate({"height": $("#sidebar .widget.flexslider .flex-active-slide").height() + 51}, 400); $("#sidebar .widget.flexslider").each(function () { $(this).stop(true, true).animate({ "height": $(this).find(".flex-active-slide").height() + 53 }, 400); dirNavContainer = $(this).children(".flex-direction-nav"); if (bodyWidth < 510) { dirNavContainer.css("left", (($(this).outerWidth() - 240) / 2)); } else { dirNavContainer.css("left", "17px"); } }); } if ($("#container.ideation").length > 0) { if ($("#ideation-gallery-container").length > 0) { // adjust height of ideation slideshow ideationImgHeight = Math.round($("#ideation-gallery").width() * ideationPhotoRatio); $("#ideation-gallery").height(ideationImgHeight); $("#ideation-gallery-container").height(ideationImgHeight); } } if (bodyWidth < 650) { mobileView = true; } else { mobileView = false; } }, 100); }); /* ============================================================= addEventListener DOMContentLoaded - Lightboxes ================================================================= */ if ($(".fancybox").length > 0 && !mobileView) { // hidden variable to hold scrollbar position if (!$('#scrollbarposition').length) { $('#main').append('<input type="hidden" id="scrollbarposition" value="0" />'); } // hidden variable to hold event timestamp if (!$('#mytstamp').length) { $('#main').append('<input type="hidden" id="mytstamp" value="0" />'); } $(".fancybox.reslifeInfo").fancybox({ type: 'ajax', autoSize: false, width: 475, autoHeight: true, autoResize: true, // scrolling: defaultscroll, wrapCSS: 'reslifeInfo', afterShow: function () { // bind to a disable function for up/down arrows and page keys (to prevent scrolling the main window with them in Firefox) $(document).bind("keydown", DisableVertScroll); }, afterClose: function () { $(document).unbind("keydown", DisableVertScroll); $('#scrollbarposition').val('0'); } }); } if ($(".ideation-popup-link").length > 0) { $(".ideation-popup-link").fancybox({ type: 'ajax', autoSize: false, width: 435, autoHeight: true, autoResize: true, wrapCSS: 'ideation-popup', afterShow: function () { /* for HD video request in fancyboxes */ $('div[id^=ytfancyplayer_]').each(function () { var varray = this.id.split('_'); // ignore varray[0] (ytplayer) we don't need it anymore var vwidth = varray[1]; var vheight = varray[2]; // since "_" is a valid yt video id character and javascript split's limit doesn't combine the leftovers we need to combine manually... var vidid = varray[3]; for (var i = 4; i < varray.length; i++) { vidid += "_" + varray[i]; } player = new YT.Player(this.id, { width: vwidth, height: vheight, videoId: vidid, playerVars: { autohide: 1, showinfo: 0, rel: 0, wmode: "transparent" }, events: { //'onReady': onPlayerReady } }); }); } }); } /* ============================================================= addEventListener DOMContentLoaded - Directory Photo Grid ================================================================= */ if ($(".wm_dir_entry_item").length > 0) { $(".wm_dir_entry_item .name_position").hide(); $(".wm_dir_entry_item").hover(function () { $(this).find(".name_position").show(); }, function () { $(this).find(".name_position").filter(":visible").hide(); }); $(".wm_dir_entry_item a").focus(function () { $(this).find(".name_position").show(); }); $(".wm_dir_entry_item a").blur(function () { $(this).find(".name_position").filter(":visible").hide(); }); if (!mobileView) { // hidden variable to hold scrollbar position if (!$('#scrollbarposition').length) { $('#main').append('<input type="hidden" id="scrollbarposition" value="0" />'); } // hidden variable to hold event timestamp if (!$('#mytstamp').length) { $('#main').append('<input type="hidden" id="mytstamp" value="0" />'); } $('.fancybox').fancybox({ type: 'inline', wrapCSS: 'wm_dir_popup user_content', width: 680, autoSize: false, autoHeight: true, autoResize: true, afterClose: function () { $(document).unbind("keydown", DisableVertScroll); $('#scrollbarposition').val('0'); } }); } else { $('.fancybox').click(function () { // strip off any url parameters and go to directory page directly subPage = window.location.href; var url = window.location.href; var filename = url.substring(url.lastIndexOf('/') + 1); var subPath = url.replace(filename, ""); subPath = subPath + $(this).attr("href").substring(1) + '.php'; document.location = subPath; }); } selectedProfile = getURLParam("profile"); if (selectedProfile != "") { $("#" + selectedProfile + "_link").click(); } } /* ============================================================= addEventListener DOMContentLoaded - Tables ================================================================= */ if ($(".user_content table").length > 0) { $(".user_content table").each(function () { if ($(this).hasClass("resizable")) { // remove fixed widths and let adjust automatically $(this).width("100%"); $(this).find("td").each(function () { $(this).removeAttr("width"); }); } // else if ($(this).width() > 720) { // really, no table should be wider than this // $(this).width("auto"); // } if ($(this).hasClass("even-columns")) { numCols = $(this).find("tr:first td").length; evenWidth = Math.floor(100.0 / numCols); $(this).find("td").each(function () { $(this).attr("width", evenWidth + "%"); }); } }); } /* ============================================================= addEventListener DOMContentLoaded - Ideation photoset ================================================================= */ if ($("#ideation-gallery-container").length > 0) { $.ajax({ type: "GET", url: xmlSrc, dataType: "xml", success: parseGalleryXml }); ideationImgHeight = Math.round($("#ideation-gallery").width() * ideationPhotoRatio); $("#ideation-gallery").height(ideationImgHeight); $("#ideation-gallery-container").height(ideationImgHeight); } /* ============================================================= addEventListener DOMContentLoaded - Clubs and Orgs, A-Z Nav ================================================================= */ if ($("#atoz_ul").length > 0) { $("#atoz_ul").tinyNav({ active: 'selected' }); } /* ============================================================= addEventListener DOMContentLoaded - A&S Arts Page ================================================================= */ if ($(".ic_container").length > 0 && $("html").hasClass("no-touch")) { $(".ic_container").capslide({ caption_color: 'white', caption_bgcolor: 'black', overlay_bgcolor: '', border: '', showcaption: false }); } else { $(".ic_caption").css({ 'position': 'absolute', 'bottom': '0px', 'background': '#000', 'opacity': '0.7' }); $(".ic_caption").show(); } if ($(".lt-ie9").length > 0) { $("#main:only-child").addClass("is-only-child"); if ($(".default_extra.events_listing li").length > 0) { $(".default_extra.events_listing li:first-child").addClass("is-first-child"); } if ($(".default_extra.announcements_listing li").length > 0) { $(".default_extra.announcements_listing li:first-child").addClass("is-first-child"); } if ($("#wm-photoset .wmphotoset-caption p").length > 0) { $("#wm-photoset .wmphotoset-caption p:first-child").addClass("is-first-child"); } if ($(".wm_dir_entry_row").length > 0) { $(".wm_dir_entry_row .wm_dir_entry_item:first-child").addClass("is-first-child"); $(".wm_dir_entry_row:last-child").addClass("is-last-child"); } if ($("#atoz_ul li").length > 0) { $("#atoz_ul li:first-child").addClass("is-first-child"); } if ($("#sidebar aside").length > 0) { $("#sidebar aside:last-child").addClass("is-last-child"); } if ($("aside.listbox .list-items li").length > 0) { $("aside.listbox .list-items li:first-child").addClass("is-first-child"); } if ($("ul.related_links li").length > 0) { $("ul.related_links li:first-child").addClass("is-first-child"); } } }); /* ============================================================= FUNCTION createScrollableTables() - Scrollable Tables: wrap tables in div for scrolling on mobile devices ================================================================= */ function createScrollableTables() { $(".user_content table, .user_content_styles table") .not(".tablespecialleft") .not(".tablespecialleft + .tablespecial") .not(".collapsible") .wrap('<div class="tablewrap"></div>') .before( $( '<p class="scroll-message" style="font-size:0.8rem;font-style:italic;position:absolute;right:0;color:#999;">Scroll right for more</p>' ) ); toggleScrollTip(); $(window).resize(function () { toggleScrollTip(); }); } /* ============================================================= FUNCTION toggleScrollTip() - Display scroll message ================================================================= */ function toggleScrollTip() { $(".tablewrap").each(function () { var div = this; var mytable = $(this).find("table"); if (div.scrollWidth > div.clientWidth) { mytable.css({ "margin-top": "1.4em", "max-width": "100%" }); $(this).find(".scroll-message").show(); } else { $(this).find(".scroll-message").hide(); mytable.css("margin-top", ""); } }); } $(document).ready(function () { createScrollableTables(); }); $(window).load(function () { // page is fully loaded, including all frames, objects and images toggleScrollTip(); }); /* ============================================================= addEventListener DOMContentLoaded - Social Media Icons: adds a class to the social icons wrapper in the page nav if there are 5, 6, or 9 icons so that the icon layout can be altered for aesthetics. ================================================================= */ document.addEventListener("DOMContentLoaded", function () { let socialMediaWrapper = document.querySelectorAll(".social-media-nav__wrapper"); if (socialMediaWrapper) { for (let i = 0; i < socialMediaWrapper.length; i++) { let numIcons = socialMediaWrapper[i].querySelectorAll('.sm_icon'); if (numIcons.length == 5 || numIcons.length == 6 || numIcons.length == 9) { socialMediaWrapper[i].classList += " -js-narrow"; } } } }); // document.addEventListener("DOMContentLoaded", function() { // checkInstagram('468d08af-deb9-4d5c-b500-d634a4a0b9e3'); // }); //var feed_container = document.getElementById('instagram-468d08af-deb9-4d5c-b500-d634a4a0b9e3'); // var x = document.getElementsByClassName("instafeed"); // var i; // for (i = 0; i < x.length; i++) { // var myDivId = x[i].id; // myFeedId = x[i].dataset.feed; // checkInstagram(myDivId, myFeedId); // } // function checkInstagram(divId,feedId) { // xhr=new XMLHttpRequest(); // xhr.onreadystatechange = function() { // if (xhr.readyState === 4 && xhr.status === 200) { // var myObj = JSON.parse(xhr.responseText); // outputInstagram(myObj.posts,divId); // } // } // xhr.open("GET","https://api.curator.io/v1/feeds/"+feedId+"/posts?api_key=dc1ddae1-a179-4531-a4ef-d1e59dc5b6a5&limit=50",true); // xhr.send(); // } // function outputInstagram(myPosts,divId) { // var out = ""; // // loop data items // for(i = 0; i < myPosts.length; i++) { // out += '<img src="'+myPosts[i].image+'" alt="" /><p>'+myPosts[i].text+'</p>'; // } // var feed_container = document.getElementById(divId); // feed_container.innerHTML = out; // }