https://tucsoninteractivemap.netlify.app/wp-content/themes/amphibious/js/custom.js?ver=1.0

1/*!
2 * Custom v1.0
3 * Contains handlers for the different site functions
4 *
5 * Copyright (c) 2019 TemplatePocket.com
6 * License: GNU General Public License v2 or later
7 * http://www.gnu.org/licenses/gpl-2.0.html
8 */
9
10/* global enquire:true */
11
12( function( $ ) {
13	var amphibious = {
14
15		// Responsive Menu Build
16		responsiveMenuBuild: function () {
17			// Site Header Menu Wrapper
18			var $menuWrapper = $( '.site-header-menu-wrapper' );
19
20			// Add dropdown toggle that display child menu items.
21			$( '.site-header-menu .page_item_has_children > a, .site-header-menu .menu-item-has-children > a' ).append( '<button class="dropdown-toggle" aria-expanded="false"/>' );
22			$( '.site-header-menu .dropdown-toggle' ).off( 'click' ).on( 'click', function( e ) {
23				e.preventDefault();
24				$( this ).toggleClass( 'toggle-on' );
25				$( this ).parent().next( '.children, .sub-menu' ).toggleClass( 'toggle-on' );
26				$( this ).attr( 'aria-expanded', $( this ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
27			} );
28
29			// Add Close Button Markup
30			$menuWrapper.prepend( '<div class="site-header-menu-responsive-close-wrapper"><button class="site-header-menu-responsive-close">&times;</button></div>' );
31		},
32
33		// Responsive Menu Destroy
34		responsiveMenuDestroy: function () {
35			// Site Header Menu
36			var $menuWrapper = $( '.site-header-menu-wrapper' );
37
38			// Remove Dropdown Toggles
39			$menuWrapper.find( '.dropdown-toggle' ).remove();
40
41			// Remove Close Button
42			$menuWrapper.find( '.site-header-menu-responsive-close-wrapper' ).remove();
43		},
44
45		// SF Menu Build
46		sfMenuBuild: function () {
47			// Superfish Menu
48			$( 'ul.sf-menu' ).superfish( {
49				delay: 1500,
50				animation: { opacity: 'show', height: 'show' },
51				speed: 'fast',

52				autoArrows: false,
53				cssArrows: true,
54			} );
55		},
56
57		// SF Menu Destroy
58		sfMenuDestroy: function () {
59			// Superfish Menu Destroy
60			$( 'ul.sf-menu' ).superfish( 'destroy' );
61		},
62
63		// Big Screen Match
64		bigScreenMatch: function () {
65			// Site Header Menu Wrapper
66			var $menuWrapper = $( '.site-header-menu-wrapper' );
67			$menuWrapper.removeClass( 'site-header-menu-responsive-wrapper' );
68
69			// Site Header Menu
70			var $menu = $( '.site-header-menu' );
71			$menu.removeClass( 'site-header-menu-responsive' );
72			$menu.addClass( 'sf-menu' );
73
74			// Superfish Menu Build
75			amphibious.sfMenuBuild();
76		},
77
78		// Big Screen UnMatch
79		bigScreenUnMatch: function () {
80			// Superfish Menu Destroy
81			amphibious.sfMenuDestroy();
82
83			// Site Header Menu
84			var $menu = $( '.site-header-menu' );
85			$menu.addClass( 'site-header-menu-responsive' );
86			$menu.removeClass( 'sf-menu' );
87
88			// Site Header Menu Wrapper
89			var $menuWrapper = $( '.site-header-menu-wrapper' );
90			$menuWrapper.addClass( 'site-header-menu-responsive-wrapper' );
91		},
92
93		// Small Screen Match
94		smallScreenMatch: function () {
95			// Responsive Menu Build
96			amphibious.responsiveMenuBuild();
97
98			// Sliding Panels for Menu
99			amphibious.slidePanelInit();
100
101			// Responsive Tables
102			$( '.entry-content, .sidebar' ).find( 'table' ).wrap( '<div class="table-responsive"></div>' );
103		},
104
105		// Small Screen UnMatch
106		smallScreenUnMatch: function () {
107			// Responsive Menu Destroy
108			amphibious.responsiveMenuDestroy();
109
110			// Responsive Menu Close
111			amphibious.slidePanelCloseInit();
112
113			// Responsive Tables Undo
114			$( '.entry-content, .sidebar' ).find( 'table' ).unwrap( '<div class="table-responsive"></div>' );
115		},
116
117		// Open Slide Panel - Responsive Mobile Menu
118		slidePanelInit: function () {
119			// Elements
120			var $menuWrapper = $( '.site-header-menu-wrapper' );
121			var $overlayEffect = $( '.overlay-effect' );
122			var $menuClose = $( '.site-header-menu-responsive-close' );
123
124			// Responsive Menu Slide
125			$( '.toggle-menu-control' ).off( 'click' ).on( 'click', function( e ) {
126				// Prevent Default
127				e.preventDefault();
128				e.stopPropagation();
129
130				// ToggleClass
131				$menuWrapper.toggleClass( 'show' );
132				$overlayEffect.toggleClass( 'open' );
133
134				// Slide Panel Open Logic
135				if ( $overlayEffect.hasClass( 'open' ) ) {
136					// Add Body Class
137					$( 'body' ).addClass( 'has-responsive-menu' );
138
139					// Responsive Menu Focus
140					amphibious.responsiveMenuFocus();
141
142					// Bring focus to first element
143					setTimeout( function() {
144						$( '.site-header-menu-responsive-close' ).focus();
145					}, 300 );
146				}
147			} );
148
149			// Responsive Menu Close
150			$menuClose.off( 'click' ).on( 'click', function( e ) {
151				// Prevent Default
152				e.preventDefault();
153				e.stopPropagation();
154
155				// Close Slide Panel
156				amphibious.slidePanelCloseInit();
157			} );
158
159			// Overlay Slide Close
160			$overlayEffect.off( 'click' ).on( 'click', function() {
161				amphibious.slidePanelCloseInit();
162			} );
163		},
164
165		// Close Slide Panel
166		slidePanelCloseInit: function () {
167			// Elements
168			var $menuWrapper = $( '.site-header-menu-wrapper' );
169			var $overlayEffect = $( '.overlay-effect' );
170
171			// Slide Panel Close Logic
172			if ( $overlayEffect.hasClass( 'open' ) ) {
173				// Remove Body Class
174				$( 'body' ).removeClass( 'has-responsive-menu' );
175
176				// For Menu
177				if ( $menuWrapper.hasClass( 'show' ) ) {
178					$menuWrapper.toggleClass( 'show' );
179				}
180
181				// Toggle Overlay Slide
182				$overlayEffect.toggleClass( 'open' );
183
184				// Bring focus to menu control
185				setTimeout( function() {
186					$( '.toggle-menu-control' ).focus();
187				}, 300 );
188			}
189		},
190
191		// Responsive Menu Focus
192		responsiveMenuFocus: function () {
193			// Key Down
194			$( document ).on( 'keydown', function( e ) {
195				// Wrapper Selector
196				var selectorWrapper = '.site-header-menu-wrapper';
197
198				// Close Button
199				var selectorCloseButton = selectorWrapper + ' > div > button';
200
201				// Parent Anchors
202				var selectorParentAnchors = selectorWrapper + ' > ul > li > a';
203				// Parent Toggles
204				var selectorParentToggles = selectorWrapper + ' > ul > li > a > button';
205
206				// Child Anchors
207				var selectorChildAnchors = selectorWrapper + ' > ul > li ul.sub-menu.toggle-on > li > a';
208				// Child Toggles
209				var selectorChildToggles = selectorWrapper + ' > ul > li ul.sub-menu.toggle-on > li > a > button';
210
211				// Build Selector
212				var selector = selectorCloseButton + ',' + selectorParentAnchors + ',' + selectorParentToggles + ',' + selectorChildAnchors + ',' + selectorChildToggles;
213
214				// Elements Query
215				var $elements = $( selector );
216				var elementsArray = Array.prototype.slice.call( $elements );
217
218				// Elements
219				var $lastElement = elementsArray[ elementsArray.length - 1 ];
220				var $firstElement = elementsArray[0];

221				var $focusedElement = $(':focus')[0];
222
223				// Keys
224				tabKey = e.keyCode === 9;
225				shiftKey = e.shiftKey;
226
227				// Last Element Matched
228				if ( ! shiftKey && tabKey && $lastElement == $focusedElement ) {
229					e.preventDefault();
230					$firstElement.focus();
231				}
232
233				// First Element Matched
234				if ( shiftKey && tabKey && $firstElement == $focusedElement ) {
235					e.preventDefault();
236					$lastElement.focus();
237				}
238			});
239		},
240
241		// Responsive Videos
242		responsiveVideosInit: function () {
243			$( '.entry-content, .sidebar' ).fitVids();
244		},
245
246		// Widget Logic
247		widgetLogicInit: function () {
248			// Social Menu Widget
249			$( '.widget_nav_menu > div[class^="menu-social-"] > ul > li > a' ).wrapInner( '<span class="screen-reader-text"></span>' );
250
251			// Custom Menu Widget
252			$( '.widget_nav_menu .menu-item-has-children > a' ).append( '<span class="custom-menu-toggle" aria-expanded="false"></span>' );
253			$( '.widget_nav_menu .custom-menu-toggle' ).off( 'click' ).on( 'click', function( e ) {
254				e.preventDefault();
255				$( this ).toggleClass( 'toggle-on' );
256				$( this ).parent().next( '.sub-menu' ).toggleClass( 'toggle-on' );
257				$( this ).attr( 'aria-expanded', $( this ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
258			} );
259
260			// Pages Widget
261			$( '.widget_pages .page_item_has_children > a' ).append( '<span class="page-toggle" aria-expanded="false"></span>' );
262			$( '.widget_pages .page-toggle' ).off( 'click' ).on( 'click', function( e ) {
263				e.preventDefault();
264				$( this ).toggleClass( 'toggle-on' );
265				$( this ).parent().next( '.children' ).toggleClass( 'toggle-on' );
266				$( this ).attr( 'aria-expanded', $( this ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
267			} );
268
269			// Categories Widget
270			$( '.widget_categories' ).find( '.children' ).parent().addClass( 'category_item_has_children' );
271			$( '.widget_categories .category_item_has_children > a' ).append( '<span class="category-toggle" aria-expanded="false"></span>' );
272			$( '.widget_categories .category-toggle' ).off( 'click' ).on( 'click', function( e ) {
273				e.preventDefault();
274				$( this ).toggleClass( 'toggle-on' );
275				$( this ).parent().next( '.children' ).toggleClass( 'toggle-on' );
276				$( this ).attr( 'aria-expanded', $( this ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
277			} );
278		},
279
280		// Media Queries
281		mqInit: function () {
282			enquire
283				.register( 'screen and ( min-width: 992px )', {
284					match() {
285						// Big Screen Match
286						amphibious.bigScreenMatch();
287					},
288					unmatch() {
289						// Big Screen UnMatch
290						amphibious.bigScreenUnMatch();
291					},
292				} )
293				.register( 'screen and ( max-width: 991px )', {
294					match() {
295						// Small Screen Match
296						amphibious.smallScreenMatch();
297					},
298					unmatch() {
299						// Small Screen UnMatch
300						amphibious.smallScreenUnMatch();
301					},
302				} );
303		},
304	};
305
306	// Document Ready
307	$( document ).ready( function() {
308		// Responsive Videos
309		amphibious.responsiveVideosInit();
310
311		// Widget Logic
312		amphibious.widgetLogicInit();
313
314		// Media Queries
315		amphibious.mqInit();
316	} );
317
318	// Document Keyup
319	$( document ).keyup( function( e ) {
320		// Escape Key
321		if ( e.keyCode === 27 ) {
322			// Make the escape key to close the slide panel
323			amphibious.slidePanelCloseInit();
324		}
325	} );
326}( jQuery ) );