https://www.naturalhistoryonthenet.com/Facts_Figures/dist/js/reaktion.js

1/**
2 * Reaktion.js
3 * Version: 1.0
4 * URL: https://github.com/ryantbrown/reaktion.js
5 * Description: A lightweight responsive, nested navigation plugin for jQuery
6 * Author: Ryan Brown (http://[email protected]) (http://ryantbrown.io)
7 * Demo URL: http://ryantbrown.io/code/reaktionjs
8 * License: MIT
9 */
10
11;(function($, document, window, undefined) {
12
13    var reaktion, nav, menu, defaults = {
14        breakPoint: 480,
15        navIcon: '<i class="fa fa-bars"></i>',
16        arrows: true,
17        arrowIcon: '<i class="fa fa-chevron-down"></i>',
18        arrowsToggleOnly: true,
19        animate: true,
20        effect: 'slide',
21        speed: 300,
22        animateSubNav: true,
23        subNavEffect: 'slide',
24        subNavSpeed: 300,
25        onOpen: function(){},
26        onClose: function(){}
27    };
28
29    function Reaktion(element, options) {
30        this.element = element;
31        this.options = $.extend({}, defaults, options);
32        this._defaults = defaults;
33
34        this._init();
35    }
36
37    Reaktion.prototype = {
38
39        _init: function() {
40
41            nav = $(this.element);
42            reaktion = this;
43            menu = $(this.element).find('ul:first');
44
45            nav.append('<div class="nav-bars">'+this.options.navIcon+'</div>');
46
47            $('.nav-bars').click(function() {
48                menu.is(':visible') ? reaktion.close() : reaktion.open();
49            });
50
51            if(this.options.arrows) {
52                nav.find('ul > li').not('ul > li > ul li').has('ul')
53                      .prepend('<span class="arrow">'+this.options.arrowIcon+'</span>');
54                menu.on('click', 'span.arrow', function() {
55                    reaktion._toggleSubNav($(this));
56                });
57            } else {
58                nav.find('ul > li').not('ul > li > ul li').has('ul')
59                      .prepend('<span class="arrow" style="padding:0;"></span>');
60            }
61
62            if(!this.options.arrows || !this.options.arrowsToggleOnly) {
63                nav.find('ul > li').not('ul > li > ul li').has('ul').find('a').on('click', function(){
64                    reaktion._toggleSubNav($(this));
65                });
66            }
67
68            reaktion._resize();
69
70            $(window).resize(function(){
71                reaktion._resize();
72            });
73
74        },
75
76        _resize: function() {
77            if($(window).width() > this.options.breakPoint) {
78                nav.removeClass('mobile');
79                nav.find('ul:first').show().find('.arrow').removeClass('arrow-rotate')
80                .parent().find('ul').hide();
81
82                nav.find('ul:first > li').hover(function() {
83                    if(!nav.hasClass('mobile')) {
84                        $(this).find('ul').show();
85                    }
86                }, function(){
87                    if(!nav.hasClass('mobile')) {
88                        $(this).find('ul').hide();
89                    }
90                });
91
92            } else {
93                if(!$(this.element).hasClass('mobile')) {
94                    $(this.element).addClass('mobile');
95                }
96                $(this.element).unbind('mouseenter mouseleave');
97            }
98        },
99
100        _toggleSubNav: function(arrow) {
101            if($('.nav-bars').is(':visible')) {
102                if(this.options.animateSubNav) {
103                    this.options.subNavEffect == 'slide' ?
104                        arrow.siblings('ul').slideToggle(this.options.subNavSpeed) :
105                        arrow.siblings('ul').fadeToggle(this.options.subNavSpeed);
106                } else {
107                    arrow.siblings('ul').toggle();
108                }
109                if(this.options.arrows) {
110                    arrow.toggleClass('arrow-rotate');
111                }
112            }
113        },
114
115        open: function() {
116            if(!menu.is(':visible')) {
117                if(this.options.animate) {
118                    this.options.effect == 'slide' ?
119                        menu.slideDown(this.options.speed, function(){
120                            if(typeof reaktion.options.onOpen === 'function'){
121                                reaktion.options.onOpen.call(this);
122                            }
123                        }) :
124                        menu.fadeIn(this.options.speed, function(){
125                           if(typeof reaktion.options.onOpen === 'function'){
126                                reaktion.options.onOpen.call(this);
127                            }
128                        });
129                } else {
130                    menu.show(function(){
131                        if(typeof reaktion.options.onOpen === 'function'){
132                            reaktion.options.onOpen.call(this);
133                        }
134                    });
135                }
136            }
137        },
138
139        close: function() {
140            if(menu.is(':visible')) {
141                if(this.options.animate) {
142                   this.options.effect == 'slide' ?
143                        menu.slideUp(this.options.speed, function(){
144                            if(typeof reaktion.options.onClose === 'function'){
145                                reaktion.options.onClose.call(this);
146                            }
147                        }) :
148                        menu.fadeOut(this.options.speed, function(){
149                            if(typeof reaktion.options.onClose === 'function'){
150                                reaktion.options.onClose.call(this);
151                            }
152                        });
153                } else {
154                    menu.hide(function(){
155                        if(typeof reaktion.options.onClose === 'function'){
156                            reaktion.options.onClose.call(this);
157                        }
158                    });
159                }
160            }
161        },
162
163        toggle: function(){
164            menu.is(':visible') ? this.close() : this.open();
165        }
166
167    };
168
169    $.fn['reaktion'] = function(args) {
170        if (!$(this).length) {
171            return $(this);
172        }
173        var instance = $(this).data('reaktion');
174
175        if(instance && instance[args]  && args.indexOf('_') != 0 && typeof instance[args] === 'function') {
176            return instance[args].apply(instance, Array.prototype.slice.call(arguments, 1));
177        } else if(typeof args === 'object' || !args) {
178            instance = new Reaktion($(this), args);
179            $(this).data('reaktion', instance);
180            return this;
181        } else if(args.indexOf('_') == 0) {
182            $.error('The ' + args + ' method is private and cannot be called publicly');
183        } else {
184            $.error('Method ' + args + ' does not exist in reaktion');
185        }
186    };
187
188})(jQuery, document, window);