Smart Grid-Layout Design for Contact Form 7 / 4.14

Smart Grid-Layout Design for Contact Form 7 v4.14

cf7-grid-layout / assets / jquery-nice-select / js / jquery.nice-select.js

jquery.nice-select.js in Smart Grid-Layout Design for Contact Form 7 4.14, at assets/jquery-nice-select/js/jquery.nice-select.js

190 lines 5.7 KB

Raw Download Zip

1	/* jQuery Nice Select - v1.1.0
2	https://github.com/hernansartorio/jquery-nice-select
3	Made by Hernán Sartorio */
4
5	(function($) {
6
7	$.fn.niceSelect = function(method) {
8
9	// Methods
10	if (typeof method == 'string') {
11	if (method == 'update') {
12	this.each(function() {
13	var $select = $(this);
14	var $dropdown = $(this).next('.nice-select');
15	var open = $dropdown.hasClass('open');
16
17	if ($dropdown.length) {
18	$dropdown.remove();
19	create_nice_select($select);
20
21	if (open) {
22	$select.next().trigger('click');
23	}
24	}
25	});
26	} else if (method == 'destroy') {
27	this.each(function() {
28	var $select = $(this);
29	var $dropdown = $(this).next('.nice-select');
30
31	if ($dropdown.length) {
32	$dropdown.remove();
33	$select.css('display', '');
34	}
35	});
36	if ($('.nice-select').length == 0) {
37	$(document).off('.nice_select');
38	}
39	} else {
40	console.log('Method "' + method + '" does not exist.')
41	}
42	return this;
43	}
44
45	// Hide native select
46	this.hide();
47
48	// Create custom markup
49	this.each(function() {
50	var $select = $(this);
51
52	if (!$select.next().hasClass('nice-select')) {
53	create_nice_select($select);
54	}
55	});
56
57	function create_nice_select($select) {
58	$select.after($('<div></div>')
59	.addClass('nice-select')
60	.addClass($select.attr('class') \|\| '')
61	.addClass($select.attr('disabled') ? 'disabled' : '')
62	.attr('tabindex', $select.attr('disabled') ? null : '0')
63	.html('<span class="current"></span><ul class="list"></ul>')
64	);
65
66	var $dropdown = $select.next();
67	var $options = $select.find('option');
68	var $selected = $select.find('option:selected');
69
70	$dropdown.find('.current').html($selected.data('display') \|\| $selected.text());
71
72	$options.each(function(i) {
73	var $option = $(this);
74	var display = $option.data('display');
75
76	$dropdown.find('ul').append($('<li></li>')
77	.attr('data-value', $option.val())
78	.attr('data-display', (display \|\| null))
79	.addClass('option' +
80	($option.is(':selected') ? ' selected' : '') +
81	($option.is(':disabled') ? ' disabled' : ''))
82	.html($option.text())
83	);
84	});
85	}
86
87	/* Event listeners */
88
89	// Unbind existing events in case that the plugin has been initialized before
90	$(document).off('.nice_select');
91
92	// Open/close
93	$(document).on('click.nice_select', '.nice-select', function(event) {
94	var $dropdown = $(this);
95
96	$('.nice-select').not($dropdown).removeClass('open');
97	$dropdown.toggleClass('open');
98
99	if ($dropdown.hasClass('open')) {
100	$dropdown.find('.option');
101	$dropdown.find('.focus').removeClass('focus');
102	$dropdown.find('.selected').addClass('focus');
103	} else {
104	$dropdown.focus();
105	}
106	});
107
108	// Close when clicking outside
109	$(document).on('click.nice_select', function(event) {
110	if ($(event.target).closest('.nice-select').length === 0) {
111	$('.nice-select').removeClass('open').find('.option');
112	}
113	});
114
115	// Option click
116	$(document).on('click.nice_select', '.nice-select .option:not(.disabled)', function(event) {
117	var $option = $(this);
118	var $dropdown = $option.closest('.nice-select');
119
120	$dropdown.find('.selected').removeClass('selected');
121	$option.addClass('selected');
122
123	var text = $option.data('display') \|\| $option.text();
124	$dropdown.find('.current').text(text);
125
126	$dropdown.prev('select').val($option.data('value')).trigger('change');
127	});
128
129	// Keyboard events
130	$(document).on('keydown.nice_select', '.nice-select', function(event) {
131	var $dropdown = $(this);
132	var $focused_option = $($dropdown.find('.focus') \|\| $dropdown.find('.list .option.selected'));
133
134	// Space or Enter
135	if (event.keyCode == 32 \|\| event.keyCode == 13) {
136	if ($dropdown.hasClass('open')) {
137	$focused_option.trigger('click');
138	} else {
139	$dropdown.trigger('click');
140	}
141	return false;
142	// Down
143	} else if (event.keyCode == 40) {
144	if (!$dropdown.hasClass('open')) {
145	$dropdown.trigger('click');
146	} else {
147	var $next = $focused_option.nextAll('.option:not(.disabled)').first();
148	if ($next.length > 0) {
149	$dropdown.find('.focus').removeClass('focus');
150	$next.addClass('focus');
151	}
152	}
153	return false;
154	// Up
155	} else if (event.keyCode == 38) {
156	if (!$dropdown.hasClass('open')) {
157	$dropdown.trigger('click');
158	} else {
159	var $prev = $focused_option.prevAll('.option:not(.disabled)').first();
160	if ($prev.length > 0) {
161	$dropdown.find('.focus').removeClass('focus');
162	$prev.addClass('focus');
163	}
164	}
165	return false;
166	// Esc
167	} else if (event.keyCode == 27) {
168	if ($dropdown.hasClass('open')) {
169	$dropdown.trigger('click');
170	}
171	// Tab
172	} else if (event.keyCode == 9) {
173	if ($dropdown.hasClass('open')) {
174	return false;
175	}
176	}
177	});
178
179	// Detect CSS pointer-events support, for IE <= 10. From Modernizr.
180	var style = document.createElement('a').style;
181	style.cssText = 'pointer-events:auto';
182	if (style.pointerEvents !== 'auto') {
183	$('html').addClass('no-csspointerevents');
184	}
185
186	return this;
187
188	};
189
190	}(jQuery));