https://www.covetboard.com/wp-content/themes/jupiter/header-builde…/assets/js/mkhb-render.js?ver=6.1.1

1/*
2 * Common script for HB. For example: Fixed and Sticky Header animation.
3 */
4( function( $ ) {
5	// Set common variables.
6	var windowSel = $( window );
7	var bodySel = $( 'body' );
8	var fixedSel = $( '.mkhb-fixed' );
9	var stickySel = $( '.mkhb-sticky' );
10
11	// Used to check if responsive burger menu is active on normal header or not.
12	var normalRespNav = $( '.mkhb-navigation-resp__normal' );
13	// Used to check if responsive burger menu is active on sticky header or not.
14	var stickyRespNav = $( '.mkhb-navigation-resp__sticky' );
15
16	var windowHeight = windowSel.height();
17	// adminBarHeight value will be updated after window load, check initialAction().
18	var adminBarHeight = 0;
19
20	/**
21	 * HELPERS LIST
22	 */
23
24	// FH - Get Header offset.
25	function mkhbGetOffset( offset, device ) {
26		var deviceEl = $( '.mkhb-' + device );
27		var $deviceHeight = deviceEl.height();
28		var $offset = 0;
29		if ( typeof offset === 'string' && offset !== 'header' ) {
30			$offset = Math.round( ( parseInt( offset ) / 100 ) * windowHeight );
31		} else if ( typeof offset === 'number' ) {
32			$offset = parseInt( offset );
33		}
34
35		// Check if it's NaN or undefined.
36		if ( 0 == $offset || isNaN( $offset ) ) {
37			$offset = $deviceHeight;
38			if ( deviceEl.hasClass( 'mkhb-overlap' ) ) {
39				$offset = deviceEl.children( '.mkhb-device-container' ).height();
40			}
41		}
42
43		// If current main header height is bigger than offset, use it.
44		if ( $deviceHeight > $offset ) {
45			$offset = $deviceHeight;
46		}
47
48		return $offset;
49	}
50
51	// SH - Update admin bar height for Sticky header top position.
52	function mkhbUpdateTop() {
53		adminBarHeight = $( '#wpadminbar' ).height();
54		adminBarHeight = ( adminBarHeight == null ) ? 0 : adminBarHeight;
55	}
56
57	/**
58	 * FUNCTIONS LIST
59	 */
60
61	// FH - Set height of HB container.
62	function mkhbSetFixedHeight( selector ) {
63		selector.each( function( e ) {
64			var thisSel = $( this );
65			if ( ! thisSel.hasClass( 'mkhb-overlap' ) ) {
66				var childHeight = thisSel.children( '.mkhb-device-container' ).height();
67				thisSel.height( childHeight );
68			}
69		});
70	}
71
72	// SH - 1. Slide Down.
73	function mkhbSlideDown( current, offset, device, curHeight ) {
74		var onScroll = function onScroll() {
75			var addOffset = mkhbAddRespNormal( offset, device );
76			if ( windowSel.scrollTop() > addOffset ) {
77			    current.css({ 'top': adminBarHeight });
78			    current.addClass( 'mkhb-sticky--active' );
79			} else {
80				current.css({ 'top': -curHeight });
81			    current.removeClass( 'mkhb-sticky--active' );
82			    mkhbHideRespBurger();
83			}
84		};
85
86		onScroll();
87		windowSel.on( 'scroll', onScroll );
88	}
89
90	// SH - 2. Lazy.
91	function mkhbLazy( current, offset, device, curHeight ) {
92		var lastScrollPos = 0;
93		var onScroll = function onScroll() {
94			var addOffset = mkhbAddRespNormal( offset, device );
95			var scrollPos = windowSel.scrollTop();
96			if ( scrollPos > addOffset && scrollPos < lastScrollPos ) {
97			    current.css({ 'top': adminBarHeight });
98			    current.addClass( 'mkhb-sticky--active' );
99			} else {
100				current.css({ 'top': -curHeight });
101			    current.removeClass( 'mkhb-sticky--active' );
102			    mkhbHideRespBurger();
103			}
104			lastScrollPos = scrollPos;
105		};
106
107		onScroll();
108		windowSel.on( 'scroll', onScroll );
109	}
110
111	// SH - Hide/show responsive burger menu.
112	function mkhbHideRespBurger() {
113		// Skip if there is no responsive burger nav exist.
114		if ( stickyRespNav.length <= 0 ) {
115			return;
116		}
117
118		// Skip if there is no responsive burger nav active.
119		if ( $( 'body[class*="mkhb-navigation-resp--opened"]' ) <= 0 ) {
120			return;
121		}
122
123		stickyRespNav.each( function(){
124			// Find the navigation wrapper and navigation burger button.
125			var wrap = $( this );
126			var id = wrap.attr( 'id' ).replace( '-wrap', '' );
127			var current = $( '#' + id ).find( '.mkhb-navigation-resp' );
128
129			// Check if current responsive burger menu is opened. Then close it.
130			if ( bodySel.hasClass( 'mkhb-navigation-resp--opened-' + id ) ) {
131				current.removeClass('is-active').find('.mkhb-navigation-resp__container').removeClass('fullscreen-active');
132				bodySel.removeClass('mkhb-navigation-resp--opened-' + id).addClass('mkhb-navigation-resp--closed-' + id).trigger('mkhb-navigation-resp--closed-' + id);
133				wrap.hide();
134			}
135		} );
136	}
137
138	// NH - Get additional height of responsive burger nav container on normal header.
139	function mkhbAddRespNormal( offset, device ) {
140		// Skip if there is responsive burger nav exist.
141		if ( normalRespNav.length <= 0 ) {
142			return offset;
143		}
144
145		// Skip if there is responsive burger nav is not active.
146		if ( $( 'body[class*="mkhb-navigation-resp--opened"]' ) <= 0 ) {
147			return offset;
148		}
149
150		// Get device real height.
151		var deviceEl = $( '.mkhb-' + device );
152		var deviceHeight = deviceEl.height();
153
154		normalRespNav.each( function(){
155			var current = $( this );
156			var height = current.height();
157			var id = current.attr( 'id' ).replace( '-wrap', '' );
158
159			// Check if current responsive burger menu is opened.
160			if ( bodySel.hasClass( 'mkhb-navigation-resp--opened-' + id ) ) {
161				var newOffset = deviceHeight + parseInt( height );
162				if ( newOffset > offset ) {
163					offset = newOffset;
164				}
165				return offset;
166			}
167		} );
168
169		return offset;
170	}
171
172	/**
173	 * ACTIONS LIST
174	 */
175
176	// Action - FH - Handle all resize action.
177	var resizeHeader = function resizeHeader() {
178		var fixedRsz = $( '.mkhb-fixed' );
179		if ( fixedRsz.length > 0 ) {
180			mkhbSetFixedHeight( fixedRsz );
181		}
182	}
183
184	// Action - FH - Set the height of each devices.
185	if ( fixedSel.length > 0 ) {

186		mkhbSetFixedHeight( fixedSel );
187		windowSel.on( 'resize', resizeHeader );
188	}
189
190	// Actiion - SH - Play the effect for Sticky Header.
191	var initialAction = function initialAction() {
192		if ( stickySel.length > 0 ) {
193			stickySel.each( function( e ) {
194				var current = $( this );
195
196				// Set the offset when the sticky will be displayed.
197				var offset = current.data( 'offset' );
198				var device = current.data( 'device' );
199				offset = mkhbGetOffset( offset, device );
200
201				// Update adminBarHeight value.
202				mkhbUpdateTop();
203
204				// Set the initial position of the sticky menu.
205				var curHeight = current.height();
206				current.css({ 'top': -curHeight });
207
208				var effect = current.data( 'effect' );
209				if ( effect == 'slide-down' ) {
210					mkhbSlideDown( current, offset, device, curHeight );
211				} else if ( effect == 'lazy' ) {
212					mkhbLazy( current, offset, device, curHeight );
213				}
214			});
215		}
216	}
217
218	windowSel.on( 'load', initialAction );
219
220	windowSel.on( 'resize', mkhbUpdateTop );
221
222})( jQuery );