https://bible-history.com/assets/js/jquery.slicknav.js

1;(function ($, document, window) {
2    var
3    // default settings object.
4        defaults = {
5            label: 'MENU',
6            duplicate: true,
7            duration: 200,
8            easingOpen: 'swing',
9            easingClose: 'swing',
10            closedSymbol: '►',
11            openedSymbol: '▼',
12            prependTo: 'body',
13            appendTo: '',
14            parentTag: 'a',
15            closeOnClick: false,
16            allowParentLinks: false,
17            nestedParentLinks: true,
18            showChildren: false,
19            removeIds: true,
20            removeClasses: false,
21            removeStyles: false,
22			brand: '',
23            animations: 'jquery',
24            init: function () {},
25            beforeOpen: function () {},
26            beforeClose: function () {},
27            afterOpen: function () {},
28            afterClose: function () {}
29        },
30        mobileMenu = 'slicknav',
31        prefix = 'slicknav',
32
33        Keyboard = {
34            DOWN: 40,
35            ENTER: 13,
36            ESCAPE: 27,
37            LEFT: 37,
38            RIGHT: 39,
39            SPACE: 32,
40            TAB: 9,
41            UP: 38,
42        };
43
44    function Plugin(element, options) {
45        this.element = element;
46
47        // jQuery has an extend method which merges the contents of two or
48        // more objects, storing the result in the first object. The first object
49        // is generally empty as we don't want to alter the default options for
50        // future instances of the plugin
51        this.settings = $.extend({}, defaults, options);
52
53        // Don't remove IDs by default if duplicate is false
54        if (!this.settings.duplicate && !options.hasOwnProperty("removeIds")) {
55          this.settings.removeIds = false;
56        }
57
58        this._defaults = defaults;
59        this._name = mobileMenu;
60
61        this.init();
62    }
63
64    Plugin.prototype.init = function () {
65        var $this = this,
66            menu = $(this.element),
67            settings = this.settings,
68            iconClass,
69            menuBar;
70
71        // clone menu if needed
72        if (settings.duplicate) {
73            $this.mobileNav = menu.clone();
74        } else {
75            $this.mobileNav = menu;
76        }
77
78        // remove IDs if set
79        if (settings.removeIds) {
80          $this.mobileNav.removeAttr('id');
81          $this.mobileNav.find('*').each(function (i, e) {
82              $(e).removeAttr('id');
83          });
84        }
85
86        // remove classes if set
87        if (settings.removeClasses) {
88            $this.mobileNav.removeAttr('class');
89            $this.mobileNav.find('*').each(function (i, e) {
90                $(e).removeAttr('class');
91            });
92        }
93
94        // remove styles if set
95        if (settings.removeStyles) {
96            $this.mobileNav.removeAttr('style');
97            $this.mobileNav.find('*').each(function (i, e) {
98                $(e).removeAttr('style');
99            });
100        }
101
102        // styling class for the button
103        iconClass = prefix + '_icon';
104
105        if (settings.label === '') {
106            iconClass += ' ' + prefix + '_no-text';
107        }
108
109        if (settings.parentTag == 'a') {
110            settings.parentTag = 'a href="#"';
111        }
112
113        // create menu bar
114        $this.mobileNav.attr('class', prefix + '_nav');
115        menuBar = $('<div class="' + prefix + '_menu"></div>');
116		if (settings.brand !== '') {
117			var brand = $('<div class="' + prefix + '_brand">'+settings.brand+'</div>');
118			$(menuBar).append(brand);
119		}
120        $this.btn = $(
121            ['<div class="container"><' + settings.parentTag + ' aria-haspopup="true" role="button" tabindex="0" class="' + prefix + '_btn ' + prefix + '_collapsed">',
122                '<span class="' + prefix + '_menutxt">' + settings.label + '</span>',
123                '<span class="' + iconClass + '">',
124                    '<span class=""><i class="ti-menu-alt"></i></span>',
125                    '<span class="ti-close"></span>',
126                '</span>',
127            '</' + settings.parentTag + '></div>'
128            ].join('')
129        );
130        $(menuBar).append($this.btn);
131        if(settings.appendTo !== '') {
132            $(settings.appendTo).append(menuBar);
133        } else {
134            $(settings.prependTo).prepend(menuBar);
135        }
136        menuBar.append($this.mobileNav);
137
138        // iterate over structure adding additional structure
139        var items = $this.mobileNav.find('li');
140        $(items).each(function () {
141            var item = $(this),
142                data = {};
143            data.children = item.children('ul').attr('role', 'menu');
144            item.data('menu', data);
145
146            // if a list item has a nested menu
147            if (data.children.length > 0) {
148
149                // select all text before the child menu
150                // check for anchors
151
152                var a = item.contents(),
153                    containsAnchor = false,
154                    nodes = [];
155
156                $(a).each(function () {
157                    if (!$(this).is('ul')) {
158                        nodes.push(this);
159                    } else {
160                        return false;

161                    }
162
163                    if($(this).is("a")) {
164                        containsAnchor = true;
165                    }
166                });
167
168                var wrapElement = $(
169                    '<' + settings.parentTag + ' role="menuitem" aria-haspopup="true" tabindex="-1" class="' + prefix + '_item"/>'
170                );
171
172                // wrap item text with tag and add classes unless we are separating parent links
173                if ((!settings.allowParentLinks || settings.nestedParentLinks) || !containsAnchor) {
174                    var $wrap = $(nodes).wrapAll(wrapElement).parent();
175                    $wrap.addClass(prefix+'_row');
176                } else
177                    $(nodes).wrapAll('<span class="'+prefix+'_parent-link '+prefix+'_row"/>').parent();
178
179                if (!settings.showChildren) {
180                    item.addClass(prefix+'_collapsed');
181                } else {
182                    item.addClass(prefix+'_open');
183                }
184
185                item.addClass(prefix+'_parent');
186
187                // create parent arrow. wrap with link if parent links and separating
188                var arrowElement = $('<span class="'+prefix+'_arrow">'+(settings.showChildren?settings.openedSymbol:settings.closedSymbol)+'</span>');
189
190                if (settings.allowParentLinks && !settings.nestedParentLinks && containsAnchor)
191                    arrowElement = arrowElement.wrap(wrapElement).parent();
192
193                //append arrow
194                $(nodes).last().after(arrowElement);
195
196
197            } else if ( item.children().length === 0) {
198                 item.addClass(prefix+'_txtnode');
199            }
200
201            // accessibility for links
202            item.children('a').attr('role', 'menuitem').click(function(event){
203                //Ensure that it's not a parent
204                if (settings.closeOnClick && !$(event.target).parent().closest('li').hasClass(prefix+'_parent')) {
205                        //Emulate menu close if set
206                        $($this.btn).click();
207                    }
208            });
209
210            //also close on click if parent links are set
211            if (settings.closeOnClick && settings.allowParentLinks) {
212                item.children('a').children('a').click(function (event) {
213                    //Emulate menu close
214                    $($this.btn).click();
215                });
216
217                item.find('.'+prefix+'_parent-link a:not(.'+prefix+'_item)').click(function(event){
218                    //Emulate menu close
219                        $($this.btn).click();
220                });
221            }
222        });
223
224        // structure is in place, now hide appropriate items
225        $(items).each(function () {
226            var data = $(this).data('menu');
227            if (!settings.showChildren){
228                $this._visibilityToggle(data.children, null, false, null, true);
229            }
230        });
231
232        // finally toggle entire menu
233        $this._visibilityToggle($this.mobileNav, null, false, 'init', true);
234
235        // accessibility for menu button
236        $this.mobileNav.attr('role','menu');
237
238        // outline prevention when using mouse
239        $(document).mousedown(function(){
240            $this._outlines(false);
241        });
242
243        $(document).keyup(function(){
244            $this._outlines(true);
245        });
246
247        // menu button click
248        $($this.btn).click(function (e) {
249            e.preventDefault();
250            $this._menuToggle();
251        });
252
253        // click on menu parent
254        $this.mobileNav.on('click', '.' + prefix + '_item', function (e) {
255            e.preventDefault();
256            $this._itemClick($(this));
257        });
258
259        // check for keyboard events on menu button and menu parents
260        $($this.btn).keydown(function (e) {
261            var ev = e || event;
262
263            switch(ev.keyCode) {
264                case Keyboard.ENTER:
265                case Keyboard.SPACE:
266                case Keyboard.DOWN:
267                    e.preventDefault();
268                    if (ev.keyCode !== Keyboard.DOWN || !$($this.btn).hasClass(prefix+'_open')){
269                        $this._menuToggle();
270                    }
271                    
272                    $($this.btn).next().find('[role="menuitem"]').first().focus();
273                    break;
274            }
275
276            
277        });
278
279        $this.mobileNav.on('keydown', '.'+prefix+'_item', function(e) {
280            var ev = e || event;
281
282            switch(ev.keyCode) {
283                case Keyboard.ENTER:
284                    e.preventDefault();
285                    $this._itemClick($(e.target));
286                    break;
287                case Keyboard.RIGHT:
288                    e.preventDefault();
289                    if ($(e.target).parent().hasClass(prefix+'_collapsed')) {
290                        $this._itemClick($(e.target));
291                    }
292                    $(e.target).next().find('[role="menuitem"]').first().focus();
293                    break;
294            }
295        });
296
297        $this.mobileNav.on('keydown', '[role="menuitem"]', function(e) {
298            var ev = e || event;
299
300            switch(ev.keyCode){

301                case Keyboard.DOWN:
302                    e.preventDefault();
303                    var allItems = $(e.target).parent().parent().children().children('[role="menuitem"]:visible');
304                    var idx = allItems.index( e.target );
305                    var nextIdx = idx + 1;
306                    if (allItems.length <= nextIdx) {
307                        nextIdx = 0;
308                    }
309                    var next = allItems.eq( nextIdx );
310                    next.focus();
311                break;
312                case Keyboard.UP:
313                    e.preventDefault();
314                    var allItems = $(e.target).parent().parent().children().children('[role="menuitem"]:visible');
315                    var idx = allItems.index( e.target );
316                    var next = allItems.eq( idx - 1 );
317                    next.focus();
318                break;
319                case Keyboard.LEFT:
320                    e.preventDefault();
321                    if ($(e.target).parent().parent().parent().hasClass(prefix+'_open')) {
322                        var parent = $(e.target).parent().parent().prev();
323                        parent.focus();
324                        $this._itemClick(parent);
325                    } else if ($(e.target).parent().parent().hasClass(prefix+'_nav')){
326                        $this._menuToggle();
327                        $($this.btn).focus();
328                    }
329                    break;
330                case Keyboard.ESCAPE:
331                    e.preventDefault();
332                    $this._menuToggle();
333                    $($this.btn).focus();
334                    break;    
335            }
336        });
337
338        // allow links clickable within parent tags if set
339        if (settings.allowParentLinks && settings.nestedParentLinks) {
340            $('.'+prefix+'_item a').click(function(e){
341                    e.stopImmediatePropagation();
342            });
343        }
344    };
345
346    //toggle menu
347    Plugin.prototype._menuToggle = function (el) {
348        var $this = this;
349        var btn = $this.btn;
350        var mobileNav = $this.mobileNav;
351
352        if (btn.hasClass(prefix+'_collapsed')) {
353            btn.removeClass(prefix+'_collapsed');
354            btn.addClass(prefix+'_open');
355        } else {
356            btn.removeClass(prefix+'_open');
357            btn.addClass(prefix+'_collapsed');
358        }
359        btn.addClass(prefix+'_animating');
360        $this._visibilityToggle(mobileNav, btn.parent(), true, btn);
361    };
362
363    // toggle clicked items
364    Plugin.prototype._itemClick = function (el) {
365        var $this = this;
366        var settings = $this.settings;
367        var data = el.data('menu');
368        if (!data) {
369            data = {};
370            data.arrow = el.children('.'+prefix+'_arrow');
371            data.ul = el.next('ul');
372            data.parent = el.parent();
373            //Separated parent link structure
374            if (data.parent.hasClass(prefix+'_parent-link')) {
375                data.parent = el.parent().parent();
376                data.ul = el.parent().next('ul');
377            }
378            el.data('menu', data);
379        }
380        if (data.parent.hasClass(prefix+'_collapsed')) {
381            data.arrow.html(settings.openedSymbol);
382            data.parent.removeClass(prefix+'_collapsed');
383            data.parent.addClass(prefix+'_open');
384            data.parent.addClass(prefix+'_animating');
385            $this._visibilityToggle(data.ul, data.parent, true, el);
386        } else {
387            data.arrow.html(settings.closedSymbol);
388            data.parent.addClass(prefix+'_collapsed');
389            data.parent.removeClass(prefix+'_open');
390            data.parent.addClass(prefix+'_animating');
391            $this._visibilityToggle(data.ul, data.parent, true, el);
392        }
393    };
394
395    // toggle actual visibility and accessibility tags
396    Plugin.prototype._visibilityToggle = function(el, parent, animate, trigger, init) {
397        var $this = this;
398        var settings = $this.settings;
399        var items = $this._getActionItems(el);
400        var duration = 0;
401        if (animate) {
402            duration = settings.duration;
403        }
404        
405        function afterOpen(trigger, parent) {
406            $(trigger).removeClass(prefix+'_animating');
407            $(parent).removeClass(prefix+'_animating');
408
409            //Fire afterOpen callback
410            if (!init) {
411                settings.afterOpen(trigger);
412            }
413        }
414        

415        function afterClose(trigger, parent) {
416            el.attr('aria-hidden','true');
417            items.attr('tabindex', '-1');
418            $this._setVisAttr(el, true);
419            el.hide(); //jQuery 1.7 bug fix
420
421            $(trigger).removeClass(prefix+'_animating');
422            $(parent).removeClass(prefix+'_animating');
423
424            //Fire init or afterClose callback
425            if (!init){
426                settings.afterClose(trigger);
427            } else if (trigger == 'init'){
428                settings.init();
429            }
430        }
431
432        if (el.hasClass(prefix+'_hidden')) {
433            el.removeClass(prefix+'_hidden');
434             //Fire beforeOpen callback
435            if (!init) {
436                settings.beforeOpen(trigger);
437            }
438            if (settings.animations === 'jquery') {
439                el.stop(true,true).slideDown(duration, settings.easingOpen, function(){
440                    afterOpen(trigger, parent);
441                });
442            } else if(settings.animations === 'velocity') {
443                el.velocity("finish").velocity("slideDown", {
444                    duration: duration,
445                    easing: settings.easingOpen,
446                    complete: function() {
447                        afterOpen(trigger, parent);
448                    }
449                });
450            }
451            el.attr('aria-hidden','false');
452            items.attr('tabindex', '0');
453            $this._setVisAttr(el, false);
454        } else {
455            el.addClass(prefix+'_hidden');
456
457            //Fire init or beforeClose callback
458            if (!init){
459                settings.beforeClose(trigger);
460            }
461
462            if (settings.animations === 'jquery') {
463                el.stop(true,true).slideUp(duration, this.settings.easingClose, function() {
464                    afterClose(trigger, parent)
465                });
466            } else if (settings.animations === 'velocity') {
467                
468                el.velocity("finish").velocity("slideUp", {
469                    duration: duration,
470                    easing: settings.easingClose,
471                    complete: function() {
472                        afterClose(trigger, parent);
473                    }
474                });
475            }
476        }
477    };
478
479    // set attributes of element and children based on visibility
480    Plugin.prototype._setVisAttr = function(el, hidden) {
481        var $this = this;
482
483        // select all parents that aren't hidden
484        var nonHidden = el.children('li').children('ul').not('.'+prefix+'_hidden');
485
486        // iterate over all items setting appropriate tags
487        if (!hidden) {
488            nonHidden.each(function(){
489                var ul = $(this);
490                ul.attr('aria-hidden','false');
491                var items = $this._getActionItems(ul);
492                items.attr('tabindex', '0');
493                $this._setVisAttr(ul, hidden);
494            });
495        } else {
496            nonHidden.each(function(){
497                var ul = $(this);
498                ul.attr('aria-hidden','true');
499                var items = $this._getActionItems(ul);
500                items.attr('tabindex', '-1');
501                $this._setVisAttr(ul, hidden);
502            });
503        }
504    };
505
506    // get all 1st level items that are clickable
507    Plugin.prototype._getActionItems = function(el) {
508        var data = el.data("menu");
509        if (!data) {
510            data = {};
511            var items = el.children('li');
512            var anchors = items.find('a');
513            data.links = anchors.add(items.find('.'+prefix+'_item'));
514            el.data('menu', data);
515        }
516        return data.links;
517    };
518
519    Plugin.prototype._outlines = function(state) {
520        if (!state) {
521            $('.'+prefix+'_item, .'+prefix+'_btn').css('outline','none');
522        } else {
523            $('.'+prefix+'_item, .'+prefix+'_btn').css('outline','');
524        }
525    };
526
527    Plugin.prototype.toggle = function(){
528        var $this = this;
529        $this._menuToggle();
530    };
531
532    Plugin.prototype.open = function(){
533        var $this = this;
534        if ($this.btn.hasClass(prefix+'_collapsed')) {
535            $this._menuToggle();
536        }
537    };
538
539    Plugin.prototype.close = function(){
540        var $this = this;
541        if ($this.btn.hasClass(prefix+'_open')) {
542            $this._menuToggle();
543        }
544    };
545
546    $.fn[mobileMenu] = function ( options ) {
547        var args = arguments;
548
549        // Is the first parameter an object (options), or was omitted, instantiate a new instance
550        if (options === undefined || typeof options === 'object') {
551            return this.each(function () {
552
553                // Only allow the plugin to be instantiated once due to methods
554                if (!$.data(this, 'plugin_' + mobileMenu)) {
555
556                    // if it has no instance, create a new one, pass options to our plugin constructor,
557                    // and store the plugin instance in the elements jQuery data object.
558                    $.data(this, 'plugin_' + mobileMenu, new Plugin( this, options ));
559                }
560            });
561
562        // If is a string and doesn't start with an underscore or 'init' function, treat this as a call to a public method.
563        } else if (typeof options === 'string' && options[0] !== '_' && options !== 'init') {
564
565            // Cache the method call to make it possible to return a value
566            var returns;
567
568            this.each(function () {
569                var instance = $.data(this, 'plugin_' + mobileMenu);
570
571                // Tests that there's already a plugin-instance and checks that the requested public method exists
572                if (instance instanceof Plugin && typeof instance[options] === 'function') {
573
574                    // Call the method of our plugin instance, and pass it the supplied arguments.
575                    returns = instance[options].apply( instance, Array.prototype.slice.call( args, 1 ) );
576                }
577            });
578
579            // If the earlier cached method gives a value back return the value, otherwise return this to preserve chainability.
580            return returns !== undefined ? returns : this;
581        }
582    };
583}(jQuery, document, window));