https://sitel.com.mk/sites/all/modules/responsive_menus/styles/res…/js/responsive_menus_simple.js?tlvu42

1/**
2 * @file
3 * Simple responsification of menus.
4 */
5(function ($) {
6  /**
7   * Handle clicks & toggling the menu.
8   */
9  var toggler_click = function() {
10    $(this).parent().toggleClass('responsive-toggled');
11  };
12  /**
13   * Unbind other mouse events on the menu items.
14   *
15   * @todo
16   *   Not sure if it works 100%.
17   *   Doesn't restore binds when out-of-responsive (if window dragging).
18   */
19  function remove_mouse_events(menuElement) {
20    // Determine jQuery version and what disable options we have.
21    var jqVersion = $.fn.jquery;
22    if (jqVersion < 1.7) {
23      $(menuElement).die('mouseover mouseout mouseenter mouseleave');
24      $(menuElement + ' li').die('mouseover mouseout mouseenter mouseleave');
25      $(menuElement + ' li a').die('mouseover mouseout mouseenter mouseleave');
26    }
27    else {
28      $(menuElement).off('hover');
29      $(menuElement + ' li').off('hover');
30      $(menuElement + ' li a').off('hover');
31    }
32    $(menuElement).unbind('mouseover mouseout mouseenter mouseleave');
33    $(menuElement + ' li').unbind('mouseover mouseout mouseenter mouseleave');
34    $(menuElement + ' li a').unbind('mouseover mouseout mouseenter mouseleave');
35  }
36
37  /**
38   * Store classes & IDs for restoring later (if window dragging).
39   */
40  function store_classes_ids(menuElement) {
41    if (!$(menuElement).attr('id')) {
42      $(menuElement).attr('id', 'rm-no-id');
43    }
44    if (!$(menuElement).attr('class')) {
45      $(menuElement).attr('class', 'rm-no-class');
46    }
47    $(menuElement).data('removeattr', true)
48      .data('rmids', $(menuElement).attr('id'))
49      .data('rmclasses', $(menuElement).attr('class'));
50    // Handle ULs if selector is parent div.
51    $(menuElement).find('ul').each(function() {
52      // Prevent error if there is no id.
53      if (!$(this).attr('id')) {
54        $(this).attr('id', 'rm-no-id');
55      }
56      // Prevent error if there is no class.
57      if (!$(this).attr('class')) {
58        $(this).attr('class', 'rm-no-class');
59      }
60      $(this).data('removeattr', true)
61        .data('rmids', $(this).attr('id'))
62        .data('rmclasses', $(this).attr('class'));
63    });
64    // Finally, add our class to the parent.
65    $(menuElement).addClass('responsive-menus-simple');
66  }
67
68  /**
69   * Remove classes & IDs from original menu for easier theming.
70   */
71  function remove_classes_ids(menuElement) {
72    // Handle ULs if selector is parent div.
73    $(menuElement).find('ul').each(function() {
74      $(this).attr('class', 'rm-removed').attr('id', 'rm-removed');
75    });
76    // Remove classes/IDs.
77    $(menuElement).attr('class', 'responsive-menus-simple').attr('id', 'rm-removed');
78  }
79
80  // Iterate through selectors, check window sizes, add some classes.
81  Drupal.behaviors.responsive_menus = {
82    attach: function (context, settings) {
83      settings.responsive_menus = settings.responsive_menus || {};
84      $('body').once('responsive-menus-load', function() {
85        // Only doing this themes that don't include a viewport attribute.
86        // e.g. Bartik for testing out-of-the-box... yeah, stupid.
87        if (!$('meta[name=viewport]').length > 0) {
88          $('head').append('<meta name="viewport" content="width=device-width, initial-scale=1.0">');
89        }
90        // Window width with legacy browsers.
91        var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
92        $.each(settings.responsive_menus, function(ind, iteration) {
93          if (iteration.responsive_menus_style != 'responsive_menus_simple') {
94            return true;
95          }
96          if (!iteration.selectors.length) {
97            return true;
98          }
99          var $media_size = iteration.media_size || 768;
100          // Handle clicks & toggling.
101          var toggler_class = '';
102          var toggler_text = iteration.toggler_text;
103          // Iterate through our selectors.
104          $.each(iteration.selectors, function(index, value) {
105            // Stop if there is no menu element.
106            if ($(value).length < 1) {
107              return true;
108            }
109            // Handle nested menus.  Make sure we get the first, but not children.
110            if ($(value).length > 1) {
111              $(value).each(function(val_index) {
112                if (!$(this).parents('ul').length) {
113                  if (!$(this).hasClass('responsive-menus-simple')) {
114                    toggler_class = 'responsive-menus-' + ind + '-' + index + '-' + val_index;
115                    // Store classes & IDs before removing.
116                    if (iteration.remove_attributes) {
117                      store_classes_ids(this);
118                    }
119                    $(this).wrap('<div data-mediasize="' + $media_size + '" class="responsive-menus ' + toggler_class + '" />');
120                    $('.' + toggler_class).prepend('<span class="toggler">' + toggler_text + '</span>');
121                    $('.' + toggler_class + ' .toggler').bind('click', toggler_click);

122                    // Unbind other mouse events.
123                    if (iteration.disable_mouse_events) {
124                      //$(this).data('disablemouse', true);
125                      remove_mouse_events(this);
126                    }
127                    // Use absolute positioning.
128                    if (iteration.absolute) {
129                      $('.' + toggler_class).addClass('absolute');
130                    }
131                    // Handle first size check.
132                    if (windowWidth <= $media_size) {
133                      // Remove attributes setting.
134                      if (iteration.remove_attributes) {
135                        remove_classes_ids(this);
136                      }
137                      $('.' + toggler_class).addClass('responsified');
138                    }
139                  }
140                }
141              });
142            }
143            else {
144              // Single level menus.
145              if (!$(value).hasClass('responsive-menus-simple')) {
146                toggler_class = 'responsive-menus-' + ind + '-' + index;
147                // Store classes & IDs before removing.
148                if (iteration.remove_attributes) {
149                  store_classes_ids(value);
150                }
151                $(value).wrap('<div data-mediasize="' + $media_size + '" class="responsive-menus ' + toggler_class + '" />');
152                $('.' + toggler_class).prepend('<span class="toggler">' + toggler_text + '</span>');
153                $('.' + toggler_class + ' .toggler').bind('click', toggler_click);
154                // Unbind other mouse events.
155                if (iteration.disable_mouse_events) {
156                  // @todo For rebinding mouse events.
157                  /*if ($(value + ' li a').data('events')) {
158                    $(value).data('tmpevents', $(value + ' li a').data('events'));
159                  }*/
160                  remove_mouse_events(value);
161                }
162                // Use absolute positioning.
163                if (iteration.absolute) {
164                  $('.' + toggler_class).addClass('absolute');
165                }
166                // Handle first size check.
167                if (windowWidth <= $media_size) {
168                  // Remove attributes setting.
169                  if (iteration.remove_attributes) {
170                    remove_classes_ids(value);
171                  }
172                  $('.' + toggler_class).addClass('responsified');
173                }
174              }
175            }
176          });
177       });
178        // Handle window resizing.
179        $(window).resize(function() {

180          // Window width with legacy browsers.
181          windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
182          $('.responsive-menus').each(function(menuIndex, menuValue) {
183            var mediasize = $(this).data('mediasize') || 768;
184            // Prevent menu from going off the screen.  This only happens in
185            // non-responsive themes (like Bartik default), but it looks bad.
186            if ($(this).width() > windowWidth) {
187              $(this).data('nonresponsive', true);
188              $(this).width(windowWidth);
189            }
190            var menuElement = $(this).find('.responsive-menus-simple');
191            if (windowWidth >= mediasize) {
192              if (menuElement.data('removeattr')) {
193                menuElement.addClass(menuElement.data('rmclasses'));
194                menuElement.attr('id', menuElement.data('rmids'));
195                menuElement.find('ul').each(function() {
196                  $(this).addClass($(this).data('rmclasses'));
197                  $(this).attr('id', $(this).data('rmids'));
198                });
199              }
200              $(this).removeClass('responsified');
201            }
202            if (windowWidth <= mediasize) {
203              // Now fix repercussions for handling non-responsive themes above.
204              // Stretch width back out w/ the screen.
205              if ($(this).data('nonresponsive') && $(this).width() < windowWidth) {
206                $(this).width(windowWidth);
207              }
208              if (menuElement.data('removeattr')) {
209                remove_classes_ids(menuElement);
210              }
211              $(this).addClass('responsified');
212            }
213          });
214        });
215      });
216    }
217  };
218
219}(jQuery));