1/* 2* Mega Menu script made by Denis Odintsov for Unlimited Elements 3*/ 4 5function ueMegaMenu(){ 6 7 var g_menu, g_menuSection, g_menuItem, g_menuListWrap, g_indicator, g_translateX, g_menuList, g_objBody, g_objHtml, g_dataMenuOpen, g_objOverlay, g_menuWrapOffsetLeft, g_viewportWidth, g_dataPositionX, g_dataEditor, g_menuItemTitle, g_showErrors, g_offsetX, g_urlBase, g_dataCloseDelay; 8 var g_classActive, g_classSection, g_menuActiveClass; 9 var g_isDesktopViewport, g_isNotDesktopViewport, g_isCustomResponsiveViewport, g_isNotCustomResponsiveViewport; 10 var g_arrItems; 11 12 /* 13 * apply template's styles to menu item's section 14 */ 15 function setTemplateStyle(){ 16 17 var objLayout = jQuery('.uc-template-wrapper .elementor'); 18 var objLayoutClass = objLayout.attr('class'); 19 20 g_menu.addClass(objLayoutClass); 21 } 22 23 /* 24 * hide expand icon if no item section found 25 */ 26 function hideIcon(objSection){ 27 28 if(g_indicator.length == 0) 29 return(false); 30 31 var objSectionArrow = objSection.find(".sub-arrow"); 32 var objSectionTitle = objSection.find('.uc-mega_menu_title'); 33 var dataClickable = objSectionTitle.data('clickable-link'); 34 35 if(dataClickable == false) 36 return(false); 37 38 if(dataClickable == true && g_dataMenuOpen == 'click') 39 objSectionArrow.hide(); 40 } 41 42 /* 43 * clone sections and append to its parent item 44 */ 45 function findSections(objSection, menuSectionParent, menuSectionItem, firstMenuSectionParent){ 46 47 //use clone mentod id in editor and detach method if live page 48 var clonedSectionItem; 49 50 if(g_dataEditor == 'yes') 51 clonedSectionItem = menuSectionItem.clone(); 52 53 if(g_dataEditor == 'no') 54 clonedSectionItem = menuSectionItem.detach(); 55 56 menuSectionParent.html(clonedSectionItem); 57 58 hideIcon(objSection); 59 60 var objMenuSection = menuSectionParent.children(); 61 objMenuSection.addClass("uc-connected"); 62 63 if(!objMenuSection.hasClass("uc-connected")) 64 return(true); 65 66 setTimeout(function(){ 67 68 objMenuSection.css({ 69 'position': 'absolute', 70 'visibility': 'hidden' 71 }); 72 73 var dataOpenFirstItem = g_menuList.data('open-first'); 74 75 if(dataOpenFirstItem == false) 76 return(false); 77 78 var firstObjMenuSection = firstMenuSectionParent.children(); 79 80 firstObjMenuSection.css({ 81 'position': '', 82 'visibility': 'visible' 83 }); 84 85 }, 200) 86 } 87 88 /* 89 * handle section find error 90 */ 91 function showHideErrors(objSection, menuSectionId, menuSectionParent, menuSectionItem) { 92 93 if(g_showErrors == false) 94 return(false); 95 96 if(menuSectionItem.length > 0) 97 return(false); 98 99 var menuItemTitle = objSection.find('.uc-mega_menu_title'); 100 var menuItemTitleType = menuItemTitle.data('type'); 101 102 if(menuItemTitleType == 'link') 103 return(false); 104 105 objSection.addClass('section-error'); 106 menuSectionParent.addClass('section-error'); 107 108 menuSectionParent.html("<div class='uc-section-error'><div class='uc-error'>Couldn't find a section with id: '" + menuSectionId + "'</div></div>"); 109 } 110 111 /* 112 * handle debug hidden template / section 113 */ 114 function debugHiddenElements() { 115 116 if(g_dataEditor == 'no') 117 return(false); 118 119 //find template for debugging purposes 120 var menuTemplate = jQuery(".uc-template-wrapper"); 121 var dataDebug = g_menu.data("debug"); 122 123 if(dataDebug == false) 124 return(false); 125 126 menuTemplate.css({'display': ''}); 127 } 128 129 /* 130 * set dropdown element full width and position in case custom width is grater than viewport width 131 */ 132 function setFullWidth(menuSectionParent){ 133 134 menuSectionParent.css({ 135 'width': g_viewportWidth + 'px', 136 'top': '100%', 137 'left': - g_menuWrapOffsetLeft + 'px', 138 'transform': 'translate(0, 0)', 139 'right': 'unset' 140 }); 141 142 var menuItemParent = menuSectionParent.parents(".uc-mega_menu_list_item"); 143 144 //set static position to menu-item so dropdown is positioned relatively to menu-list-wrapper 145 menuItemParent.css({ 146 'position': 'static' 147 }); 148 } 149 150 /* 151 * set dropdown element position left 152 */ 153 function setScreenStartPos(menuSectionParent){ 154 155 menuSectionParent.css({ 156 'left': - g_menuWrapOffsetLeft + 'px', 157 'transform': 'translate(0, 0)' 158 }); 159 160 //find 'elementor' parents and set left positin css propery so mega menu section were positioned with respect to 'elementor' element 161 var objElementorParent = g_menu.parents('.elementor'); 162 163 if(objElementorParent.length > 0){ 164 165 var elementorParentOffsetLeft = jQuery(objElementorParent[0]).offset().left; 166 167 menuSectionParent.css({ 168 'left': - g_menuWrapOffsetLeft + elementorParentOffsetLeft + 'px', 169 }); 170 171 } 172 173 } 174 175 /* 176 * set position / width 177 */ 178 function setWidthType(widthType, widthTypeFull, widthTypeCustom, customWidthNumber, menuSectionParent, each){ 179 180 //find 'elementor' parents and set max width property 181 var objElementorParent = g_menu.parents('.elementor'); 182 183 if(objElementorParent.length > 0){ 184 185 var elementorParentWidth = jQuery(objElementorParent[0]).width(); 186 187 menuSectionParent.css({'max-width': elementorParentWidth + 'px'}); 188 189 } 190 191 if(widthType == widthTypeFull){ 192 setScreenStartPos(menuSectionParent); 193 menuSectionParent.css({'width': g_viewportWidth + 'px'}); 194 return(false); 195 } 196 197 if(widthType == widthTypeCustom){ 198 menuSectionParent.css({'width': customWidthNumber + 'px'}); 199 } 200 201 if(customWidthNumber == '0' || customWidthNumber == '' || customWidthNumber >= g_viewportWidth){ 202 setFullWidth(menuSectionParent); 203 }else{ 204 205 //set position relative back when dropdown again can be fully visible in the screen 206 g_menuItem.eq(each).css({'position': 'relative'}); 207 208 //return values that were set before change of the width to full-width 209 if (g_dataPositionX == "item_left"){ 210 menuSectionParent.css({ 211 'left': '0' 212 }); 213 } 214 215 if (g_dataPositionX == "item_right"){ 216 menuSectionParent.css({ 217 'left': 'unset', 218 'right': '0' 219 }); 220 } 221 222 if (g_dataPositionX == "item_center"){ 223 menuSectionParent.css({ 224 'left': '50%', 225 'right': 'unset' 226 }); 227 } 228 229 } 230 } 231 232 /* 233 * set position / width for each type of width-type 234 */ 235 function handleWidthType(){ 236 237 var menuItemsNumber = g_menuItem.length; 238 239 for (let i=0; i<menuItemsNumber; i++){ 240 241 var menuSectionParent = g_menuItem.eq(i).find('.uc-mega_menu_section'); 242 243 var widthType = g_arrItems[i].dropdown_width; 244 var customWidthNumber = g_arrItems[i].dropdown_width_number; 245 246 setWidthType(widthType, 'full', 'custom', customWidthNumber, menuSectionParent, i); 247 248 if(widthType == 'default'){ 249 250 var defaultWidthType = g_menuList.data('default-width-type'); 251 var defaultWidthNumber = g_menuList.data('default-width-number'); 252 253 setWidthType(defaultWidthType, 'default_full', 'default_custom', defaultWidthNumber, menuSectionParent, i) 254 } 255 } 256 } 257 258 /* 259 * debug items ids 260 */ 261 function showHideMenuItemsId(){ 262 263 var debugMenuItemsId = g_menu.data("items-id"); 264 265 if (debugMenuItemsId == false) 266 return(false); 267 268 //show all item ids 269 g_menuListWrap.append("<div class='available_id_s'>Item Id's List<ul class='available_item_id_s_list'></ul></div>"); 270 271 var objItemIdList = g_menu.find(".available_item_id_s_list"); 272 var menuItemsNumber = g_menuItem.length; 273 274 for(let i=0; i<=menuItemsNumber-1; i++){ 275 var objMenuItem = g_menuItem.eq(i); 276 var objMenuItemDataId = objMenuItem.data("id"); 277
278 //if data-id attribute is empty, skip and go to next data-id 279 if(!objMenuItemDataId){ 280 continue; 281 }else{ 282 objItemIdList.append("<li>" + objMenuItemDataId + "</li>"); 283 } 284 } 285 } 286 287 /* 288 * debug elements ids 289 */ 290 function showHideElementsId(){ 291 292 var debugElementsId = g_menu.data("elements-id"); 293 294 if (debugElementsId == false) 295 return(false); 296 297 //show list of section's ids that can be connected to mega menu items 298 g_menuListWrap.append("<div class='available_id_s'>Section Id's List<ul class='available_section_id_s_list'></ul></div>"); 299 300 var objSectionIdList = g_menu.find(".available_section_id_s_list"); 301 var availableSections = jQuery('section'); 302 303 availableSections.each(function(){ 304 305 var objSectionItem = jQuery(this); 306 var objSectionItemId = objSectionItem.attr('id'); 307 var objSectionItemDisplay = objSectionItem.css('display'); 308 309 //watch only those sections that are displayed on the page 310 if(objSectionItemDisplay == 'none') 311 return(true); 312 313 //if id attribute is empty, skip and go to next id 314 if(!objSectionItemId){ 315 return(true); 316 } 317 318 //check if sections are connected to mega menu items 319 if(objSectionItem.hasClass("uc-connected")){ 320 return(true); 321 }else{ 322 //add section's id to the list 323 objSectionIdList.append("<li>" + objSectionItemId + "</li>"); 324 } 325 }); 326 } 327 328 /* 329 * set overlay position to screen left 330 */ 331 function setOverlayPosition(activeMenuItem){ 332 333 var dataOverlay = g_objOverlay.data('overlay'); 334 335 if(dataOverlay == false) 336 return(false); 337 338 if(g_isCustomResponsiveViewport.matches == true || !activeMenuItem.length) 339 return(false); 340 341 342 var g_menuListWrapOffsetTop = g_menuListWrap.offset().top; 343 var g_menuListWrapOffsetHeight = g_menuListWrap.height(); 344 var documentOffsetHeight = jQuery(document).height(); 345 346 var g_objOverlayOffsetTop = g_menuListWrapOffsetTop + g_menuListWrapOffsetHeight; 347 var g_objOverlayOffsetHeight = documentOffsetHeight - g_objOverlayOffsetTop; 348 349 g_objOverlay.show(); 350 351 var dataOverlayPosition = g_objOverlay.data('overlay-position'); 352 353 g_objOverlay.css({ 354 'width': g_viewportWidth + 'px', 355 'left': - g_menuWrapOffsetLeft + 'px', 356 'transform': 'translate(0, 0)', 357 'height': g_objOverlayOffsetHeight + 'px' 358 }); 359 360 if(dataOverlayPosition == 'under') 361 return(false); 362 363 var overlayTopPosition = -g_menuListWrapOffsetTop; 364 365 g_objOverlay.css({ 366 'top': overlayTopPosition + 'px', 367 'height': documentOffsetHeight + 'px' 368 }); 369 370 371 } 372 373 /* 374 * set active disresponsive height 375 */ 376 function setDisactiveResponsiveHeight(){ 377 378 if(g_isNotCustomResponsiveViewport.matches == true) 379 return(false); 380 381 g_menuSection.css({'height': '0px'}); 382 383 } 384 385 /* 386 * set disactive responsive height for parent menu item 387 */ 388 function setActiveResponsiveHeight(activeMenuItem){ 389 390 if(!activeMenuItem) 391 return(false); 392 393 var menuSectionActive = activeMenuItem.find(g_classSection); 394 var menuSectionActiveChild = menuSectionActive.children(); 395 var menuSectionActiveHeight = menuSectionActiveChild.outerHeight(); 396 397 398 if(g_menuSection.hasClass(g_classActive)){ 399 setDisactiveResponsiveHeight(); 400 menuSectionActive.css({'height': menuSectionActiveHeight + 'px'}); 401 }else{ 402 setDisactiveResponsiveHeight(); 403 } 404 } 405 406 /* 407 *set active menu item icon 408 */ 409 function setActiveArrow(activeItem){ 410 411 var indicatorActive = activeItem.find('.sub-arrow'); 412 var collapseIndicatorClass = '.uc_collapse_indicator'; 413 var objCollapseIndicator = jQuery(collapseIndicatorClass); 414 415 if(objCollapseIndicator.length){ 416 var objCollapseIndicatorItem = objCollapseIndicator.parents('.uc-mega_menu_list_item'); 417 418 objCollapseIndicatorItem.find('.sub-arrow').html("<span class='uc_expand_indicator'></span>"); 419 } 420 421 indicatorActive.html("<span class='uc_collapse_indicator'></span>"); 422 } 423 424 /* 425 * set disactive menu item icon 426 */ 427 function setDisactiveArrow(){ 428 429 var collapseIndicatorClass = '.uc_collapse_indicator'; 430 var objCollapseIndicator = jQuery(collapseIndicatorClass); 431 432 if(objCollapseIndicator.length){ 433 var objCollapseIndicatorItem = objCollapseIndicator.parents('.uc-mega_menu_list_item'); 434 435 objCollapseIndicatorItem.find('.sub-arrow').html("<span class='uc_expand_indicator'></span>"); 436 } 437 438 } 439 440 /* 441 * set top position 100% + padding-bottom of menu-list-wrapper 442 */ 443 function setTopPosition(objElement){ 444 445 var activeMenuSection = objElement.find(g_classSection); 446 var menuListPaddingBottom = g_menuList.css('padding-bottom'); 447 448 activeMenuSection.css({ 449 'top': 'calc(100% + ' + menuListPaddingBottom + ')' 450 }); 451 } 452 453 /* 454 * handle positionX option 455 */ 456 function isElementInViewportX(objElement) { 457 458 var activeMenuSection = objElement.find(g_classSection); 459 460 if(!activeMenuSection.length) 461 return(true); 462 463 var activeMenuSectionWidth = activeMenuSection.width(); 464 var elementPositionLeft = activeMenuSection.offset().left; 465 var elementPositionRight = activeMenuSectionWidth + elementPositionLeft; 466 467 var isInViewport; 468 469 if (g_dataPositionX == "item_left"){ 470 var menuItemPositionLeft = objElement.offset().left; 471 var elementPositionRight = activeMenuSectionWidth + menuItemPositionLeft + g_offsetX; 472 var elementPositionLeft = activeMenuSection.offset().left; 473 474 //if dropdown width == viewportwidth + width of a scroll bar 475 if(activeMenuSectionWidth == g_viewportWidth) 476 return(true); 477 478 setTopPosition(objElement); 479 480 if(elementPositionLeft < 0){ 481 g_translateX = 0 + 'px'; 482 }else if(elementPositionRight >= g_viewportWidth){ 483 g_translateX = g_viewportWidth - elementPositionRight + g_offsetX + "px"; 484 } 485 486 isInViewport = elementPositionLeft > 0 && elementPositionRight < g_viewportWidth; 487 488 return(isInViewport); 489 } 490 491 if (g_dataPositionX == "item_right"){ 492 var menuItemPositionRight = objElement.offset().left + objElement.width(); 493 var elementPositionLeft = menuItemPositionRight - activeMenuSectionWidth + g_offsetX; 494 var elementPositionRight = activeMenuSection.offset().left + activeMenuSectionWidth; 495 496 //if dropdown width == viewportwidth + width of a scroll bar 497 if(activeMenuSectionWidth == g_viewportWidth) 498 return(true); 499 500 setTopPosition(objElement); 501 502 if(elementPositionLeft < 0){ 503 g_translateX = Math.abs(elementPositionLeft) + g_offsetX + "px"; 504 }else{ 505 g_translateX = 0 + 'px'; 506 } 507 508 isInViewport = elementPositionLeft > 0 && elementPositionLeft + g_offsetX > 0 && elementPositionRight < g_viewportWidth; 509 510 return(isInViewport); 511 } 512 513 if (g_dataPositionX == "item_center"){ 514 var menuItemPositionLeft = objElement.offset().left; 515 var objElementWidth = objElement.width(); 516 var elementPositionCenter = menuItemPositionLeft + (objElementWidth / 2); 517 var elementPositionLeft = elementPositionCenter - (activeMenuSectionWidth / 2) + g_offsetX; 518 var elementPositionRight = elementPositionCenter + (activeMenuSectionWidth / 2) + g_offsetX; 519 520 //if dropdown width == viewportwidth + width of a scroll bar 521 if(activeMenuSectionWidth == g_viewportWidth) 522 return(true); 523 524 setTopPosition(objElement); 525 526 if(elementPositionLeft < 0){ 527 g_translateX = '-' + (objElementWidth / 2) - menuItemPositionLeft + 'px'; 528 }else if(elementPositionRight > g_viewportWidth){ 529 g_translateX = 'calc(-50% + ' + (g_viewportWidth - elementPositionRight + g_offsetX) + 'px)'; 530 } 531 532 isInViewport = elementPositionLeft > 0 && elementPositionRight < g_viewportWidth; 533 534 return(isInViewport); 535 } 536 } 537 538 /* 539 * dropdown element style always visible 540 */ 541 function setCssVisiblePositionX(activeMenuSection){ 542 543 activeMenuSection.css({ 544 "transform": "translate(" + g_translateX + ", 0)" 545 }); 546 } 547 548 /* 549 * set dropdown element position 550 */ 551 function setVisiblePositionX(objElement){ 552 553 if(g_isCustomResponsiveViewport.matches == true) 554 return(false); 555 556 var activeMenuSection = objElement.find(g_classSection); 557 var activeMenuSectionWidth = activeMenuSection.width(); 558 559 //if activeMenuSectionWidth is less than viewport width - return to original coordinates 560 if(activeMenuSectionWidth > g_viewportWidth) 561 return(false); 562 563 activeMenuSection.css({ 564 "transform": "translate(" + g_offsetX + "px, 0)" 565 }); 566 567 568 //if position_x is "item_center" than transform calculate with '-50%' 569 if (g_dataPositionX == "item_center" && activeMenuSectionWidth < g_viewportWidth){ 570 activeMenuSection.css({ 571 "transform": "translate(calc(-50% + " + g_offsetX + "px), 0)" 572 }); 573 } 574 575 if(isElementInViewportX(objElement)) 576 return(false); 577 578 //if dropdown does not fit in screen than change coordinates so it is always fully visible 579 setCssVisiblePositionX(activeMenuSection); 580 } 581 582 /* 583 * set dropdown cover element position 584 */ 585 function setCoverPosition(menuSection, menuSectionChild){ 586 587 if(menuSection.length == 0) 588 return(false); 589 590 if(menuSectionChild.length == 0) 591 return(false); 592 593 var objCover = menuSection.next(); 594 var menuItem = menuSectionChild.parents('.uc-mega_menu_list_item'); 595 596 var objCoverHeight = menuSectionChild.outerHeight(); 597 var objCoverWidth = menuSection.width(); 598 var menuItemWidth = menuItem.width(); 599 600 var menuItemOffsetLeft = menuItem.offset().left; 601 var menuSectionOffsetLeft = menuSection.offset().left; 602 603 var menuItemOffsetRight = menuItemOffsetLeft + menuItemWidth; 604 var menuSectionOffsetRight = menuSectionOffsetLeft + objCoverWidth; 605 606 objCover.css({ 607 'width': objCoverWidth + 'px', 608 'height': objCoverHeight + 'px' 609 }); 610 611 if (menuItemOffsetLeft == menuSectionOffsetLeft){ 612 objCover.css({ 613 'left': '0px', 614 'right': 'unset' 615 }); 616 } 617 618 if(menuItemOffsetRight == menuSectionOffsetRight){ 619 objCover.css({ 620 'left': 'unset', 621 'right': '0px' 622 }); 623 } 624 625 if (menuItemOffsetLeft > menuSectionOffsetLeft){ 626 627 var menuItemSectionPositionDeviation = menuItemOffsetLeft - menuSectionOffsetLeft; 628 629 objCover.css({ 630 'right': 'unset', 631 'left': - menuItemSectionPositionDeviation + 'px' 632 }); 633 } 634 635 if (menuItemOffsetLeft < menuSectionOffsetLeft){ 636 637 var menuItemSectionPositionDeviation = menuSectionOffsetLeft - menuItemOffsetLeft; 638 639 objCover.css({ 640 'right': 'unset', 641 'left': menuItemSectionPositionDeviation + 'px' 642 }); 643 } 644 645 if(objCoverWidth == g_viewportWidth){ 646 647 objCover.css({ 648 'right': 'unset', 649 'left': - g_menuWrapOffsetLeft + 'px' 650 }); 651 } 652 } 653 654 /* 655 * set active item 656 */ 657 function setActive(activeMenuItem){ 658 659 g_menuItem.removeClass(g_classActive); 660 g_menuSection.removeClass(g_classActive); 661 662 var activeMenuItemSection = activeMenuItem.find(g_classSection); 663 664 activeMenuItem.addClass(g_classActive); 665 activeMenuItemSection.addClass(g_classActive); 666 667 // Add area-expended true/false to menu item for accesibility 668 var menuItemTitle = activeMenuItem.find('.uc-mega_menu_title'); 669 g_menuItem.find('.uc-mega_menu_title').attr('aria-expanded', 'false'); 670 671 if (menuItemTitle.attr('data-type') == 'section') { 672 menuItemTitle.attr('aria-expanded', 'true'); 673 } 674 675 setTimeout(function(){ 676 activeMenuItemSection.children().css({ 677 'position': '', 678 'visibility': 'visible' 679 }); 680 },100); 681 682 //add active class to menu if menu item section has children 683 if(activeMenuItemSection.children().length){ 684 g_menu.addClass(g_menuActiveClass); 685 686 if(g_isCustomResponsiveViewport.matches == false){ 687 688 g_objBody.addClass(g_menuActiveClass); 689 g_objHtml.addClass(g_menuActiveClass); 690 } 691 692 }else{ 693 g_menu.removeClass(g_menuActiveClass); 694 g_objBody.removeClass(g_menuActiveClass); 695 g_objHtml.removeClass(g_menuActiveClass); 696 } 697 698 if(g_isCustomResponsiveViewport.matches == true){
699 setActiveResponsiveHeight(activeMenuItem); 700 } 701 702 setVisiblePositionX(activeMenuItem); 703 handleWidthType(); 704 setTipPosition(activeMenuItemSection); 705 setOverlayPosition(activeMenuItem); 706 707 var menuSectionChild = activeMenuItemSection.children(); 708 709 setCoverPosition(activeMenuItemSection, menuSectionChild); 710 scrollToHead(activeMenuItem); 711 } 712 713 /* 714 * set disactive menu item 715 */ 716 function setDisactive(){ 717 718 g_menuItem.removeClass(g_classActive); 719 g_menuSection.removeClass(g_classActive); 720 g_menuItem.find('.uc-mega_menu_title').attr('aria-expanded', 'false'); 721 setDisactiveArrow(); 722 723 setTimeout(function(){ 724 g_menuSection.children().css({ 725 'position': 'absolute', 726 'visibility': 'hidden' 727 }); 728 },g_dataCloseDelay); 729 730 //remove active class from menu 731 g_menu.removeClass(g_menuActiveClass); 732 733 if(g_isCustomResponsiveViewport.matches == false){ 734 735 g_objBody.removeClass(g_menuActiveClass); 736 g_objHtml.removeClass(g_menuActiveClass); 737 } 738 739 if(g_objOverlay.length) 740 g_objOverlay.hide(); 741 742 } 743 744 /* 745 * create tip 746 */ 747 function createTip(menuSectionParent){ 748 749 var isTipExist = menuSectionParent.data('tip'); 750 751 if(isTipExist == false) 752 return(false); 753 754 var offsetY = g_menuList.data("offset-y"); 755 756 //create padding for the tip 757 if(offsetY < 14){ 758 menuSectionParent.css({'padding-top': '14px'}) 759 }else if(offsetY >= 14){ 760 menuSectionParent.css({'padding-top': offsetY + 'px'}) 761 } 762 763 var objsection = menuSectionParent.find('.uc-connected'); 764 765 objsection.prepend('<div class="ue-tip"></div>'); 766 767 var objErrorTip; 768 769 if(menuSectionParent.hasClass('section-error')){ 770 menuSectionParent.find('.uc-section-error').prepend('<div class="ue-tip"></div>'); 771 772 objErrorTip = menuSectionParent.find('.ue-tip'); 773 774 objErrorTip.css({ 775 'border-top-color': '#cccccc', 776 'border-left-color': '#cccccc' 777 }) 778 } 779 780 var objTip = menuSectionParent.find('.ue-tip'); 781 var menuSectionBgColor = objsection.css('background-color'); 782 var dataTipBgColor = menuSectionParent.data('bg-color'); 783 var dataTipMainColor = menuSectionParent.data('tip-color'); 784 785 var isMenuSectionBorderExist = parseInt(objsection.css('border-width')) > 0; 786 var menuSectionBorderColor = objsection.css('border-color'); 787 788 if(menuSectionBgColor == 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false){ 789 objTip.css({ 790 'border-top-color': dataTipBgColor, 791 'border-left-color': dataTipBgColor, 792 }); 793 } 794 795 if(isMenuSectionBorderExist == true){ 796 objTip.css({ 797 'border-top-color': menuSectionBorderColor, 798 'border-left-color': menuSectionBorderColor, 799 }); 800 } 801 802 if(menuSectionBgColor != 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false){ 803 objTip.css({ 804 'border-top-color': menuSectionBgColor, 805 'border-left-color': menuSectionBgColor, 806 }); 807 } 808 809 if(menuSectionParent.hasClass('section-error')){ 810 811 objErrorTip.css({ 812 'border-top-color': '#cccccc', 813 'border-left-color': '#cccccc' 814 }) 815 } 816 817 if(dataTipMainColor != ''){ 818 objTip.css({ 819 'border-top-color': dataTipMainColor, 820 'border-left-color': dataTipMainColor, 821 }); 822 } 823 824 if(menuSectionBgColor == 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false && dataTipBgColor == '' && dataTipMainColor == ''){ 825 objTip.css({ 826 'border-top-color': '#C9C9C9', 827 'border-left-color': '#C9C9C9' 828 }); 829 } 830 } 831 832 /* 833 * set position of the tip 834 */ 835 function setTipPosition(menuSectionParent){ 836 837 if(menuSectionParent.length == 0) 838 return(false); 839 840 var objTip = menuSectionParent.find('.ue-tip'); 841 var objsection = menuSectionParent.find('.uc-connected'); 842 843 var menuSectionBgColor = objsection.css('background-color'); 844 var menuSectionBorderColor = objsection.css('border-color'); 845 var dataTipBgColor = menuSectionParent.data('bg-color'); 846 var dataTipMainColor = menuSectionParent.data('tip-color'); 847 848 var isMenuSectionBorderExist = parseInt(objsection.css('border-width')) > 0; 849 850 var menuItem = menuSectionParent.parents('.uc-mega_menu_list_item'); 851 852 var menuItemWidth = menuItem.width(); 853 var objTipWidth = objTip.width(); 854 var menuSectionWidth = menuSectionParent.width(); 855 var menuItemCenter = menuItemWidth / 2; 856 857 var menuItemOffsetLeft = menuItem.offset().left; 858 var menuSectionOffsetLeft = menuSectionParent.offset().left; 859 860 var menuItemOffsetRight = menuItemOffsetLeft + menuItemWidth; 861 var menuSectionOffsetRight = menuSectionOffsetLeft + menuSectionWidth; 862 863 var menuItemCenterOffsetLeft = menuItemOffsetLeft + menuItemCenter; 864 865 if (menuItemOffsetLeft == menuSectionOffsetLeft){ 866 objTip.css({ 867 'left': (menuItemWidth / 2) + 'px', 868 'right': 'unset' 869 }); 870 } 871 872 if(menuItemOffsetRight == menuSectionOffsetRight){ 873 objTip.css({ 874 'left': 'unset', 875 'right': (menuItemWidth / 2) + 'px' 876 }); 877 } 878 879 if (menuSectionOffsetLeft < menuItemOffsetLeft && menuSectionOffsetRight > menuItemCenterOffsetLeft + objTipWidth){ 880 881 //find how much menuSectionOffsetLeft is less then menuItemOffsetLeft 882 var menuItemSectionPositionDeviation = menuItemOffsetLeft - menuSectionOffsetLeft; 883 884 objTip.css({ 885 'left': menuItemSectionPositionDeviation + (menuItemWidth / 2) + 'px', 886 'right': 'unset' 887 }); 888 } 889 890 if (menuSectionOffsetLeft < menuItemOffsetLeft && menuSectionOffsetRight <= menuItemCenterOffsetLeft + objTipWidth){ 891 892 //find how much menuSectionOffsetLeft is less then menuItemOffsetLeft 893 var menuItemSectionPositionDeviation = menuItemOffsetLeft - menuSectionOffsetLeft; 894 895 objTip.css({ 896 'left': 'unset', 897 'right': '0px', 898 'transform': 'translate(0, -50%) rotate(0)', 899 'border-top-color': 'transparent', 900 'border-left-color': 'transparent' 901 }); 902 903 //set right border color 904 if(menuSectionBgColor == 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false){ 905 objTip.css({ 906 'border-right-color': dataTipBgColor 907 }); 908 } 909 910 if(isMenuSectionBorderExist == true){ 911 objTip.css({ 912 'border-right-color': menuSectionBorderColor 913 }); 914 } 915 916 if(menuSectionBgColor != 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false){ 917 objTip.css({ 918 'border-right-color': menuSectionBgColor 919 }); 920 } 921 922 if (menuSectionParent.hasClass('section-error')){ 923 var objErrorTip = menuSectionParent.find('.ue-tip'); 924 925 objErrorTip.css({ 926 'border-right-color': '#cccccc', 927 }); 928 } 929 930 if(dataTipMainColor != ''){ 931 objTip.css({ 932 'border-right-color': dataTipMainColor 933 }); 934 } 935 936 if(menuSectionBgColor == 'rgba(0, 0, 0, 0)' && isMenuSectionBorderExist == false && dataTipBgColor == '' && dataTipMainColor == ''){ 937 objTip.css({ 938 'border-right-color': '#C9C9C9' 939 }); 940 } 941 942 } 943 944 if (menuSectionOffsetLeft > menuItemOffsetLeft && menuSectionOffsetLeft < menuItemCenterOffsetLeft - objTipWidth){ 945 946 //find how much menuSectionOffsetLeft is grater then menuItemOffsetLeft 947 var menuItemSectionPositionDeviation = menuSectionOffsetLeft - menuItemOffsetLeft; 948 949 objTip.css({ 950 'left': (menuItemWidth / 2) - menuItemSectionPositionDeviation + 'px', 951 'right': 'unset' 952 }); 953 } 954 955 if (menuSectionOffsetLeft > menuItemOffsetLeft && menuSectionOffsetLeft >= menuItemCenterOffsetLeft - objTipWidth){ 956 957 //find how much menuSectionOffsetLeft is grater then menuItemOffsetLeft 958 var menuItemSectionPositionDeviation = menuSectionOffsetLeft - menuItemOffsetLeft; 959 960 objTip.css({ 961 'left': '0px', 962 'right': 'unset', 963 'transform': 'translate(0, -50%) rotate(0)', 964 'border-top-color': 'transparent' 965 }); 966 } 967 } 968 969 /* 970 * get menu item offset top position 971 */ 972 function getScrollPos(){ 973 974 if(g_isNotCustomResponsiveViewport.matches == true) 975 return(false); 976 977 g_menuItem.each(function(){ 978 979 var objItem = jQuery(this); 980 981 var menuItemOffsetTop = objItem.offset().top; 982 983 objItem.attr('data-scrollpos', menuItemOffsetTop); 984 }); 985 } 986 987 /* 988 * check if element is in viewport 989 */ 990 function isElementInViewport(element){ 991 992 var elementTop = element.offset().top; 993 var viewportTop = jQuery(window).scrollTop(); 994 995 //check if beginning of the element is in viewport 996 var isInViewport = elementTop > viewportTop; 997 998 return(isInViewport); 999 } 1000 1001 /* 1002 * scroll to head 1003 */ 1004 function scrollToHead(menuItem){ 1005 1006 if(g_isNotCustomResponsiveViewport.matches == true) 1007 return(false); 1008 1009 var menuItemOffsetTop = menuItem.data('scrollpos'); 1010 var menuItemSection = menuItem.find(g_classSection); 1011 1012 //wait untill height transition is finished 1013 setTimeout(function(){ 1014 1015 if(isElementInViewport(menuItemSection) == true) 1016 return(false); 1017 1018 g_menuListWrap.animate({ 1019 scrollTop: menuItemOffsetTop 1020 }, 400); 1021 }, 400); 1022 } 1023 1024 /* 1025 * hide arrows while animation is on 1026 */ 1027 function showHideArrows(){ 1028 1029 if(g_indicator.length == 0) 1030 return(false); 1031 1032 var dataAnimation = g_indicator.data('animate-arrows') 1033 1034 if(dataAnimation == false) 1035 return(false); 1036 1037 setTimeout(function(){ 1038 g_indicator.css({'opacity': 1}); 1039 }, 300) 1040 } 1041 1042 /* 1043 * set class to menu item title when base url matches 1044 */ 1045 function checkUrl(){ 1046 1047 var itemsNumber = g_menuItem.length; 1048 1049 for(let i=0; i<itemsNumber; i++){ 1050 var menuItemTitle = g_menuItem.eq(i).find('.uc-mega_menu_title'); 1051 var menuItemUrl = menuItemTitle.attr('href'); 1052 1053 if(menuItemUrl == g_urlBase){ 1054 menuItemTitle.addClass('uc-current-page'); 1055 } 1056 } 1057 } 1058 1059 /* 1060 * show | hide section in editor 1061 */ 1062 function hideSectionInEditor(menuSectionItem){ 1063 1064 if(g_dataEditor == false) 1065 return(false); 1066 1067 1068 if(menuSectionItem.hasClass('uc-connected') == true) 1069 return(false); 1070 1071 var dataShowInEditor = g_menuList.data('show-section'); 1072 1073 if(dataShowInEditor == 'no'){ 1074 menuSectionItem.css({ 1075 'position': '', 1076 'visibility': 'visible' 1077 }); 1078 } 1079 1080 if(dataShowInEditor == 'message' || dataShowInEditor == 'hide'){ 1081 menuSectionItem.css({ 1082 'position': 'absolute', 1083 'visibility': 'hidden' 1084 }); 1085 } 1086 } 1087 1088 /* 1089 * open first item on mobile 1090 */ 1091 function openFirstItem(){ 1092 1093 if(g_isNotCustomResponsiveViewport.matches == true) 1094 return(false); 1095 1096 var firstItem = g_menuItem.eq(0); 1097 var firsItemTitle = firstItem.find('.uc-mega_menu_title'); 1098 var dataFirstItemType = firsItemTitle.data('type'); 1099 var dataFirstItemClickable = firsItemTitle.data('clickable-link'); 1100 1101 if(dataFirstItemType != 'section') 1102 return(false); 1103 1104 if(dataFirstItemClickable != false) 1105 return(false); 1106 1107 var dataOpenFirstItem = g_menuList.data('open-first'); 1108 1109 if(dataOpenFirstItem == false) 1110 return(false); 1111 1112 setActive(firstItem); 1113 setActiveArrow(firstItem); 1114 1115 } 1116 1117 /* 1118 * define item type "section" behaviour 1119 */ 1120 function handleItemTypeSection(){ 1121 1122 var menuSectionParentItem = g_menuSection.parents('.uc-mega_menu_list_item'); 1123 1124 menuSectionParentItem.each(function(){ 1125 1126 var objSection = jQuery(this); 1127 var menuSectionId = objSection.data("id"); 1128 var menuSectionItem = jQuery("#" + menuSectionId); 1129 var menuSectionParent = objSection.find(g_classSection); 1130 var firstMenuSectionParent = objSection.eq(0).find(g_classSection); 1131 1132 setTemplateStyle(); 1133 1134 findSections(objSection, menuSectionParent, menuSectionItem, firstMenuSectionParent); 1135 1136 showHideErrors(objSection, menuSectionId, menuSectionParent, menuSectionItem); 1137 debugHiddenElements(); 1138 1139 1140 }); 1141 1142 handleWidthType(); 1143 showHideArrows(); 1144 1145 //set visible position of all dropdown sections and then create tip 1146 for(let i = 0; i < g_menuItem.length; i++){ 1147 1148 var objMenuItem = g_menuItem.eq(i); 1149 var menuSection = objMenuItem.find(g_classSection); 1150 var menuSectionChild = menuSection.children(); 1151 1152 setVisiblePositionX(objMenuItem); 1153 1154 createTip(menuSection); 1155 setTipPosition(menuSection); 1156 setCoverPosition(menuSection, menuSectionChild); 1157 } 1158 1159 //handle debug mode 1160 showHideMenuItemsId(); 1161 showHideElementsId(); 1162 1163 if(g_isCustomResponsiveViewport.matches == true){ 1164 g_menuListWrap.addClass('uc-mobile-mode'); 1165 }else{ 1166 g_menuListWrap.removeClass('uc-mobile-mode'); 1167 } 1168 1169 getScrollPos(); 1170 checkUrl(); 1171 1172 openFirstItem(); 1173 } 1174 1175 /* 1176 * define item type "section" behaviour in editor 1177 */ 1178 function handleItemTypeSectionInEditor(){ 1179 1180 g_menuItem.each(function(){ 1181 1182 var objSection = jQuery(this); 1183 var menuSectionId = objSection.data("id"); 1184 var menuSectionItem = jQuery("#" + menuSectionId); 1185 var menuSectionParent = objSection.find(g_classSection); 1186 1187 1188 showHideErrors(objSection, menuSectionId, menuSectionParent, menuSectionItem); 1189 debugHiddenElements(); 1190 1191 hideSectionInEditor(menuSectionItem) 1192 1193 }); 1194 1195 //handle debug mode 1196 showHideMenuItemsId(); 1197 showHideElementsId(); 1198 1199 } 1200 1201 /* 1202 * handle click event 1203 */ 1204 function menuItemClick(objTitle){ 1205 1206 var activeMenuItemClick = objTitle.parents('.uc-mega_menu_list_item'); 1207 1208 if(activeMenuItemClick.hasClass(g_classActive)){ 1209 1210 setDisactive(); 1211 1212 if(g_isCustomResponsiveViewport.matches == true) 1213 setDisactiveResponsiveHeight(); 1214 1215 }else{
1216 setActive(activeMenuItemClick); 1217 setActiveArrow(activeMenuItemClick); 1218 } 1219 } 1220 1221 /* 1222 * close menu when anchor link click 1223 */ 1224 function closeMenuOnAnchorClick(objTitle){ 1225 1226 var url = objTitle.attr('href'); 1227 1228 //if not anchor do nothing 1229 if (url.indexOf("#") == -1) 1230 return(false); 1231 1232 setDisactive(); 1233 1234 if(g_isCustomResponsiveViewport.matches == false) 1235 return(false); 1236 1237 setDisactiveResponsiveHeight(); 1238 g_menuListWrap.removeClass(g_menuActiveClass); 1239 g_objBody.removeClass(g_menuActiveClass); 1240 g_objHtml.removeClass(g_menuActiveClass); 1241 g_menu.removeClass(g_menuActiveClass); 1242 1243 } 1244 1245 /* 1246 * handle click event 1247 */ 1248 function onMenuItemClick(e){ 1249 1250 var objTitle = jQuery(this); 1251 var isItemClickable = objTitle.data('clickable-link'); 1252 var itemType = objTitle.data('type'); 1253 var titleClass = 'uc-mega_menu_title'; 1254 1255 if (g_dataMenuOpen == 'hover'){ 1256 1257 if(g_isDesktopViewport.matches == true && g_isCustomResponsiveViewport.matches == false && itemType != 'link' && isItemClickable == false) 1258 return(false); 1259 1260 if(itemType != 'link' && isItemClickable == false){ 1261 menuItemClick(objTitle); 1262 return(false); 1263 } 1264 1265 if(g_isNotDesktopViewport.matches == true && isItemClickable == true){ 1266 1267 var objTarget = jQuery(e.target); 1268 var objTargetParent = objTarget.parent(); 1269 1270 if(objTargetParent.hasClass(titleClass) == false){ 1271 1272 menuItemClick(objTitle); 1273 return(false); 1274 1275 } 1276 1277 if(objTargetParent.hasClass(titleClass) == true) 1278 return(true) 1279 1280 } 1281 1282 if(g_isDesktopViewport.matches == true && isItemClickable == true) 1283 return(true); 1284 1285 //close menu when anchor link click 1286 if(itemType == 'link'){ 1287 1288 closeMenuOnAnchorClick(objTitle); 1289 1290 //stop any further function execution 1291 return(true); 1292 1293 } 1294 1295 menuItemClick(objTitle); 1296 } 1297 1298 //close menu when anchor link click 1299 if(itemType == 'link'){ 1300 1301 closeMenuOnAnchorClick(objTitle); 1302 1303 //stop any further function execution 1304 return(true); 1305 1306 } 1307 1308 if(g_isDesktopViewport.matches == true && isItemClickable == true) 1309 return(true); 1310 1311 if(g_isNotDesktopViewport.matches == true && isItemClickable == true){ 1312 1313 var objTarget = jQuery(e.target); 1314 var objTargetParent = objTarget.parent(); 1315 1316 if(objTargetParent.hasClass(titleClass) == false){ 1317 1318 menuItemClick(objTitle); 1319 return(false); 1320 1321 } 1322 1323 if(objTargetParent.hasClass(titleClass) == true) 1324 return(true) 1325 1326 } 1327 1328 if(isItemClickable == false) 1329 menuItemClick(objTitle); 1330 } 1331 1332 /* 1333 * handle click on body event 1334 */ 1335 function setDisactiveOnbodyClick(event){ 1336 1337 if(g_menuItem.hasClass(g_classActive) == false) 1338 return(false); 1339 1340 if(g_isCustomResponsiveViewport.matches == true) 1341 return(false); 1342 1343 //exclude arrow indicator from this function to prevent closing dropdown after arrow click 1344 if(jQuery(event.target).hasClass('uc_expand_indicator')) 1345 return(false); 1346 1347 if (!jQuery(event.target).closest(g_menuItem).length) 1348 setDisactive(); 1349 1350 } 1351 1352 /* 1353 * handle body click event 1354 */ 1355 function bodyClick(event){ 1356 1357 if (g_dataMenuOpen == 'hover'){ 1358 1359 if(g_isDesktopViewport.matches == true && g_isNotCustomResponsiveViewport.matches == true){ 1360 return(false); 1361 } 1362 1363 setDisactiveOnbodyClick(event); 1364 } 1365 1366 setDisactiveOnbodyClick(event); 1367 } 1368 1369 /* 1370 * close menu on mega-menu-inner-links link-item click 1371 */ 1372 function onInnerLinkClick(){ 1373 1374 setDisactive(); 1375 1376 if(g_isCustomResponsiveViewport.matches == true){ 1377 setDisactiveResponsiveHeight(); 1378 g_menuListWrap.removeClass(g_menuActiveClass); 1379 g_objBody.removeClass(g_menuActiveClass); 1380 g_objHtml.removeClass(g_menuActiveClass); 1381 g_menu.removeClass(g_menuActiveClass); 1382 } 1383 1384 openFirstItem(); 1385 } 1386 1387 /* 1388 * handle body click event 1389 */ 1390 function handleMenuItemClick(){ 1391 1392 g_menuItemTitle.on("click", onMenuItemClick); 1393 1394 jQuery(document).on('click', function(event) { 1395 1396 bodyClick(event); 1397 }); 1398 1399 } 1400 1401 /* 1402 * handle mouse enter event on menu item 1403 */ 1404 function onMenuItemMouseEnter(){ 1405 1406 if(g_dataMenuOpen == 'click') 1407 return(false); 1408 1409 if(g_isCustomResponsiveViewport.matches == true) 1410 return(false); 1411 1412 var activeMenuItemHover = jQuery(this); 1413 1414 setActive(activeMenuItemHover); 1415 setActiveArrow(activeMenuItemHover); 1416 } 1417 1418 /* 1419 * set disactive menu item on mouseleave 1420 */ 1421 function onMenuItemMouseLeave(){ 1422 1423 if(g_dataMenuOpen == 'click') 1424 return(false); 1425 1426 if(g_isCustomResponsiveViewport.matches == true) 1427 return(false); 1428 1429 setDisactive(); 1430 } 1431 1432 /* 1433 * handle hover event 1434 */ 1435 function handleMenuItemHover(){ 1436 1437 g_menuItem.on('mouseenter', onMenuItemMouseEnter); 1438 1439 g_menuListWrap.on('mouseleave', onMenuItemMouseLeave); 1440 } 1441 1442 /* 1443 * handle mega-menu-inner-links link-item click 1444 */ 1445 function handleMenuInnerLinksClick(){ 1446 1447 g_menuList.on('close_mega_menu', onInnerLinkClick); 1448 } 1449 1450 /* 1451 * handle menu item open option 1452 */ 1453 function menuItemOpen(){ 1454 1455 handleMenuItemHover(); 1456 handleMenuItemClick(); 1457 handleMenuInnerLinksClick(); 1458 } 1459 1460 /* 1461 * define responsive mode behaviour 1462 */ 1463 function onBurgerMenuClick(){ 1464 1465 g_menuListWrap.addClass(g_menuActiveClass); 1466 g_objBody.addClass(g_menuActiveClass); 1467 g_objHtml.addClass(g_menuActiveClass); 1468 } 1469 1470 /* 1471 * close menu on click on the burger 1472 */ 1473 function onCloseBurgerMenuBtnClick(){ 1474 1475 g_menuItem.removeClass(g_classActive); 1476 1477 g_menuSection.removeClass(g_classActive); 1478 setDisactiveArrow(); 1479 1480 setDisactiveResponsiveHeight(); 1481 g_menuListWrap.removeClass(g_menuActiveClass); 1482 g_objBody.removeClass(g_menuActiveClass); 1483 g_objHtml.removeClass(g_menuActiveClass); 1484 1485 //remove active class from menu 1486 g_menu.removeClass(g_menuActiveClass); 1487 1488 openFirstItem(); 1489 } 1490 1491 /* 1492 * remove from body and menu wrapper open class 1493 */ 1494 function removeOpenClass(){ 1495 1496 if(g_menuListWrap.hasClass(g_menuActiveClass) == false) 1497 return(false); 1498 1499 if(g_objBody.hasClass(g_menuActiveClass) == false) 1500 return(false); 1501 1502 g_menuListWrap.removeClass(g_menuActiveClass); 1503 g_objBody.removeClass(g_menuActiveClass); 1504 g_objHtml.removeClass(g_menuActiveClass); 1505 } 1506 1507 /* 1508 * handle resize event 1509 */ 1510 function onWindowResize(){ 1511 1512 var activeMenuItem = g_menu.find('.uc-mega_menu_list_item.uc-active_item'); 1513 1514 //set height 0 except active section when resize from desktop to mobile 1515 if(g_isCustomResponsiveViewport.matches == true){ 1516 1517 //add responsive class to wrapper on mobile 1518 g_menuListWrap.addClass('uc-mobile-mode'); 1519
1520 setActiveResponsiveHeight(activeMenuItem); 1521 1522 g_objOverlay.hide(); 1523 } 1524 1525 //remove menu / wrapper open class when breakpoint changes 1526 if(g_isNotCustomResponsiveViewport.matches == true){ 1527 1528 removeOpenClass(); 1529 1530 //remove responsive class from wrapper 1531 g_menuListWrap.removeClass('uc-mobile-mode'); 1532 1533 g_menuSection.css({'height': 'unset'}); 1534 } 1535 1536 //update viewport width var on scroll 1537 g_viewportWidth = jQuery(window).width(); 1538 1539 //update left position on scroll 1540 g_menuWrapOffsetLeft = g_menuListWrap.offset().left; 1541 1542 handleWidthType(); 1543 1544 //set visible position of all dropdown sections / set position of the tip 1545 for(let i = 0; i < g_menuItem.length; i++){ 1546 1547 var objMenuItem = g_menuItem.eq(i); 1548 var menuSection = objMenuItem.find(g_classSection); 1549 var menuSectionChild = menuSection.children(); 1550 1551 setVisiblePositionX(objMenuItem); 1552 1553 setTipPosition(menuSection); 1554 setCoverPosition(menuSection, menuSectionChild); 1555 } 1556 1557 setOverlayPosition(activeMenuItem); 1558 1559 getScrollPos(); 1560 1561 //handle sticky section bug protection 1562 setTimeout(onPageScroll,100); 1563 1564 } 1565 1566 /* 1567 * handle scroll event for sticky section protection 1568 */ 1569 function onPageScroll(){ 1570 1571 var objParentSticky = g_menu.parents('.elementor-sticky'); 1572 1573 //only if .elementor-sticky exist 1574 if(!objParentSticky.length) 1575 return(false); 1576 1577 var objActiveMenuSections = jQuery('.uc-mega_menu_section.uc-active_item'); 1578 var visibleMenuSectionNum = objActiveMenuSections.length; 1579 1580 //only if active menu item section exist 1581 if(!visibleMenuSectionNum) 1582 return(false); 1583 1584 //only if active menu item section number grater than 1 1585 if(visibleMenuSectionNum == 1) 1586 return(false); 1587 1588 objActiveMenuSections.each(function(index, el){ 1589 1590 //look for index 1 only 1591 if(index == 0) 1592 return(true); 1593 1594 //hide opened section with opacity and pointer events 1595 el.style.opacity = 0; 1596 el.style.pointerEvents = 'none'; 1597 1598 if(g_isNotCustomResponsiveViewport.matches == true) 1599 return(true) 1600 1601 jQuery(this).removeClass('uc-active_item'); 1602 1603 }); 1604 1605 } 1606 1607 /** 1608 * find focused item and trigger event 1609 */ 1610 function findFocusedAndTrigger(e, eventToTrigger){ 1611 1612 //look at each title item 1613 g_menuItemTitle.each(function(){ 1614 1615 var objTitle = jQuery(this); 1616 1617 //if not focused then skip 1618 if(!objTitle.is(':focus')) 1619 return(true); 1620 1621 //if open menu type hover 1622 if(g_dataMenuOpen == 'hover') 1623 objTitle.trigger(eventToTrigger); 1624 1625 var activeMenuItemClick = objTitle.parents('.uc-mega_menu_list_item'); 1626 1627 //if open menu type click 1628 //if enter - check if active and open if not 1629 if(g_dataMenuOpen == 'click' && e.keyCode == 13){ 1630 1631 if(activeMenuItemClick.hasClass(g_classActive) == false){ 1632
1633 setActive(activeMenuItemClick); 1634 setActiveArrow(activeMenuItemClick); 1635 1636 } 1637 1638 } 1639 1640 //if esc - check if active and close if opened 1641 if(g_dataMenuOpen == 'click' && e.keyCode == 27){ 1642 1643 if(activeMenuItemClick.hasClass(g_classActive) == false) 1644 return(true); 1645 1646 setDisactive(); 1647 1648 } 1649 1650 e.preventDefault(); 1651 1652 }); 1653 1654 } 1655 1656 /** 1657 * find focused item and trigger open 1658 */ 1659 function findFocusedAndOpen(e){ 1660 1661 findFocusedAndTrigger(e, 'mouseenter'); 1662 1663 } 1664 1665 /** 1666 * find focused item and trigger close 1667 */ 1668 function findFocusedAndClose(e){ 1669 1670 findFocusedAndTrigger(e, 'mouseleave'); 1671 1672 } 1673 1674 /** 1675 * open / close with key press 1676 */ 1677 function onKeyDown(e){ 1678 1679 //do not listen on mobile devices 1680 if(g_isCustomResponsiveViewport.matches == true) 1681 return(true); 1682 1683 //if pressed key is enter then trigger open 1684 if(e.keyCode == 13) 1685 findFocusedAndOpen(e); 1686 1687 //if pressed key is esc then trigger close 1688 if(e.keyCode == 27) 1689 findFocusedAndClose(e); 1690 1691 } 1692 1693 /** 1694 * protection from parent backdrop filter css property 1695 **/ 1696 function backdropFilterProtection(){ 1697 1698 //find element with backdrop property 1699 var objElements = g_menu.parents('.elementor-element'); 1700 1701 if(!objElements.length) 1702 return(false); 1703 1704 //look at each element 1705 objElements.each(function(){ 1706 1707 var objElement = jQuery(this); 1708 var objElementBackdropProperty = objElement.css('backdrop-filter'); 1709 1710 //if none then skip 1711 if(objElementBackdropProperty == 'none') 1712 return(true); 1713 1714 //if not none then set to none 1715 objElement.css('backdrop-filter', 'none'); 1716 1717 }); 1718 1719 } 1720 1721 /* 1722 * lord icons protection 1723 */ 1724 function lordIconsProtection(){ 1725 1726 var objLordIcons = g_menu.find('lord-icon'); 1727 1728 if(!objLordIcons.length) 1729 return(false); 1730 1731 objLordIcons.each(function(){ 1732 1733 var objIcon = jQuery(this); 1734 var srcIcon = objIcon.attr('src'); 1735 1736 objIcon.attr('src','') 1737 1738 setTimeout(function(){ 1739 1740 objIcon.attr('src',srcIcon); 1741 1742 },600); 1743 1744 }); 1745 1746 } 1747 1748 1749 /* 1750 * init menu 1751 */ 1752 this.init = function(objMegaMenu, arrItems, urlAjax){ 1753 1754 //init globals 1755 g_menu = jQuery(objMegaMenu); 1756 1757 //protection for no menu element found 1758 if(!g_menu.length){ 1759 1760 console.log("Mega Menu not found"); 1761 1762 return(false); 1763 } 1764 1765 //backdrop filter protection 1766 setTimeout(backdropFilterProtection, 200); 1767 1768 g_menuSection = g_menu.find(".uc-mega_menu_section"); 1769 g_menuList = g_menu.find(".uc-mega_menu_list"); 1770 g_menuItem = g_menu.find(".uc-mega_menu_list_item"); 1771 g_menuItemTitle = g_menu.find(".uc-mega_menu_title"); 1772 g_menuListWrap = g_menu.find(".uc-mega_menu-wrapper"); 1773 g_indicator = g_menuItem.find('.sub-arrow'); 1774 g_objBody = jQuery("body"); 1775 g_objHtml = jQuery("html"); 1776 g_dataMenuOpen = g_menuList.data("menu-open"); 1777 g_objOverlay = g_menu.find('.uc_mega_menu_overlay'); 1778 g_menuWrapOffsetLeft = g_menuListWrap.offset().left; 1779 g_viewportWidth = jQuery(window).width(); 1780 g_dataPositionX = g_menuList.data("position-x"); 1781 g_dataEditor = g_menu.data("editor"); 1782 g_showErrors = g_menu.data("errors"); 1783 g_offsetX = g_menuList.data("offset-x"); 1784 g_dataCloseDelay = g_menuList.data("close-delay"); 1785 g_urlBase = urlAjax; 1786 1787 g_menuActiveClass = "uc-menu-open"; 1788 g_classSection = '.uc-mega_menu_section'; 1789 g_classActive = 'uc-active_item'; 1790 1791 g_isDesktopViewport = window.matchMedia("(min-width: 1025px)"); 1792 g_isNotDesktopViewport = window.matchMedia("(max-width: 1024px)"); 1793 1794 var customResponsiveBreakpoint = g_menuListWrap.data("responsive-breakpoint"); 1795
1796 g_isCustomResponsiveViewport = window.matchMedia("(max-width: " + customResponsiveBreakpoint + "px)"); 1797 g_isNotCustomResponsiveViewport = window.matchMedia("(min-width: " + (customResponsiveBreakpoint + 1) + "px)"); 1798 1799 g_arrItems = arrItems; 1800 1801 //remove any loader that was active 1802 var objLoaders = g_menu.find('.uc-mega-menu-item-loader'); 1803 1804 objLoaders.remove(); 1805 1806 //remove uc-arrow-hidden class from sub-arrows 1807 if(g_indicator.length) 1808 g_indicator.removeClass('uc-arrow-hidden'); 1809 1810 //if in editor do nothing with sections 1811 if(g_dataEditor == 'no') 1812 handleItemTypeSection(); 1813 1814 //if in editor debug sections 1815 if(g_dataEditor == 'yes') 1816 handleItemTypeSectionInEditor(); 1817 1818 var burgerMenu = g_menu.find(".uc-mega_menu-burger"); 1819 var closeBtn = g_menu.find(".uc-mega_menu-close-btn"); 1820 1821 //init events 1822 burgerMenu.on("click", onBurgerMenuClick); 1823 closeBtn.on("click", onCloseBurgerMenuBtnClick); 1824 1825 //if in editor do not open dropdown 1826 if(g_dataEditor == 'yes') 1827 return(false); 1828 1829 menuItemOpen(); 1830 1831 jQuery(window).on('resize', function(){ 1832 setTimeout(onWindowResize,100) 1833 }); 1834 1835 jQuery(window).on('scroll', function(){ 1836 setTimeout(onPageScroll,100); 1837 }); 1838 1839 g_menuListWrap.on('scroll', function(){ 1840 setTimeout(onPageScroll,100); 1841 }); 1842 1843 jQuery(window).on("keydown", function(e){ 1844 onKeyDown(e); 1845 }); 1846 1847 //lord icons load protection 1848 lordIconsProtection(); 1849 1850 //trigger resize after init to fix layout issue 1851 window.dispatchEvent(new Event('resize')); 1852 1853 } 1854}
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.