https://miamicolortheory.com/wp-content/themes/riwa/js/jquery.dlmenu.js?ver=1.0.0

1/**
2 * jquery.dlmenu.js v1.0.1
3 * http://www.codrops.com
4 *
5 * Licensed under the MIT license.
6 * http://www.opensource.org/licenses/mit-license.php
7 * 
8 * Copyright 2013, Codrops
9 * http://www.codrops.com
10 */
11;( function( $, window, undefined ) {
12
13	'use strict';
14
15	// global
16	var Modernizr = window.Modernizr, $body = $( 'body' );
17
18	$.DLMenu = function( options, element ) {
19		this.$el = $( element );
20		this._init( options );
21	};
22
23	// the options
24	$.DLMenu.defaults = {
25		// classes for the animation effects
26		animationClasses : { classin : 'dl-animate-in-1', classout : 'dl-animate-out-1' },
27		// callback: click a link that has a sub menu
28		// el is the link element (li); name is the level name
29		onLevelClick : function( el, name ) { return false; },
30		// callback: click a link that does not have a sub menu
31		// el is the link element (li); ev is the event obj
32		onLinkClick : function( el, ev ) { return false; }
33	};
34
35	$.DLMenu.prototype = {
36		_init : function( options ) {
37
38			// options
39			this.options = $.extend( true, {}, $.DLMenu.defaults, options );
40			// cache some elements and initialize some variables
41			this._config();
42			
43			var animEndEventNames = {
44					'WebkitAnimation' : 'webkitAnimationEnd',
45					'OAnimation' : 'oAnimationEnd',
46					'msAnimation' : 'MSAnimationEnd',
47					'animation' : 'animationend'
48				},
49				transEndEventNames = {
50					'WebkitTransition' : 'webkitTransitionEnd',
51					'MozTransition' : 'transitionend',
52					'OTransition' : 'oTransitionEnd',
53					'msTransition' : 'MSTransitionEnd',
54					'transition' : 'transitionend'
55				};
56			// animation end event name
57			this.animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ] + '.dlmenu';
58			// transition end event name
59			this.transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ] + '.dlmenu',
60			// support for css animations and css transitions
61			this.supportAnimations = Modernizr.cssanimations,
62			this.supportTransitions = Modernizr.csstransitions;
63
64			this._initEvents();
65
66		},
67		_config : function() {
68			this.open = false;
69			this.$trigger = this.$el.children( '.dl-trigger' );
70			this.$menu = this.$el.children( 'ul.dl-menu' );
71			this.$menuitems = this.$menu.find( 'li:not(.dl-back)' );
72			//this.$el.find( 'ul.dl-submenu' ).prepend( '<li class="dl-back"><a href="#">back</a></li>' );
73			this.$el.find( 'ul.sub-menu' ).prepend( '<li class="dl-back"><a href="#">&nbsp;</a></li>' );
74			this.$back = this.$menu.find( 'li.dl-back' );
75		},
76		_initEvents : function() {
77
78			var self = this;
79
80			this.$trigger.on( 'click.dlmenu', function() {
81				
82				if( self.open ) {
83					self._closeMenu();
84				} 
85				else {
86					self._openMenu();
87				}
88				return false;
89
90			} );
91
92			this.$menuitems.on( 'click.dlmenu', function( event ) {
93				
94				event.stopPropagation();
95
96				var $item = $(this),
97					//$submenu = $item.children( 'ul.dl-submenu' );
98					$submenu = $item.children( 'ul.sub-menu' );
99
100				if( $submenu.length > 0 ) {
101
102					var $flyin = $submenu.clone().css( 'opacity', 0 ).insertAfter( self.$menu ),
103						onAnimationEndFn = function() {
104							self.$menu.off( self.animEndEventName ).removeClass( self.options.animationClasses.classout ).addClass( 'dl-subview' );
105							$item.addClass( 'dl-subviewopen' ).parents( '.dl-subviewopen:first' ).removeClass( 'dl-subviewopen' ).addClass( 'dl-subview' );
106							$flyin.remove();
107						};
108
109					setTimeout( function() {
110						$flyin.addClass( self.options.animationClasses.classin );
111						self.$menu.addClass( self.options.animationClasses.classout );
112						if( self.supportAnimations ) {
113							self.$menu.on( self.animEndEventName, onAnimationEndFn );
114						}
115						else {
116							onAnimationEndFn.call();
117						}
118
119						self.options.onLevelClick( $item, $item.children( 'a:first' ).text() );
120					} );
121
122					return false;
123
124				}
125				else {
126					self.options.onLinkClick( $item, event );
127				}
128
129			} );
130
131			this.$back.on( 'click.dlmenu', function( event ) {
132				
133				var $this = $( this ),
134					//$submenu = $this.parents( 'ul.dl-submenu:first' ),
135					$submenu = $this.parents( 'ul.sub-menu:first' ),
136					$item = $submenu.parent(),
137
138					$flyin = $submenu.clone().insertAfter( self.$menu );
139
140				var onAnimationEndFn = function() {
141					self.$menu.off( self.animEndEventName ).removeClass( self.options.animationClasses.classin );
142					$flyin.remove();
143				};
144
145				setTimeout( function() {
146					$flyin.addClass( self.options.animationClasses.classout );
147					self.$menu.addClass( self.options.animationClasses.classin );
148					if( self.supportAnimations ) {
149						self.$menu.on( self.animEndEventName, onAnimationEndFn );
150					}
151					else {
152						onAnimationEndFn.call();
153					}
154
155					$item.removeClass( 'dl-subviewopen' );
156					
157					var $subview = $this.parents( '.dl-subview:first' );
158					if( $subview.is( 'li' ) ) {
159						$subview.addClass( 'dl-subviewopen' );
160					}
161					$subview.removeClass( 'dl-subview' );
162				} );
163
164				return false;
165
166			} );
167			
168		},
169		closeMenu : function() {
170			if( this.open ) {
171				this._closeMenu();
172			}
173		},
174		_closeMenu : function() {
175			var self = this,
176				onTransitionEndFn = function() {
177					self.$menu.off( self.transEndEventName );
178					self._resetMenu();
179				};
180			
181			this.$menu.removeClass( 'dl-menuopen' );
182			this.$menu.addClass( 'dl-menu-toggle' );
183			this.$trigger.removeClass( 'dl-active' );
184			
185			if( this.supportTransitions ) {
186				this.$menu.on( this.transEndEventName, onTransitionEndFn );
187			}
188			else {
189				onTransitionEndFn.call();
190			}
191
192			this.open = false;
193		},
194		openMenu : function() {
195			if( !this.open ) {
196				this._openMenu();
197			}
198		},
199		_openMenu : function() {
200			var self = this;
201			// clicking somewhere else makes the menu close
202			$body.off( 'click' ).on( 'click.dlmenu', function() {
203				self._closeMenu() ;
204			} );
205			this.$menu.addClass( 'dl-menuopen dl-menu-toggle' ).on( this.transEndEventName, function() {
206				$( this ).removeClass( 'dl-menu-toggle' );
207			} );
208			this.$trigger.addClass( 'dl-active' );
209			this.open = true;
210		},
211		// resets the menu to its original state (first level of options)
212		_resetMenu : function() {
213			this.$menu.removeClass( 'dl-subview' );
214			this.$menuitems.removeClass( 'dl-subview dl-subviewopen' );
215		}
216	};
217
218	var logError = function( message ) {
219		if ( window.console ) {
220			window.console.error( message );
221		}
222	};
223
224	$.fn.dlmenu = function( options ) {
225		if ( typeof options === 'string' ) {
226			var args = Array.prototype.slice.call( arguments, 1 );
227			this.each(function() {
228				var instance = $.data( this, 'dlmenu' );
229				if ( !instance ) {
230					logError( "cannot call methods on dlmenu prior to initialization; " +
231					"attempted to call method '" + options + "'" );
232					return;
233				}
234				if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
235					logError( "no such method '" + options + "' for dlmenu instance" );
236					return;
237				}
238				instance[ options ].apply( instance, args );
239			});
240		} 
241		else {
242			this.each(function() {	
243				var instance = $.data( this, 'dlmenu' );
244				if ( instance ) {
245					instance._init();
246				}
247				else {
248					instance = $.data( this, 'dlmenu', new $.DLMenu( options, this ) );
249				}
250			});
251		}
252		return this;
253	};
254
255} )( jQuery, window );