https://www.stimulusrespond.com/wp-content/themes/cyanotype-wpcom/js/functions.js?ver=20150302

1/* global screenReaderText */
2/* global toggleButtonText */
3/**
4 * Theme functions file.
5 *
6 * Contains handlers for navigation and widget area.
7 */
8
9( function( $ ) {
10	var $body         = $( document.body ),
11	    $window       = $( window ),
12	    sidebar       = $( '#sidebar' ),
13	    sidebarToggle = $( '#masthead' ).find( '#sidebar-toggle' ),
14	    menu          = $( '#masthead' ).find( '.nav-menu' ),
15	    windowWidth   = window.innerWidth,
16	    resizeTimer;
17
18	// Add dropdown toggle that display child menu items.
19	$( '#sidebar .main-navigation .menu-item-has-children > a' ).after( '<button class="dropdown-toggle" aria-expanded="false">' + screenReaderText.expand + '</button>' );
20
21	// Toggle buttons and submenu items with active children menu items.
22	$( '#sidebar .main-navigation .current-menu-ancestor > button' ).addClass( 'toggle-on' );
23	$( '#sidebar .main-navigation .current-menu-ancestor > .sub-menu' ).addClass( 'toggled-on' );
24
25	$( '.dropdown-toggle' ).click( function( e ) {
26		var _this = $( this );
27		e.preventDefault();
28		_this.toggleClass( 'toggle-on' );
29		_this.next( '.children, .sub-menu' ).toggleClass( 'toggled-on' );
30		_this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
31		_this.html( _this.html() === screenReaderText.expand ? screenReaderText.collapse : screenReaderText.expand );
32	} );
33
34	// Move the Page Links before Sharedaddy.
35	$( '.single .hentry' ).each( function() {
36		$( this ).find( '.page-links' ).insertBefore( $( this ).find( '.sharedaddy' ).first() );
37	} );
38
39	// Enable sidebar toggle.
40	( function() {
41		if ( ! sidebar || ! sidebarToggle ) {
42			return;
43		}
44
45		// Add a toggle button text.
46		sidebarToggle.append( toggleButtonText.widgets );
47
48		// Add an initial value for the attribute.
49		$( sidebarToggle ).add( sidebar ).attr( 'aria-expanded', 'false' );
50
51		sidebarToggle.on( 'click.cyanotype', function() {
52			$body.toggleClass( 'sidebar-open' ).trigger( 'resize' );
53			$( this ).toggleClass( 'toggled-on' );
54			$( this ).add( sidebar ).attr( 'aria-expanded', $( this ).add( sidebar ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false');
55
56			// Remove mejs players from sidebar
57			$( '#secondary .mejs-container' ).each( function( i, el ) {
58				if ( mejs.players[ el.id ] ) {
59					mejs.players[ el.id ].remove();
60				}
61			} );
62
63			// Re-initialize mediaelement players.
64			setTimeout( function() {
65				if ( window.wp && window.wp.mediaelement ) {
66					window.wp.mediaelement.initialize();
67				}
68			} );
69
70			// Trigger resize event to display VideoPress player.
71			setTimeout( function(){
72				if ( typeof( Event ) === 'function' ) {
73					window.dispatchEvent( new Event( 'resize' ) );
74				} else {
75					var event = window.document.createEvent( 'UIEvents' );
76					event.initUIEvent( 'resize', true, false, window, 0 );
77					window.dispatchEvent( event );
78				}
79			} );
80		} );
81	} )();
82
83	// Fix sub-menus for touch devices and better focus for hidden submenu items for accessibility.
84	( function() {
85		if ( ! menu || ! menu.children().length ) {
86			return;
87		}
88
89		if ( 'ontouchstart' in window ) {
90			menu.find( '.menu-item-has-children > a' ).on( 'touchstart.cyanotype', function( e ) {
91				var el = $( this ).parent( 'li' );
92
93				if ( ! el.hasClass( 'focus' ) ) {
94					e.preventDefault();
95					el.toggleClass( 'focus' );
96					el.siblings( '.focus' ).removeClass( 'focus' );
97				}
98			} );
99		}
100
101		menu.find( 'a' ).on( 'focus.cyanotype blur.cyanotype', function() {
102			$( this ).parents( '.menu-item' ).toggleClass( 'focus' );
103		} );
104	} )();
105
106	// Minimum height for sidebar.
107	function sidebarSize() {
108		var toolbarHeight,
109		    mastheadHeight    = $( '#masthead' ).outerHeight(),
110		    headerImageHeight = $( '.header-image' ).height(),
111		    sidebarMinHeight;
112
113		if ( ! sidebar ) {
114			return;
115		}
116
117		toolbarHeight     = $body.is( '.admin-bar' ) ? $( '#wpadminbar' ).height() : 0;
118		sidebarMinHeight  = $window.height() - ( toolbarHeight + mastheadHeight + headerImageHeight );
119
120		sidebar.css( {
121			'min-height': sidebarMinHeight + 'px'
122		} );
123	}
124
125	// Add body classes to modify layout.
126	function bodyClasses() {

127		if ( 827 <= windowWidth ) {
128			var siteBranding           = $( '.site-branding' ),
129			    siteBrandingWidth      = siteBranding.width(),
130			    siteBrandingInnerWidth = siteBranding.find( '.site-branding-inner' ).width(),
131			    socialNavigationWidth  = siteBranding.find( '.social-navigation' ).width();
132
133			if ( siteBrandingWidth < ( siteBrandingInnerWidth + socialNavigationWidth ) ) {
134				$body.addClass( 'social-menu-left' );
135			} else {
136				$body.removeClass( 'social-menu-left' );
137			}
138		} else {
139			$body.removeClass( 'social-menu-left' );
140		}
141	}
142
143	// Add a class to big image and caption >= 960px.
144	function bigImageClass() {
145		var entryContent = $( '.entry-content' );
146		entryContent.find( 'img.size-full, img.size-large' ).each( function() {
147			var img     = $( this ),
148			    caption = $( this ).closest( 'figure' ),
149			    newImg  = new Image();
150
151			newImg.src = img.attr( 'src' );
152
153			$( newImg ).load( function() {
154				var imgWidth = newImg.width;
155
156				if ( 960 <= imgWidth ) {
157					$( img ).addClass( 'size-big' );
158				}
159
160				if ( caption.hasClass( 'wp-caption' ) && 960 <= imgWidth ) {
161					caption.addClass( 'caption-big' );
162					caption.removeAttr( 'style' );
163				}
164			} );
165		} );
166	}
167
168	// Make Post Navigation full-width on large screen.
169	function postNavigation() {
170		var postNav       = $( '.post-navigation' ),
171		    postNavMargin = 0;
172
173		if ( ! $body.hasClass( 'single' ) ) {
174			return;
175		} else if ( 1088 <= windowWidth ) {
176			postNavMargin = ( $( window ).width() - 1088 - 4 ) / 2;
177			postNav.css( {
178				'width': $( window ).width() + 'px',
179				'margin-left':  '-' + postNavMargin + 'px',
180				'margin-right':  '-' + postNavMargin + 'px'
181			} );
182		} else {
183			postNav.attr( 'style', '' );
184		}
185	}
186
187	// Change the toggle button text.
188	function toggleButtonTxt() {
189		var social      = sidebar.find( '.social-navigation' ),
190		    sidebarMenu = sidebar.find( '.main-navigation' ),
191		    widgets     = sidebar.find( '#secondary' );
192
193		if ( 828 >= windowWidth ) {
194			if ( ( sidebarMenu.length || social.length ) && widgets.length ) {
195				sidebarToggle.html( toggleButtonText.both );
196			} else if ( ( sidebarMenu.length || social.length ) && ! widgets.length ) {
197				sidebarToggle.html( toggleButtonText.menu );
198			} else {
199				sidebarToggle.html( toggleButtonText.widgets );
200			}
201		} else {
202			sidebarToggle.html( toggleButtonText.widgets );
203		}
204	}
205
206	// Close Sidebar with an escape key.
207	$( document ).keyup( function( e ) {
208		if ( 27 === e.keyCode && sidebarToggle.hasClass( 'toggled-on' ) ) {
209			$body.removeClass( 'sidebar-open' );
210			sidebarToggle.removeClass( 'toggled-on' ).attr( 'aria-expanded', 'false' );
211			sidebar.attr( 'aria-hidden', 'true' );
212		}
213	} );
214
215	$( document ).ready( function() {
216		$window.on( 'resize.cyanotype', function() {
217			windowWidth = window.innerWidth;
218			clearTimeout( resizeTimer );
219			resizeTimer = setTimeout( function() {
220				sidebarSize();
221				bodyClasses();
222				postNavigation();
223				toggleButtonTxt();
224			}, 300 );
225		} );
226
227		sidebarSize();
228		bodyClasses();
229		bigImageClass();
230		postNavigation();
231		toggleButtonTxt();
232	} );
233} )( jQuery );