1/** 2 * jquery.dropdown.js v1.0.0 3 * http://www.codrops.com 4 * 5 * Licensed under the MIT license. 6 * http://www.opensource.org/licenses/mit-license.php 7 * 8 * Copyright 2012, Codrops 9 * http://www.codrops.com 10 */ 11;( function( $, window, undefined ) { 12 13 'use strict'; 14 15 $.DropDown = function( options, element ) { 16 this.$el = $( element ); 17 this._init( options ); 18 }; 19 20 // the options 21 $.DropDown.defaults = { 22 speed : 300, 23 easing : 'ease', 24 gutter : 0, 25 // initial stack effect 26 stack : true, 27 // delay between each option animation 28 delay : 0, 29 // random angle and positions for the options 30 random : false, 31 // rotated [right||left||false] : the options will be rotated to thr right side or left side. 32 // make sure to tune the transform origin in the stylesheet 33 rotated : false, 34 // effect to slide in the options. value is the margin to start with 35 slidingIn : false, 36 onOptionSelect : function(opt) { return false; } 37 }; 38 39 $.DropDown.prototype = { 40 41 _init : function( options ) { 42 43 // options 44 this.options = $.extend( true, {}, $.DropDown.defaults, options ); 45 this.anchorFlag=!window.filteringFlag; 46 this._layout(); 47 this._initEvents(); 48 49 console.log(this.anchorFlag); 50 51 }, 52 _layout : function() { 53 54 var self = this; 55 this.minZIndex = 1000; 56 var value = this._transformSelect(); 57 this.opts = this.listopts.children( 'li' ); 58 this.optsCount = this.opts.length; 59 this.size = { width : this.dd.width(), height : this.dd.height() }; 60 61 var elName = this.$el.attr( 'name' ), elId = this.$el.attr( 'id' ), 62 inputName = elName !== undefined ? elName : elId !== undefined ? elId : 'cd-dropdown-' + ( new Date() ).getTime(); 63 64 this.inputEl = $( '<input type="hidden" name="' + inputName + '" value="' + value + '"></input>' ).insertAfter( this.selectlabel ); 65 66 this.selectlabel.css( 'z-index', this.minZIndex + this.optsCount ); 67 this._positionOpts(); 68 if( Modernizr.csstransitions ) { 69 setTimeout( function() { self.opts.css( 'transition', 'all ' + self.options.speed + 'ms ' + self.options.easing ); }, 25 ); 70 } 71 72 }, 73 _transformSelect : function() { 74 75 var self=this; 76 77 var optshtml = '', selectlabel = '', value = -1; 78 this.$el.children( 'option' ).each( function() { 79 80 var $this = $( this ), 81 val = isNaN( $this.attr( 'value' ) ) ? $this.attr( 'value' ) : Number( $this.attr( 'value' ) ) , 82 classes = $this.attr( 'class' ), 83 url=$this.attr('data-url'), 84 selected = $this.attr( 'selected' ), 85 label = $this.text(); 86 87 if( val !== -1 ) { 88 if (self.anchorFlag) { 89 90 optshtml += 91 classes !== undefined ? 92 '<li data-value="' + val + '"><a href="'+url+'"><span class="' + classes + '">' + label + '</span></a></li>' : 93 '<li data-value="' + val + '"><a href="'+url+'"><span>' + label + '</span></a></li>'; 94 }else{ 95 optshtml += 96 classes !== undefined ? 97 '<li data-value="' + val + '"><span class="' + classes + '">' + label + '</span></li>' : 98 '<li data-value="' + val + '"><span>' + label + '</span></li>'; 99 } 100 101 } 102 103 if( selected ) { 104 selectlabel = label; 105 value = val; 106 } 107 108 } ); 109 110 this.listopts = $( '<ul/>' ).append( optshtml ); 111 this.selectlabel = $( '<span/>' ).append( selectlabel ); 112 this.dd = $( '<div class="cd-dropdown"/>' ).append( this.selectlabel, this.listopts ).insertAfter( this.$el ); 113 this.$el.remove(); 114 115 return value; 116 117 }, 118 _positionOpts : function( anim ) { 119 120 var self = this; 121 122 this.listopts.css( 'height', 'auto' ); 123 this.opts 124 .each( function( i ) { 125 $( this ).css( { 126 zIndex : self.minZIndex + self.optsCount - 1 - i, 127 top : self.options.slidingIn ? ( i + 1 ) * ( self.size.height + self.options.gutter ) : 0, 128 left : 0, 129 marginLeft : self.options.slidingIn ? i % 2 === 0 ? self.options.slidingIn : - self.options.slidingIn : 0, 130 opacity : self.options.slidingIn ? 0 : 1, 131 transform : 'none' 132 } ); 133 } ); 134 135 if( !this.options.slidingIn ) { 136 this.opts 137 .eq( this.optsCount - 1 ) 138 .css( { top : this.options.stack ? 9 : 0, left : this.options.stack ? 4 : 0, width : this.options.stack ? this.size.width - 8 : this.size.width, transform : 'none' } ) 139 .end() 140 .eq( this.optsCount - 2 ) 141 .css( { top : this.options.stack ? 6 : 0, left : this.options.stack ? 2 : 0, width : this.options.stack ? this.size.width - 4 : this.size.width, transform : 'none' } ) 142 .end() 143 .eq( this.optsCount - 3 ) 144 .css( { top : this.options.stack ? 3 : 0, left : 0, transform : 'none' } ); 145 } 146 147 }, 148 _initEvents : function() { 149 150 var self = this; 151 152 this.selectlabel.on( 'mousedown.dropdown', function( event ) { 153 self.opened ? self.close() : self.open(); 154 return false;
155 156 } ); 157 158 this.opts.on( 'click.dropdown', function() { 159 if( self.opened ) { 160 var opt = $( this ); 161 self.options.onOptionSelect( opt ); 162 self.inputEl.val( opt.data( 'value' ) ).trigger('change'); 163 164 self.selectlabel.html( opt.html() ); 165 self.close(); 166 } 167 } ); 168 169 }, 170 open : function() { 171 var self = this; 172 this.dd.toggleClass( 'cd-active' ); 173 this.listopts.css( 'height', ( this.optsCount + 1 ) * ( this.size.height + this.options.gutter ) ); 174 this.opts.each( function( i ) { 175 176 $( this ).css( { 177 opacity : 1, 178 top : self.options.rotated ? self.size.height + self.options.gutter : ( i + 1 ) * ( self.size.height + self.options.gutter ), 179 left : self.options.random ? Math.floor( Math.random() * 11 - 5 ) : 0, 180 width : self.size.width, 181 marginLeft : 0, 182 transform : self.options.random ? 183 'rotate(' + Math.floor( Math.random() * 11 - 5 ) + 'deg)' : 184 self.options.rotated ? 185 self.options.rotated === 'right' ? 186 'rotate(-' + ( i * 5 ) + 'deg)' : 187 'rotate(' + ( i * 5 ) + 'deg)' 188 : 'none', 189 transitionDelay : self.options.delay && Modernizr.csstransitions ? self.options.slidingIn ? ( i * self.options.delay ) + 'ms' : ( ( self.optsCount - 1 - i ) * self.options.delay ) + 'ms' : 0 190 } ); 191 192 } ); 193 this.opened = true; 194 195 }, 196 close : function() { 197 198 var self = this; 199 this.dd.toggleClass( 'cd-active' ); 200 if( this.options.delay && Modernizr.csstransitions ) { 201 this.opts.each( function( i ) { 202 $( this ).css( { 'transition-delay' : self.options.slidingIn ? ( ( self.optsCount - 1 - i ) * self.options.delay ) + 'ms' : ( i * self.options.delay ) + 'ms' } ); 203 } ); 204 } 205 this._positionOpts( true ); 206 this.opened = false; 207 208 } 209 210 } 211 212 $.fn.dropdownit = function( options ) { 213 var instance = $.data( this, 'dropdown' ); 214 if ( typeof options === 'string' ) { 215 var args = Array.prototype.slice.call( arguments, 1 ); 216 this.each(function() { 217 instance[ options ].apply( instance, args ); 218 }); 219 } 220 else { 221 this.each(function() { 222 instance ? instance._init() : instance = $.data( this, 'dropdown', new $.DropDown( options, this ) ); 223 }); 224 } 225 return instance; 226 }; 227 228} )( jQuery, window );
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.