https://www.militaryconnection.com/wp-content/plugins/mobile-menu/includes/js/mobmenu.js?ver=2.8.2.7

1
2  /*
3    *
4    *   Javascript Functions
5    *   ------------------------------------------------
6    *   WP Mobile Menu
7    *   Copyright WP Mobile Menu 2018 - http://www.wpmobilemenu.com
8    *
9    */
10
11    "use strict";
12    function getSelector(el){
13      var $el = jQuery(el);
14  
15      var id = $el.attr("id");
16      if (id) { //"should" only be one of these if theres an ID
17          return "#"+ id;
18      }
19  
20      var selector = $el.parents()
21                  .map(function() { return this.tagName; })
22                  .get().reverse().join(" ");
23  
24      if (selector) {
25          selector += " "+ $el[0].nodeName;
26      }
27  
28      var classNames = $el.attr("class");
29      if (classNames) {
30          selector += "." + jQuery.trim(classNames).replace(/\s/gi, ".");
31      }
32  
33      var name = $el.attr('name');
34      if (name) {
35          selector += "[name='" + name + "']";
36      }
37      if (!name){
38          var index = $el.index();
39          if (index) {
40              index = index + 1;
41              selector += ":nth-child(" + index + ")";
42          }
43      }
44      return selector;
45    }
46
47    function enableMobileMenuElementPicker(){
48      const p = new Picker({
49          elm: document.getElementById('elm1'),
50          mode: 'cover',
51          excludeElmName: ['body'],
52          events: [{
53              key: 'contextmenu',
54              fn(event) {
55                  event.preventDefault();
56              },
57          }],
58          onInit() {
59          },
60          onClick(event) {
61            var selector = getSelector(event.target).toLowerCase();
62            window.parent.receivePickedElement(selector);
63            jQuery(selector).hide();
64          },
65          onHover(event) {
66          },
67      });
68
69      document.getElementById('m_on').addEventListener('click', () => {
70          p.on();
71      });
72
73      document.getElementById('m_off').addEventListener('click', () => {
74          p.off();
75      });
76
77      document.getElementById('m_cover').addEventListener('click', () => {
78          p.changeMode('cover');
79      });
80
81      document.getElementById('m_target').addEventListener('click', () => {
82          p.changeMode('target');
83      });
84
85    }
86    jQuery( document ).ready( function($) {
87
88      const urlParams = new URLSearchParams( window.location.search );
89
90      if ( urlParams.get( 'mobmenu-action' ) == 'find-element' ) {
91        enableMobileMenuElementPicker();
92      }
93
94      function mobmenuOpenSubmenus( menu ) {
95        var submenu = $(menu).parent().next();
96
97        if ( $(menu).parent().next().hasClass( 'show-sub-menu' )  ) {
98          $(menu).find('.show-sub-menu' ).hide();
99          $(menu).toggleClass( 'show-sub');
100        } else {
101          if ( ! $( menu ).parents('.show-sub-menu').prev().hasClass('mob-expand-submenu') && submenu[0] !== $('.show-sub-menu')[0] && $( menu ).parent('.sub-menu').length <= 0 ) {
102  
103            $(menu).parent().find( '.show-submenu' ).first().hide().toggleClass( 'show-sub-menu' );
104            $(menu).toggleClass( 'show-sub');
105  
106          }
107        }
108
109        if ( !$( menu ).parent().next().hasClass( 'show-sub-menu' ) ) {
110          submenu.fadeIn( 'slow' );
111        } else {  
112          submenu.hide();
113        }
114
115        if ( ! $('body').hasClass('mob-menu-sliding-menus') ) {
116          $( menu ).find('.open-icon').toggleClass('hide');
117          $( menu ).find('.close-icon').toggleClass('hide');
118        }
119
120        submenu.toggleClass( 'show-sub-menu');
121        
122
123      }
124
125      if ( $( 'body' ).find( '.mobmenu-push-wrap' ).length <= 0 &&  $( 'body' ).hasClass('mob-menu-slideout') ) {
126
127        $( 'body' ).wrapInner( '<div class="mobmenu-push-wrap"></div>' );
128        $( '.mobmenu-push-wrap' ).after( $( '.mobmenu-left-alignment' ).detach() );
129        $( '.mobmenu-push-wrap' ).after( $( '.mobmenu-right-alignment' ).detach() );
130        $( '.mobmenu-push-wrap' ).after( $( '.mob-menu-header-holder' ).detach() ); 
131        $( '.mobmenu-push-wrap' ).after( $( '.mobmenu-footer-menu-holder' ).detach() ); 
132        $( '.mobmenu-push-wrap' ).after( $( '.mobmenu-overlay' ).detach() ); 
133        $( '.mobmenu-push-wrap' ).after( $( '#wpadminbar' ).detach() );
134
135        if ( $('.mob-menu-header-holder' ).attr( 'data-detach-el' ) != '' ) {
136          $( '.mobmenu-push-wrap' ).after( $(   $('.mob-menu-header-holder' ).attr( 'data-detach-el' ) ).detach() );
137        }
138
139      }
140      // Double Check the the menu display classes where added to the body.
141      var menu_display_type = $( '.mob-menu-header-holder' ).attr( 'data-menu-display' );
142
143      if ( menu_display_type != '' && !$( 'body' ).hasClass( 'mob-menu-slideout' ) && !$( 'body' ).hasClass( 'mob-menu-slideout-over' ) && !$( 'body' ).hasClass( 'mob-menu-slideout-top' ) && !$( 'body' ).hasClass( 'mob-menu-overlay' ) ) {
144        $( 'body' ).addClass( menu_display_type );
145      }
146
147      $( 'video' ).each( function(){
148        if( 'autoplay' === $( this ).attr('autoplay') ) {
149          $( this )[0].play();
150        } 
151      });
152
153      var submenu_open_icon  = $( '.mob-menu-header-holder' ).attr( 'data-open-icon' );
154      var submenu_close_icon = $( '.mob-menu-header-holder' ).attr( 'data-close-icon' );
155
156      $( '.mobmenu-content .sub-menu' ).each( function(){
157
158        $( this ).prev().append('<div class="mob-expand-submenu"><i class="mob-icon-' + submenu_open_icon + ' open-icon"></i><i class="mob-icon-' + submenu_close_icon + ' close-icon hide"></i></div>');
159
160        if ( 0 < $( this ).parents( '.mobmenu-parent-link' ).length  ) {
161          $( this ).prev().attr('href', '#');
162        }
163
164      });
165      
166      $( document ).on( 'click', '.mobmenu-parent-link .menu-item-has-children' , function ( e ) {
167        
168        if ( e.target.parentElement != this) return;
169        
170        e.preventDefault();
171        $(this).find('a').find('.mob-expand-submenu').first().trigger('click');
172        e.stopPropagation();
173        
174      });
175      $( document ).on( 'click', '.show-nav-left .mobmenu-push-wrap,  .show-nav-left .mobmenu-overlay', function ( e ) { 
176  
177        e.preventDefault();
178        $( '.mobmenu-left-bt' ).first().trigger( 'click' );
179        e.stopPropagation();
180
181      });
182      
183      $( document ).on( 'click', '.mob-expand-submenu' , function ( e ) {
184
185        // Check if any menu is open and close it.
186        if ( 1 == $( '.mob-menu-header-holder' ).attr( 'data-autoclose-submenus' ) && ! $(this).parent().next().hasClass( 'show-sub-menu' ) ) {
187          if ( 0 < $( '.mob-expand-submenu.show-sub' ).length &&  $(this).parents('.show-sub-menu').length <= 0 ) {
188            mobmenuOpenSubmenus( $( '.mob-expand-submenu.show-sub' ) );
189          }
190        }
191
192        mobmenuOpenSubmenus( $(this) );
193        e.preventDefault();
194        e.stopPropagation();
195
196      });
197
198      $( document ).on( 'keyup', '.mobmenu-left-bt', function(e){
199        if( e.type != 'click' && e.which != 13 || e.which == 9 ) {
200          return;
201        }
202
203        mobmenuClosePanel( 'mobmenu-left-panel' );
204        e.stopPropagation();
205      });
206
207      $( document ).on( 'keyup', '.mobmenu-right-bt', function(e){
208        if( e.type != 'click' && e.which != 13 || e.which == 9 ) {
209          return;
210        }
211
212        mobmenuClosePanel( 'mobmenu-right-panel' );
213        e.stopPropagation();
214      });
215
216      
217     
218      $( document ).on( 'click', '.mobmenu-panel.show-panel .mob-cancel-button, .show-nav-right .mobmenu-overlay, .show-nav-left .mobmenu-overlay', function ( e ) { 
219        
220        
221
222        e.preventDefault();
223        mobmenuClosePanel( 'show-panel' );
224        if ( $('body').hasClass('mob-menu-sliding-menus') ) {
225          $( '.mobmenu-trigger-action .hamburger' ).toggleClass('is-active');
226        }
227
228      });
229
230      $( document ).on( 'click', '.mobmenu-trigger-action', function(e){
231        e.preventDefault();
232        

233        var targetPanel = $( this ).attr( 'data-panel-target' );
234        
235        if ( ! $( 'body' ).hasClass( 'show-nav-left' ) &&  ! $( 'body' ).hasClass( 'show-nav-right' )  ) {
236          if ( 'mobmenu-filter-panel' !==  targetPanel ) {
237            mobmenuOpenPanel( targetPanel );
238          }
239        }
240
241      });
242
243      $( document ).on( 'click', '.hamburger', function(e){
244        var targetPanel = $(this).parent().attr('data-panel-target');
245        e.preventDefault();
246        e.stopPropagation();
247        
248        $(this).toggleClass( 'is-active' );
249        
250        setTimeout(function(){ 
251          if ( $( 'body' ).hasClass('show-nav-left') ) {
252            if ( $('body').hasClass('mob-menu-sliding-menus') ) {
253              $( '.mobmenu-trigger-action .hamburger' ).toggleClass('is-active');
254            }
255            mobmenuClosePanel( targetPanel );
256            
257          } else {
258            mobmenuOpenPanel( targetPanel );
259          }
260            
261        }, 400);
262        
263
264      });
265     
266      $('.mobmenu a[href*="#"], .mobmenu-panel a[href*="#"]')
267        // Remove links that don't actually link to anything
268        .not('[href="#0"]')
269        .on( 'click', function(event) {
270          // On-page links  
271  
272        if (
273          location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') 
274          && 
275          location.hostname == this.hostname
276          &&
277          $(this).parents('.mobmenu-content').length > 0
278        ) {
279          // Figure out element to scroll to.
280          var target;
281
282          try {
283	          target = decodeURIComponent( this.hash );
284          } catch(e) {
285 	          target = this.hash;
286          }
287
288          $( 'html' ).css( 'overflow', '' );
289
290          // Does a scroll target exist?
291          if (target.length) {
292
293            
294          if ( 0 < $(this).parents('.mobmenu-left-panel').length ) {
295            mobmenuClosePanel( 'mobmenu-left-panel' );
296          } else {
297            mobmenuClosePanel( 'mobmenu-right-panel' );
298          }
299
300            target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
301
302            $('body,html').animate({
303              scrollTop: target.offset().top - $(".mob-menu-header-holder").height() - 50
304            }, 1000);
305          }
306        }
307      });
308      function mobmenuClosePanel( target ) {
309
310        $( '.' + target ).toggleClass( 'show-panel' );
311        $( 'html' ).removeClass( 'show-mobmenu-filter-panel' );
312        $( 'body' ).removeClass( 'show-nav-right' );
313        $( 'body' ).removeClass( 'show-nav-left' );
314        $( 'html' ).removeClass( 'mob-menu-no-scroll' ); 
315
316        setTimeout(function(){
317          $( '.mob-menu-sliding-menus [data-menu-level]' ).scrollTop( '0' );
318          if ( 1 == $( '.mob-menu-header-holder' ).attr( 'data-autoclose-submenus' )  ) {
319            $( '.mob-expand-submenu.show-sub' ).click();
320            $( '.mobmenu-content .show-sub-menu' ).removeClass( 'show-sub-menu' );
321          }
322          
323        }, 400);
324
325      }
326    
327      function mobmenuOpenPanel( target) {
328        $( '.mobmenu-content' ).scrollTop(0);
329        $( 'html' ).addClass( 'mob-menu-no-scroll' ); 
330    
331        if ( $('.' + target ).hasClass( 'mobmenu-left-alignment' ) ) {
332          $('body').addClass('show-nav-left');
333        }
334        if ( $('.' + target ).hasClass( 'mobmenu-right-alignment' ) ) {
335          $('body').addClass('show-nav-right');
336        }
337    
338        $('.' + target ).addClass( 'show-panel' );
339    
340      }
341    });
342
343window.Picker = class Picker {
344  constructor(options = {}) {
345      this.elm = options.elm || document.querySelector('body');
346      this.mode = options.mode || 'target';
347      this.excludeElmName = options.excludeElmName || [];
348      this.switch = typeof options.switch === 'boolean' ? options.switch : true;
349
350      this.events = options.events || [];
351      this.onInit = options.onInit;
352      this.onClick = options.onClick ? options.onClick.bind(this) : null;
353      this.onHover = options.onHover ? options.onHover.bind(this) : null;
354
355
356      // Internal handler
357      this.fn_bind_clickHandle = null;
358      this.fn_bind_hoverHandle = null;
359      this.fn_bind_contextmenuHandle = null;
360      this._init();
361  }
362  on() {
363      this.switch = true;
364  }
365  off() {
366      this.switch = false;

367      this._removeTargetShowPos();
368      this._removeCoverShowPos();
369  }
370  changeMode(mode) {
371      let modeArr = ['cover', 'target'];
372      if (modeArr.includes(mode)) {
373          this.mode = mode;
374          this._removeTargetShowPos();
375          this._removeCoverShowPos();
376      } else {
377          console.error(`Mode error, only includes [ ${modeArr.join(" | ")} ]`);
378      }
379  }
380  destroy() {
381      this.events.forEach((eo) => {
382          eo.fn_bind = eo.fn.bind(this);
383          this.elm.removeEventListener(eo.key, this[`_${eo.key}_Handle`], false);
384      });
385
386      this.elm.removeEventListener('mouseover', this.fn_bind_hoverHandle, false);
387      this.elm.removeEventListener('click', this.fn_bind_clickHandle, false);
388
389      this._removeTargetShowPos();
390      document.querySelector("#_picker_cover_wrap_box").remove();
391  }
392  _init() {
393      let wrapDom = document.createElement('div');
394      wrapDom.setAttribute("id", "_picker_cover_wrap_box");
395      wrapDom.innerHTML = '<svg></svg>';
396      document.body.appendChild(wrapDom);
397      this._initEvent();
398      this.onInit && this.onInit();
399  }
400  _initEvent() {
401      this.events.forEach((eo) => {
402          this[`_${eo.key}_Handle`] = (event) => {
403              if (this._triggerEvent(event) === false) return;
404              eo.fn && eo.fn(event);
405          };
406          eo.fn_bind = this[`_${eo.key}_Handle`].bind(this);
407          this.elm.addEventListener(eo.key, this[`_${eo.key}_Handle`], false);
408      });
409
410      this.fn_bind_hoverHandle = this._hoverHandle.bind(this);
411      this.fn_bind_clickHandle = this._clickHandle.bind(this);
412
413      this.elm.addEventListener('mouseover', this.fn_bind_hoverHandle, false);
414      this.elm.addEventListener('click', this.fn_bind_clickHandle, false);
415
416  }
417  _triggerEvent(event) {
418      let tipsDom = document.querySelector("#_pick_tips_content");
419      if (
420          this.switch &&
421          !this.excludeElmName.includes(event.target.localName.toLocaleLowerCase()) &&
422          !(tipsDom ? tipsDom.contains(event.target) : 0)
423      ) {
424          event.stopPropagation();
425          event.preventDefault();
426          return true;
427      } else {
428          return false;
429      }
430  }
431  _hoverHandle(event) {
432      if (this._triggerEvent(event) === false) return;
433      switch (this.mode) {
434          case 'cover':
435              this._coverShowPos(event);
436              break;
437          case 'target':
438              this._targetShowPos(event);
439              break;
440      }
441      this.onHover && this.onHover(event);
442  }
443  _clickHandle(event) {
444      if (this._triggerEvent(event) === false) return;
445      this.onClick && this.onClick(event);
446  }
447  _targetShowPos(event) {
448      this._removeTargetShowPos();
449      if (event.target.localName === 'body') return;
450      event.target.classList.add("_picker_target_elm");
451  }
452  _removeTargetShowPos() {
453      document.querySelectorAll("._picker_target_elm").forEach((elm) => {
454          elm.classList.remove("_picker_target_elm");
455      });
456  }
457  _coverShowPos(event) {
458      let elm = event.target;
459      let W_W = window.screen.availWidth;
460      let W_H = window.screen.availHeight;
461      let pos = elm.getBoundingClientRect();
462      let p = {
463          tX: pos.left > 0 ? pos.left : 0,
464          tY: pos.top > 0 ? pos.top : 0,
465          w: pos.right - pos.left,
466          h: pos.bottom - pos.top,
467      };
468      let path_W = `M 0 0 h ${W_W} v ${W_H} h -${W_W} Z`;
469      let path_box = `M ${p.tX} ${p.tY} h ${p.w} v ${p.h} h -${p.w} Z`;
470      let elm_path1 = `<path d="${path_W} ${path_box}"></path>`;
471      let elm_path2 = `<path d="${path_box}"></path>`;
472      document.querySelector("#_picker_cover_wrap_box svg").innerHTML = elm_path1 + elm_path2;
473  }
474  _removeCoverShowPos() {
475      document.querySelector("#_picker_cover_wrap_box svg").innerHTML = '';
476  }
477};
478  
479