zurb-foundation 3.0.5 → 3.0.6
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +4 -0
- data/config/assets.yml +58 -0
- data/foundation.gemspec +1 -0
- data/index.html +1 -1
- data/lib/foundation/version.rb +1 -1
- data/lib/zurb-foundation.rb +4 -5
- data/public/assets/foundation.js +11 -0
- data/public/assets/jquery.js +23 -0
- data/stylesheets/foundation/_mixins.scss +1 -1
- data/stylesheets/foundation/_semantic-grid.scss +9 -5
- data/stylesheets/foundation/_settings.scss +6 -0
- data/stylesheets/foundation/buttons.scss +35 -8
- data/stylesheets/foundation/forms.scss +3 -3
- data/stylesheets/foundation/globals.scss +1 -3
- data/stylesheets/foundation/grid.scss +10 -7
- data/stylesheets/foundation/navbar.scss +1 -1
- data/stylesheets/foundation/reveal.scss +1 -1
- data/stylesheets/foundation/typography.scss +25 -11
- data/stylesheets/foundation/ui.scss +48 -4
- data/templates/project/index.html +23 -9
- data/templates/project/manifest.rb +32 -20
- data/templates/project/sass/_settings.scss +2 -0
- data/templates/project/sass/app.scss +1 -0
- data/templates/project/sass/{foundation-style → foundation}/buttons.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/forms.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/globals.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/grid.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/navbar.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/orbit.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/reveal.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/tabs.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/typography.scss +0 -0
- data/templates/project/sass/{foundation-style → foundation}/ui.scss +0 -0
- data/test.html +152 -686
- data/test2.html +320 -0
- data/vendor/assets/javascripts/foundation/app.js +19 -123
- data/vendor/assets/javascripts/foundation/index.js +11 -5
- data/vendor/assets/javascripts/foundation/jquery.foundation.accordion.js +15 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.alerts.js +19 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.buttons.js +45 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.forms.js +481 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.navigation.js +30 -0
- data/vendor/assets/javascripts/foundation/{jquery.orbit-1.4.0.js → jquery.foundation.orbit.js} +3 -3
- data/vendor/assets/javascripts/foundation/jquery.foundation.reveal.js +773 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.tabs.js +36 -0
- data/vendor/assets/javascripts/foundation/jquery.foundation.tooltips.js +183 -0
- data/vendor/assets/javascripts/foundation/jquery.js +9404 -0
- data/vendor/assets/javascripts/foundation/jquery.placeholder.js +157 -0
- data/vendor/assets/javascripts/foundation/modernizr.foundation.js +3 -3
- metadata +45 -21
- data/templates/project/stylesheets/app.css +0 -0
- data/vendor/assets/javascripts/foundation/jquery.customforms.js +0 -258
- data/vendor/assets/javascripts/foundation/jquery.min.js +0 -4
- data/vendor/assets/javascripts/foundation/jquery.placeholder.min.js +0 -2
- data/vendor/assets/javascripts/foundation/jquery.reveal.js +0 -178
- data/vendor/assets/javascripts/foundation/jquery.tooltips.js +0 -166
@@ -1,8 +1,14 @@
|
|
1
1
|
/*
|
2
2
|
=require foundation/modernizr.foundation
|
3
|
-
=require foundation/jquery.
|
4
|
-
=require foundation/jquery.
|
5
|
-
=require foundation/jquery.
|
6
|
-
=require foundation/jquery.
|
7
|
-
=require foundation/jquery.tooltips
|
3
|
+
=require foundation/jquery.placeholder
|
4
|
+
=require foundation/jquery.foundation.alerts
|
5
|
+
=require foundation/jquery.foundation.accordion
|
6
|
+
=require foundation/jquery.foundation.buttons
|
7
|
+
=require foundation/jquery.foundation.tooltips
|
8
|
+
=require foundation/jquery.foundation.forms
|
9
|
+
=require foundation/jquery.foundation.tabs
|
10
|
+
=require foundation/jquery.foundation.navigation
|
11
|
+
=require foundation/jquery.foundation.reveal
|
12
|
+
=require foundation/jquery.foundation.orbit
|
13
|
+
=require foundation/app
|
8
14
|
*/
|
@@ -0,0 +1,15 @@
|
|
1
|
+
(function( $ ){
|
2
|
+
|
3
|
+
$.fn.foundationAccordion = function(options) {
|
4
|
+
|
5
|
+
$('.accordion li', this).on('click.fndtn', function() {
|
6
|
+
var flyout = $(this).children('.content').first();
|
7
|
+
$('.accordion .content').not(flyout).hide().parent('li').removeClass('active');
|
8
|
+
flyout.show(0, function() {
|
9
|
+
flyout.parent('li').addClass('active');
|
10
|
+
});
|
11
|
+
});
|
12
|
+
|
13
|
+
};
|
14
|
+
|
15
|
+
})( jQuery );
|
@@ -0,0 +1,19 @@
|
|
1
|
+
(function( $ ){
|
2
|
+
|
3
|
+
$.fn.foundationAlerts = function(options) {
|
4
|
+
var settings = $.extend({
|
5
|
+
callback: $.noop
|
6
|
+
}, options);
|
7
|
+
|
8
|
+
$(".alert-box", this).delegate("a.close", "click", function(event) {
|
9
|
+
event.preventDefault();
|
10
|
+
$(this).closest(".alert-box").fadeOut(function(event){
|
11
|
+
$(this).remove();
|
12
|
+
// Do something else after the alert closes
|
13
|
+
settings.callback();
|
14
|
+
});
|
15
|
+
});
|
16
|
+
|
17
|
+
};
|
18
|
+
|
19
|
+
})( jQuery );
|
@@ -0,0 +1,45 @@
|
|
1
|
+
(function( $ ){
|
2
|
+
|
3
|
+
$.fn.foundationButtons = function(options) {
|
4
|
+
// Prevent event propagation on disabled buttons
|
5
|
+
$('.button.disabled', this).on('click.fndtn', function (event) {
|
6
|
+
event.preventDefault();
|
7
|
+
});
|
8
|
+
|
9
|
+
$('.button.dropdown > ul', this).addClass('no-hover');
|
10
|
+
|
11
|
+
$('.button.dropdown', this).on('click.fndtn', function (e) {
|
12
|
+
e.stopPropagation();
|
13
|
+
});
|
14
|
+
$('.button.dropdown.split span', this).on('click.fndtn', function (e) {
|
15
|
+
e.preventDefault();
|
16
|
+
$('.button.dropdown', this).not($(this).parent()).children('ul').removeClass('show-dropdown');
|
17
|
+
$(this).siblings('ul').toggleClass('show-dropdown');
|
18
|
+
});
|
19
|
+
$('.button.dropdown', this).not('.split').on('click.fndtn', function (e) {
|
20
|
+
$('.button.dropdown', this).not(this).children('ul').removeClass('show-dropdown');
|
21
|
+
$(this).children('ul').toggleClass('show-dropdown');
|
22
|
+
});
|
23
|
+
$('body, html').on('click.fndtn', function () {
|
24
|
+
$('.button.dropdown ul').removeClass('show-dropdown');
|
25
|
+
});
|
26
|
+
|
27
|
+
// Positioning the Flyout List
|
28
|
+
var normalButtonHeight = $('.button.dropdown:not(.large):not(.small):not(.tiny)', this).outerHeight() - 1,
|
29
|
+
largeButtonHeight = $('.button.large.dropdown', this).outerHeight() - 1,
|
30
|
+
smallButtonHeight = $('.button.small.dropdown', this).outerHeight() - 1,
|
31
|
+
tinyButtonHeight = $('.button.tiny.dropdown', this).outerHeight() - 1;
|
32
|
+
|
33
|
+
$('.button.dropdown:not(.large):not(.small):not(.tiny) > ul', this).css('top', normalButtonHeight);
|
34
|
+
$('.button.dropdown.large > ul', this).css('top', largeButtonHeight);
|
35
|
+
$('.button.dropdown.small > ul', this).css('top', smallButtonHeight);
|
36
|
+
$('.button.dropdown.tiny > ul', this).css('top', tinyButtonHeight);
|
37
|
+
|
38
|
+
$('.button.dropdown.up:not(.large):not(.small):not(.tiny) > ul', this).css('top', 'auto').css('bottom', normalButtonHeight - 2);
|
39
|
+
$('.button.dropdown.up.large > ul', this).css('top', 'auto').css('bottom', largeButtonHeight - 2);
|
40
|
+
$('.button.dropdown.up.small > ul', this).css('top', 'auto').css('bottom', smallButtonHeight - 2);
|
41
|
+
$('.button.dropdown.up.tiny > ul', this).css('top', 'auto').css('bottom', tinyButtonHeight - 2);
|
42
|
+
|
43
|
+
};
|
44
|
+
|
45
|
+
})( jQuery );
|
@@ -0,0 +1,481 @@
|
|
1
|
+
/*
|
2
|
+
* jQuery Custom Forms Plugin 1.0
|
3
|
+
* www.ZURB.com
|
4
|
+
* Copyright 2010, ZURB
|
5
|
+
* Free to use under the MIT license.
|
6
|
+
* http://www.opensource.org/licenses/mit-license.php
|
7
|
+
*/
|
8
|
+
|
9
|
+
(function( $ ){
|
10
|
+
|
11
|
+
/**
|
12
|
+
* Helper object used to quickly adjust all hidden parent element's, display and visibility properties.
|
13
|
+
* This is currently used for the custom drop downs. When the dropdowns are contained within a reveal modal
|
14
|
+
* we cannot accurately determine the list-item elements width property, since the modal's display property is set
|
15
|
+
* to 'none'.
|
16
|
+
*
|
17
|
+
* This object will help us work around that problem.
|
18
|
+
*
|
19
|
+
* NOTE: This could also be plugin.
|
20
|
+
*
|
21
|
+
* @function hiddenFix
|
22
|
+
*/
|
23
|
+
var hiddenFix = function() {
|
24
|
+
// We'll use this to temporarily store style properties.
|
25
|
+
var tmp = [],
|
26
|
+
hidden = null; // We'll use this to set hidden parent elements.
|
27
|
+
|
28
|
+
return {
|
29
|
+
/**
|
30
|
+
* Sets all hidden parent elements and self to visibile.
|
31
|
+
*
|
32
|
+
* @method adjust
|
33
|
+
* @param {jQuery Object} $child
|
34
|
+
*/
|
35
|
+
adjust : function( $child ) {
|
36
|
+
// Internal reference.
|
37
|
+
var _self = this;
|
38
|
+
|
39
|
+
// Set all hidden parent elements, including this element.
|
40
|
+
_self.hidden = $child.parents().andSelf().filter( ":hidden" );
|
41
|
+
|
42
|
+
// Loop through all hidden elements.
|
43
|
+
_self.hidden.each( function() {
|
44
|
+
|
45
|
+
// Cache the element.
|
46
|
+
var $elem = $( this );
|
47
|
+
|
48
|
+
// Store the style attribute.
|
49
|
+
// Undefined if element doesn't have a style attribute.
|
50
|
+
_self.tmp.push( $elem.attr( 'style' ) );
|
51
|
+
|
52
|
+
// Set the element's display property to block,
|
53
|
+
// but ensure it's visibility is hidden.
|
54
|
+
$elem.css( { 'visibility' : 'hidden', 'display' : 'block' } );
|
55
|
+
});
|
56
|
+
|
57
|
+
}, // end adjust
|
58
|
+
|
59
|
+
/**
|
60
|
+
* Resets the elements previous state.
|
61
|
+
*
|
62
|
+
* @method reset
|
63
|
+
*/
|
64
|
+
reset : function() {
|
65
|
+
// Internal reference.
|
66
|
+
var _self = this;
|
67
|
+
// Loop through our hidden element collection.
|
68
|
+
_self.hidden.each( function( i ) {
|
69
|
+
// Cache this element.
|
70
|
+
var $elem = $( this ),
|
71
|
+
_tmp = _self.tmp[ i ]; // Get the stored 'style' value for this element.
|
72
|
+
|
73
|
+
// If the stored value is undefined.
|
74
|
+
if( _tmp === undefined )
|
75
|
+
// Remove the style attribute.
|
76
|
+
$elem.removeAttr( 'style' );
|
77
|
+
else
|
78
|
+
// Otherwise, reset the element style attribute.
|
79
|
+
$elem.attr( 'style', _tmp );
|
80
|
+
|
81
|
+
});
|
82
|
+
// Reset the tmp array.
|
83
|
+
_self.tmp = [];
|
84
|
+
// Reset the hidden elements variable.
|
85
|
+
_self.hidden = null;
|
86
|
+
|
87
|
+
} // end reset
|
88
|
+
|
89
|
+
}; // end return
|
90
|
+
|
91
|
+
};
|
92
|
+
|
93
|
+
jQuery.foundation = jQuery.foundation || {};
|
94
|
+
jQuery.foundation.customForms = jQuery.foundation.customForms || {};
|
95
|
+
|
96
|
+
$.foundation.customForms.appendCustomMarkup = function ( options ) {
|
97
|
+
|
98
|
+
var defaults = {
|
99
|
+
disable_class: "js-disable-custom"
|
100
|
+
};
|
101
|
+
|
102
|
+
options = $.extend( defaults, options );
|
103
|
+
|
104
|
+
function appendCustomMarkup(idx, sel) {
|
105
|
+
var $this = $(sel).hide(),
|
106
|
+
type = $this.attr('type'),
|
107
|
+
$span = $this.next('span.custom.' + type);
|
108
|
+
|
109
|
+
if ($span.length === 0) {
|
110
|
+
$span = $('<span class="custom ' + type + '"></span>').insertAfter($this);
|
111
|
+
}
|
112
|
+
|
113
|
+
$span.toggleClass('checked', $this.is(':checked'));
|
114
|
+
$span.toggleClass('disabled', $this.is(':disabled'));
|
115
|
+
}
|
116
|
+
|
117
|
+
function appendCustomSelect(idx, sel) {
|
118
|
+
var hiddenFixObj = hiddenFix();
|
119
|
+
//
|
120
|
+
// jQueryify the <select> element and cache it.
|
121
|
+
//
|
122
|
+
var $this = $( sel ),
|
123
|
+
//
|
124
|
+
// Find the custom drop down element.
|
125
|
+
//
|
126
|
+
$customSelect = $this.next( 'div.custom.dropdown' ),
|
127
|
+
//
|
128
|
+
// Find the custom select element within the custom drop down.
|
129
|
+
//
|
130
|
+
$customList = $customSelect.find( 'ul' ),
|
131
|
+
//
|
132
|
+
// Find the custom a.current element.
|
133
|
+
//
|
134
|
+
$selectCurrent = $customSelect.find( ".current" ),
|
135
|
+
//
|
136
|
+
// Find the custom a.selector element (the drop-down icon).
|
137
|
+
//
|
138
|
+
$selector = $customSelect.find( ".selector" ),
|
139
|
+
//
|
140
|
+
// Get the <options> from the <select> element.
|
141
|
+
//
|
142
|
+
$options = $this.find( 'option' ),
|
143
|
+
//
|
144
|
+
// Filter down the selected options
|
145
|
+
//
|
146
|
+
$selectedOption = $options.filter( ':selected' ),
|
147
|
+
//
|
148
|
+
// Initial max width.
|
149
|
+
//
|
150
|
+
maxWidth = 0,
|
151
|
+
//
|
152
|
+
// We'll use this variable to create the <li> elements for our custom select.
|
153
|
+
//
|
154
|
+
liHtml = '',
|
155
|
+
//
|
156
|
+
// We'll use this to cache the created <li> elements within our custom select.
|
157
|
+
//
|
158
|
+
$listItems
|
159
|
+
;
|
160
|
+
var $currentSelect = false;
|
161
|
+
//
|
162
|
+
// Should we not create a custom list?
|
163
|
+
//
|
164
|
+
if ( $this.hasClass( 'no-custom' ) ) return;
|
165
|
+
|
166
|
+
//
|
167
|
+
// Did we not create a custom select element yet?
|
168
|
+
//
|
169
|
+
if ( $customSelect.length === 0 ) {
|
170
|
+
//
|
171
|
+
// Let's create our custom select element!
|
172
|
+
//
|
173
|
+
|
174
|
+
//
|
175
|
+
// Determine what select size to use.
|
176
|
+
//
|
177
|
+
var customSelectSize = $this.hasClass( 'small' ) ? 'small' :
|
178
|
+
$this.hasClass( 'medium' ) ? 'medium' :
|
179
|
+
$this.hasClass( 'large' ) ? 'large' :
|
180
|
+
$this.hasClass( 'expand' ) ? 'expand' : ''
|
181
|
+
;
|
182
|
+
//
|
183
|
+
// Build our custom list.
|
184
|
+
//
|
185
|
+
$customSelect = $('<div class="' + ['custom', 'dropdown', customSelectSize ].join( ' ' ) + '"><a href="#" class="selector"></a><ul /></div>"');
|
186
|
+
//
|
187
|
+
// Grab the selector element
|
188
|
+
//
|
189
|
+
$selector = $customSelect.find( ".selector" );
|
190
|
+
//
|
191
|
+
// Grab the unordered list element from the custom list.
|
192
|
+
//
|
193
|
+
$customList = $customSelect.find( "ul" );
|
194
|
+
//
|
195
|
+
// Build our <li> elements.
|
196
|
+
//
|
197
|
+
liHtml = $.map( $options, function( opt ) { return "<li>" + opt.value + "</li>"; } ).join( '' );
|
198
|
+
//
|
199
|
+
// Append our <li> elements to the custom list (<ul>).
|
200
|
+
//
|
201
|
+
$customList.append( liHtml );
|
202
|
+
//
|
203
|
+
// Insert the the currently selected list item before all other elements.
|
204
|
+
// Then, find the element and assign it to $currentSelect.
|
205
|
+
//
|
206
|
+
|
207
|
+
$currentSelect = $customSelect.prepend( '<a href="#" class="current">' + $selectedOption.html() + '</a>' ).find( ".current" );
|
208
|
+
//
|
209
|
+
// Add the custom select element after the <select> element.
|
210
|
+
//
|
211
|
+
$this.after( $customSelect )
|
212
|
+
//
|
213
|
+
//then hide the <select> element.
|
214
|
+
//
|
215
|
+
.hide();
|
216
|
+
|
217
|
+
} else {
|
218
|
+
//
|
219
|
+
// Create our list item <li> elements.
|
220
|
+
//
|
221
|
+
liHtml = $.map( $options, function( opt ) { return "<li>" + opt.value + "</li>"; } ).join( '' );
|
222
|
+
//
|
223
|
+
// Refresh the ul with options from the select in case the supplied markup doesn't match.
|
224
|
+
// Clear what's currently in the <ul> element.
|
225
|
+
//
|
226
|
+
$customList.html( '' )
|
227
|
+
//
|
228
|
+
// Populate the list item <li> elements.
|
229
|
+
//
|
230
|
+
.append( liHtml );
|
231
|
+
|
232
|
+
} // endif $customSelect.length === 0
|
233
|
+
|
234
|
+
//
|
235
|
+
// Determine whether or not the custom select element should be disabled.
|
236
|
+
//
|
237
|
+
$customSelect.toggleClass( 'disabled', $this.is( ':disabled' ) );
|
238
|
+
//
|
239
|
+
// Cache our List item elements.
|
240
|
+
//
|
241
|
+
$listItems = $customList.find( 'li' );
|
242
|
+
|
243
|
+
//
|
244
|
+
// Determine which elements to select in our custom list.
|
245
|
+
//
|
246
|
+
$options.each( function ( index ) {
|
247
|
+
|
248
|
+
if ( this.selected ) {
|
249
|
+
//
|
250
|
+
// Add the selected class to the current li element
|
251
|
+
//
|
252
|
+
$listItems.eq( index ).addClass( 'selected' );
|
253
|
+
//
|
254
|
+
// Update the current element with the option value.
|
255
|
+
//
|
256
|
+
if ($currentSelect) {
|
257
|
+
$currentSelect.html( this.value );
|
258
|
+
}
|
259
|
+
|
260
|
+
}
|
261
|
+
|
262
|
+
});
|
263
|
+
|
264
|
+
//
|
265
|
+
// Update the custom <ul> list width property.
|
266
|
+
//
|
267
|
+
$customList.css( 'width', 'inherit' );
|
268
|
+
//
|
269
|
+
// Set the custom select width property.
|
270
|
+
//
|
271
|
+
$customSelect.css( 'width', 'inherit' );
|
272
|
+
|
273
|
+
//
|
274
|
+
// If we're not specifying a predetermined form size.
|
275
|
+
//
|
276
|
+
if ( !$customSelect.is( '.small, .medium, .large, .expand' ) ) {
|
277
|
+
|
278
|
+
// ------------------------------------------------------------------------------------
|
279
|
+
// This is a work-around for when elements are contained within hidden parents.
|
280
|
+
// For example, when custom-form elements are inside of a hidden reveal modal.
|
281
|
+
//
|
282
|
+
// We need to display the current custom list element as well as hidden parent elements
|
283
|
+
// in order to properly calculate the list item element's width property.
|
284
|
+
// -------------------------------------------------------------------------------------
|
285
|
+
|
286
|
+
//
|
287
|
+
// Show the drop down.
|
288
|
+
// This should ensure that the list item's width values are properly calculated.
|
289
|
+
//
|
290
|
+
$customSelect.addClass( 'open' );
|
291
|
+
//
|
292
|
+
// Quickly, display all parent elements.
|
293
|
+
// This should help us calcualate the width of the list item's within the drop down.
|
294
|
+
//
|
295
|
+
hiddenFixObj.adjust( $customList );
|
296
|
+
//
|
297
|
+
// Grab the largest list item width.
|
298
|
+
//
|
299
|
+
maxWidth = ( $listItems.outerWidth() > maxWidth ) ? $listItems.outerWidth() : maxWidth;
|
300
|
+
//
|
301
|
+
// Okay, now reset the parent elements.
|
302
|
+
// This will hide them again.
|
303
|
+
//
|
304
|
+
hiddenFixObj.reset();
|
305
|
+
//
|
306
|
+
// Finally, hide the drop down.
|
307
|
+
//
|
308
|
+
$customSelect.removeClass( 'open' );
|
309
|
+
//
|
310
|
+
// Set the custom list width.
|
311
|
+
//
|
312
|
+
$customSelect.width( maxWidth + 18);
|
313
|
+
//
|
314
|
+
// Set the custom list element (<ul />) width.
|
315
|
+
//
|
316
|
+
$customList.width( maxWidth + 16 );
|
317
|
+
|
318
|
+
} // endif
|
319
|
+
|
320
|
+
}
|
321
|
+
|
322
|
+
$('form.custom input:radio[data-customforms!=disabled]').each(appendCustomMarkup);
|
323
|
+
$('form.custom input:checkbox[data-customforms!=disabled]').each(appendCustomMarkup);
|
324
|
+
$('form.custom select[data-customforms!=disabled]').each(appendCustomSelect);
|
325
|
+
};
|
326
|
+
|
327
|
+
var refreshCustomSelect = function($select) {
|
328
|
+
var maxWidth = 0,
|
329
|
+
$customSelect = $select.next();
|
330
|
+
$options = $select.find('option');
|
331
|
+
$customSelect.find('ul').html('');
|
332
|
+
|
333
|
+
$options.each(function () {
|
334
|
+
$li = $('<li>' + $(this).html() + '</li>');
|
335
|
+
$customSelect.find('ul').append($li);
|
336
|
+
});
|
337
|
+
|
338
|
+
// re-populate
|
339
|
+
$options.each(function (index) {
|
340
|
+
if (this.selected) {
|
341
|
+
$customSelect.find('li').eq(index).addClass('selected');
|
342
|
+
$customSelect.find('.current').html($(this).html());
|
343
|
+
}
|
344
|
+
});
|
345
|
+
|
346
|
+
// fix width
|
347
|
+
$customSelect.removeAttr('style')
|
348
|
+
.find('ul').removeAttr('style');
|
349
|
+
$customSelect.find('li').each(function () {
|
350
|
+
$customSelect.addClass('open');
|
351
|
+
if ($(this).outerWidth() > maxWidth) {
|
352
|
+
maxWidth = $(this).outerWidth();
|
353
|
+
}
|
354
|
+
$customSelect.removeClass('open');
|
355
|
+
});
|
356
|
+
$customSelect.css('width', maxWidth + 18 + 'px');
|
357
|
+
$customSelect.find('ul').css('width', maxWidth + 16 + 'px');
|
358
|
+
|
359
|
+
};
|
360
|
+
|
361
|
+
var toggleCheckbox = function($element) {
|
362
|
+
var $input = $element.prev(),
|
363
|
+
input = $input[0];
|
364
|
+
|
365
|
+
if (false == $input.is(':disabled')) {
|
366
|
+
input.checked = ((input.checked) ? false : true);
|
367
|
+
$element.toggleClass('checked');
|
368
|
+
|
369
|
+
$input.trigger('change');
|
370
|
+
}
|
371
|
+
};
|
372
|
+
|
373
|
+
var toggleRadio = function($element) {
|
374
|
+
var $input = $element.prev(),
|
375
|
+
input = $input[0];
|
376
|
+
|
377
|
+
if (false == $input.is(':disabled')) {
|
378
|
+
$('input:radio[name="' + $input.attr('name') + '"]').each(function () {
|
379
|
+
$(this).next().removeClass('checked');
|
380
|
+
});
|
381
|
+
input.checked = ((input.checked) ? false : true);
|
382
|
+
$element.toggleClass('checked');
|
383
|
+
|
384
|
+
$input.trigger('change');
|
385
|
+
}
|
386
|
+
};
|
387
|
+
|
388
|
+
$('form.custom span.custom.checkbox').on('click', function (event) {
|
389
|
+
event.preventDefault();
|
390
|
+
event.stopPropagation();
|
391
|
+
|
392
|
+
toggleCheckbox($(this));
|
393
|
+
});
|
394
|
+
|
395
|
+
$('form.custom span.custom.radio').on('click', function (event) {
|
396
|
+
event.preventDefault();
|
397
|
+
event.stopPropagation();
|
398
|
+
|
399
|
+
toggleRadio($(this));
|
400
|
+
});
|
401
|
+
|
402
|
+
$('form.custom select').on('change', function (event) {
|
403
|
+
refreshCustomSelect($(this));
|
404
|
+
});
|
405
|
+
|
406
|
+
$('form.custom label').on('click', function (event) {
|
407
|
+
var $associatedElement = $('#' + $(this).attr('for')),
|
408
|
+
$customCheckbox,
|
409
|
+
$customRadio;
|
410
|
+
if ($associatedElement.length !== 0) {
|
411
|
+
if ($associatedElement.attr('type') === 'checkbox') {
|
412
|
+
event.preventDefault();
|
413
|
+
$customCheckbox = $(this).find('span.custom.checkbox');
|
414
|
+
toggleCheckbox($customCheckbox);
|
415
|
+
} else if ($associatedElement.attr('type') === 'radio') {
|
416
|
+
event.preventDefault();
|
417
|
+
$customRadio = $(this).find('span.custom.radio');
|
418
|
+
toggleRadio($customRadio);
|
419
|
+
}
|
420
|
+
}
|
421
|
+
});
|
422
|
+
|
423
|
+
$('form.custom div.custom.dropdown a.current, form.custom div.custom.dropdown a.selector').live('click', function (event) {
|
424
|
+
var $this = $(this),
|
425
|
+
$dropdown = $this.closest('div.custom.dropdown'),
|
426
|
+
$select = $dropdown.prev();
|
427
|
+
|
428
|
+
event.preventDefault();
|
429
|
+
$('div.dropdown').removeClass('open');
|
430
|
+
|
431
|
+
if (false == $select.is(':disabled')) {
|
432
|
+
$dropdown.toggleClass('open');
|
433
|
+
|
434
|
+
if ($dropdown.hasClass('open')) {
|
435
|
+
$(document).bind('click.customdropdown', function (event) {
|
436
|
+
$dropdown.removeClass('open');
|
437
|
+
$(document).unbind('.customdropdown');
|
438
|
+
});
|
439
|
+
} else {
|
440
|
+
$(document).unbind('.customdropdown');
|
441
|
+
}
|
442
|
+
return false;
|
443
|
+
}
|
444
|
+
});
|
445
|
+
|
446
|
+
$('form.custom div.custom.dropdown li').live('click', function (event) {
|
447
|
+
var $this = $(this),
|
448
|
+
$customDropdown = $this.closest('div.custom.dropdown'),
|
449
|
+
$select = $customDropdown.prev(),
|
450
|
+
selectedIndex = 0;
|
451
|
+
|
452
|
+
event.preventDefault();
|
453
|
+
event.stopPropagation();
|
454
|
+
$('div.dropdown').removeClass('open');
|
455
|
+
|
456
|
+
$this
|
457
|
+
.closest('ul')
|
458
|
+
.find('li')
|
459
|
+
.removeClass('selected');
|
460
|
+
$this.addClass('selected');
|
461
|
+
|
462
|
+
$customDropdown
|
463
|
+
.removeClass('open')
|
464
|
+
.find('a.current')
|
465
|
+
.html($this.html());
|
466
|
+
|
467
|
+
$this.closest('ul').find('li').each(function (index) {
|
468
|
+
if ($this[0] == this) {
|
469
|
+
selectedIndex = index;
|
470
|
+
}
|
471
|
+
|
472
|
+
});
|
473
|
+
$select[0].selectedIndex = selectedIndex;
|
474
|
+
|
475
|
+
$select.trigger('change');
|
476
|
+
});
|
477
|
+
|
478
|
+
|
479
|
+
$.fn.foundationCustomForms = $.foundation.customForms.appendCustomMarkup;
|
480
|
+
|
481
|
+
})( jQuery );
|