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