/public_html/javascripts/jquery.slimmenu.js
JavaScript | 175 lines | 146 code | 22 blank | 7 comment | 14 complexity | 51c3708d5dd39a585fe826af85579c1f MD5 | raw file
- /**
- * jquery.slimmenu.js
- * http://adnantopal.github.io/slimmenu/
- * Author: @adnantopal
- * Copyright 2013, Adnan Topal (atopal.com)
- * Licensed under the MIT license.
- */
- ;(function ( $, window, document, undefined )
- {
- var pluginName = "slimmenu",
- defaults =
- {
- resizeWidth: '767',
- collapserTitle: '',
- animSpeed: 'medium',
- easingEffect: null,
- indentChildren: false,
- childrenIndenter: ' '
- };
-
- var oldWindowWidth = 0;
- function Plugin( element, options )
- {
- this.element = element;
- this.$elem = $(this.element);
- this.options = $.extend( {}, defaults, options );
- this.oldwidth = 0;
- this.init();
- }
- Plugin.prototype = {
- init: function()
- {
- var $options = this.options,
- $menu = this.$elem,
- $collapser = '<div class="menu-collapser">'+$options.collapserTitle+'<div class="collapse-button"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></div></div>',
- $menu_collapser;
- $menu.before($collapser);
- $menu_collapser = $menu.prev('.menu-collapser');
- $menu.on('click', '.sub-collapser', function(e)
- {
- e.preventDefault();
- e.stopPropagation();
- var $parent_li = $(this).closest('li');
- if ($(this).hasClass('expanded'))
- {
- $(this).removeClass('expanded');
- $(this).find('i').html('▼');
- $parent_li.find('>ul').slideUp($options.animSpeed, $options.easingEffect);
- }
- else
- {
- $(this).addClass('expanded');
- $(this).find('i').html('▲');
- $parent_li.find('>ul').slideDown($options.animSpeed, $options.easingEffect);
- }
- });
- $menu_collapser.on('click', '.collapse-button', function(e)
- {
- e.preventDefault();
- $menu.slideToggle($options.animSpeed, $options.easingEffect);
- });
- this.resizeMenu({ data: { el: this.element, options: this.options } });
- $(window).on('resize', { el: this.element, options: this.options }, this.resizeMenu);
- $(window).trigger("resize");
- },
- resizeMenu: function(event)
- {
- var $window = $(window),
- $options = event.data.options,
- $menu = $(event.data.el),
- $menu_collapser = $('body').find('.menu-collapser');
-
- if (oldWindowWidth == $window.width()) {
- return;
- }
- oldWindowWidth = $window.width();
- var windowWidth = $window.width();
- if(window["innerWidth"] !== undefined){
- if(window["innerWidth"] > windowWidth){
- windowWidth = window["innerWidth"];
- }
- }
-
- if(windowWidth != this.oldwidth){
- this.oldwidth = windowWidth;
- $menu.find('li').each(function()
- {
- if ($(this).has('ul').length)
- {
- if ($(this).has('.sub-collapser').length)
- {
- $(this).children('.sub-collapser i').html('▼');
- }
- else
- {
- $(this).append('<span class="sub-collapser"><i>▼</i></span>');
- }
- }
-
- $(this).children('ul').hide();
- $(this).find('.sub-collapser').removeClass('expanded').children('i').html('▼');
- });
-
- if ($options.resizeWidth >= windowWidth)
- {
- if ($options.indentChildren)
- {
- $menu.find('ul').each(function()
- {
- var $depth = $(this).parents('ul').length;
- if (!$(this).children('li').children('a').has('i').length)
- {
- $(this).children('li').children('a').prepend(Plugin.prototype.indent($depth, $options));
- }
- });
- }
-
- $menu.find('li').has('ul').off('mouseenter mouseleave');
- $menu.addClass('collapsed').hide();
- $menu_collapser.show();
- }
- else
- {
- $menu.find('li').has('ul').on('mouseenter', function()
- {
- $(this).find('>ul').stop().slideDown($options.animSpeed, $options.easingEffect);
- })
- .on('mouseleave', function()
- {
- $(this).find('>ul').stop().slideUp($options.animSpeed, $options.easingEffect);
- });
-
- $menu.find('li > a > i').remove();
- $menu.removeClass('collapsed').show();
- $menu_collapser.hide();
- }
- }
- },
- indent: function(num, options)
- {
- var $indent = '';
- for (var i=0; i < num; i++)
- {
- $indent += options.childrenIndenter;
- }
- return '<i>'+$indent+'</i>';
- }
- };
- $.fn[pluginName] = function ( options )
- {
- return this.each(function ()
- {
- if (!$.data(this, "plugin_" + pluginName))
- {
- $.data(this, "plugin_" + pluginName,
- new Plugin( this, options ));
- }
- });
- };
- })( jQuery, window, document );