wp/wp-content/themes/twentyseventeen/assets/js/global.js
changeset 8 c7c34916027a
parent 7 cf61fcea0001
child 9 177826044cd9
--- a/wp/wp-content/themes/twentyseventeen/assets/js/global.js	Mon Oct 14 17:39:30 2019 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,249 +0,0 @@
-/* global twentyseventeenScreenReaderText */
-(function( $ ) {
-
-	// Variables and DOM Caching.
-	var $body = $( 'body' ),
-		$customHeader = $body.find( '.custom-header' ),
-		$branding = $customHeader.find( '.site-branding' ),
-		$navigation = $body.find( '.navigation-top' ),
-		$navWrap = $navigation.find( '.wrap' ),
-		$navMenuItem = $navigation.find( '.menu-item' ),
-		$menuToggle = $navigation.find( '.menu-toggle' ),
-		$menuScrollDown = $body.find( '.menu-scroll-down' ),
-		$sidebar = $body.find( '#secondary' ),
-		$entryContent = $body.find( '.entry-content' ),
-		$formatQuote = $body.find( '.format-quote blockquote' ),
-		isFrontPage = $body.hasClass( 'twentyseventeen-front-page' ) || $body.hasClass( 'home blog' ),
-		navigationFixedClass = 'site-navigation-fixed',
-		navigationHeight,
-		navigationOuterHeight,
-		navPadding,
-		navMenuItemHeight,
-		idealNavHeight,
-		navIsNotTooTall,
-		headerOffset,
-		menuTop = 0,
-		resizeTimer;
-
-	// Ensure the sticky navigation doesn't cover current focused links.
-	$( 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]', '.site-content-contain' ).filter( ':visible' ).focus( function() {
-		if ( $navigation.hasClass( 'site-navigation-fixed' ) ) {
-			var windowScrollTop = $( window ).scrollTop(),
-				fixedNavHeight = $navigation.height(),
-				itemScrollTop = $( this ).offset().top,
-				offsetDiff = itemScrollTop - windowScrollTop;
-
-			// Account for Admin bar.
-			if ( $( '#wpadminbar' ).length ) {
-				offsetDiff -= $( '#wpadminbar' ).height();
-			}
-
-			if ( offsetDiff < fixedNavHeight ) {
-				$( window ).scrollTo( itemScrollTop - ( fixedNavHeight + 50 ), 0 );
-			}
-		}
-	});
-
-	// Set properties of navigation.
-	function setNavProps() {
-		navigationHeight      = $navigation.height();
-		navigationOuterHeight = $navigation.outerHeight();
-		navPadding            = parseFloat( $navWrap.css( 'padding-top' ) ) * 2;
-		navMenuItemHeight     = $navMenuItem.outerHeight() * 2;
-		idealNavHeight        = navPadding + navMenuItemHeight;
-		navIsNotTooTall       = navigationHeight <= idealNavHeight;
-	}
-
-	// Make navigation 'stick'.
-	function adjustScrollClass() {
-
-		// Make sure we're not on a mobile screen.
-		if ( 'none' === $menuToggle.css( 'display' ) ) {
-
-			// Make sure the nav isn't taller than two rows.
-			if ( navIsNotTooTall ) {
-
-				// When there's a custom header image or video, the header offset includes the height of the navigation.
-				if ( isFrontPage && ( $body.hasClass( 'has-header-image' ) || $body.hasClass( 'has-header-video' ) ) ) {
-					headerOffset = $customHeader.innerHeight() - navigationOuterHeight;
-				} else {
-					headerOffset = $customHeader.innerHeight();
-				}
-
-				// If the scroll is more than the custom header, set the fixed class.
-				if ( $( window ).scrollTop() >= headerOffset ) {
-					$navigation.addClass( navigationFixedClass );
-				} else {
-					$navigation.removeClass( navigationFixedClass );
-				}
-
-			} else {
-
-				// Remove 'fixed' class if nav is taller than two rows.
-				$navigation.removeClass( navigationFixedClass );
-			}
-		}
-	}
-
-	// Set margins of branding in header.
-	function adjustHeaderHeight() {
-		if ( 'none' === $menuToggle.css( 'display' ) ) {
-
-			// The margin should be applied to different elements on front-page or home vs interior pages.
-			if ( isFrontPage ) {
-				$branding.css( 'margin-bottom', navigationOuterHeight );
-			} else {
-				$customHeader.css( 'margin-bottom', navigationOuterHeight );
-			}
-
-		} else {
-			$customHeader.css( 'margin-bottom', '0' );
-			$branding.css( 'margin-bottom', '0' );
-		}
-	}
-
-	// Set icon for quotes.
-	function setQuotesIcon() {
-		$( twentyseventeenScreenReaderText.quote ).prependTo( $formatQuote );
-	}
-
-	// Add 'below-entry-meta' class to elements.
-	function belowEntryMetaClass( param ) {
-		var sidebarPos, sidebarPosBottom;
-
-		if ( ! $body.hasClass( 'has-sidebar' ) || (
-			$body.hasClass( 'search' ) ||
-			$body.hasClass( 'single-attachment' ) ||
-			$body.hasClass( 'error404' ) ||
-			$body.hasClass( 'twentyseventeen-front-page' )
-		) ) {
-			return;
-		}
-
-		sidebarPos       = $sidebar.offset();
-		sidebarPosBottom = sidebarPos.top + ( $sidebar.height() + 28 );
-
-		$entryContent.find( param ).each( function() {
-			var $element = $( this ),
-				elementPos = $element.offset(),
-				elementPosTop = elementPos.top;
-
-			// Add 'below-entry-meta' to elements below the entry meta.
-			if ( elementPosTop > sidebarPosBottom ) {
-				$element.addClass( 'below-entry-meta' );
-			} else {
-				$element.removeClass( 'below-entry-meta' );
-			}
-		});
-	}
-
-	/*
-	 * Test if inline SVGs are supported.
-	 * @link https://github.com/Modernizr/Modernizr/
-	 */
-	function supportsInlineSVG() {
-		var div = document.createElement( 'div' );
-		div.innerHTML = '<svg/>';
-		return 'http://www.w3.org/2000/svg' === ( 'undefined' !== typeof SVGRect && div.firstChild && div.firstChild.namespaceURI );
-	}
-
-	/**
-	 * Test if an iOS device.
-	*/
-	function checkiOS() {
-		return /iPad|iPhone|iPod/.test(navigator.userAgent) && ! window.MSStream;
-	}
-
-	/*
-	 * Test if background-attachment: fixed is supported.
-	 * @link http://stackoverflow.com/questions/14115080/detect-support-for-background-attachment-fixed
-	 */
-	function supportsFixedBackground() {
-		var el = document.createElement('div'),
-			isSupported;
-
-		try {
-			if ( ! ( 'backgroundAttachment' in el.style ) || checkiOS() ) {
-				return false;
-			}
-			el.style.backgroundAttachment = 'fixed';
-			isSupported = ( 'fixed' === el.style.backgroundAttachment );
-			return isSupported;
-		}
-		catch (e) {
-			return false;
-		}
-	}
-
-	// Fire on document ready.
-	$( document ).ready( function() {
-
-		// If navigation menu is present on page, setNavProps and adjustScrollClass.
-		if ( $navigation.length ) {
-			setNavProps();
-			adjustScrollClass();
-		}
-
-		// If 'Scroll Down' arrow in present on page, calculate scroll offset and bind an event handler to the click event.
-		if ( $menuScrollDown.length ) {
-
-			if ( $( 'body' ).hasClass( 'admin-bar' ) ) {
-				menuTop -= 32;
-			}
-			if ( $( 'body' ).hasClass( 'blog' ) ) {
-				menuTop -= 30; // The div for latest posts has no space above content, add some to account for this.
-			}
-			if ( ! $navigation.length ) {
-				navigationOuterHeight = 0;
-			}
-
-			$menuScrollDown.click( function( e ) {
-				e.preventDefault();
-				$( window ).scrollTo( '#primary', {
-					duration: 600,
-					offset: { top: menuTop - navigationOuterHeight }
-				});
-			});
-		}
-
-		adjustHeaderHeight();
-		setQuotesIcon();
-		if ( true === supportsInlineSVG() ) {
-			document.documentElement.className = document.documentElement.className.replace( /(\s*)no-svg(\s*)/, '$1svg$2' );
-		}
-
-		if ( true === supportsFixedBackground() ) {
-			document.documentElement.className += ' background-fixed';
-		}
-	});
-
-	// If navigation menu is present on page, adjust it on scroll and screen resize.
-	if ( $navigation.length ) {
-
-		// On scroll, we want to stick/unstick the navigation.
-		$( window ).on( 'scroll', function() {
-			adjustScrollClass();
-			adjustHeaderHeight();
-		});
-
-		// Also want to make sure the navigation is where it should be on resize.
-		$( window ).resize( function() {
-			setNavProps();
-			setTimeout( adjustScrollClass, 500 );
-		});
-	}
-
-	$( window ).resize( function() {
-		clearTimeout( resizeTimer );
-		resizeTimer = setTimeout( function() {
-			belowEntryMetaClass( 'blockquote.alignleft, blockquote.alignright' );
-		}, 300 );
-		setTimeout( adjustHeaderHeight, 1000 );
-	});
-
-	// Add header video class after the video is loaded.
-	$( document ).on( 'wp-custom-header-video-loaded', function() {
-		$body.addClass( 'has-header-video' );
-	});
-
-})( jQuery );