https://www.nes.ru/assets/js/activeaxon_menu.js

1/**
2 * AXMenu v1.0 - jQuery menu plugin.
3 * Copyright (c) 2013 ActiveAxon.
4 * http://www.activeaxon.com
5 * [email protected]
6 */
7;
8(function($, window, document, undefined) {
9
10
11    // Create the defaults once
12    var pluginName = "AXMenu",
13            defaults = {
14        showArrowIcon: true,
15        firstLevelArrowIcon: '<i class="icon-chevron-down"></i>',
16        menuArrowIcon: '<i class="icon-caret-up icon-arrow-menu"></i>',
17        subMenuArrowIcon: '<i class="icon-chevron-right icon-arrow-submenu"></i>',
18        activeLinkClass: 'activelink'
19    };
20
21    // The actual plugin constructor
22    function AXMenu(element, options) {
23        this.element = element;
24
25        // jQuery has an extend method which merges the contents of two or
26        // more objects, storing the result in the first object. The first object
27        // is generally empty as we don't want to alter the default options for
28        // future instances of the plugin
29        this.options = $.extend({}, defaults, options);
30
31        this._defaults = defaults;
32        this._name = pluginName;
33        this.$el = $(element);
34
35        this.init();
36        this.$timeoutRef = new Array();
37
38    }
39
40    AXMenu.prototype = {
41        init: function() {
42
43            this.currentPageLink = window.location.href;
44            this.pageName = getPageName(this.currentPageLink);
45            this.addFirstLevelArrowIcon(this.$el, this.options);
46
47            this.startEventListener(this.$el, this.options);
48            //add the arrow between the menubox
49            this.addArrowIcon(this.$el, this.options);
50            this.addSubArrowIcon(this.$el, this.options);
51            this.setSelectedElementLink(this.$el);
52
53        },
54        startEventListener: function(el, options) {
55
56            var $that = this;
57
58            var currentUrl = window.location.href;
59
60            /*
61             For every subli element attach mouse enter event
62             */
63            el.find('li').mouseenter(function() {
64
65                var $ul = $(this).find('ul:first').first(),
66                        $li = $(this).first(),
67                        $ulNext;
68
69                //this is used for handling menu icon
70                $ulNext = $ul.next() ? $ul.next().first() : false;
71
72                // attach unique id for each UL element
73                var $subMenuid;
74                if (!$ul.data('zeina-id')) {
75                    $ul.data('zeina-id', getUID());
76                }
77                $subMenuid = $ul.data('zeina-id');
78
79                /* Clear timeouts & events & z-index */
80                window.clearTimeout($that.$timeoutRef[ $subMenuid ])
81                $li.unbind('mouseleave');
82
83                el.find('ul').css('z-index', 1);
84
85                // if its has sub-menu
86                if ($ul[0] && $ul[0].nodeName.toLowerCase() === 'ul') {
87
88                    /* Show Menu & Arrow */
89                    $ul.addClass('show-sub-menu');
90                    $ul.css('z-index', 2);
91                    if ($ulNext) {
92                        $ulNext.addClass('show-sub-menu');
93                    }
94
95                    /* Handle Mouse Leave Action */
96                    $li.mouseleave(function() {
97
98                        $ul.removeClass('show-sub-menu')
99                        if ($ulNext[0] && $ulNext[0].nodeName.toLowerCase() === 'i') {
100                            $ulNext.removeClass('show-sub-menu');
101                        }
102                    });
103
104                }
105            });
106        },
107        /**
108         *  Add icon for 1st level menus.
109         *
110         * @param el
111         * @param options
112         */
113        addArrowIcon: function(el, options) {
114            var $opt = this.options;
115            if (options['showArrowIcon'] === true) {
116                el.find('>li').each(function() {
117                    $(this).find('ul:first').each(function() {
118                        $(this).parent().append($opt['menuArrowIcon']);
119                    });
120                });
121            }
122        },
123        /**
124         *  Add icon for 1st level menus.
125         *
126         * @param el
127         * @param options
128         */
129        addSubArrowIcon: function(el, options) {
130
131            var $opt = this.options,
132                    $that = this;

133            if (options['showArrowIcon'] === true) {
134
135                el.find('ul a').each(function() {
136
137                    //cache element
138                    var $this = $(this);
139
140                    //set selected link
141                    //$that.setSelectedElementLink( $this  );
142
143                    if ($this.next()[0] && $this.next()[0].nodeName.toLowerCase() === 'ul') {
144                        $this.append($opt['subMenuArrowIcon']);
145                    }
146                });
147            }
148        },
149        /**
150         *  Add first level icon
151         *
152         * @param el
153         * @param options
154         */
155        addFirstLevelArrowIcon: function(el, options) {
156
157            var $opt = this.options,
158                    $that = this;
159            if (options['showArrowIcon'] === true) {
160
161                el.find('>li>a').each(function() {
162
163                    //cache element
164                    var $this = $(this);
165
166                    //set selected link
167                    //$that.setSelectedElementLink( $this  );
168
169                    if ($this.next()[0] && $this.next()[0].nodeName.toLowerCase() === 'ul') {
170                        $this.find('span.label-nav').append($opt['firstLevelArrowIcon']);
171                    }
172
173                });
174
175            }
176        },
177        /**
178         * Set selected element.
179         *
180         * @param el
181         * @param options
182         */
183        setSelectedElementLink: function(el) {
184
185            var $opt = this.options, link, linkRegex, $this, $that = this;
186            ;
187            var found = false;
188            $(el).find('a').each(function() {
189
190                $this = $(this);
191                link = $this.attr('href');
192                //linkRegex = new RegExp( escapeRegExp(link) );
193
194                //if ($.trim(link) != '' && $that.pageName == getPageName(link)) {
195                if ($.trim(link) != '' && $that.pageName == getPageName(link) && $that.currentPageLink==this.href) {    
196                    found = true;
197                    $this.addClass($that.options['activeLinkClass']);
198                    /* Set selected links ( parents links ) */
199                    $this.parentsUntil(el).each(function() {
200                        $(this).find('>a').addClass($that.options['activeLinkClass']);
201                    });
202                }
203
204            });
205
206
207        }
208    };
209
210    // A really lightweight plugin wrapper around the constructor,
211    // preventing against multiple instantiations
212    $.fn[pluginName] = function(options) {
213        return this.each(function() {
214            if (!$.data(this, "plugin_" + pluginName)) {
215                $.data(this, "plugin_" + pluginName, new AXMenu(this, options));
216            }
217        });
218    };
219
220
221
222
223    /**
224     * This function is used for return unique string using for tracking element timeouts.
225     * @returns {string}
226     */
227    var i = 0;
228    function getUID() {
229        return 'U' + (++i);
230    }
231
232    /**
233     * getPageName
234     *
235     * @returns {string}
236     */
237    function getPageName(link) {
238        var segments = link.split("/");
239        return segments[ segments.length - 1 ];
240    }
241
242})(jQuery, window, document);