1var t = 0; 2var h = 0; 3var ct = 0; 4var b = 0; 5var header, headerContainer, headerSearchCart, topBar, body, headerHeight, LastScrollVal, headerVal, contactInfo, socialIconInnerParent, socialIconParent, headerSearchCartPositionResponsive, headerSearchCartPositionNonResponsive, topbBarInfoPosition, menuParent, portal, brandingInfo, portalResponsive, portalNonResponsive, mobileHeaderStyle; 6var scrollTopVal, headercontainerHeight, bannerLi, bannerBaseHeader, bannerArrowClass,darkHeader,responsiveSearchCartContainer,bannerThemecontainer,themeContentContainer,themeHeaderSixRes,themeHeaderSixResHeight,themeLogo,themeLogoHeight,themeLogoWidth,themeLogoHeightSlice,themeLogoWidthSlice,themeCurrencyList,themeCurrencyRes,themeCurrencyNonRes,themeSidebarContent,themeSidebarContentContainer,themeSidebarMobileContentContainer,hasHeaderSeven,langContainer,langNonResContainer,langResContainer,displayMode,currencyListUl,pageContainer; 7 8function removeClass(element, className) { 9 element && (element.className = element.className.replace(new RegExp(className, 'g'), '')); 10} 11 12function addClass(element, className) { 13 element && element.classList.add(className); 14} 15 16function VariableInit() { 17 headerSearchCartPositionResponsive = document.querySelectorAll('[data-search-cart-position-responsive="zptheme-search-cart-position-responsive"]')[0]; 18 headerSearchCart = document.querySelectorAll('[data-theme-search-cart-group="zptheme-search-cart-group"]')[0]; 19 headerSearchCartPositionNonResponsive = document.querySelectorAll('[data-search-cart-position-non-responsive="zptheme-search-cart-position-non-responsive"]')[0]; 20 topbBarInfoPosition = document.querySelectorAll('[data-topbarinfo-position="zptheme-topbarinfo-position"]')[0]; 21 contactInfo = document.querySelectorAll('[data-contact-info="zptheme-contact-info"]')[0]; 22 menuParent = document.querySelectorAll('[data-non-res-menu="zptheme-menu-non-res"]')[0]; 23 socialIconParent = document.querySelectorAll('[data-socialicon-parent="zptheme-socialicon-parent"]')[0]; 24 socialIconInnerParent = document.querySelectorAll('[data-socialicon-inner-parent="zptheme-socialicon-inner-parent"]')[0]; 25 portal = document.querySelectorAll('[data-theme-portal="zptheme-portal"]')[0]; 26 topBar = document.querySelectorAll('[data-theme-topbar="zptheme-topbar"]')[0]; 27 brandingInfo = document.querySelectorAll('[data-theme-branding-info="zptheme-branding-info"]')[0]; 28 header = document.querySelectorAll('[data-header="zptheme-data-header"]')[0] || document.querySelectorAll('[data-header="zptheme-data-header-transparent"]')[0] || document.querySelectorAll('[data-header="none"]')[0]; 29 headerContainer = document.querySelectorAll('[data-headercontainer="zptheme-data-headercontainer"]')[0]; 30 portal = document.querySelectorAll('[data-theme-portal="zptheme-portal"]')[0]; 31 portalResponsive = document.querySelectorAll('[data-theme-portal-responsive="zptheme-portal-responsive"]')[0]; 32 portalNonResponsive = document.querySelectorAll('[data-theme-portal-non-responsive="zptheme-portal-non-responsive"]')[0]; 33 verticalMmenu = document.querySelectorAll('[data-theme-vertical-menu="zptheme-vertical-menu"]')[0]; 34 35 themeCurrencyList = document.querySelectorAll('[data-theme-currency-list-container]')[0]; 36 themeCurrencyRes = document.querySelectorAll('[data-theme-currency-placeholder-res]')[0]; 37 themeCurrencyNonRes = document.querySelectorAll('[data-theme-currency-placeholder-non-res]')[0]; 38 39 langContainer = $D.get('[data-theme-lang-container]'); 40 langNonResContainer = $D.get('[data-theme-lang-container-non-res]'); 41 langResContainer = $D.get('[data-theme-lang-container-res]'); 42 43 body = document.getElementsByTagName("body")[0]; 44 header = document.querySelectorAll('[data-header="zptheme-data-header"]')[0] || document.querySelectorAll('[data-header="zptheme-data-header-transparent"]')[0] || document.querySelectorAll('[data-header="none"]')[0]; 45 if(!header){ 46 return; 47 } 48 headerVal = header.getAttribute("data-header").trim(); 49 headerHeight = header.clientHeight; 50 headerContainer = document.querySelectorAll('[data-headercontainer="zptheme-data-headercontainer"]')[0]; 51 if(!headerContainer){ 52 return; 53 } 54 headercontainerHeight = headerContainer.clientHeight; 55 scrollTopVal = headercontainerHeight - headerHeight; 56 57 // VARIABLE FOR BANNER BASE HEADER TEXT COLOR 58 59 bannerBaseHeader = document.querySelectorAll('[data-banner-base-header="theme-banner-base-header"]'); 60 bannerLi = document.querySelectorAll('[data-element-type="heroslide"]'); 61 hero = document.querySelector('.zphero') 62 63 // VARIABLE FOR BANNER BASE HEADER TEXT COLOR END 64 65 responsiveSearchCartContainer = document.querySelectorAll('[data-theme-responsive-search-cart]')[0]; 66 responsiveSearchCartTopbar = document.querySelectorAll('[data-theme-responsive-search-cart-topbar]')[0]; 67 68 searchCartScrollPosition = document.querySelectorAll('[data-search-cart-scrollposition-non-responsive="zptheme-search-cart-scrollposition-non-responsive"]')[0]; 69 70 bannerThemecontainer = document.querySelectorAll('[data-themebanner="zptheme-banner"]')[0]; 71
72 themeContentContainer = document.querySelectorAll('[data-theme-content-container="theme-content-container"]')[0]; 73 74 themeHeaderSixRes = document.querySelectorAll('[data-theme-header-six-res="theme-header-six-res"]')[0]; 75 76 if(themeHeaderSixRes){ 77 themeHeaderSixResHeight = themeHeaderSixRes.clientHeight; 78 } 79 80 themeLogo = document.querySelectorAll('[data-zs-logo]')[0]; 81 if(themeLogo){ 82 themeLogoHeight = themeLogo.style.height; 83 themeLogoHeightSlice = Number(themeLogoHeight.slice(0,-2)); 84 themeLogoWidth = themeLogo.style.width; 85 themeLogoWidthSlice = Number(themeLogoWidth.slice(0,-2)); 86 } 87 88 // HEADER STYLE 07 89 90 hasHeaderSeven = headerContainer.classList.contains('zpheader-style-07'); 91 92 93 // SIDEBAR VARIABLES 94 95 themeSidebarContent = $D.get('[data-theme-sidebar-content]'); 96 themeSidebarContentContainer = $D.get('[data-theme-sidebar-content-container]'); 97 themeSidebarMobileContentContainer = $D.get('[data-theme-sidebar-mobile-content-container]'); 98 99 mobileHeaderStyle = $D.get('[data-zs-mobile-headerstyle]') 100 if(mobileHeaderStyle){ 101 mobileHeaderStyle = mobileHeaderStyle.getAttribute("data-zs-mobile-headerstyle"); 102 } 103 104 currencyListUl = document.querySelector('[data-theme-currency-list-ul]'); 105 pageContainer = document.querySelector('.page-container'); 106} 107 108// ONSCROLL HEADER EFFECT 109function responsivechanges() { 110 if (!body) { 111 VariableInit(); 112 } 113 if(!headerContainer){ 114 return; 115 } 116 var offsetValLoad = window.pageYOffset; 117 118 if (document.documentElement.clientWidth > 992) { 119 if (topBar) { 120 topBar.removeAttribute('style'); 121 } 122 if(hasHeaderSeven && topBar && portal && headerSearchCart){ 123 if (portal.classList.contains('theme-portal-icon-enabled')) { 124 headerSearchCart.prepend(portal); 125 } 126 } 127 if (headerSearchCartPositionResponsive) { 128 headerSearchCartPositionResponsive.innerHTML = ''; 129 } 130 if (menuParent && menuParent.parentNode == contactInfo) { 131 menuParent.removeChild(contactInfo); 132 } 133 if (contactInfo && contactInfo.parentNode == socialIconInnerParent) { 134 contactInfo.removeChild(socialIconInnerParent); 135 } 136 if (socialIconParent) { 137 socialIconParent.appendChild(socialIconInnerParent); 138 var socialIconMoreBtn = document.querySelectorAll('[data-more-socialicon-parent]')[0]; 139 if (socialIconMoreBtn) { 140 $D.append(socialIconParent, socialIconMoreBtn); 141 } 142 } 143 if (headerSearchCart && headerSearchCartPositionNonResponsive) { 144 headerSearchCartPositionNonResponsive.appendChild(headerSearchCart); 145 } 146 if(responsiveSearchCartContainer && headerSearchCart){ 147 responsiveSearchCartContainer.innerHTML = ""; 148 } 149 if(headerContainer.className.indexOf('zpheader-style-02') >= 0 || headerContainer.className.indexOf('zpheader-style-03') >= 0){ 150 if(offsetValLoad < scrollTopVal && headerSearchCart && headerSearchCartPositionNonResponsive){ 151 headerSearchCartPositionNonResponsive.appendChild(headerSearchCart); 152 } 153 else if(menuParent && offsetValLoad > scrollTopVal && headerSearchCart && searchCartScrollPosition && header.className.indexOf('theme-header-animate') > -1){ 154 searchCartScrollPosition.appendChild(headerSearchCart); 155 } 156 } 157 if (contactInfo || contactInfo && !menuParent) { 158 topbBarInfoPosition.appendChild(contactInfo); 159 } 160 if (topBar && headerContainer.className.indexOf('zpheader-style-05') == -1) { 161 addClass(topBar, 'theme-topbar-not-in-header-05'); 162 } 163 if (portal && portalResponsive) { 164 portalResponsive.innerHTML = ''; 165 } 166 if (portalNonResponsive) { 167 portalNonResponsive.appendChild(portal); 168 } 169 if (!menuParent && !brandingInfo && headerSearchCart) { 170 header.setAttribute('style', 'display:flex'); 171 } 172 if(bannerThemecontainer){ 173 bannerThemecontainer.style.marginTop = '0px'; 174 } 175 if(themeContentContainer){
176 themeContentContainer.style.marginTop = '0px'; 177 } 178 if(menuParent){ 179 menuParent.style.maxHeight = "none"; 180 } 181 if(themeCurrencyList && themeCurrencyNonRes){ 182 themeCurrencyNonRes.appendChild(themeCurrencyList); 183 } 184 if(themeSidebarContent && themeSidebarMobileContentContainer){ 185 themeSidebarContentContainer.appendChild(themeSidebarContent); 186 } 187 removeClass(body,'theme-body-overflowhidden'); 188 } else { 189 if (topBar && (!headerSearchCart && !portal)) { 190 topBar.setAttribute('style', 'display:none'); 191 } 192 if(hasHeaderSeven && topBar && portal){ 193 if (topBar.querySelector('.zpcontainer') && portal.classList.contains('theme-portal-icon-enabled')) { 194 topBar.querySelector('.zpcontainer').appendChild(portal); 195 } 196 } 197 if ((topBar && headerSearchCart && headerSearchCartPositionResponsive && (headerSearchCart.parentElement !== headerSearchCartPositionResponsive)) || (headerSearchCart && verticalMmenu && headerSearchCartPositionResponsive && (headerSearchCart.parentElement !== headerSearchCartPositionResponsive)) || (hasHeaderSeven && headerSearchCart && headerSearchCartPositionResponsive && (headerSearchCart.parentElement !== headerSearchCartPositionResponsive))) { 198 headerSearchCartPositionResponsive.appendChild(headerSearchCart); 199 } 200 if(responsiveSearchCartContainer && headerSearchCart && !topBar && (headerSearchCart.parentElement !== responsiveSearchCartContainer)){ 201 responsiveSearchCartContainer.appendChild(headerSearchCart); 202 } 203 if(responsiveSearchCartContainer && headerSearchCart && topBar){ 204 addClass(responsiveSearchCartTopbar, 'theme-hide-responsive-topbar'); 205 } else if(responsiveSearchCartContainer && headerSearchCart && !topBar){ 206 removeClass(responsiveSearchCartTopbar, 'theme-hide-responsive-topbar'); 207 } 208 if (contactInfo && menuParent) { 209 menuParent.appendChild(contactInfo); 210 } 211 if ((contactInfo && socialIconInnerParent) && menuParent) { 212 contactInfo.appendChild(socialIconInnerParent); 213 214 } else if ((!contactInfo && socialIconInnerParent) && menuParent) { 215 menuParent.appendChild(socialIconInnerParent); 216 } 217 if (headerSearchCartPositionResponsive && headerSearchCartPositionNonResponsive && topBar || headerSearchCartPositionNonResponsive && verticalMmenu) { 218 headerSearchCartPositionNonResponsive.innerHTML = ''; 219 } 220 if (!menuParent && !brandingInfo && headerSearchCart && mobileHeaderStyle != '02') { 221 header.setAttribute('style', 'display:none'); 222 } 223 if (portal && portalResponsive) { 224 portalResponsive.appendChild(portal); 225 } 226 if(themeCurrencyList && themeCurrencyRes){ 227 themeCurrencyRes.appendChild(themeCurrencyList); 228 } 229 if(themeSidebarContent && themeSidebarMobileContentContainer){ 230 themeSidebarMobileContentContainer.appendChild(themeSidebarContent); 231 } 232 var deviceWidth = document.documentElement.clientWidth/2; 233 var deviceHeight = document.documentElement.clientHeight/2; 234 if(themeLogo && themeLogoHeightSlice >= deviceHeight || themeLogo && themeLogoWidthSlice >= deviceWidth){ 235 addClass(themeLogo,'mobileLogoAuto'); 236 } 237 if(menuParent){ 238 menuParent.style.maxHeight = ""; 239 } 240 } 241} 242 243function fullBannerHeaderColor(){ 244 if(hero){ 245 bannerBaseHeaderLength = bannerBaseHeader.length; 246 bannerLiLength = bannerLi.length; 247 var hasHeaderSix = headerContainer.classList.contains('zpheader-style-06'); 248 var hasHeaderTwo = headerContainer.classList.contains('zpheader-style-02'); 249 var arrowContainer = document.getElementsByClassName('zsslider-arrows-container'); 250 if (headerContainer.className.indexOf('theme-header-fixed') > 0 && hasHeaderSix == false && document.documentElement.clientWidth > 992) { 251 for (bl = 0; bl < bannerLiLength; bl++) { 252 if (bannerLi[bl].className.indexOf('zpdark-section') > -1 && bannerLi[bl].className.indexOf('curslide') > -1) { 253 for (bh = 0; bh < bannerBaseHeaderLength; bh++) { 254 addClass(bannerBaseHeader[bh], 'zpdark-header-portion'); 255 } 256 if (topBar) { 257 addClass(topBar, 'zpdark-header-portion'); 258 } 259 } else if ((bannerLi[bl].className.indexOf('zpdefault-section') > -1 && bannerLi[bl].className.indexOf('curslide') >
259 -1) || (bannerLi[bl].className.indexOf('zplight-section') > -1 && bannerLi[bl].className.indexOf('curslide') > -1)) { 260 for (bh = 0; bh < bannerBaseHeaderLength; bh++) { 261 removeClass(bannerBaseHeader[bh], 'zpdark-header-portion'); 262 } 263 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 264 removeClass(topBar, 'zpdark-header-portion'); 265 } 266 } 267 } 268 } 269 270 for(ac=0;ac<arrowContainer.length;ac++){ 271 var arrowSvg = arrowContainer[ac].getElementsByTagName('svg'); 272 for(asv=0;asv<arrowSvg.length;asv++){ 273 for (blsvg = 0; blsvg < bannerLiLength; blsvg++) { 274 if (bannerLi[blsvg].className.indexOf('zpdefault-section') > -1 && bannerLi[blsvg].className.indexOf('curslide') > -1 || bannerLi[blsvg].className.indexOf('zplight-section') > -1 && bannerLi[blsvg].className.indexOf('curslide') > -1) { 275 arrowSvg[asv].style.fill = '#404040'; 276 } 277 if (bannerLi[blsvg].className.indexOf('zpdark-section') > -1 && bannerLi[blsvg].className.indexOf('curslide') > -1){ 278 arrowSvg[asv].style.fill = '#fff'; 279 } 280 } 281 } 282 } 283 } 284} 285 286document.addEventListener("DOMContentLoaded", function(event) { 287 displayMode = displayMode(); 288 if(displayMode.isWebView){ 289 document.body.setAttribute('data-zs-display-mode','webview'); 290 } 291 responsivechanges(); 292 if(!headerContainer){ 293 return; 294 } 295 296 fullBannerHeaderColor(); 297 298 // MENU EVENT LISTENER 299 300 var menu = document.querySelector('[data-zp-theme-menu]'); 301 if(menu){ 302 menu.addEventListener('zsMenu:burgerIcon:open', onMobileMenuOpen); 303 menu.addEventListener('zsMenu:orientationchange', onMobileMenuOpen); 304 function onMobileMenuOpen() { 305 var currencyListClick = document.querySelector('[data-theme-currency-list-container]'); 306 var headercontainerHeightplus = headerContainer.clientHeight + 20; 307 var viewheight = document.documentElement.clientHeight; 308 var maxHeight = viewheight - headercontainerHeightplus; 309 if(themeHeaderSixRes){ 310 var themeHeaderSixResHeightPlus = themeHeaderSixRes.clientHeight + 20; 311 var maxHeight = viewheight - themeHeaderSixResHeightPlus; 312 } 313 body.setAttribute('data-theme-menu-max-height',maxHeight); 314 addClass(body,'theme-body-overflowhidden'); 315 var menucloseid = document.getElementById('themeMenuAnimateEnd'); 316 if(menucloseid){ 317 menucloseid.parentElement.removeChild(menucloseid); 318 } 319 320 var menuAnimateStyle = document.createElement('style'); 321 menuAnimateStyle.id = "themeMenuAnimate"; 322 menuAnimateStyle.type = "text/css"; 323 var cssText = document.createTextNode('.theme-responsive-menu-area.theme-navigation-and-icons .theme-menu-area .theme-menu.theme-toggle-animate{max-height: '+maxHeight+'px;-webkit-animation: toggleAnimate 0.2s linear 1; -moz-animation: toggleAnimate 0.2s linear 1; -ms-animation: toggleAnimate 0.2s linear 1; -o-animation: toggleAnimate 0.2s linear 1; animation: toggleAnimate 0.2s linear 1;} @-webkit-keyframes toggleAnimate { from { max-height: 0px; } } @-moz-keyframes toggleAnimate { from { max-height: 0px; } } @-ms-keyframes toggleAnimate { from { max-height: 0px; } } @-o-keyframes toggleAnimate { from { max-height: 0px; } } @keyframes toggleAnimate { from { max-height: 0px; } }'); 324 menuAnimateStyle.appendChild(cssText); 325 document.getElementsByTagName('head')[0].appendChild(menuAnimateStyle); 326 if(currencyListClick){ 327 currencyListClick.removeEventListener('click',openCurrency); 328 currencyListClick.addEventListener('click',openCurrency); 329 } 330 } 331 332 menu.addEventListener('zsMenu:burgerIcon:close', function onMobileMenuClose() { 333 removeClass(body,'theme-body-overflowhidden'); 334 var maxHeight = body.getAttribute('data-theme-menu-max-height'); 335 var menuAnimateEndStyle = document.createElement('style'); 336 menuAnimateEndStyle.id = "themeMenuAnimateEnd"; 337 menuAnimateEndStyle.type = "text/css"; 338 var cssText = document.createTextNode('.theme-responsive-menu-area.theme-navigation-and-icons .theme-menu-area .theme-menu.theme-toggle-animate-end{max-height:0px;-webkit-animation: toggleAnimateEnd 0.2s linear 1; -moz-animation: toggleAnimateEnd 0.2s linear 1; -ms-animation: toggleAnimateEnd 0.2s linear 1; -o-animation: toggleAnimateEnd 0.2s linear 1; animation: toggleAnimateEnd 0.2s linear 1;} @-webkit-keyframes toggleAnimateEnd { from { max-height: '+maxHeight+'px; visibility: visible; } } @-moz-keyframes toggleAnimateEnd { from { max-height: '+maxHeight+'px; visibility: visible; } } @-ms-keyframes toggleAnimateEnd { from { max-height: '+maxHeight+'px; visibility: visible; } } @-o-keyframes toggleAnimateEnd { from { max-height: '+maxHeight+'px; visibility: visible; } } @keyframes toggleAnimateEnd { from { max-height: '+maxHeight+'px; visibility: visible; } }'); 339 menuAnimateEndStyle.appendChild(cssText); 340 document.getElementsByTagName('head')[0].appendChild(menuAnimateEndStyle); 341 342 var menuopenid = document.getElementById('themeMenuAnimate'); 343 if(menuopenid){ 344 menuopenid.parentElement.removeChild(menuopenid); 345 } 346 }); 347 } 348 349 // BANNER BASED HEADER TEXT COLOR STARTS 350 351 if (hero) { 352 hero.addEventListener('sliderActive:changed', function(e) { 353 var data = e.detail; 354 var slide = data.slide; 355 var bannerLi = hero.querySelectorAll('[data-element-type="heroslide"]'); 356 var bannerBaseHeader = document.querySelectorAll('[data-banner-base-header="theme-banner-base-header"]'); 357 bannerBaseHeaderLength = bannerBaseHeader.length; 358 bannerLiLength = bannerLi.length; 359 var hasHeaderSix = headerContainer.classList.contains('zpheader-style-06'); 360 headercontainerHeight = headerContainer.clientHeight; 361 offsetVal = window.pageYOffset; 362 if (headerContainer.className.indexOf('theme-header-fixed') > 0 && hasHeaderSix == false && offsetVal <= headercontainerHeight && document.documentElement.clientWidth > 992) { 363 for (bhl = 0; bhl < bannerBaseHeaderLength; bhl++) { 364 if (bannerBaseHeader[bhl].className.indexOf('zpdark-header-portion') > -1) { 365 removeClass(bannerBaseHeader[bhl], 'zpdark-header-portion'); 366 } 367 } 368 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 369 removeClass(topBar, 'zpdark-header-portion'); 370 } 371 if (slide.className.indexOf('zpdark-section') > -1) { 372 for (bhl = 0; bhl < bannerBaseHeaderLength; bhl++) { 373 addClass(bannerBaseHeader[bhl], 'zpdark-header-portion'); 374 } 375 if (topBar) { 376 addClass(topBar, 'zpdark-header-portion'); 377 } 378 } 379 } 380
381 if (slide.className.indexOf('zplight-section') > -1 || slide.className.indexOf('zpdefault-section') > -1 ){ 382 var arrowContainer = document.getElementsByClassName('zsslider-arrows-container'); 383 for(ac=0;ac<arrowContainer.length;ac++){ 384 var arrowSvg = arrowContainer[ac].getElementsByTagName('svg'); 385 for(asv=0;asv<arrowSvg.length;asv++){ 386 arrowSvg[asv].style.fill = '#404040'; 387 } 388 } 389 } 390 else{ 391 var arrowContainer = document.getElementsByClassName('zsslider-arrows-container'); 392 for(ac=0;ac<arrowContainer.length;ac++){ 393 var arrowSvg = arrowContainer[ac].getElementsByTagName('svg'); 394 for(asv=0;asv<arrowSvg.length;asv++){ 395 arrowSvg[asv].style.fill = '#fff'; 396 } 397 } 398 } 399 400 }); 401 } 402 403 // BANNER BASED HEADER TEXT COLOR END 404 405 // ADDING ID TO pageContainer FOR SKIP to main CONTENT 406 407 if(pageContainer){ 408 pageContainer.setAttribute('id','thememaincontent'); 409 pageContainer.setAttribute('role','main'); 410 } 411 412 menuAccessibility(); 413 414 // EVENT DISPATCH FOR DOM CONTENT LOADED 415 416 var event = new Event('zs:header:dom', {}); 417 document.dispatchEvent(event); 418 mobileheader(); 419}); 420 421 422window.addEventListener('resize', function(event) { 423 responsivechanges(); 424 bannerLiScroll = document.querySelectorAll('[data-element-type="heroslide"]'); 425 bannerLiScrollLength = bannerLiScroll.length; 426 bannerBaseHeaderScrl = document.querySelectorAll('[data-banner-base-header="theme-banner-base-header"]'); 427 bannerBaseHeaderScrlLength = bannerBaseHeaderScrl.length; 428 headerContainer = document.querySelectorAll('[data-headercontainer="zptheme-data-headercontainer"]')[0]; 429 if(!headerContainer){ 430 return; 431 } 432 var hasHeaderSix = headerContainer.classList.contains('zpheader-style-06'); 433 if (topBar) { 434 var darkTopbar = topBar.getAttribute('data-dark-part-applied').trim(); 435 } 436 if(hasHeaderSix == false){ 437 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 438 var darkHeader = bannerBaseHeaderScrl[bhscrl].getAttribute('data-dark-part-applied').trim(); 439 } 440 } 441 headerContainerChildren = headerContainer.children; 442 if(document.documentElement.clientWidth < 992){ 443 headerContainer.style.top = '0px'; 444 if(topBar){ 445 topBar.style.opacity = '1'; 446 } 447 } 448 for (bnrScrl = 0; bnrScrl < bannerLiScrollLength; bnrScrl++) { 449 var bannerDark = bannerLiScroll[bnrScrl].classList.contains('zpdark-section'); 450 var hasHeaderSix = headerContainer.classList.contains('zpheader-style-06'); 451 if (headerContainer.className.indexOf('theme-header-fixed') > 0 && bannerLiScroll[bnrScrl].className.indexOf('zpdark-section') > -1 && bannerLiScroll[bnrScrl].className.indexOf('curslide') > -1 && hasHeaderSix == false && document.documentElement.clientWidth > 768 && document.documentElement.clientWidth < 1028) { 452 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 453 addClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 454 } 455 if (topBar) { 456 addClass(topBar, 'zpdark-header-portion'); 457 } 458 } 459 if (headerContainer.className.indexOf('theme-header-fixed') > 0 && hasHeaderSix == false && bannerDark == false && bannerLiScroll[bnrScrl].className.indexOf('curslide') > -1 && document.documentElement.clientWidth > 768 && document.documentElement.clientWidth < 1028) { 460 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 461 removeClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 462 } 463 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 464 removeClass(topBar, 'zpdark-header-portion'); 465 } 466 } 467 if (headerContainer.className.indexOf('theme-header-fixed') > 0 && document.documentElement.clientWidth < 992) { 468 if(hasHeaderSix == false){ 469 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 470 var darkHeader = bannerBaseHeaderScrl[bhscrl].getAttribute('data-dark-part-applied').trim(); 471 if (darkHeader == 'true') { 472 addClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 473 } 474 if (darkHeader == 'false' && bannerBaseHeaderScrl[bhscrl].className.indexOf('zpdark-header-portion') > -1) { 475 removeClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 476 } 477 } 478 } 479 if (topBar && darkTopbar == 'true') { 480 addClass(topBar, 'zpdark-header-portion'); 481 } 482 if (topBar && darkTopbar == 'false' && topBar.className.indexOf('zpdark-header-portion') > -1) { 483 removeClass(topBar, 'zpdark-header-portion'); 484 } 485 } 486 } 487 488 // CURRENCY RESIZE 489 490 var currencyListContainer = document.querySelector('[data-theme-currency-list-ul]'); 491 if(currencyListContainer){ 492 var currencyListClick = document.querySelector('[data-theme-currency-list-container]'); 493 var currencyContainerHeight = document.querySelector('[data-theme-currency-list-container]'); 494 var currencyPlaceHeight = document.querySelector('[data-theme-currency-placeholder-non-res]'); 495 var curHeight = currencyListContainer.firstChild.clientHeight; 496 if(window.innerWidth > 992){ 497 if(curHeight != 0){ 498 currencyPlaceHeight.style.height = curHeight+'px'; 499 currencyContainerHeight.style.height = curHeight+'px'; 500 } 501 } 502 else{ 503 currencyPlaceHeight.style.height = 'auto'; 504 currencyContainerHeight.style.height = 'auto'; 505 } 506 if(window.innerWidth < 992 ){ 507 currencyListContainer.addEventListener('click',function(){ 508 currencyListClick.removeEventListener('click',openCurrency); 509 }); 510 } 511 else{ 512 currencyListContainer.addEventListener('click',function(){ 513 currencyListClick.removeEventListener('click',openCurrency); 514 currencyListClick.addEventListener('click',openCurrency); 515 }); 516 } 517 } 518 519 // CURRENCY RESIZE END 520 521 // EVENT DISPATCH FOR RESIZING 522 523 var event = new Event('zs:header:resize', {}); 524 document.dispatchEvent(event); 525 drawerPlugin(); 526 fullBannerHeaderColor(); 527 hideLang(); 528 mobileheader(); 529}); 530 531window.addEventListener('scroll', function(event) { 532 if (!body) { 533 VariableInit(); 534 } 535 if(!headerContainer){ 536 return; 537 } 538 if(!header){ 539 return; 540 } 541 headerHeight = header.clientHeight; 542 headercontainerHeight = headerContainer.clientHeight; 543 var hasHeaderSix = headerContainer.classList.contains('zpheader-style-06'); 544 headerContainerChildren = headerContainer.children; 545 headerContainerChildrenLength = headerContainerChildren.length; 546 offsetVal = window.pageYOffset; 547 548 bannerLiScroll = document.querySelectorAll('[data-element-type="heroslide"]'); 549 bannerLiScrollLength = bannerLiScroll.length; 550 bannerBaseHeaderScrl = document.querySelectorAll('[data-banner-base-header="theme-banner-base-header"]'); 551 bannerBaseHeaderScrlLength = bannerBaseHeaderScrl.length; 552 553 var menu = document.querySelector('[data-zp-theme-menu]'); 554 555 if(hasHeaderSix == false){ 556 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 557 var darkHeader = bannerBaseHeaderScrl[bhscrl].getAttribute('data-dark-part-applied').trim(); 558 } 559 } 560 561 // HEADER STATIC TO FIXED ANIMATION STARTS 562 563 if (offsetVal > headercontainerHeight) { 564 if (headerContainer.className.indexOf('theme-header-fixed') == -1) { 565 if (headerVal == 'zptheme-data-header') { 566 if (header.className.indexOf('theme-header-animate') == -1) { 567 header.className += ' theme-header-animate'; 568 } 569 } 570 if (headerVal == 'zptheme-data-header-transparent') { 571 if (header.className.indexOf('theme-header-animate') == -1) { 572 header.className += ' theme-header-animate'; 573 } 574 if (header.className.indexOf('theme-header-transparent') == -1) { 575 header.className += ' theme-header-transparent'; 576 } 577 } 578 header.setAttribute('style', 'animation:headerStart 0.8s linear 1 alternate'); 579 if (headerVal == 'zptheme-data-header' && window.innerWidth > 992 || headerVal == 'zptheme-data-header-transparent' && window.innerWidth > 992) { 580 body.style.paddingTop = headerHeight + 'px'; 581 } 582 } 583 if(topBar && window.innerWidth > 992){ 584 topBar.style.opacity = '0'; 585 } 586 if(menuParent && searchCartScrollPosition && window.innerWidth > 992 && (header.className.indexOf('theme-header-animate') > -1 || headerContainer.className.indexOf('theme-header-animate') > -1)){ 587 searchCartScrollPosition.appendChild(headerSearchCart); 588 } 589 if(menuParent && headerSearchCartPositionNonResponsive && searchCartScrollPosition && window.innerWidth > 992){ 590 headerSearchCartPositionNonResponsive.innerHTML = ""; 591 menu && templateUti.dispatchEvent(menu, 'zsMenu:rewrap'); 592 } 593 if(menuParent && searchCartScrollPosition && window.innerWidth > 992){ 594 addClass(menuParent,'theme-menu-align-left'); 595 } 596 } 597 else{ 598 if (headerVal == 'zptheme-data-header') { 599 header.className = header.className.replace('theme-header-animate', ''); 600 } 601 if (headerVal == 'zptheme-data-header-transparent') { 602 header.className = header.className.replace('theme-header-animate', ''); 603 header.className = header.className.replace('theme-header-transparent', ''); 604 } 605 header.setAttribute('style', 'animation:noTopBarAni 0.8s linear 1 alternate;'); 606 body.style.paddingTop = '0px'; 607 if(topBar && window.innerWidth > 992){ 608 topBar.style.opacity = '1'; 609 } 610 if(menuParent && headerSearchCartPositionNonResponsive && searchCartScrollPosition && window.innerWidth > 992){ 611 headerSearchCartPositionNonResponsive.appendChild(headerSearchCart); 612 menu && templateUti.dispatchEvent(menu, 'zsMenu:rewrap'); 613 } 614 if(menuParent && searchCartScrollPosition && window.innerWidth > 992){ 615 removeClass(menuParent,'theme-menu-align-left'); 616 } 617 } 618 619 // HEADER STATIC TO FIXED ANIMATION END 620 621 // FULL WIDTH BANNER HEADER FIXED START 622 623 if (headerContainer.className.indexOf('theme-header-fixed') > 0) { 624 scrollTopVal = headercontainerHeight-headerHeight; 625 if (window.innerWidth > 992) { 626 headerContainer.setAttribute('style', 'top:' + (-offsetVal) + 'px;transition:none;'); 627 } 628 if (offsetVal >= headercontainerHeight) { 629 630 headerContainer.className = headerContainer.className.replace('theme-header-animate', ''); 631 if (headerVal == 'zptheme-data-header') { 632 headerContainer.className += ' theme-header-animate'; 633 for (bnrScrl = 0; bnrScrl < bannerLiScrollLength; bnrScrl++) { 634 if (window.innerWidth > 992 && darkHeader == 'true' && hasHeaderSix == false) { 635 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 636 addClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 637 } 638 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 639 topBar.className = topBar.className.replace('zpdark-header-portion', ''); 640 } 641 } 642 if (window.innerWidth > 992 && darkHeader == 'false' && hasHeaderSix == false) { 643 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 644 removeClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 645 } 646 } 647 } 648 if (window.innerWidth > 992) { 649 headerContainer.setAttribute('style', 'top:' + (-scrollTopVal) + 'px;transition:0.3s linear;'); 650 } 651 } 652 header.className = header.className.replace('theme-header-transparent', ''); 653 if (headerVal == 'zptheme-data-header-transparent') { 654 655 headerContainer.className += ' theme-header-animate'; 656 header.className += ' theme-header-transparent'; 657 658 for (bnrScrl = 0; bnrScrl < bannerLiScrollLength; bnrScrl++) { 659 if (window.innerWidth > 992 && darkHeader == 'true' && hasHeaderSix == false) { 660 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 661 addClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 662 } 663 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 664 topBar.className = topBar.className.replace('zpdark-header-portion', ''); 665 } 666 } 667 if (window.innerWidth > 992 && darkHeader == 'false' && hasHeaderSix == false) { 668 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 669 removeClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 670 } 671 } 672 } 673 if (window.innerWidth > 992) { 674 headerContainer.setAttribute('style', 'top:' + (-scrollTopVal) + 'px;transition:0.3s linear;'); 675 } 676 } 677 if (headerVal == '') { 678 if (window.innerWidth > 992) { 679 headerContainer.setAttribute('style', 'top:' + (-offsetVal) + 'px;'); 680 } 681 } 682 } 683 if (offsetVal < LastScrollVal) { 684 685 if (offsetVal < headercontainerHeight) { 686 if (headerVal == '') { 687 if (window.innerWidth > 992) { 688 headerContainer.setAttribute('style', 'top:' + (-offsetVal) + 'px;transition:0s linear;'); 689 } 690 } else { 691 if (window.innerWidth > 992) { 692 headerContainer.setAttribute('style', 'top:' + (-offsetVal) + 'px;transition:0.3s linear;'); 693 } 694 } 695 headerContainer.className = headerContainer.className.replace('theme-header-animate', ''); 696 headerContainer.className = headerContainer.className.replace('theme-header-transparent', ''); 697 for (bnrScrl = 0; bnrScrl < bannerLiScrollLength; bnrScrl++) { 698 var bannerDark = bannerLiScroll[bnrScrl].classList.contains('zpdark-section'); 699 if (bannerLiScroll[bnrScrl].className.indexOf('zpdark-section') > -1 && hasHeaderSix == false && bannerLiScroll[bnrScrl].className.indexOf('curslide') > -1 && window.innerWidth > 992) { 700 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 701 addClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 702 } 703 if (topBar) { 704 addClass(topBar, 'zpdark-header-portion'); 705 } 706 } else if (bannerDark == false && hasHeaderSix == false && bannerLiScroll[bnrScrl].className.indexOf('curslide') > -1 && window.innerWidth > 992) { 707 for (bhscrl = 0; bhscrl < bannerBaseHeaderScrlLength; bhscrl++) { 708 removeClass(bannerBaseHeaderScrl[bhscrl], 'zpdark-header-portion'); 709 } 710 if (topBar && topBar.className.indexOf('zpdark-header-portion') > -1) { 711 removeClass(topBar, 'zpdark-header-portion'); 712 } 713 714 } 715 716 } 717 } 718 } 719 } 720 721 // FULL WIDTH BANNER HEADER FIXED END 722 723
723 LastScrollVal = offsetVal; 724 725 // EVENT DISPATCH FOR SCROLL 726 727 var event = new Event('zs:header:scroll', {}); 728 document.dispatchEvent(event); 729 730}); 731 732// ONSCROLL HEADER EFFECT END 733var searchClick = 0; 734function toggleSearch(e) { 735 elem = e || window.event; 736 var elemParent = elem.closest('[data-zs-search-container]'); 737 var searchcont = elemParent.querySelector('[data-search="zptheme-search-container"]'); 738 var searchInput = elemParent.querySelector('[data-search-input="zptheme-search-input"]'); 739 var searchHideOverlay = elemParent.querySelector('[data-theme-search-overlay="theme-search-overlay"]'); 740 if(searchClick == 0){ 741 searchcont.style.display = 'block'; 742 searchHideOverlay.style.display = "block"; 743 searchInput.focus(); 744 elem.setAttribute('aria-expanded','true'); 745 searchClick = 1; 746 } 747 if(searchClick == 1){ 748 searchHideOverlay.addEventListener('click',function(){ 749 searchcont.style.display = "none"; 750 searchHideOverlay.style.display = "none"; 751 searchInput.value = ""; 752 elem.setAttribute('aria-expanded','false'); 753 searchClick = 0; 754 }); 755 } 756} 757 758var templateUti = { 759 dispatchEvent : function ( ctx, customEventType, details, capture ) { 760 761 function createCustomEvent( details ) { 762 763 var ev = null; 764 765 if (typeof CustomEvent === 'function') { 766 ev = new CustomEvent( customEventType, { 767 detail : details, 768 bubbles: true, 769 capture : !!capture 770 }); 771 } else { 772 ev = document.createEvent( 'CustomEvent' ); 773 774 ev.initCustomEvent( customEventType, true, true, details ); 775 } 776 777 return ev; 778 } 779 780 if (typeof ctx === 'string') { 781 capture = details; 782 details = customEventType; 783 customEventType = ctx; 784 ctx = document.body; 785 } 786 787 var evt = createCustomEvent( details ); 788 789 ctx.dispatchEvent( evt ); 790 } 791} 792function mobileheader(){ 793 if (document.documentElement.clientWidth < 992) { 794 if(mobileHeaderStyle == '03'){ 795 var mobileHeaderSearchInput = document.querySelector('[data-zs-mobile-header-search] [data-zs-search-input]'), 796 mobileHeaderSearchIcon = document.querySelector('[data-zs-mobile-header-search-icon]'), 797 mobileHeaderSearchBackButton = document.querySelector('[data-zs-mobile-header-search-back]'), 798 mobileHeaderSearchClearButton = document.querySelector('[data-zs-mobile-header-search-clear]'), 799 mobileHeaderClearSearchInput = ''; 800 if(window.location.href.indexOf("search-products") > -1){ 801 var mobileHeaderSearch = document.querySelector('[data-zs-mobile-header-search]'); 802 if(mobileHeaderSearch){ 803 mobileHeaderSearch.classList.add('theme-mobile-header-search-open'); 804 } 805 if(mobileHeaderSearchBackButton){ 806 mobileHeaderSearchBackButton.addEventListener('click',function(){ 807 history.go(-1); 808 }); 809 } 810 } 811 if(mobileHeaderSearchInput){ 812 mobileHeaderSearchInput.addEventListener('keyup',function(){ 813 if (this.value) { 814 this.closest('[data-zs-mobile-header-search]').querySelector('[data-zs-mobile-header-search-clear]').style.display = 'block'; 815 } else { 816 this.closest('[data-zs-mobile-header-search]').querySelector('[data-zs-mobile-header-search-clear]').style.display = 'none'; 817 } 818 }); 819 } 820 if(mobileHeaderSearchIcon){ 821 mobileHeaderSearchIcon.addEventListener('click',function(){ 822 this.closest('[data-zs-mobile-header-search]').classList.add('theme-mobile-header-search-open'); 823 this.closest('[data-zs-mobile-header-search]').querySelector('[data-zs-search-input]').focus(); 824 }); 825 } 826 if(mobileHeaderSearchBackButton){ 827 mobileHeaderSearchBackButton.addEventListener('click',function(){ 828 this.closest('[data-zs-mobile-header-search]').classList.remove('theme-mobile-header-search-open'); 829 }); 830 } 831 if(mobileHeaderSearchClearButton){ 832 mobileHeaderSearchClearButton.addEventListener('click',function(){ 833 mobileHeaderClearSearchInput = this.closest('[data-zs-mobile-header-search]').querySelector('[data-zs-search-input]'); 834 mobileHeaderClearSearchInput.value = "" 835 mobileHeaderClearSearchInput.focus(); 836 this.style.display = 'none'; 837 }); 838 } 839 var portalUserName = document.querySelector('[data-portal-profile]'), 840 portalLogoutParent = document.querySelector('[data-portal-logout]'); 841 if(portalUserName && portalLogoutParent && portalLogoutParent.parentNode){
842 portalUserName.appendChild(portalLogoutParent.parentNode); 843 } 844 drawerPlugin(); 845 }else if(mobileHeaderStyle == '02'){ 846 var mobileHeaderOpenSearchInput = document.querySelector('[data-zs-mobile-openstyle-searchbox] [data-zs-search-input]'); 847 if(mobileHeaderOpenSearchInput){ 848 mobileHeaderOpenSearchInput.blur(); 849 } 850 var menuclose = document.querySelector('[data-zp-theme-burger-icon]'); 851 if(menuclose && menuclose.classList.contains('theme-close-icon')){ 852 menuclose.click(); 853 } 854 var standalone = window.navigator.standalone || (window.matchMedia('(display-mode: standalone)').matches), 855 userAgent = window.navigator.userAgent.toLowerCase(), 856 safari = /safari/.test(userAgent), 857 ios = /iphone|ipod|ipad/.test(userAgent); 858 if (ios && !standalone && !safari) { //iOS webview check 859 var ishome = window.location.pathname === "/" ? true : false; 860 var mobileHeaderResponsiveGoBack = document.querySelector('[data-zs-mobile-header-responsive-goback]'), 861 mobileHeaderBranding = document.querySelector('[data-zs-branding]'), 862 mobileHeaderResponsiveMenuArea = document.querySelector('[data-zs-responsive-menu-area]'); 863 if(ishome){ 864 if(mobileHeaderResponsiveGoBack){ 865 mobileHeaderResponsiveGoBack.style.display = 'none'; 866 } 867 if(mobileHeaderBranding){ 868 mobileHeaderBranding.style.display = 'flex'; 869 } 870 if(mobileHeaderResponsiveMenuArea){ 871 mobileHeaderResponsiveMenuArea.style.flex = ''; 872 } 873 }else{ 874 if(mobileHeaderResponsiveGoBack){ 875 mobileHeaderResponsiveGoBack.style.display = 'flex'; 876 } 877 if(mobileHeaderBranding){ 878 mobileHeaderBranding.style.display = 'none'; 879 } 880 if(mobileHeaderResponsiveMenuArea){ 881 mobileHeaderResponsiveMenuArea.style.flex = '1 1 auto'; 882 } 883 } 884 } 885 } 886 } 887} 888 889function drawerPlugin(){ 890 var drawerPlugin = {}; 891 drawerPlugin.init = function() { 892 drawerPlugin.drawerWrapper = document.querySelector("[data-zs-drawer]"); 893 drawerPlugin.drawerOpenButton = document.querySelectorAll("[data-zs-drawer-open-button]"); 894 drawerPlugin.drawerCloseButton = document.querySelector("[data-zs-drawer-close-button]"); 895 896 if(drawerPlugin.drawerOpenButton){ 897 drawerPlugin.drawerOpenButton.forEach(function(drawerOpenButton){ 898 drawerOpenButton.addEventListener("click", function(){ 899 drawerPlugin.open(this.getAttribute('data-zs-drawer-open-button')); 900 }); 901 }); 902 } 903 if(drawerPlugin.drawerCloseButton){ 904 drawerPlugin.drawerCloseButton.addEventListener("click", function(){ 905 drawerPlugin.close(); 906 }); 907 } 908 } 909 drawerPlugin.open = function(targetContentSelector){ 910 var targetContent = document.querySelector("[data-zs-drawer-content="+targetContentSelector+"]"); 911 if(targetContent && drawerPlugin.drawerWrapper){ 912 drawerPlugin.drawerWrapper.classList.add('active'); 913 targetContent.classList.add('active'); 914 } 915 document.getElementsByTagName("body")[0].classList.add('theme-body-overflowhidden'); 916 } 917 drawerPlugin.close = function(){ 918 var activeDrawerContent = document.querySelector("[data-zs-drawer-content].active"); 919 if(activeDrawerContent && drawerPlugin.drawerWrapper){ 920 drawerPlugin.drawerWrapper.classList.remove('active'); 921 activeDrawerContent.classList.remove('active'); 922 } 923 document.getElementsByTagName("body")[0].classList.remove('theme-body-overflowhidden'); 924 } 925 drawerPlugin.init(); 926} 927 928function displayMode(){ 929 var standalone = window.navigator.standalone || (window.matchMedia('(display-mode: standalone)').matches), 930 userAgent = window.navigator.userAgent.toLowerCase(), 931 android = /android/.test(userAgent); 932 safari = /safari/.test(userAgent), 933 ios = /iphone|ipod|ipad/.test(userAgent) || navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1, 934 webview = (android && /; wv\)/.test(userAgent)) || (ios && !standalone && !safari), 935 displayMode = { 936 "standalone" : standalone, 937 "isWebView" : webview, 938 "platform" : ios ? 'ios' : android ? 'android' : 'other' 939 };
940 return displayMode; 941} 942 943 944// CURRENCY OPTION CODE 945 946function hideCurrency(){ 947 var currencyList = document.querySelectorAll('[data-theme-currency-list]'); 948 var currencyListContainer = document.querySelector('[data-theme-currency-list-ul]'); 949 var currencyHideOverlay = document.querySelector('[data-theme-currency-hide-overlay]'); 950 var resMenu = document.querySelector('[data-non-res-menu="zptheme-menu-non-res"]'); 951 var currencyMobileOpenTop = document.querySelector('[data-theme-currency-open-top]'); 952 for(cur=0;cur<currencyList.length;cur++){ 953 currencyList[cur].style.display = 'none'; 954 currencyListContainer.firstChild.style.display = "flex"; 955 removeClass(currencyListContainer,'theme-currency-open'); 956 if(currencyList[cur].hasAttribute('tabindex')){ 957 currencyList[cur].removeAttribute('tabindex') 958 } 959 } 960 currencyHideOverlay.style.display = "none"; 961 currencyMobileOpenTop.style.display = "none"; 962 removeClass(resMenu,'theme-change-zindex'); 963 var currencyListClick = document.querySelector('[data-zs-currency-list]'); 964 currencyListClick.setAttribute('aria-expanded','false'); 965 currencyListClick.setAttribute('aria-haspopup','true'); 966 currencyListClick.setAttribute('role','button'); 967} 968function closeCurrencyMobile(){ 969 var currencyList = document.querySelectorAll('[data-theme-currency-list]'); 970 var currencyListContainer = document.querySelector('[data-theme-currency-list-ul]'); 971 var currencyHideMobile = document.querySelector('[data-theme-currency-hide-mobile]'); 972 var currencyMobileOpenTop = document.querySelector('[data-theme-currency-open-top]'); 973 var menuId = currencyListContainer.getAttribute('data-theme-currency-list-ul'); 974 var menuClose = document.querySelector('[data-zp-burger-clickable-area="'+menuId+'"]'); 975 var resMenu = document.querySelector('[data-non-res-menu="zptheme-menu-non-res"]'); 976 for(cur=0;cur<currencyList.length;cur++){ 977 currencyList[cur].style.display = 'none'; 978 currencyListContainer.firstChild.style.display = "flex"; 979 removeClass(currencyListContainer,'theme-currency-open'); 980 } 981 if(mobileHeaderStyle != '03'){ 982 menuClose.click(); 983 } 984 currencyHideMobile.style.display = "none"; 985 currencyMobileOpenTop.style.display = "none"; 986 removeClass(resMenu,'theme-change-zindex'); 987} 988function currentCurrency(currentList){ 989 var currencyListContainer = document.querySelector('[data-theme-currency-list-ul]'); 990 var currenyOpen = currencyListContainer.classList.contains('theme-currency-open'); 991 var currencyList = document.querySelectorAll('[data-theme-currency-list]'); 992 var menuId = currencyListContainer.getAttribute('data-theme-currency-list-ul'); 993 var currencyMobileOpenTop = document.querySelector('[data-theme-currency-open-top]'); 994 var menuClose = document.querySelector('[data-zp-burger-clickable-area="'+menuId+'"]'); 995 var resMenu = document.querySelector('[data-non-res-menu="zptheme-menu-non-res"]'); 996 if(currentList != currencyListContainer.childNodes[0]){ 997 currencyListContainer.insertBefore(currentList,currencyListContainer.childNodes[0]); 998 // multi_currency.change(currentList.innerText); 999 } 1000 if(currenyOpen == true && mobileHeaderStyle != '03'){ 1001 menuClose.click(); 1002 } 1003 currencyMobileOpenTop.style.display = "none"; 1004 if(window.innerWidth <= 992){ 1005 for(cur=0;cur<currencyList.length;cur++){ 1006 currencyList[cur].style.display = 'none'; 1007 currencyListContainer.firstChild.style.display = "flex"; 1008 removeClass(currencyListContainer,'theme-currency-open'); 1009 } 1010 if(resMenu){ 1011 removeClass(resMenu,'theme-change-zindex'); 1012 } 1013 } 1014 var currencyListClick = document.querySelector('[data-zs-currency-list]'); 1015 currencyListClick.setAttribute('aria-expanded','false'); 1016 currencyListClick.setAttribute('aria-haspopup','true'); 1017 currencyListClick.setAttribute('role','button'); 1018 currencyListClick.focus(); 1019} 1020 1021function openCurrency(){ 1022 var currencyList = document.querySelectorAll('[data-theme-currency-list]'); 1023 var currencyListContainer = document.querySelector('[data-theme-currency-list-ul]'); 1024 var currencyHideOverlay = document.querySelector('[data-theme-currency-hide-overlay]'); 1025 var currencyHideMobile = document.querySelector('[data-theme-currency-hide-mobile]'); 1026 var currencyMobileOpenTop = document.querySelector('[data-theme-currency-open-top]'); 1027 var resMenu = document.querySelector('[data-non-res-menu="zptheme-menu-non-res"]'); 1028 for(cur=0;cur<currencyList.length;cur++){ 1029 if(currencyList[cur].style.display == 'flex'){ 1030 currencyList[cur].style.display = 'none'; 1031 currencyListContainer.firstChild.style.display = "flex"; 1032 removeClass(currencyListContainer,'theme-currency-open'); 1033 currencyHideOverlay.style.display = "none"; 1034 removeClass(resMenu,'theme-change-zindex'); 1035 currencyMobileOpenTop.style.display = "none"; 1036 var currencyListClick = document.querySelector('[data-zs-currency-list]'); 1037 currencyListClick.setAttribute('aria-expanded','false'); 1038 currencyListClick.setAttribute('aria-haspopup','true'); 1039 currencyListClick.setAttribute('role','button'); 1040 var parentUl = currencyList[cur].parentElement; 1041 var allCurrency = parentUl.querySelectorAll('[data-theme-currency-list]'); 1042 for(var ac=0;ac<allCurrency.length;ac++){ 1043 if(allCurrency[ac].hasAttribute('tabindex')){ 1044 allCurrency[ac].removeAttribute('tabindex') 1045 } 1046 } 1047 } 1048 else{ 1049 currencyList[cur].style.display = 'flex'; 1050 addClass(currencyListContainer,'theme-currency-open'); 1051 currencyHideOverlay.style.display = "block"; 1052 currencyHideMobile.style.display = "block"; 1053 currencyMobileOpenTop.style.display = "flex"; 1054 addClass(resMenu,'theme-change-zindex'); 1055 var currencyListClick = document.querySelector('[data-zs-currency-list]'); 1056 currencyListClick.setAttribute('aria-expanded','true'); 1057 currencyListClick.setAttribute('aria-haspopup','false'); 1058 currencyListClick.removeAttribute('role'); 1059 var parentUl = currencyList[cur].parentElement; 1060 var allCurrency = parentUl.querySelectorAll('[data-theme-currency-list]'); 1061 for(var ac=0;ac<allCurrency.length;ac++){ 1062 allCurrency[ac].setAttribute('tabindex','0') 1063 } 1064 var firstLi = currencyListClick.querySelector('[data-theme-currency-list]') 1065 firstLi.focus(); 1066 } 1067 } 1068} 1069 1070// CURRENCY OPTION CODE END 1071 1072 1073// ACCESSIBILITY 1074 1075function hideOnBlur(elm,matchesEl,hidefunction,foucsAgainElem){ 1076 elm.addEventListener('blur',function(e){ 1077 setTimeout(function(){ 1078 var isFocused = matchesEl.matches(':focus-within'); 1079 if(!isFocused){ 1080 hidefunction(); 1081 }else if(foucsAgainElem){ 1082 foucsAgainElem.addEventListener('focus',function(e){ 1083 hidefunction(); 1084 this.setAttribute('aria-expanded','false'); 1085 this.setAttribute('aria-haspopup','true'); 1086 }) 1087 } 1088 }
1088,0) // Needed this 0s timout for safari to make support this :focus-within 1089 }) 1090} 1091 1092 1093// CURRENCY ACCESSIBILITY FOCUS KEYPRESS 1094 1095var currencyTarget = document.querySelector('[data-zs-currency-list]'); 1096var currencyListUl = document.querySelector('[data-theme-currency-list-ul]'); 1097var currencyList = currencyListUl && currencyListUl.querySelectorAll('[data-theme-currency-list]'); 1098if(currencyTarget){ 1099 currencyTarget.addEventListener('click',openCurrency); 1100 currencyTarget.addEventListener('keydown',function(e){ 1101 if(e.which === 13){ 1102 this.click(); 1103 } 1104 if(e.which === 9){ 1105 hideOnBlur(this,this,hideCurrency); 1106 } 1107 }); 1108 for(var i=0; i<currencyList.length; i++){ 1109 currencyList[i].addEventListener('keydown',function(e){ 1110 if(e.which === 13){ 1111 this.click(); 1112 currencyTarget.focus(); 1113 e.stopPropagation(); 1114 } 1115 if(e.which === 9){ 1116 hideOnBlur(this,currencyListUl,hideCurrency); 1117 } 1118 if(e.which === 27){ 1119 hideCurrency(); 1120 currencyTarget.focus(); 1121 currencyTarget.role = 'button'; 1122 } 1123 }) 1124 } 1125} 1126 1127// SEARCH ACCESSIBILITY 1128 1129var headerSearchIcon = document.querySelector('[data-zs-search-icon]'); 1130var searchHideOverlay = document.querySelector('[data-theme-search-overlay="theme-search-overlay"]'); 1131var searchFormCont = document.querySelector('[data-search]'); 1132var searchInputs = searchFormCont && searchFormCont.querySelectorAll('input'); 1133document.addEventListener('keydown',function(e){ 1134 var searchOverlayDisplay = searchHideOverlay && searchHideOverlay.style.display; 1135 if(searchOverlayDisplay != 'none' && e.which === 27){ 1136 hideSearchOnblur(); 1137 headerSearchIcon && headerSearchIcon.focus(); 1138 } 1139}) 1140function hideSearchOnblur(){ 1141 searchHideOverlay && searchHideOverlay.click(); 1142} 1143if(headerSearchIcon){ 1144 headerSearchIcon.addEventListener('keydown',function(e){ 1145 if(e.which === 13){ 1146 if(searchClick == 0){ 1147 this.click(); 1148 e.preventDefault(); 1149 }else{ 1150 hideSearchOnblur(); 1151 } 1152 } 1153 }); 1154 for(var i=0;i<searchInputs.length;i++){ 1155 searchInputs[i].addEventListener('keydown',function(e){ 1156 if(e.which === 9){ 1157 hideOnBlur(this,searchFormCont,hideSearchOnblur); 1158 } 1159 }) 1160 } 1161} 1162 1163// MENU ACCESSIBILITY 1164 1165function menuAccessibility(){ 1166 var submenuClickableArrow = document.querySelectorAll('[data-theme-accessible-submenu]'); 1167 var mainMenuContainer = document.querySelector('[data-zs-menu-container]'); 1168 var allMenuAnchor = mainMenuContainer && mainMenuContainer.querySelectorAll('a'); 1169 var megamenuBackdrop = document.querySelector('.zpmm-backdrop-enabled'); 1170 function displayNoneElem(elem){ 1171 elem && (elem.style.display = 'none') 1172 } 1173 function displayBlockElem(elem){ 1174 elem && (elem.style.display = 'block') 1175 } 1176 function currentSubmenuUl(currentEl){ 1177 var currentLi = currentEl.closest('li'); 1178 var currentSubMenu = currentLi.querySelector('ul'); 1179 displayBlockElem(currentSubMenu) 1180 var currentSubMenuFirstAnchor = currentSubMenu.firstChild.querySelector('a'); 1181 currentSubMenuFirstAnchor.focus(); 1182 var currentSubMenuAllLi = currentSubMenu.querySelectorAll('li'); 1183 for(var i=0;i<currentSubMenuAllLi.length;i++){ 1184 currentSubMenuAllLi[i].role = 'menuitem'; 1185 } 1186 } 1187 function findTopLevelLi(element) { 1188 var currentElement = element; 1189 while (currentElement && currentElement.tagName === 'LI') { 1190 element = currentElement; 1191 currentElement = currentElement.parentElement.parentElement; 1192 } 1193 return element; 1194 } 1195 function hideAllCurrentSubmenus(element){ 1196 var topLevelLi = findTopLevelLi(element.parentElement) 1197 var allSubmenuContainer = topLevelLi.querySelectorAll('[data-zs-submenu-container]'); 1198 for(as=0;as<allSubmenuContainer.length;as++){ 1199 displayNoneElem(allSubmenuContainer[as]) 1200 } 1201 } 1202 function nextlevelLiFocus(elem){ 1203 var closestFirstLevelLi = findTopLevelLi(elem.parentElement); 1204 var nextFirstLevlLi = closestFirstLevelLi.nextElementSibling; 1205 var nextLevelAnchor = nextFirstLevlLi && nextFirstLevlLi.querySelector('a'); 1206 event.preventDefault(); 1207 nextLevelAnchor && nextLevelAnchor.focus(); 1208 } 1209 function curentLevelLiFocus(elem){ 1210 var curFirstLevelLi = findTopLevelLi(elem.parentElement); 1211 var curFirstLevelAnchor = curFirstLevelLi && curFirstLevelLi.querySelector('a'); 1212 curFirstLevelAnchor && curFirstLevelAnchor.focus(); 1213 } 1214 if(mainMenuContainer){ 1215 for(var i=0;i<submenuClickableArrow.length;i++){ 1216 var isItSubmenu = submenuClickableArrow[i].closest('[data-zs-submenu-container]'); 1217 var isMegaMenu = submenuClickableArrow[i].parentElement.hasAttribute('data-megamenu'); 1218 if(isMegaMenu){ 1219 var menuName = submenuClickableArrow[i].innerText; 1220 submenuClickableArrow[i].setAttribute('aria-label',i18n.get('accessibility.menu.menu_has_submenu', menuName)); 1221 } 1222 submenuClickableArrow[i].addEventListener('keydown',function(e){ 1223 var isItSubmenu = this.closest('[data-zs-submenu-container]'); 1224 var isMegaMenu = this.parentElement.hasAttribute('data-megamenu'); 1225 var megamenuId = isMegaMenu && this.parentElement.getAttribute('data-megamenu'); 1226 var megamenuCont = document.querySelector('[data-megamenu-content="'+megamenuId+'"]'); 1227 if( e.which === 40 || e.which === 32){ 1228 if(!isMegaMenu){ 1229 // SHOW SUBMENU 1230 currentSubmenuUl(this) 1231 e.preventDefault(); 1232 }else{ 1233 1234 // SHOW MEGAMENU 1235 1236 var megamenuDirection = document.querySelector("[data-megamenu-direction]").getAttribute('data-megamenu-direction'); 1237 var sidebarnav = document.querySelector('.theme-veritical-nav-with-sidebar'); 1238 1239 if (megamenuDirection == 'right') { 1240 var megamenuContentContainer = $D.get('[data-megamenu-content-container]'); 1241 var megamenuItemBounding = this.parentElement.getBoundingClientRect(); 1242 var firstMegamenuItemBounding = this.parentElement.parentElement.firstChild.getBoundingClientRect(); 1243 var firstVisibleMegamenuItem, lastVisibleMegamenuItem, elPos; 1244 var megamenuItems = this.parentElement.parentElement.querySelectorAll("[data-megamenu]"); 1245 for (var i = 0; i < megamenuItems.length; i++) { 1246 var isElemOutOfViewport = isOutOfViewport(megamenuItems[i]); 1247 if ((firstVisibleMegamenuItem == 'undefined' || firstVisibleMegamenuItem == null) && isElemOutOfViewport.top == false) { 1248 firstVisibleMegamenuItem = megamenuItems[i] 1249 } 1250 if ((firstVisibleMegamenuItem != 'undefined' || firstVisibleMegamenuItem != null) && (lastVisibleMegamenuItem == 'undefined' || lastVisibleMegamenuItem == null) && isElemOutOfViewport.bottom == true) { 1251 lastVisibleMegamenuItem = megamenuItems[i - 1] 1252 } else if (i == megamenuItems.length - 1) { 1253 lastVisibleMegamenuItem = megamenuItems[i] 1254 } 1255 } 1256 elPos = getPosition(firstVisibleMegamenuItem); 1257 megamenuCont.style.top = elPos.top - 30 + "px"; 1258 if ((lastVisibleMegamenuItem.getBoundingClientRect().top - firstVisibleMegamenuItem.getBoundingClientRect().top) < 450) { 1259 megamenuCont.style.height = 500 + "px"; 1260 } else { 1261 megamenuCont.style.height = lastVisibleMegamenuItem.getBoundingClientRect().top + lastVisibleMegamenuItem.getBoundingClientRect().height - firstVisibleMegamenuItem.getBoundingClientRect().top + 60 + "px"; 1262 } 1263 megamenuCont.style.left = megamenuContentContainer.clientWidth + "px"; 1264 megamenuCont.style.width = (window.innerWidth || document.documentElement.clientWidth) - megamenuContentContainer.clientWidth + "px"; 1265 1266 1267 if (typeof(sidebarnav) == 'undefined' || sidebarnav == null) { 1268 megamenuCont.style.top = firstMegamenuItemBounding.top - 30 + "px"; 1269 } 1270 addClass(megamenuCont,'mmactive'); 1271 displayBlockElem(megamenuBackdrop) 1272 1273 }else{ 1274 addClass(megamenuCont,'mmactive'); 1275 displayBlockElem(megamenuBackdrop) 1276 } 1277 var megamenuLinks = megamenuCont.querySelectorAll('a'); 1278 megamenuLinks[0].focus(); 1279 1280 // HIDE MEGAMENU 1281 1282 var currentMegamenuLi = this.parentElement; 1283 function currentMainAnchorFocus(event){ 1284 var curMegamenuAnchor = currentMegamenuLi.querySelector('a'); 1285 event.preventDefault(); 1286 curMegamenuAnchor.focus(); 1287 displayNoneElem(megamenuBackdrop) 1288 $D.hasClass(body,'theme-body-overflowhidden') && removeClass(body,'theme-body-overflowhidden'); 1289 } 1290 function nextMainAnchorFocus(event){ 1291 var nextLiElem = currentMegamenuLi.nextElementSibling; 1292 var nextAnchorElem = nextLiElem && nextLiElem.querySelector('a'); 1293 event.preventDefault(); 1294 nextAnchorElem && nextAnchorElem.focus(); 1295 displayNoneElem(megamenuBackdrop) 1296 if(!nextAnchorElem){ 1297 currentMainAnchorFocus(event) 1298 } 1299 $D.hasClass(body,'theme-body-overflowhidden') && removeClass(body,'theme-body-overflowhidden'); 1300 } 1301 megamenuLinks.forEach(function (megamenuLink, index) { 1302 megamenuLink.addEventListener('keydown', function (event) { 1303 var currentMegamenuCont = this.closest('[data-megamenu-content]'); 1304 if (index === 0 && event.which === 9 && event.shiftKey) { 1305 $D.hasClass(currentMegamenuCont,'mmactive') && removeClass(currentMegamenuCont,'mmactive'); 1306 currentMainAnchorFocus(event); 1307 } 1308 if (index === megamenuLinks.length - 1 && event.which === 9 && !event.shiftKey) { 1309 $D.hasClass(currentMegamenuCont,'mmactive') && removeClass(currentMegamenuCont,'mmactive'); 1310 nextMainAnchorFocus(event); 1311 } 1312 if(event.which === 27){ 1313 var currentMegamenuCont = this.closest('[data-megamenu-content]'); 1314 $D.hasClass(currentMegamenuCont,'mmactive') && removeClass(currentMegamenuCont,'mmactive'); 1315 displayNoneElem(megamenuBackdrop) 1316 var curMegamenuAnchor = currentMegamenuLi.querySelector('a'); 1317 event.preventDefault(); 1318 curMegamenuAnchor.focus(); 1319 $D.hasClass(body,'theme-body-overflowhidden') && removeClass(body,'theme-body-overflowhidden'); 1320 } 1321 }); 1322 }); 1323 e.preventDefault(); 1324 } 1325 } 1326 }) 1327 } 1328 1329 // HANDLING SUBMENU HIDE 1330 1331 for(var i=0;i<allMenuAnchor.length;i++){ 1332 allMenuAnchor[i].addEventListener('keydown',function(e){ 1333 if(e.which === 9){ 1334 var blurUl = this.closest('[data-zs-submenu-container]'); 1335 var blurUrlAnchros = blurUl && blurUl.querySelectorAll(':scope > li > a'); 1336 blurUl && blurUrlAnchros.forEach(function (submenuAnchor, index) { 1337 submenuAnchor.addEventListener('blur',function(event){ 1338 var topLi = findTopLevelLi(this.parentElement); 1339 var topAnchor = topLi.querySelector('a'); 1340 var nextTopLi = topLi.nextElementSibling; 1341 var nextTopAnchor = nextTopLi && nextTopLi.querySelector('a'); 1342 if(index === 0 && blurUrlAnchros.length == 1){ 1343 var blurUlinBlurUl = blurUl.querySelectorAll('[data-zs-submenu-container]'); 1344 if(blurUlinBlurUl.length === 0){ 1345 displayNoneElem(blurUl) 1346 } 1347 }else if(index === 0){ 1348 var curSubmenuContianer = this.closest('[data-zs-submenu-container]'); 1349 var previousMenuAnchor = curSubmenuContianer && curSubmenuContianer.previousElementSibling; 1350 previousMenuAnchor && previousMenuAnchor.addEventListener('focus',function(event){ 1351 displayNoneElem(blurUl); 1352 }); 1353 } 1354 topAnchor.addEventListener('focus',function(event){ 1355 hideAllCurrentSubmenus(this); 1356 }) 1357 nextTopAnchor && nextTopAnchor.addEventListener('focus',function(event){ 1358 hideAllCurrentSubmenus(this.parentElement.previousElementSibling); 1359 }) 1360 }) 1361 submenuAnchor.addEventListener('keydown',function(event){ 1362 if (index === 0 && event.which === 9 && event.shiftKey) { 1363 displayNoneElem(blurUl) 1364 } 1365 if (index === blurUrlAnchros.length - 1 && event.which === 9 && !event.shiftKey) { 1366 displayNoneElem(blurUl) 1367 var thisParentSubmenu = this.closest('[data-zs-submenu-container]'); 1368 var subMenuInItsParent = thisParentSubmenu.querySelectorAll('[data-zs-submenu-container]'); 1369 if(subMenuInItsParent.length == 0){ 1370 var lastSubmenuUl = this.closest('[data-zs-submenu-container]'); 1371 var lastSubmenuLastAnchor = lastSubmenuUl.lastChild.querySelector('a'); 1372 if(this.isSameNode(lastSubmenuLastAnchor)){ 1373 hideAllCurrentSubmenus(this); 1374 } 1375 } 1376 } 1377 }) 1378 }) 1379 } 1380 if(e.which === 27){ 1381 hideAllCurrentSubmenus(this); 1382 curentLevelLiFocus(this) 1383 } 1384 }) 1385 } 1386 } 1387 1388} 1389function notify_error() { 1390 event.preventDefault() 1391 window.parent.notification(window.parent.cms_i18n("ui.search.builderorpreview.nolinkwork"), "warning"); 1392 }
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.