https://broadstonelosfeliz.com/assets/common/header/js/header.js

1$(function() {
2    // Remove and extract number from "header9" format
3    var headerTemplateNumber = headerTemplate.match(/\d+/g);
4    $('body').addClass('header-' + headerTemplateNumber);
5
6    //Add a class to the body if this is a side nav so that we can adjust style for it
7    if ($('body').hasClass('header-6') || $('body').hasClass('header-9') || $('body').hasClass('header-10')) {
8        $('body').addClass('side-nav');
9    }
10
11    var $header = $('.header-widget header');
12    var $headerLogo = $header.find('.header-logo img');
13    var $headerNav = $header.find('.header-nav');
14    var $menuNav = $header.find('.menu-nav');
15    var checkLogoOrientationTimer = setInterval(checkLogoOrientation, 20);
16
17    cleanMenus();
18
19    // setTimeout(function(){
20    //     var headerRatio = $headerLogo[0].naturalHeight / $headerLogo[0].naturalWidth;
21    //
22    //     console.log('setTimeout headerRatio', $headerLogo[0].naturalHeight, $headerLogo[0].naturalWidth, headerRatio);
23    // }, 400);
24
25    if (headerTemplateNumber != 6) {
26        addMoreDropdown();
27    } else {
28        $headerNav.css("visibility", "visible");
29    }
30
31    var lastScrollTop = 0;
32    $(window).scroll(function() {
33
34        st = $(this).scrollTop();
35        if (st < lastScrollTop) {
36            $header.addClass('show-top');
37        } else if (st > lastScrollTop) {
38            $header.removeClass('show-top');
39        }
40        lastScrollTop = st;
41        if ($(window).scrollTop() > 0) {
42            $header.addClass('header-sticky');
43        } else {
44            $header.removeClass('header-sticky');
45        }
46    });
47
48    $('.menu-toggle').click(function() {
49        var $menu = $('.' + $(this).data('toggle'));
50
51        if ($menu.hasClass('show')) {
52            $menu.removeClass('show');
53            $('body').removeClass('menu-open');
54        } else {
55            $menu.addClass('show');
56            $('body').addClass('menu-open');
57        }
58    });
59
60    $('.menu-close').click(function() {
61        var $menu = $(this).parent();
62
63        $menu.removeClass('show');
64        $('body').removeClass('menu-open');
65    });
66
67    function cleanMenus() {
68        var navs = $('.header-' + headerTemplateNumber + ' nav');
69
70        $.each(navs, function() {
71            $nav = $(this);
72            $nav.removeAttr('style');
73            $nav.find('ul').removeAttr('style');
74
75            $nav.find('li').each(function(idx) {
76                $(this).addClass('nav-item');
77                $(this).find('a').removeAttr('style');
78                $(this).find('span').removeAttr('style').addClass('active');
79            });
80        });
81    }
82
83    function checkLogoOrientation() {
84        var headerRatio = $headerLogo[0].naturalHeight / $headerLogo[0].naturalWidth;
85
86        if (!isNaN(headerRatio)) {
87            console.log('headerRatio', headerRatio);
88            if (headerRatio > .4) {
89                $headerLogo.addClass('header-logo-vert');
90            } else {
91                $headerLogo.removeClass('header-logo-vert');
92            }
93
94            $headerLogo.addClass('loaded');
95            setTimeout(function() {
96                $headerLogo.addClass('animate');
97            }, 1);
98
99            clearInterval(checkLogoOrientationTimer);
100            return;
101        }
102    }
103
104    function addMoreDropdown() {
105        var $moreDropdown = $('<ul class="dropdown-menu"></ul>');
106
107        $headerNav.find('li').each(function(idx) {
108            $moreDropdown.append($(this).clone().removeClass('nav-item').addClass('dropdown-menu-item'));
109        });
110        $moreLink = $('<li id="header-nav-more" class="dropdown hide"><a href="#" class="dropdown-toggle" role="button" data-toggle="dropdown">More <em class="fa fa-angle-down" aria-hidden="true"></em></a></li>');
111        $headerNav.find('ul').append($moreLink.append($moreDropdown));
112
113        $headerNav.removeClass('hide');
114        $headerNav.css("visibility", "visible");
115
116        updateMoreDropdown();
117
118        $(window).resize(updateMoreDropdown);
119        $(window).on("load", updateMoreDropdown);
120    }
121
122    function updateMoreDropdown() {
123        var $header = $('.header-widget header');
124        var $headerLogo = $header.find('.header-logo');
125        var $headerNav = $header.find('.header-nav');
126        var headerNavWidth = $headerNav.outerWidth();
127        var headerNavItems = $headerNav.find('.nav-item').removeClass('hide');
128        var dropdownMenuItems = $headerNav.find('.dropdown-menu-item').addClass('hide');
129        var headerNavItemsTotalWidth = 0;
130        var $headerNavMore = $('#header-nav-more').removeClass('hide');
131        var headerNavMoreWidth = $headerNavMore.outerWidth(true) + 15;
132
133        $headerNavMore.addClass('hide');
134
135        $(headerNavItems).each(function(idx) {
136            headerNavItemsTotalWidth += $(this).outerWidth(true);
137        });
138
139        if (headerNavItemsTotalWidth + 30 > $headerNav.outerWidth()) {
140
141            headerNavItemsTotalWidth = 0;
142
143            $(headerNavItems).each(function(idx) {
144                headerNavItemsTotalWidth += $(this).outerWidth(true);
145
146                if (headerNavItemsTotalWidth + headerNavMoreWidth + 30 > $headerNav.outerWidth()) {
147                    $(this).addClass('hide');
148                    $headerNavMore.removeClass('hide');
149                }
150            });
151
152            $(".header-nav").css("visibility", "visible");
153
154            $(dropdownMenuItems).each(function(idx) {
155                if ($(headerNavItems[idx]).hasClass('hide')) {
156                    $(this).removeClass('hide');
157                }
158            });
159        } else {
160            $(".header-nav").css("visibility", "visible");
161        }
162
163    }
164
165    $('.menu-drawer .nav-item a').on('click', function() {
166
167        if ($(window).width() < 1025 && typeof RP_SPS !== 'undefined' && RP_SPS.rpSPS == true) {
168            $('.menu-drawer').removeClass('show');
169        }
170    });

171
172    $('.menu-drawer .header-cta').on('click', function() {
173
174        if ($(window).width() < 1025 && typeof RP_SPS !== 'undefined' && RP_SPS.rpSPS == true) {
175            $('.menu-drawer').removeClass('show');
176        }
177    });
178
179    // Header 9 & 10 Specific
180
181    if ($('body').hasClass('header-9') || $('body').hasClass('header-10')) {
182        $('body').addClass('headers-910');
183    }
184
185    var progressHeight, liHeight, linkHeight, extraHeight;
186    $('.headers-910 .btnNavOpen, .headers-910 .hamBtnMobile').click(function() {
187        $('body').toggleClass('navOpen');
188        setTimeout(initResize, 250);
189    });
190    if (!($(".headers-910 .mobiHeader:visible").length)) {
191        $('body').addClass("navOpen");
192    }
193    if (!($(".headers-910 .topCTA").length)) {
194        $('.mobiHeader, .logo-main').addClass("noCTA");
195    }
196    $(".headers-910 .bodyMain").add(window).scroll(function() {
197        setTimeout(function() {
198            navProgressBar();
199        }, 80);
200    });
201
202
203    $(window).resize(function() {
204        setTimeout(function() {
205            navProgressBar();
206        }, 80);
207    });
208    $(".headers-910 .bodyMain").add(window).scroll(function() {
209        setTimeout(function() {
210            navProgressBar();
211        }, 80);
212    });
213    $(window).resize(function () {
214        setTimeout(function () { navProgressBar(); }, 80);
215        setStickyCTAHeight();
216    });
217    $(".headers-910 .bodyMain").add(window).scroll(function () {
218        setTimeout(function () { navProgressBar(); }, 80);
219        var scrollTop = $(window).scrollTop();
220        var topbarHeight = parseInt($(".block-area:eq(1)").css("padding-top"));
221        var windowView = $(window).outerHeight();
222    });
223    
224    setStickyCTAHeight();
225
226    function setStickyCTAHeight(){
227        $(".header-9 .mobiHeader").css("top", $(".header-9 #home .topCTAWrapper").height() + 25);
228
229        //Initially set in the Wilshire.js file when the fixTitle class is added to title
230        $(".header-9 .fixTitle").css("top", $(".header-9 #home .topCTAWrapper").height() + 52);
231
232        $(".header-9 .block-area").css("padding-top", $(".header-9 #home .topCTAWrapper").height() + 50);
233
234        $(".header-10 .mobiHeader").css("top", $(".header-10 .header-widget-9-10 .stickyHeader").height() + 15);
235
236        //Initially set in the Wilshire.js file when the fixTitle class is added to title
237        $(".header-10 .fixTitle").css("top", $(".header-10 .header-widget-9-10 .stickyHeader").height() + 42);
238
239        $(".header-10 .block-area").css("padding-top", $(".header-10 .header-widget-9-10 .stickyHeader").height() + 40);
240    }
241
242    function navProgressBar() {
243        if ($('.headers-910 .sidebarFlex .CMSListMenuUL .active').length) {
244            liHeight = $(".headers-910 .sidebarFlex .CMSListMenuUL .active").outerHeight();
245            linkHeight = $(".headers-910 .sidebarFlex .CMSListMenuUL .active a").outerHeight();
246            extraHeight = ((liHeight - linkHeight) / 2) + linkHeight;
247            progressHeight = ($('.headers-910 .sidebarFlex .CMSListMenuUL .active').offset().top - $('.headers-910 .sidebarFlex .CMSListMenuUL').offset().top - $('.headers-910 .sidebarFlex .CMSListMenuUL').scrollTop()) + extraHeight;
248        }
249        $(".headers-910 .nav-progress-bar").height(progressHeight);
250    }
251
252    function initResize() {
253        window.dispatchEvent(new Event('resize'))
254    }
255
256
257
258});