1( function( $ ) { 2 'use strict'; 3 4 /** 5 * JetMegaMenuClass 6 */ 7 class JetMegaMenuClass { 8 9 /** 10 * [constructor description] 11 * @return {[type]} [description] 12 */ 13 constructor( instance, options ) { 14 this.defaultSettings = { 15 menuId: '0', 16 menuUniqId: window.jetMenu.getUniqId(), 17 layout: 'horizontal', 18 subTrigger: 'item', // item, submarker 19 subEvent: 'click', // hover, click 20 rollUp: true, 21 breakpoint: 768, // Minimal menu width, when this plugin activates 22 mouseLeaveDelay: 500, 23 megaWidthType: 'container', 24 megaWidthSelector: '', 25 megaAjaxLoad: false, 26 classes: { 27 instance: 'menu', 28 menuContainer: 'menu-container', 29 menuList: 'menu-list', 30 menuItem: 'menu-item', 31 menuItemLink: 'menu-item__link', 32 subMenuContainer: 'sub-menu', 33 subMenuList: 'sub-menu__list', 34 megaContainer: 'mega-container', 35 } 36 } 37 38 this.$instance = $( instance ); 39 this.settings = $.extend( this.defaultSettings, options ); 40 this.$window = $( window ); 41 this.$document = $( document ); 42 this.$body = $( 'body' ); 43 this.isRTL = this.$body.hasClass( 'rtl' ); 44 this.isDropdownState = false; 45 46 this.createInstance(); 47 } 48 49 createInstance() { 50 this.$menuList = $( `.${ this.settings.classes.menuList }`, this.$instance ); 51 this.$menuItems = $( `>.${ this.settings.classes.menuItem }:not(.${ this.settings.classes.menuItem }--roll-up)`, this.$menuList ); 52 this.$rollUpItem = $( `>.${ this.settings.classes.menuItem }--roll-7up`, this.$menuList ); 53 54 this.menuItemsData = this.$menuItems.toArray().map( function( item ) { 55 return { 56 element: item, 57 outerWidth: $( item ).outerWidth( true ), 58 offsetLeft: $( item )[0].offsetLeft, 59 } 60 } ); 61 62 this.initWatcher( 50 ); 63 this.initEvents(); 64 this.maybeRollUpItems(); 65 this.rebuildSubContainers(); 66 this.watchTick(); 67 68 document.addEventListener( 'DOMContentLoaded', ( event ) => { 69 setTimeout( () => { 70 this.watchTick(); 71 }, 100 ); 72 } ); 73 74 this.$instance.addClass( `${ this.settings.classes.instance }--inited` ); 75 this.$document.trigger( 'JetMegaMenuInited' ); 76 } 77 78 initEvents() { 79 let debounceTimer, 80 eventHandler = 'JetMegaMenu', 81 $itemTargetSelector = 'item' === this.settings.subTrigger ? `.${ this.settings.classes.menuItem } > .${ this.settings.classes.menuItem }__inner` : `.${ this.settings.classes.menuItem } > .${ this.settings.classes.menuItem }__inner .${ this.settings.classes.menuItem }__dropdown`; 82 83 switch ( this.settings.subEvent ) { 84 case 'hover': 85 this.$instance.on( `mouseenter.${ eventHandler }`, `.${ this.settings.classes.menuItem } > .${ this.settings.classes.menuItem }__inner`, { instance: this }, ( event ) => { 86 let $target = $( event.target ), 87 $menuItem = $target.parents( `.${ this.settings.classes.menuItem }` ), 88 $subContainer = $( `.${ this.settings.classes.subMenuContainer }:first, .${ this.settings.classes.megaContainer }:first`, $menuItem ), 89 templateContent = $subContainer.data( 'template-content' ) || false, 90 templateId = $subContainer.data( 'template-id' ) || false; 91 92 $( `.${ this.settings.classes.menuItem }--hover`, this.$instance ).removeClass( `${ this.settings.classes.menuItem }--hover` ); 93 94 if ( $menuItem.hasClass( `${ this.settings.classes.menuItem }-has-children` ) ) { 95 $menuItem.addClass( `${ this.settings.classes.menuItem }--hover` ); 96 97 if ( templateId ) { 98 this.maybeTemplateLoad( templateId, templateContent, $subContainer ); 99 } 100 } 101 } ); 102 103 this.$instance.on( `mouseleave.${ eventHandler }`, `.${ this.settings.classes.menuItem } > .${ this.settings.classes.menuItem }__inner`, ( event ) => { /* Item Mouse Leave Event */ } ); 104 break; 105 106 case 'click': 107 108 this.$instance.on( `click.${ eventHandler }`, $itemTargetSelector, ( event ) => { 109 event.preventDefault(); 110 event.stopPropagation(); 111 112 let $currentTarget = $( event.currentTarget ), 113 $menuItem = $currentTarget.closest( `.${this.settings.classes.menuItem}` ), 114 $menuItemLink = $( '.jet-mega-menu-item__link', $menuItem ).first(), 115 $siblingsItems = $menuItem.siblings( `.${this.settings.classes.menuItem}-has-children` ), 116 $subContainer = $( `.${this.settings.classes.subMenuContainer}:first, .${this.settings.classes.megaContainer}`, $menuItem ), 117 templateContent = $subContainer.data( 'template-content' ) || false, 118 templateId = $subContainer.data( 'template-id' ) || false; 119 120 if ( $siblingsItems.length ) { 121 $siblingsItems.removeClass( `${ this.settings.classes.menuItem }--hover` ); 122 $( `.${ this.settings.classes.menuItem }-has-children`, $siblingsItems ).removeClass( `${ this.settings.classes.menuItem }--hover` ); 123 } 124 125 if ( $menuItem.hasClass( `${ this.settings.classes.menuItem }-has-children` ) ) { 126 if ( ! $menuItem.hasClass( `${ this.settings.classes.menuItem }--hover` ) ) { 127 $menuItem.addClass( `${ this.settings.classes.menuItem }--hover` ); 128 } else { 129 $menuItem.removeClass( `${ this.settings.classes.menuItem }--hover` ); 130 } 131 132 if ( templateId ) { 133 this.maybeTemplateLoad( templateId, templateContent, $subContainer ); 134 } 135 } else { 136 let itemLink = $menuItemLink.attr( 'href' ) || '#', 137 target = $menuItemLink.attr( 'target' ) || '_self'; 138 139 window.open( itemLink, target ); 140 141 return false;
142 } 143 } ); 144 break; 145 } 146 147 this.$instance.on( `mouseenter.${ eventHandler }`, `.${ this.settings.classes.subMenuContainer }, .${ this.settings.classes.megaContainer }`, ( event ) => { 148 clearTimeout( debounceTimer ); 149 } ); 150 151 this.$instance.on( `mouseenter.${ eventHandler }`, ( event ) => { 152 clearTimeout( debounceTimer ); 153 } ); 154 155 this.$instance.on( `mouseleave.${ eventHandler }`, ( event ) => { 156 debounceTimer = setTimeout( () => { 157 $( `.${ this.settings.classes.menuItem }--hover`, this.$instance ).removeClass( `${ this.settings.classes.menuItem }--hover` ); 158 }, this.settings.mouseLeaveDelay ); 159 } ); 160 161 this.$window.on( `orientationchange.${ eventHandler } resize.${ eventHandler }`, ( event ) => { 162 $( `.${ this.settings.classes.menuItem }`, this.$instance ).removeClass( `${ this.settings.classes.menuItem }--hover` ); 163 this.$instance.removeClass( `${ this.settings.classes.instance }--dropdown-open` ); 164 } ); 165 166 this.$document.on( `touchend.${ eventHandler }`, ( event ) => { 167 168 if ( $( event.target ).closest( `.${ this.settings.classes.menuItem }` ).length ) { 169 return; 170 } 171 172 $( `.${ this.settings.classes.menuItem }`, this.$instance ).removeClass( `${ this.settings.classes.menuItem }--hover` ); 173 } ); 174 175 this.$instance.on( 'watchTickEventResetRegularState', ( event ) => { 176 this.resetRegularState(); 177 178 if ( this.$rollUpItem[0] ) { 179 $( `.${ this.settings.classes.subMenuList }:first`, this.$rollUpItem ).empty(); 180 this.$rollUpItem[0].hidden = true; 181 } 182 183 for ( let index = 0; index < this.menuItemsData.length; index++ ) { 184 this.menuItemsData[ index ].element.hidden = false; 185 } 186 } ); 187 188 this.$instance.on( 'watchTickEventResetDropdownState', ( event ) => { 189 this.resetDropdownState(); 190 this.$instance.removeClass( `${ this.settings.classes.instance }--dropdown-open` ); 191 } ); 192 193 this.$instance.on( `click.${ eventHandler }`, `.${ this.settings.classes.instance }-toggle`, ( event ) => { 194 195 if ( ! this.$instance.hasClass( `${ this.settings.classes.instance }--dropdown-open` ) ) { 196 this.$instance.addClass( `${ this.settings.classes.instance }--dropdown-open` ); 197 } else { 198 this.$instance.removeClass( `${ this.settings.classes.instance }--dropdown-open` ); 199 } 200 } ); 201 202 } 203 204 /** 205 * Init watcher function. 206 * 207 * @param {number} Watcher debounce delay. 208 * @return {void} 209 */ 210 initWatcher( delay = 10 ) { 211 $( window ).off( `resize.JetMegaMenu${ this.settings['menuUniqId'] }` ).on( `resize.JetMegaMenu${ this.settings['menuUniqId'] } orientationchange.JetMegaMenu${ this.settings['menuUniqId'] }`, this.debounce( delay, this.watchTick.bind( this ) ) ); 212 this.$instance.trigger( 'containerResize' ); 213 } 214 215 /** 216 * Responsive menu watcher callback. 217 * 218 * @param {Object} Resize or Orientationchange event. 219 * @return {void} 220 */ 221 watchTick( event ) { 222 223 if ( this.isDropdown() ) { 224 225 if ( ! this.isDropdownState ) { 226 this.$instance.trigger( 'watchTickEventResetRegularState' ); 227 } 228 229 this.isDropdownState = true; 230 this.$instance.removeClass( `${ this.settings.classes.instance }--layout-horizontal ${ this.settings.classes.instance }--layout-vertical` ); 231 this.$instance.addClass( `${ this.settings.classes.instance }--layout-dropdown` ); 232 this.$instance.trigger( 'watchTickEventDropdown' ); 233 } else { 234 235 if ( this.isDropdownState ) { 236 this.$instance.trigger( 'watchTickEventResetDropdownState' ); 237 } 238 239 this.isDropdownState = false; 240 this.$instance.removeClass( `${ this.settings.classes.instance }--layout-dropdown` ); 241 this.$instance.addClass( `${ this.settings.classes.instance }--layout-${ this.settings.layout }` ); 242 this.$instance.trigger( `watchTickEventRegular` ); 243 this.$instance.trigger( `watchTickEventRegular--${ this.settings.layout }` ); 244 } 245 246 this.$instance.trigger( 'watchTickEvent' ); 247 } 248 249 /** 250 * Rollup rebuilding function. 251 * 252 * @return {void} 253 */ 254 maybeRollUpItems() { 255 this.$instance.on( 'watchTickEventRegular--horizontal', ( event ) => { 256 257 if ( ! this.settings.rollUp ) { 258 return false;
259 } 260 261 let mainMenuWidth = this.$instance.width(), 262 visibleItemsArray = [], 263 hiddenItemsArray = []; 264 265 for ( let index = 0; index < this.menuItemsData.length; index++ ) { 266 let itemData = this.menuItemsData[ index ], 267 nextItemData = this.menuItemsData[ index + 1 ] || false, 268 offsetLeft = nextItemData ? nextItemData.offsetLeft : itemData.offsetLeft + itemData.outerWidth, 269 item = itemData.element; 270 271 if ( offsetLeft + this.$rollUpItem.outerWidth( true ) > mainMenuWidth ) { 272 item.hidden = true; 273 hiddenItemsArray.push( item ); 274 } else { 275 item.hidden = false; 276 visibleItemsArray.push( item ); 277 } 278 } 279 280 $( `.${ this.settings.classes.subMenuList }:first`, this.$rollUpItem ).empty(); 281 for ( let hiddenMenuItem of hiddenItemsArray ) { 282 let $hiddenClone = $( hiddenMenuItem ).clone(); 283 284 $hiddenClone[0].hidden = false; 285 286 $( `>.${ this.settings.classes.menuItem }__inner >.${ this.settings.classes.menuItemLink }`, $hiddenClone ).toggleClass( `${ this.settings.classes.menuItemLink }--top-level ${ this.settings.classes.menuItemLink }--sub-level` ); 287 $( `.${ this.settings.classes.subMenuList }:first`, this.$rollUpItem ).append( $hiddenClone ); 288 } 289 290 if ( this.$rollUpItem[0] ) { 291 this.$rollUpItem[0].hidden = hiddenItemsArray.length ? false : true; 292 } 293 294 this.$instance.trigger( 'rollUpItemsEvent' ); 295 } ) 296 } 297 298 /** 299 * Rebuild SubContainers function. 300 * 301 * @return {void} 302 */ 303 rebuildSubContainers() { 304 this.$instance.on( 'watchTickEventRegular--horizontal', ( event ) => { 305 let $megaMenuList = $( `.${ this.settings.classes.megaContainer }`, this.$instance ), 306 $subMenuList = $( `.${ this.settings.classes.subMenuContainer }`, this.$instance ), 307 subInverseClass = `${ this.settings.classes.subMenuContainer }--inverse`, 308 instanceWidth = this.$instance.width(), 309 instanceOffset = this.$instance.offset(); 310 311 $subMenuList.each( ( index, element ) => { 312 let $element = $( element ); 313 314 if ( this.isOffscreenX( element ) ) { 315 $element.addClass( subInverseClass ); 316 } else { 317 $element.removeClass( subInverseClass ); 318 } 319 } ); 320 321 switch( this.settings.megaWidthType ) { 322 case 'container': 323 $megaMenuList.each( ( index, element ) => { 324 let $element = $( element ), 325 $elementPosition = $element.data( 'position' ), 326 elementOffset = $element.offset(), 327 elementDeltaOffset = 'default' === $elementPosition ? ( instanceOffset.left - elementOffset.left ) : 0; 328 329 $element.css( { 330 '--jmm-submenu-width': `${ instanceWidth }px`, 331 '--jmm-submenu-delta-x-offset': `${ elementDeltaOffset }px` 332 } ); 333 } ); 334 335 break; 336 case 'selector': 337 let $customSelector = $( this.settings.megaWidthSelector ); 338 339 if ( $customSelector[0] ) { 340 let selectorWidth = $customSelector.width(), 341 selectorOffset = $customSelector.offset(); 342 343 $megaMenuList.each( ( index, element ) => { 344 let $element = $( element ), 345 $elementPosition = $element.data( 'position' ), 346 elementOffset = $element.offset(), 347 elementDeltaOffset = 'default' === $elementPosition ? ( selectorOffset.left - elementOffset.left ) : 0; 348 349 $element.css( { 350 '--jmm-submenu-width': `${ selectorWidth }px`, 351 '--jmm-submenu-delta-x-offset': `${ elementDeltaOffset }px` 352 } ); 353 } ); 354 355 } 356 357 break; 358 case 'items': 359 let $lastItem = $( `.${ this.settings.classes.menuItem }--top-level:not([hidden]):last`, this.$instance ), 360 $firstItem = $( `.${ this.settings.classes.menuItem }--top-level:not([hidden]):first`, this.$instance ), 361 lastItemBounding = $lastItem[0].getBoundingClientRect(), 362 firstItemBounding = $firstItem[0].getBoundingClientRect(), 363 itemsWidth = lastItemBounding.x + lastItemBounding.width - firstItemBounding.x; 364 365 $megaMenuList.each( ( index, element ) => { 366 let $element = $( element ), 367 $elementPosition = $element.data( 'position' ), 368 elementOffset = $element.offset(), 369 elementDeltaOffset = 'default' === $elementPosition ? ( instanceOffset.left - elementOffset.left ) : 0; 370 371 $element.css( { 372 '--jmm-submenu-width': `${ itemsWidth }px`, 373 '--jmm-submenu-delta-x-offset': `${ elementDeltaOffset }px` 374 } ); 375 } ); 376 break; 377 } 378 } ); 379
380 this.$instance.on( 'watchTickEventRegular--vertical', ( event ) => { 381 let $megaMenuList = $( `.${ this.settings.classes.megaContainer }`, this.$instance ), 382 $subMenuList = $( `.${ this.settings.classes.subMenuContainer }`, this.$instance ), 383 instanceWidth = this.$instance.width(), 384 instanceHeight = this.$instance.height(), 385 instanceOffset = this.$instance.offset(), 386 windowWidth = this.$window.outerWidth( true ), 387 subInverseClass = `${ this.settings.classes.subMenuContainer }--inverse`, 388 megaInverseClass = `${ this.settings.classes.megaContainer }--inverse`; 389 390 $subMenuList.each( ( index, element ) => { 391 let $element = $( element ); 392 393 if ( this.isOffscreenX( element ) ) { 394 $element.addClass( subInverseClass ); 395 } else { 396 $element.removeClass( subInverseClass ); 397 } 398 } ); 399 400 $megaMenuList.each( ( index, element ) => { 401 let $element = $( element ), 402 $elementPosition = $element.data( 'position' ), 403 $parentElement = $element.parent(), 404 elementOffset = $element.offset(), 405 elementDeltaOffsetX = ( instanceOffset.left - elementOffset.left ) + instanceWidth, 406 elementDeltaOffsetY = 'default' === $elementPosition ? ( instanceOffset.top - elementOffset.top ) : 0, 407 elementDeltaWidth = ( elementDeltaOffsetX + $element.width() ); 408 409 if ( $parentElement.hasClass(`${ this.settings.classes.menuItem }--top-level` ) ) { 410 $element.css( { 411 //'--jmm-submenu-width': `${ instanceWidth }px`, 412 '--jmm-submenu-min-height': `${ instanceHeight }px`, 413 //'--jmm-submenu-delta-x-offset': `${ elementDeltaOffsetX }px`, 414 '--jmm-submenu-delta-y-offset': `${ elementDeltaOffsetY }px` 415 } ); 416 } 417 418 if ( this.isOffscreenX( element ) ) { 419 $element.addClass( megaInverseClass ); 420 } else { 421 $element.removeClass( megaInverseClass ); 422 } 423 } ); 424 } ); 425 } 426 427 /** 428 * Reset Regular State 429 * 430 * @return {void} 431 */ 432 resetRegularState() {} 433 434 /** 435 * Reset Dropdown State 436 * 437 * @return {void} 438 */ 439 resetDropdownState() {} 440 441 /** 442 * Get mobile status. 443 * 444 * @return {boolean} Mobile Status 445 */ 446 isDropdown() { 447 return ( this.$window.width() < this.settings.breakpoint || 'dropdown' === this.settings.layout ) ? true : false; 448 } 449 450 /** 451 * 452 * @param element 453 * @returns {boolean} 454 */ 455 isOffscreenX( element ) { 456 let rect = element.getBoundingClientRect(); 457 458 return ( 459 rect.x < 0 || ( rect.x + rect.width ) > window.innerWidth 460 ); 461 } 462 463 /** 464 * Mobile and tablet check funcion. 465 * 466 * @return {boolean} Mobile Status 467 */ 468 mobileAndTabletcheck() { 469 let check = false; 470 471 (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|
471sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera); 472 473 return check; 474 } 475 476 /** 477 * Debounce the function call 478 * 479 * @param {number} threshold The delay. 480 * @param {Function} callback The function. 481 */ 482 debounce( threshold, callback ) { 483 let timeout; 484 485 return function debounced( $event ) { 486 function delayed() { 487 callback.call( this, $event ); 488 timeout = null; 489 } 490 491 if ( timeout ) { 492 clearTimeout( timeout ); 493 } 494 495 timeout = setTimeout( delayed, threshold ); 496 }; 497 } 498 499 maybeTemplateLoad( templateId, templateContent, $templateContainer ) { 500 501 if ( ! this.settings.megaAjaxLoad ) { 502 return; 503 } 504 505 if ( $templateContainer.hasClass( 'template-loaded' ) ) { 506 return; 507 } 508 509 let getMegaContentUrl = 'default' === templateContent ? window.jetMenuPublicSettings.getBlocksTemplateApiUrl : window.jetMenuPublicSettings.getElementorTemplateApiUrl; 510 511 $.ajax( { 512 type: 'GET', 513 url: getMegaContentUrl, 514 dataType: 'json', 515 data: { 516 'id': templateId, 517 'dev': window.jetMenuPublicSettings.devMode 518 }, 519 beforeSend: function( jqXHR, ajaxSettings ) { 520 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 521 }, 522 success: function( responce, textStatus, jqXHR ) { 523 var templateContent = responce['template_content'], 524 templateScripts = responce['template_scripts'], 525 templateStyles = responce['template_styles']; 526 527 for ( var scriptHandler in templateScripts ) { 528 jetMenu.addedAssetsPromises.push( jetMenu.loadScriptAsync( scriptHandler, templateScripts[ scriptHandler ] ) ); 529 } 530 531 for ( var styleHandler in templateStyles ) { 532 jetMenu.addedAssetsPromises.push( jetMenu.loadStyle( styleHandler, templateStyles[ styleHandler ] ) ); 533 } 534 535 $templateContainer.addClass( 'template-loaded' ); 536 537 jetMenu.megaContentRender( $( '.jet-mega-menu-mega-container__inner', $templateContainer ), templateContent ); 538 } 539 } ); 540 } 541 } 542 543 // jQuery plugin 544 $.fn.JetMegaMenu = function( options ) { 545 return this.each( function() { 546 let $this = $( this ), 547 pluginOptions = ( 'object' === typeof options ) ? options : {}; 548 549 if ( ! $this.data( 'JetMegaMenu' ) ) { 550 // create plugin instance (only if not exists) and expose the entire instance API 551 $this.data( 'JetMegaMenu', new JetMegaMenuClass( this, pluginOptions ) ); 552 } 553 } ); 554 }; 555} ( jQuery )); 556 557// JetMenu Public Scripts 558( function( $ ) { 559 'use strict'; 560 561 window.jetMenu = { 562 563 addedScripts: {}, 564 565 addedStyles: {}, 566 567 addedAssetsPromises: [], 568 569 initedMobileRenderInstance: [], 570 571 eventBus: new Vue(), 572 573 $body: $( 'body' ), 574 575 init: function() { 576 this.initLocationMenuRender(); 577 this.mobileVueComponents(); 578 this.initMobileRender(); 579 580 window.addEventListener( 'jetMenu/editor/templateRenderer/renderSuccess', ( event ) => { 581 this.initLocationMenuRender(); 582 this.mobileVueComponents(); 583 this.initMobileRender(); 584 }, false ); 585 586 $( window ).on( 'jet-menu/ajax/frontend-init', ( event, payload ) => { 587 jetMenu.maybeElementorFrontendInit( payload.$container ); 588 } ); 589 590 $( window ).on( 'jet-menu/ajax/frontend-init/after', ( event, payload ) => { 591 this.initLocationMenuRender(); 592 this.mobileVueComponents(); 593 this.initMobileRender(); 594 } ); 595 596 }, 597 598 initLocationMenuRender: function() { 599 600 let $megaMenuList = $( '.jet-mega-menu--location-wp-nav' ); 601 602 if ( ! $megaMenuList[0] ) { 603 return false; 604 } 605 606 $megaMenuList.each( function() { 607 let $this = $( this ), 608 settings = $this.data( 'settings' ); 609 610 $this.JetMegaMenu( { 611 rollUp: settings.rollUp, 612 layout: settings.layout, 613 subTrigger: settings.subTrigger, 614 subEvent: settings.subEvent, 615 breakpoint: settings.breakpoint, 616 megaWidthType: settings.megaWidthType, 617 megaWidthSelector: settings.megaWidthSelector, 618 megaAjaxLoad: settings.megaAjaxLoad, 619 classes: { 620 instance: 'jet-mega-menu', 621 menuContainer: 'jet-mega-menu-container', 622 menuList: 'jet-mega-menu-list', 623 menuItem: 'jet-mega-menu-item', 624 menuItemLink: 'jet-mega-menu-item__link', 625 subMenuContainer: 'jet-mega-menu-sub-menu', 626 subMenuList: 'jet-mega-menu-sub-menu__list', 627 megaContainer: 'jet-mega-menu-mega-container', 628 } 629 } ); 630 } ); 631 }, 632 633 initMobileRender: function() { 634 635 let mobileMenuList = $( '.jet-mobile-menu--location-wp-nav' ); 636 637 if ( ! mobileMenuList[0] ) { 638 return false;
639 } 640 641 if ( 'true' === window.jetMenuPublicSettings.devMode ) { 642 Vue.config.devtools = true; 643 } 644 645 mobileMenuList.each( function() { 646 let $this = $( this ), 647 menuInstanceId = $this.attr( 'id' ), 648 menuId = $this.data( 'menu-id' ) || false, 649 menuOptions = $this.data( 'menu-options' ) || {}; 650 651 jetMenu.createMobileRenderInstance( menuInstanceId, menuId, menuOptions ); 652 } ); 653 }, 654 655 createMobileRenderInstance: function( menuInstanceId, menuId, menuOptions ) { 656 657 if ( jetMenu.initedMobileRenderInstance.includes( menuInstanceId ) ) { 658 return; 659 } 660 661 jetMenu.initedMobileRenderInstance.push( menuInstanceId ); 662 663 let mobileRenderInstance = new Vue( { 664 el: '#' + menuInstanceId, 665 data: { 666 uniqId: menuInstanceId, 667 menuOptions: menuOptions, 668 refsHtml: {}, 669 }, 670 mounted: function() { 671 let refsHtml = {}; 672 673 for ( var ref in this.$refs ) { 674 Object.assign( refsHtml, { [ ref ]: this.$refs[ ref ].innerHTML } ); 675 } 676 677 this.refsHtml = refsHtml; 678 } 679 } ); 680 }, 681 682 mobileVueComponents: function() { 683 684 Vue.component( 'mobile-menu-item', { 685 template: '#mobile-menu-item-template', 686 687 props: { 688 itemDataObject: Object, 689 depth: Number 690 }, 691 692 data: function() { 693 return ( { 694 ajaxRequest: null, 695 templateLoadStatus: false, 696 subDropdownVisible: false 697 } ) 698 }, 699 700 computed: { 701 702 itemClasses: function() { 703 let itemClasses = [ 704 'jet-mobile-menu__item', 705 'jet-menu-item-' + this.itemDataObject.itemId, 706 'jet-mobile-menu__item--sub-trigger-' + ( this.$root.menuOptions.subTrigger || 'item' ), 707 ]; 708 709 let customClasses = this.itemDataObject.classes; 710 711 if ( 0 !== customClasses.length ) { 712 itemClasses = itemClasses.concat( customClasses ); 713 } 714 715 if ( window.location.href === this.itemDataObject.url ) { 716 itemClasses.push( 'jet-mobile-menu__item--active' ); 717 } 718 719 return itemClasses; 720 }, 721 722 itemLinkClasses: function() { 723 let classes = [ 724 'mobile-link', 725 0 === this.depth ? 'mobile-top-level-link' : 'mobile-sub-level-link', 726 ]; 727 728 return classes; 729 }, 730 731 isСhildrenDefine: function() { 732 return this.itemDataObject.children ? true : false; 733 }, 734 735 isTemplateDefine: function() { 736 return false !== this.itemDataObject.megaTemplateId ? true : false; 737 }, 738 739 getTemplateUrl: function() { 740 return 'default' === this.itemDataObject.megaContentType ? window.jetMenuPublicSettings.getBlocksTemplateApiUrl : window.jetMenuPublicSettings.getElementorTemplateApiUrl; 741 }, 742 743 isSub: function() { 744 return this.isСhildrenDefine || this.isTemplateDefine ? true : false; 745 }, 746 747 isTopLevel: function() { 748 return 0 === this.depth ? true : false; 749 }, 750 751 isDropdownLayout: function() { 752 return this.isSub && ! this.isTemplateDefine && 'dropdown' === this.$root.menuOptions.subOpenLayout; 753 }, 754 755 depthClass: function() { 756 return 0 === this.depth ? 'mobile-top-level-link' : 'mobile-sub-level-link'; 757 }, 758 759 dropdownIconHtml: function() { 760 let dropdownIcon = this.$root.refsHtml.dropdownIcon ? this.$root.refsHtml.dropdownIcon : '<span class="dashicons dashicons-arrow-right"></span>', 761 dropdownOpenedIcon = this.$root.refsHtml.dropdownOpenedIcon ? this.$root.refsHtml.dropdownOpenedIcon : '<span class="dashicons dashicons-arrow-down"></span>'; 762 763 if ( this.subDropdownVisible ) { 764 dropdownIcon = dropdownOpenedIcon; 765 } 766 767 return dropdownIcon; 768 }, 769 770 itemIconHtml: function() { 771 return this.itemDataObject.itemIcon; 772 }, 773 774 isIconVisible: function() { 775 let iconVisible = this.$root.menuOptions.itemIconVisible; 776 777 return ! iconVisible || '' === this.itemDataObject.itemIcon || ! this.itemDataObject.itemIcon ? false : true; 778 }, 779 780 isBadgeVisible: function() { 781 let badgeVisible = this.$root.menuOptions.itemBadgeVisible; 782 783 return false === badgeVisible || '' === this.itemDataObject.badgeContent || ! this.itemDataObject.badgeContent ? false : true; 784 }, 785 786 isDescVisible: function() { 787 let descVisible = this.$root.menuOptions.itemDescVisible; 788
789 return false === descVisible || '' === this.itemDataObject.description || ! this.itemDataObject.description ? false : true; 790 }, 791 792 loaderColor: function() { 793 return this.$root.menuOptions.loaderColor || '#3a3a3a'; 794 }, 795 }, 796 797 methods: { 798 itemSubHandler: function( event ) { 799 let target = event.target, 800 mobileLink = $( target ).closest( '.mobile-link' ); 801 802 if ( 'item' !== this.$root.menuOptions.subTrigger ) { 803 return; 804 } 805 806 if ( this.isSub && mobileLink ) { 807 event.preventDefault(); 808 } 809 810 if ( ! this.isSub && mobileLink && this.$root.menuOptions.closeAfterNavigate ) { 811 jetMenu.eventBus.$emit( 'closeMenu', { 812 menuUniqId: this.$root.menuOptions.menuUniqId, 813 } ); 814 } 815 816 this.switchToSub( event ); 817 }, 818 819 markerSubHandler: function( event ) { 820 821 if ( 'submarker' !== this.$root.menuOptions.subTrigger ) { 822 return; 823 } 824 825 this.switchToSub( event ); 826 }, 827 828 switchToSub: function( event ) { 829 830 if ( ! this.isSub ) { 831 return; 832 } 833 834 if ( ! this.isTemplateDefine ) { 835 836 if ( this.isDropdownLayout ) { 837 this.subDropdownVisible = !this.subDropdownVisible; 838 839 return; 840 } 841 842 jetMenu.eventBus.$emit( 'itemsSubSwitch', { 843 menuUniqId: this.$root.menuOptions.menuUniqId, 844 id: this.itemDataObject.id, 845 name: this.itemDataObject.name, 846 children: this.itemDataObject.children || false 847 } ); 848 } else { 849 850 if ( ! this.itemDataObject.megaContent ) { 851 this.getMegaTemplate(); 852 } else { 853 jetMenu.eventBus.$emit( 'showTemplateContent', { 854 menuUniqId: this.$root.menuOptions.menuUniqId, 855 id: this.itemDataObject.id, 856 name: this.itemDataObject.name, 857 megaContent: this.itemDataObject.megaContent 858 } ); 859 } 860 } 861 }, 862 863 getMegaTemplate: function() { 864 var vueInstance = this; 865 866 vueInstance.ajaxRequest = $.ajax( { 867 type: 'GET', 868 url: vueInstance.getTemplateUrl, 869 dataType: 'json', 870 data: { 871 'id': vueInstance.itemDataObject.megaTemplateId, 872 'dev': window.jetMenuPublicSettings.devMode 873 }, 874 beforeSend: function( jqXHR, ajaxSettings ) { 875 876 if ( null !== vueInstance.ajaxRequest ) { 877 vueInstance.ajaxRequest.abort(); 878 } 879 880 vueInstance.templateLoadStatus = true; 881 882 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 883 }, 884 success: function( responce, textStatus, jqXHR ) { 885 let templateContent = responce['template_content'], 886 templateScripts = responce['template_scripts'], 887 templateStyles = responce['template_styles']; 888 889 for ( const scriptHandler in templateScripts ) { 890 jetMenu.addedAssetsPromises.push( jetMenu.loadScriptAsync( scriptHandler, templateScripts[ scriptHandler ] ) ); 891 } 892 893 for ( const styleHandler in templateStyles ) { 894 jetMenu.addedAssetsPromises.push( jetMenu.loadStyle( styleHandler, templateStyles[ styleHandler ] ) ); 895 } 896 897 vueInstance.templateLoadStatus = false; 898 899 vueInstance.itemDataObject.megaContent = templateContent; 900 901 jetMenu.eventBus.$emit( 'showTemplateContent', { 902 menuUniqId: vueInstance.$root.menuOptions.menuUniqId, 903 id: vueInstance.itemDataObject.id, 904 name: vueInstance.itemDataObject.name, 905 megaContent: vueInstance.itemDataObject.megaContent 906 } ); 907 } 908 } ); 909 } 910 } 911 912 }); 913 914 Vue.component( 'mobile-menu-list', { 915 template: '#mobile-menu-list-template', 916 props: { 917 depth: Number, 918 childrenObject: Object 919 } 920 } ); 921 922 Vue.component( 'mobile-menu', { 923 template: '#mobile-menu-template', 924 925 data: function() { 926 return ( { 927 menuOpen: false, 928 children: false, 929 itemsRawData: {}, 930 trail:[], 931 breadcrumbsData: [], 932 animation: 'items-next-animation', 933 ajaxRequest: null, 934 templateVisible: false, 935 instanceLoadStatus: false, 936 itemTemplateContent: false, 937 headerTemplate: this.$root.menuOptions['headerTemplate'] || 0, 938 headerContent: false, 939 headerTemplateVisible: false, 940 beforeTemplate: this.$root.menuOptions['beforeTemplate'] || 0, 941 beforeContent: false, 942 afterTemplate: this.$root.menuOptions['afterTemplate'] || 0, 943 afterContent: false, 944 ajaxPromises: [], 945 } ) 946 }, 947 948 mounted: function() { 949 let vueInstance = this; 950 951 if ( this.menuOpen ) { 952 jetMenu.$body.addClass( 'jet-mobile-menu-visible' ); 953 954 if ( 'slide-out' === this.$root.menuOptions.menuLayout ) { 955 jetMenu.$body.addClass( 'jet-menu-body-blocker' ); 956 } 957 } 958 959 this.ajaxPromises.push( 960 new Promise( function( resolve, reject ) { 961 $.ajax( { 962 type: 'GET', 963 url: window.jetMenuPublicSettings.menuItemsApiUrl, 964 dataType: 'json', 965 data: { 966 'menu_id': vueInstance.menuId, 967 'dev': window.jetMenuPublicSettings.devMode, 968 'lang': window.jetMenuPublicSettings.wpmlLanguageCode || false 969 }, 970 beforeSend: function( jqXHR, ajaxSettings ) { 971 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 972 }, 973 success: function( responce, textStatus, jqXHR ) { 974 let responceData = responce.data.items; 975 976 vueInstance.itemsRawData = responceData; 977 978 resolve(); 979 } 980 } ); 981 } ) 982 ); 983 984 if ( 0 !== +this.headerTemplate ) { 985 this.ajaxPromises.push( 986 new Promise( function( resolve, reject ) { 987 $.ajax( { 988 type: 'GET', 989 url: window.jetMenuPublicSettings.getElementorTemplateApiUrl, 990 dataType: 'json', 991 data: { 992 'id': vueInstance.headerTemplate, 993 'dev': window.jetMenuPublicSettings.devMode 994 }, 995 beforeSend: function( jqXHR, ajaxSettings ) { 996 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 997 }, 998 success: function( responce, textStatus, jqXHR ) { 999 let templateContent = responce['template_content'], 1000 templateScripts = responce['template_scripts'], 1001 templateStyles = responce['template_styles']; 1002 1003 for ( let scriptHandler in templateScripts ) { 1004 jetMenu.addedAssetsPromises.push( jetMenu.loadScriptAsync( scriptHandler, templateScripts[ scriptHandler ] ) ); 1005 } 1006 1007 for ( let styleHandler in templateStyles ) { 1008 jetMenu.addedAssetsPromises.push( jetMenu.loadStyle( styleHandler, templateStyles[ styleHandler ] ) ); 1009 } 1010 1011 vueInstance.headerContent = templateContent; 1012 vueInstance.headerTemplateVisible = true; 1013 1014 resolve(); 1015 } 1016 } ); 1017 } ) 1018 ); 1019 } 1020 1021 if ( 0 !== +this.beforeTemplate ) { 1022 this.ajaxPromises.push( 1023 new Promise( function( resolve, reject ) { 1024 $.ajax( { 1025 type: 'GET', 1026 url: window.jetMenuPublicSettings.getElementorTemplateApiUrl, 1027 dataType: 'json', 1028 data: { 1029 'id': vueInstance.beforeTemplate, 1030 'dev': window.jetMenuPublicSettings.devMode 1031 }, 1032 beforeSend: function( jqXHR, ajaxSettings ) { 1033 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 1034 }, 1035 success: function( responce, textStatus, jqXHR ) { 1036 let templateContent = responce['template_content'], 1037 templateScripts = responce['template_scripts'], 1038 templateStyles = responce['template_styles']; 1039 1040 for ( let scriptHandler in templateScripts ) { 1041 jetMenu.addedAssetsPromises.push( jetMenu.loadScriptAsync( scriptHandler, templateScripts[ scriptHandler ] ) ); 1042 } 1043 1044 for ( let styleHandler in templateStyles ) { 1045 jetMenu.addedAssetsPromises.push( jetMenu.loadStyle( styleHandler, templateStyles[ styleHandler ] ) ); 1046 } 1047 1048 vueInstance.beforeContent = templateContent; 1049 1050 resolve(); 1051 } 1052 } ); 1053 } ) 1054 ); 1055 } 1056 1057 if ( 0 !== +this.afterTemplate ) { 1058 this.ajaxPromises.push( 1059 new Promise( function( resolve, reject ) { 1060 $.ajax( { 1061 type: 'GET', 1062 url: window.jetMenuPublicSettings.getElementorTemplateApiUrl, 1063 dataType: 'json', 1064 data: { 1065 'id': vueInstance.afterTemplate, 1066 'dev': window.jetMenuPublicSettings.devMode 1067 }, 1068 beforeSend: function( jqXHR, ajaxSettings ) { 1069 jqXHR.setRequestHeader( 'X-WP-Nonce', window.jetMenuPublicSettings.restNonce ); 1070 }, 1071 success: function( responce, textStatus, jqXHR ) { 1072 let templateContent = responce['template_content'], 1073 templateScripts = responce['template_scripts'], 1074 templateStyles = responce['template_styles']; 1075 1076 for ( let scriptHandler in templateScripts ) { 1077 jetMenu.addedAssetsPromises.push( jetMenu.loadScriptAsync( scriptHandler, templateScripts[ scriptHandler ] ) ); 1078 } 1079 1080 for ( let styleHandler in templateStyles ) { 1081 jetMenu.addedAssetsPromises.push( jetMenu.loadStyle( styleHandler, templateStyles[ styleHandler ] ) ); 1082 } 1083 1084 vueInstance.afterContent = templateContent; 1085 resolve(); 1086 } 1087 } ); 1088 } ) 1089 ); 1090 } 1091 1092 this.instanceLoadStatus = true; 1093 1094 Promise.all( this.ajaxPromises ).then( function() { 1095 vueInstance.instanceLoadStatus = false;
1096 }, function( reason ) { 1097 console.log( 'Script Loaded Error' ); 1098 } ); 1099 1100 jetMenu.eventBus.$on( 'itemsSubSwitch', function ( payLoad ) { 1101 1102 if ( vueInstance.$root.menuOptions.menuUniqId !== payLoad.menuUniqId ) { 1103 return; 1104 } 1105 1106 vueInstance.trail.push( payLoad.children ); 1107 vueInstance.children = payLoad.children; 1108 vueInstance.animation = 'items-next-animation'; 1109 vueInstance.breadcrumbsData.push( payLoad.name ); 1110 } ); 1111 1112 jetMenu.eventBus.$on( 'showTemplateContent', function ( payLoad ) { 1113 1114 if ( vueInstance.$root.menuOptions.menuUniqId !== payLoad.menuUniqId ) { 1115 return; 1116 } 1117 1118 vueInstance.itemTemplateContent = payLoad.megaContent; 1119 vueInstance.templateVisible = true; 1120 vueInstance.breadcrumbsData.push( payLoad.name ); 1121 vueInstance.animation = 'items-next-animation'; 1122 1123 vueInstance.showTemplateContent(); 1124 } ); 1125 1126 jetMenu.eventBus.$on( 'closeMenu', function( payLoad ) { 1127 1128 if ( vueInstance.$root.menuOptions.menuUniqId !== payLoad.menuUniqId ) { 1129 return; 1130 } 1131 1132 vueInstance.closeMenu(); 1133 } ); 1134 1135 }, 1136 1137 watch: { 1138 menuOpen: function( curr, prev ) { 1139 1140 if ( curr ) { 1141 jetMenu.$body.addClass( 'jet-mobile-menu-visible' ); 1142 1143 if ( 'slide-out' === this.$root.menuOptions.menuLayout ) { 1144 jetMenu.$body.addClass( 'jet-menu-body-blocker' ); 1145 } 1146 1147 this.initTemplatesContent(); 1148 } 1149 1150 if ( ! curr ) { 1151 jetMenu.$body.removeClass( 'jet-mobile-menu-visible' ); 1152 1153 if ( 'slide-out' === this.$root.menuOptions.menuLayout ) { 1154 jetMenu.$body.removeClass( 'jet-menu-body-blocker' ); 1155 } 1156 1157 this.clearStates(); 1158 } 1159 } 1160 }, 1161 1162 computed: { 1163 instanceClass: function() { 1164 let classes = [ 1165 'jet-mobile-menu__instance', 1166 'jet-mobile-menu__instance--' + this.$root.menuOptions.menuLayout + '-layout', 1167 this.$root.menuOptions.menuPosition + '-container-position', 1168 ( this.$root.menuOptions.togglePosition || 'default' ) + '-toggle-position', 1169 ]; 1170 1171 return classes; 1172 }, 1173 1174 menuContainerVisible: function() { 1175 return this.menuOpen && !this.instanceLoadStatus; 1176 }, 1177 1178 menuId: function() { 1179 1180 if ( this.$root.menuOptions.mobileMenuId ) { 1181 return this.$root.menuOptions.mobileMenuId; 1182 } 1183 1184 return this.$root.menuOptions.menuId; 1185 }, 1186 1187 coverVisible: function() { 1188 1189 let avaliableForLayout = [ 1190 'slide-out' 1191 ]; 1192 1193 return avaliableForLayout.includes( this.$root.menuOptions.menuLayout ); 1194 }, 1195 1196 itemsList: function() { 1197 1198 if ( ! this.children ) { 1199 return this.itemsRawData; 1200 } 1201 1202 return this.children; 1203 }, 1204 1205 isClose: function() { 1206 let avaliableForLayout = [ 1207 'slide-out' 1208 ]; 1209 1210 return avaliableForLayout.includes( this.$root.menuOptions.menuLayout ); 1211 }, 1212 1213 isBack: function() { 1214 return this.children || this.templateVisible ? true : false; 1215 }, 1216 1217 isBreadcrumbs: function() { 1218 return this.$root.menuOptions.useBreadcrumb && 0 !== this.breadcrumbsData.length ? true : false; 1219 }, 1220 1221 breadcrumbsPathData: function() { 1222 1223 if ( 'minimal' === this.$root.$root.menuOptions.breadcrumbPath && 1 < this.breadcrumbsData.length ) { 1224 return this.breadcrumbsData.filter( ( item, index, breadcrumbsData ) => { 1225 return index === breadcrumbsData.length - 1; 1226 } ); 1227 } 1228 1229 return this.breadcrumbsData; 1230 }, 1231 1232 depth: function() { 1233 return this.trail.length; 1234 }, 1235 1236 containerPosition: function() { 1237 return this.$root.menuOptions.menuPosition; 1238 }, 1239 1240 showAnimation: function() { 1241 1242 let animation = false; 1243 1244 switch( this.$root.menuOptions.menuLayout ) { 1245 1246 case 'slide-out': 1247 animation = 'right' === this.containerPosition ? 'menu-container-left-animation' : 'menu-container-right-animation'; 1248 break; 1249 1250 case 'dropdown': 1251 animation = 'menu-container-dropdown-animation'; 1252 break; 1253 1254 case 'push': 1255 animation = 'menu-container-expand-animation'; 1256 break; 1257 } 1258 1259 return animation; 1260 }, 1261 1262 toggleClosedIcon: function() { 1263 return this.$root.refsHtml.toggleClosedIcon || ''; 1264 }, 1265 1266 toggleOpenedIcon: function() { 1267 return this.$root.refsHtml.toggleOpenedIcon || ''; 1268 }, 1269 1270 toggleText: function() { 1271 return '' !== this.$root.menuOptions.toggleText ? this.$root.menuOptions.toggleText : false;
1272 }, 1273 1274 closeIcon: function() { 1275 return this.$root.refsHtml.closeIcon || ''; 1276 }, 1277 1278 backIcon: function() { 1279 let backIcon = this.$root.refsHtml.backIcon || '', 1280 backText = '' !== this.$root.menuOptions.backText ? '<span>' + this.$root.menuOptions.backText + '</span>' : '', 1281 backHtml = backIcon + backText; 1282 1283 return backHtml; 1284 }, 1285 1286 backText: function() { 1287 return '' !== this.$root.menuOptions.backText ? this.$root.menuOptions.backText : false; 1288 }, 1289 1290 breadcrumbIcon: function() { 1291 return this.$root.refsHtml.breadcrumbIcon || ''; 1292 }, 1293 1294 loaderColor: function() { 1295 return this.$root.menuOptions.loaderColor || '#3a3a3a'; 1296 }, 1297 1298 toggleLoaderVisible: function() { 1299 return this.$root.menuOptions.toggleLoader && this.instanceLoadStatus && this.menuOpen ? true : false; 1300 }, 1301 1302 beforeTemplateVisible: function() { 1303 return this.beforeContent ? true : false; 1304 }, 1305 1306 afterTemplateVisible: function() { 1307 return this.afterContent ? true : false; 1308 } 1309 1310 }, 1311 1312 methods: { 1313 menuToggle: function() { 1314 this.menuOpen = ! this.menuOpen; 1315 }, 1316 1317 closeMenu: function() { 1318 this.menuOpen = false; 1319 }, 1320 1321 clearStates: function() { 1322 this.trail = []; 1323 this.children = false; 1324 this.breadcrumbsData = []; 1325 this.templateVisible = false; 1326 }, 1327 1328 goBack: function() { 1329 1330 this.animation = 'items-prev-animation'; 1331 1332 if ( ! this.templateVisible ) { 1333 this.$delete( this.trail, this.trail.length - 1 ); 1334 this.children = this.trail.slice(-1)[0] || false; 1335 } else { 1336 this.templateVisible = false; 1337 } 1338 1339 this.$delete(this.breadcrumbsData, this.breadcrumbsData.length - 1); 1340 }, 1341 1342 escapeKeyHandler: function() { 1343 1344 if ( this.isBack ) { 1345 this.goBack(); 1346 } else { 1347 this.closeMenu(); 1348 } 1349 }, 1350 1351 showTemplateContent: function() { 1352 let vueInstance = this; 1353 1354 this.$nextTick( function() { 1355 let $templateContainer = $( vueInstance.$refs['template-content'] ).find( '.jet-mobile-menu__template-content' ); 1356 1357 jetMenu.megaContentRender( $templateContainer ); 1358 } ); 1359 }, 1360 1361 initTemplatesContent: function() { 1362 let vueInstance = this; 1363 1364 this.$nextTick( function() { 1365 1366 if ( vueInstance.headerContent ) { 1367 let $headerContainer = $( vueInstance.$refs['header-template-content'] ); 1368 1369 jetMenu.megaContentRender( $headerContainer ); 1370 } 1371 1372 if ( vueInstance.beforeContent ) { 1373 let $beforeContainer = $( vueInstance.$refs['before-template-content'] ); 1374 1375 jetMenu.megaContentRender( $beforeContainer ); 1376 } 1377 1378 if ( vueInstance.afterContent ) { 1379 let $afterContainer = $( vueInstance.$refs['after-template-content'] ); 1380 1381 jetMenu.megaContentRender( $afterContainer ); 1382 } 1383 } ); 1384 }, 1385 1386 breadcrumbHandle: function( index ) { 1387 1388 if ( index === this.breadcrumbsData.length ) { 1389 return; 1390 } 1391 1392 if ( 'minimal' === this.$root.menuOptions.breadcrumbPath ) { 1393 this.goBack(); 1394 1395 return; 1396 } 1397 1398 this.animation = 'items-prev-animation'; 1399 this.trail = this.trail.slice( 0, index ); 1400 this.children = this.trail.slice( -1 )[0] || false; 1401 this.templateVisible = false; 1402 this.breadcrumbsData = this.breadcrumbsData.slice( 0, index ); 1403 } 1404 1405 } 1406 }); 1407 }, 1408 1409 loadScriptAsync: function( script, uri ) { 1410 1411 if ( jetMenu.addedScripts.hasOwnProperty( script ) ) { 1412 return script; 1413 } 1414 1415 jetMenu.addedScripts[ script ] = uri; 1416 1417 return new Promise( function( resolve, reject ) { 1418 var tag = document.createElement( 'script' ); 1419 1420 tag.src = uri; 1421 tag.async = true; 1422 tag.onload = function() { 1423 resolve( script ); 1424 }; 1425 1426 document.head.appendChild( tag ); 1427 } ); 1428 }, 1429 1430 loadStyle: function( style, uri ) { 1431 1432 if ( jetMenu.addedStyles.hasOwnProperty( style ) && jetMenu.addedStyles[ style ] === uri) { 1433 return style; 1434 } 1435 1436 jetMenu.addedStyles[ style ] = uri; 1437 1438 return new Promise( function( resolve, reject ) { 1439 var tag = document.createElement( 'link' ); 1440 1441 tag.id = style; 1442 tag.rel = 'stylesheet'; 1443 tag.href = uri; 1444 tag.type = 'text/css'; 1445 tag.media = 'all'; 1446 tag.onload = function() { 1447 resolve( style ); 1448 }; 1449 1450 document.head.appendChild( tag ); 1451 }); 1452 }, 1453 1454 megaContentRender: function( $templateContainer, templateContent ) { 1455 let content = templateContent || false; 1456 1457 Promise.all( jetMenu.addedAssetsPromises ).then( function( value ) { 1458 1459 if ( templateContent ) { 1460 $templateContainer.html( templateContent ); 1461 } 1462 1463 // Before ajax frontend init 1464 $( window ).trigger( 'jet-menu/ajax/frontend-init/before', { 1465 $container: $templateContainer, 1466 content: content, 1467 } ); 1468 1469 // Frontend init 1470 $( window ).trigger( 'jet-menu/ajax/frontend-init', { 1471 $container: $templateContainer, 1472 content: content, 1473 } ); 1474
1475 // after ajax frontend init 1476 $( window ).trigger( 'jet-menu/ajax/frontend-init/after', { 1477 $container: $templateContainer, 1478 content: content, 1479 } ); 1480 }, function( reason ) { 1481 console.log( 'Script Loaded Error' ); 1482 }); 1483 }, 1484 1485 maybeElementorFrontendInit: function( $templateContainer ) { 1486 1487 $templateContainer.find( 'div[data-element_type]' ).each( function() { 1488 var $this = $( this ), 1489 elementType = $this.data( 'element_type' ); 1490 1491 if ( ! elementType ) { 1492 return; 1493 } 1494 1495 try { 1496 if ( 'widget' === elementType ) { 1497 elementType = $this.data( 'widget_type' ); 1498 1499 if ( window.elementorFrontend && window.elementorFrontend.hooks ) { 1500 window.elementorFrontend.hooks.doAction( 'frontend/element_ready/widget', $this, $ ); 1501 } 1502 } 1503 1504 if ( window.elementorFrontend && window.elementorFrontend.hooks ) { 1505 window.elementorFrontend.hooks.doAction( 'frontend/element_ready/global', $this, $ ); 1506 window.elementorFrontend.hooks.doAction( 'frontend/element_ready/' + elementType, $this, $ ); 1507 } 1508 1509 } catch ( err ) { 1510 console.log(err); 1511 1512 $this.remove(); 1513 1514 return false; 1515 } 1516 } ); 1517 }, 1518 1519 getUniqId: function() { 1520 return Math.random().toString( 36 ).substr( 2, 9 ); 1521 }, 1522 1523 }; 1524 1525 jetMenu.init(); 1526 1527} ( jQuery ) );
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.