| Conditions | 2 |
| Paths | > 20000 |
| Total Lines | 357 |
| Code Lines | 242 |
| Lines | 357 |
| Ratio | 100 % |
| Changes | 1 | ||
| Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | View Code Duplication | /******/ (function(modules) { // webpackBootstrap |
|
| 79 | $(document).ready(function () { |
||
| 80 | |||
| 81 | /* |
||
| 82 | * jQuery accessible and keyboard-enhanced autocomplete list |
||
| 83 | * @version v1.6.0 |
||
| 84 | * Website: https://a11y.nicolas-hoffmann.net/autocomplet-list/ |
||
| 85 | * License MIT: https://github.com/nico3333fr/jquery-accessible-autocomplete-list-aria/blob/master/LICENSE |
||
| 86 | */ |
||
| 87 | // loading combobox ------------------------------------------------------------------------------------------------------------ |
||
| 88 | // init |
||
| 89 | var $js_combobox = $('.js-combobox'), |
||
| 90 | $body = $('body'), |
||
| 91 | |||
| 92 | // default_text_help = 'Use tabulation (or down) key to access and browse suggestions after input. Confirm your choice with enter key, or esc key to close suggestions box.', |
||
| 93 | default_text_help = '', |
||
| 94 | default_class_for_invisible_text = 'invisible', |
||
| 95 | suggestion_single = 'There is ', |
||
| 96 | suggestion_plural = 'There are ', |
||
| 97 | suggestion_word = 'suggestion', |
||
| 98 | suggestion_word_plural = 'suggestions', |
||
| 99 | button_clear_title = 'clear this field', |
||
| 100 | button_clear_text = 'X', |
||
| 101 | case_sensitive = 'no', |
||
| 102 | min_length = 0, |
||
| 103 | limit_number_suggestions = 666, |
||
| 104 | search_option = 'beginning', |
||
| 105 | // or 'containing' |
||
| 106 | see_more_text = 'See more results…', |
||
| 107 | tablo_suggestions = []; |
||
| 108 | |||
| 109 | function do_see_more_option() { |
||
| 110 | var $output_content = $('#js-codeit'); |
||
| 111 | $output_content.html('You have to code a function or a redirection to display more results ;)'); |
||
| 112 | } |
||
| 113 | |||
| 114 | if ($js_combobox.length) { |
||
| 115 | // if there are at least one :) |
||
| 116 | |||
| 117 | // init |
||
| 118 | $js_combobox.each(function (index_combo) { |
||
| 119 | var $this = $(this), |
||
| 120 | $this_id = $this.attr('id'), |
||
| 121 | $label_this = $('label[for="' + $this_id + '"]'), |
||
| 122 | index_lisible = index_combo + 1, |
||
| 123 | options = $this.data(), |
||
| 124 | $combobox_prefix_class = typeof options.comboboxPrefixClass !== 'undefined' ? options.comboboxPrefixClass + '-' : '', |
||
| 125 | $combobox_help_text = typeof options.comboboxHelpText !== 'undefined' ? options.comboboxHelpText : default_text_help, |
||
| 126 | $list_suggestions = $('#' + $this.attr('list')), |
||
| 127 | $combobox_button_title = typeof options.comboboxButtonTitle !== 'undefined' ? options.comboboxButtonTitle : button_clear_title, |
||
| 128 | $combobox_button_text = typeof options.comboboxButtonText !== 'undefined' ? options.comboboxButtonText : button_clear_text, |
||
| 129 | $combobox_case_sensitive = typeof options.comboboxCaseSensitive !== 'undefined' ? options.comboboxCaseSensitive : case_sensitive, |
||
| 130 | tablo_temp_suggestions = []; |
||
| 131 | |||
| 132 | // input |
||
| 133 | $this.attr({ |
||
| 134 | 'data-number': index_lisible, |
||
| 135 | 'autocorrect': 'off', |
||
| 136 | 'autocapitalize': 'off', |
||
| 137 | 'spellcheck': 'false', |
||
| 138 | 'autocomplete': 'off', |
||
| 139 | 'aria-describedby': $combobox_prefix_class + 'help-text' + index_lisible, |
||
| 140 | 'aria-autocomplete': 'list', |
||
| 141 | 'data-lastval': '', |
||
| 142 | 'aria-owns': $combobox_prefix_class + 'suggest_' + index_lisible |
||
| 143 | }); |
||
| 144 | // stock into tables |
||
| 145 | $list_suggestions.find('option').each(function (index_option, index_element) { |
||
| 146 | tablo_temp_suggestions.push(index_element.value); |
||
| 147 | }); |
||
| 148 | if ($combobox_case_sensitive === 'no') { |
||
| 149 | // order case tablo_temp_suggestions |
||
| 150 | tablo_suggestions[index_lisible] = tablo_temp_suggestions.sort(function (a, b) { |
||
| 151 | a = a.toLowerCase(); |
||
| 152 | b = b.toLowerCase(); |
||
| 153 | if (a == b) { |
||
| 154 | return 0; |
||
| 155 | } |
||
| 156 | if (a > b) { |
||
| 157 | return 1; |
||
| 158 | } |
||
| 159 | return -1; |
||
| 160 | }); |
||
| 161 | } else { |
||
| 162 | tablo_suggestions[index_lisible] = tablo_temp_suggestions.sort(); |
||
| 163 | } |
||
| 164 | |||
| 165 | // wrap into a container |
||
| 166 | $this.wrap('<div class="' + $combobox_prefix_class + 'container js-container" data-combobox-prefix-class="' + $combobox_prefix_class + '"></div>'); |
||
| 167 | |||
| 168 | var $combobox_container = $this.parent(); |
||
| 169 | |||
| 170 | // custom datalist/listbox linked to input |
||
| 171 | $combobox_container.append('<div id="' + $combobox_prefix_class + 'suggest_' + index_lisible + '" class="js-suggest ' + $combobox_prefix_class + 'suggestions"><div role="listbox"></div></div>'); |
||
| 172 | $list_suggestions.remove(); |
||
| 173 | |||
| 174 | // status zone |
||
| 175 | // $combobox_container.prepend('<div id="' + $combobox_prefix_class + 'suggestion-text' + index_lisible + '" class="js-suggestion-text ' + $combobox_prefix_class + 'suggestion-text ' + default_class_for_invisible_text + '" aria-live="assertive"></div>'); |
||
| 176 | |||
| 177 | // help text |
||
| 178 | $combobox_container.prepend('<span id="' + $combobox_prefix_class + 'help-text' + index_lisible + '" class="' + $combobox_prefix_class + 'help-text ' + default_class_for_invisible_text + '">' + $combobox_help_text + '</span>'); |
||
| 179 | |||
| 180 | // label id |
||
| 181 | $label_this.attr('id', 'label-id-' + $this_id); |
||
| 182 | |||
| 183 | // button clear |
||
| 184 | $this.after('<button class="js-clear-button ' + $combobox_prefix_class + 'clear-button" aria-label="' + $combobox_button_title + '" title="' + $combobox_button_title + '" aria-describedby="label-id-' + $this_id + '" type="button">' + $combobox_button_text + '</button>'); |
||
| 185 | }); |
||
| 186 | |||
| 187 | // listeners |
||
| 188 | // keydown on field |
||
| 189 | $body.on('keyup', '.js-combobox', function (event) { |
||
| 190 | var $this = $(this), |
||
| 191 | options_combo = $this.data(), |
||
| 192 | $container = $this.parent(), |
||
| 193 | $form = $container.parents('form'), |
||
| 194 | options = $container.data(), |
||
| 195 | $combobox_prefix_class = typeof options.comboboxPrefixClass !== 'undefined' ? options.comboboxPrefixClass : '', |
||
| 196 | // no "-"" because already generated |
||
| 197 | $suggestions = $container.find('.js-suggest div'), |
||
| 198 | |||
| 199 | //$suggestion_list = $suggestions.find('.js-suggestion'), |
||
| 200 | $suggestions_text = $container.find('.js-suggestion-text'), |
||
| 201 | $combobox_suggestion_single = typeof options_combo.suggestionSingle !== 'undefined' ? options_combo.suggestionSingle : suggestion_single, |
||
| 202 | $combobox_suggestion_plural = typeof options_combo.suggestionPlural !== 'undefined' ? options_combo.suggestionPlural : suggestion_plural, |
||
| 203 | $combobox_suggestion_word = typeof options_combo.suggestionWord !== 'undefined' ? options_combo.suggestionWord : suggestion_word, |
||
| 204 | $combobox_suggestion_word_plural = typeof options_combo.suggestionWord !== 'undefined' ? options_combo.suggestionWordPlural : suggestion_word_plural, |
||
| 205 | combobox_min_length = typeof options_combo.comboboxMinLength !== 'undefined' ? Math.abs(options_combo.comboboxMinLength) : min_length, |
||
| 206 | $combobox_case_sensitive = typeof options_combo.comboboxCaseSensitive !== 'undefined' ? options_combo.comboboxCaseSensitive : case_sensitive, |
||
| 207 | combobox_limit_number_suggestions = typeof options_combo.comboboxLimitNumberSuggestions !== 'undefined' ? Math.abs(options_combo.comboboxLimitNumberSuggestions) : limit_number_suggestions, |
||
| 208 | $combobox_search_option = typeof options_combo.comboboxSearchOption !== 'undefined' ? options_combo.comboboxSearchOption : search_option, |
||
| 209 | $combobox_see_more_text = typeof options_combo.comboboxSeeMoreText !== 'undefined' ? options_combo.comboboxSeeMoreText : see_more_text, |
||
| 210 | index_table = $this.attr('data-number'), |
||
| 211 | value_to_search = $this.val(), |
||
| 212 | text_number_suggestions = ''; |
||
| 213 | |||
| 214 | if (event.keyCode === 13) { |
||
| 215 | $form.submit(); |
||
| 216 | } else { |
||
| 217 | |||
| 218 | if (event.keyCode !== 27) { |
||
| 219 | // No Escape |
||
| 220 | |||
| 221 | $this.attr('data-lastval', value_to_search); |
||
| 222 | // search for text suggestion in the array tablo_suggestions[index_table] |
||
| 223 | var size_tablo = tablo_suggestions[index_table].length, |
||
| 224 | i = 0, |
||
| 225 | counter = 0; |
||
| 226 | |||
| 227 | $suggestions.empty(); |
||
| 228 | |||
| 229 | if (value_to_search != '' && value_to_search.length >= combobox_min_length) { |
||
| 230 | while (i < size_tablo) { |
||
| 231 | if (counter < combobox_limit_number_suggestions) { |
||
| 232 | if ($combobox_search_option === 'containing' && ($combobox_case_sensitive === 'yes' && tablo_suggestions[index_table][i].indexOf(value_to_search) >= 0 || $combobox_case_sensitive === 'no' && tablo_suggestions[index_table][i].toUpperCase().indexOf(value_to_search.toUpperCase()) >= 0) || $combobox_search_option === 'beginning' && ($combobox_case_sensitive === 'yes' && tablo_suggestions[index_table][i].substring(0, value_to_search.length) === value_to_search || $combobox_case_sensitive === 'no' && tablo_suggestions[index_table][i].substring(0, value_to_search.length).toUpperCase() === value_to_search.toUpperCase())) { |
||
| 233 | $suggestions.append('<div id="suggestion-' + index_table + '-' + counter + '" class="js-suggestion ' + $combobox_prefix_class + 'suggestion" tabindex="-1" role="option">' + tablo_suggestions[index_table][i] + '</div>'); |
||
| 234 | counter++; |
||
| 235 | } |
||
| 236 | } |
||
| 237 | i++; |
||
| 238 | } |
||
| 239 | if (counter >= combobox_limit_number_suggestions) { |
||
| 240 | $suggestions.append('<div id="suggestion-' + index_table + '-' + counter + '" class="js-suggestion js-seemore ' + $combobox_prefix_class + 'suggestion" tabindex="-1" role="option">' + $combobox_see_more_text + '</div>'); |
||
| 241 | counter++; |
||
| 242 | } |
||
| 243 | // update number of suggestions |
||
| 244 | if (counter > 1) { |
||
| 245 | text_number_suggestions = $combobox_suggestion_plural + counter + ' ' + $combobox_suggestion_word_plural + '.'; |
||
| 246 | } |
||
| 247 | if (counter === 1) { |
||
| 248 | text_number_suggestions = $combobox_suggestion_single + counter + ' ' + $combobox_suggestion_word + '.'; |
||
| 249 | } |
||
| 250 | if (counter === 0) { |
||
| 251 | text_number_suggestions = $combobox_suggestion_single + counter + ' ' + $combobox_suggestion_word + '.'; |
||
| 252 | } |
||
| 253 | if (counter >= 0) { |
||
| 254 | var text_number_suggestions_default = $suggestions_text.text(); |
||
| 255 | if (text_number_suggestions != text_number_suggestions_default) { |
||
| 256 | // @Goestu trick to make it work on all AT |
||
| 257 | var suggestions_to_add = $("<p>").text(text_number_suggestions); |
||
| 258 | $suggestions_text.attr('aria-live', 'polite'); |
||
| 259 | $suggestions_text.empty(); |
||
| 260 | $suggestions_text.append(suggestions_to_add); |
||
| 261 | } |
||
| 262 | } |
||
| 263 | } |
||
| 264 | } |
||
| 265 | } |
||
| 266 | }).on('click', function (event) { |
||
| 267 | var $target = $(event.target), |
||
| 268 | $suggestions_text = $('.js-suggestion-text:not(:empty)'), |
||
| 269 | // if a suggestion text is not empty => suggestion opened somewhere |
||
| 270 | $container = $suggestions_text.parents('.js-container'), |
||
| 271 | $input_text = $container.find('.js-combobox'), |
||
| 272 | $suggestions = $container.find('.js-suggest div'); |
||
| 273 | |||
| 274 | // if click outside => close opened suggestions |
||
| 275 | if (!$target.is('.js-suggestion') && !$target.is('.js-combobox') && $suggestions_text.length) { |
||
| 276 | $input_text.val($input_text.attr('data-lastval')); |
||
| 277 | $suggestions.empty(); |
||
| 278 | $suggestions_text.empty(); |
||
| 279 | } |
||
| 280 | }) |
||
| 281 | // tab + down management for autocomplete (when list of suggestion) |
||
| 282 | .on('keydown', '.js-combobox', function (event) { |
||
| 283 | var $this = $(this), |
||
| 284 | $container = $this.parent(), |
||
| 285 | $input_text = $container.find('.js-combobox'), |
||
| 286 | $suggestions = $container.find('.js-suggest div'), |
||
| 287 | $suggestion_list = $suggestions.find('.js-suggestion'), |
||
| 288 | $suggestions_text = $container.find('.js-suggestion-text'), |
||
| 289 | $autorise_tab_options = typeof $this.attr('data-combobox-notab-options') !== 'undefined' ? false : true, |
||
| 290 | $first_suggestion = $suggestion_list.first(); |
||
| 291 | |||
| 292 | if (!event.shiftKey && event.keyCode == 9 && $autorise_tab_options || event.keyCode == 40) { |
||
| 293 | // tab (if authorised) or bottom |
||
| 294 | // See if there are suggestions, and yes => focus on first one |
||
| 295 | if ($suggestion_list.length) { |
||
| 296 | $input_text.val($first_suggestion.html()); |
||
| 297 | $suggestion_list.first().focus(); |
||
| 298 | event.preventDefault(); |
||
| 299 | } |
||
| 300 | } |
||
| 301 | if (event.keyCode == 27 || $autorise_tab_options === false && event.keyCode == 9) { |
||
| 302 | // esc or (tab/shift tab + notab option) = close |
||
| 303 | $input_text.val($input_text.attr('data-lastval')); |
||
| 304 | $suggestions.empty(); |
||
| 305 | $suggestions_text.empty(); |
||
| 306 | if (event.keyCode == 27) { |
||
| 307 | // Esc prevented only, tab can go :) |
||
| 308 | event.preventDefault(); |
||
| 309 | setTimeout(function () { |
||
| 310 | $input_text.focus(); |
||
| 311 | }, 300); // timeout to avoid problem in suggestions display |
||
| 312 | } |
||
| 313 | } |
||
| 314 | }) |
||
| 315 | // tab + down management in list of suggestions |
||
| 316 | .on('keydown', '.js-suggestion', function (event) { |
||
| 317 | var $this = $(this), |
||
| 318 | $container = $this.parents('.js-container'), |
||
| 319 | $input_text = $container.find('.js-combobox'), |
||
| 320 | $autorise_tab_options = typeof $input_text.attr('data-combobox-notab-options') !== 'undefined' ? false : true, |
||
| 321 | $suggestions = $container.find('.js-suggest div'), |
||
| 322 | $suggestions_text = $container.find('.js-suggestion-text'), |
||
| 323 | $next_suggestion = $this.next(), |
||
| 324 | $previous_suggestion = $this.prev(); |
||
| 325 | |||
| 326 | if (event.keyCode == 27 || $autorise_tab_options === false && event.keyCode == 9) { |
||
| 327 | // esc or (tab/shift tab + notab option) = close |
||
| 328 | if (event.keyCode == 27) { |
||
| 329 | // Esc prevented only, tab can go :) |
||
| 330 | $input_text.val($input_text.attr('data-lastval')); |
||
| 331 | $suggestions.empty(); |
||
| 332 | $suggestions_text.empty(); |
||
| 333 | setTimeout(function () { |
||
| 334 | $input_text.focus(); |
||
| 335 | }, 300); // timeout to avoid problem in suggestions display |
||
| 336 | event.preventDefault(); |
||
| 337 | } |
||
| 338 | if ($autorise_tab_options === false && event.keyCode == 9) { |
||
| 339 | $suggestions.empty(); |
||
| 340 | $suggestions_text.empty(); |
||
| 341 | $input_text.focus(); |
||
| 342 | } |
||
| 343 | } |
||
| 344 | if (event.keyCode == 13 || event.keyCode == 32) { |
||
| 345 | // Enter or space |
||
| 346 | if ($this.hasClass('js-seemore')) { |
||
| 347 | $input_text.val($input_text.attr('data-lastval')); |
||
| 348 | $suggestions.empty(); |
||
| 349 | $suggestions_text.empty(); |
||
| 350 | setTimeout(function () { |
||
| 351 | $input_text.focus(); |
||
| 352 | }, 300); // timeout to avoid problem in suggestions display |
||
| 353 | // go define the function you need when we click the see_more option |
||
| 354 | setTimeout(function () { |
||
| 355 | do_see_more_option(); |
||
| 356 | }, 301); // timeout to avoid problem in suggestions display |
||
| 357 | event.preventDefault(); |
||
| 358 | } else { |
||
| 359 | $input_text.val($this.html()); |
||
| 360 | $input_text.attr('data-lastval', $this.html()); |
||
| 361 | $suggestions.empty(); |
||
| 362 | $suggestions_text.empty(); |
||
| 363 | setTimeout(function () { |
||
| 364 | $input_text.focus(); |
||
| 365 | }, 300); // timeout to avoid problem in suggestions display |
||
| 366 | event.preventDefault(); |
||
| 367 | } |
||
| 368 | } |
||
| 369 | if (!event.shiftKey && event.keyCode == 9 && $autorise_tab_options || event.keyCode == 40) { |
||
| 370 | // tab (if authorised) or bottom |
||
| 371 | if ($next_suggestion.length) { |
||
| 372 | $input_text.val($next_suggestion.html()); |
||
| 373 | $next_suggestion.focus(); |
||
| 374 | } else { |
||
| 375 | $input_text.val($input_text.attr('data-lastval')); |
||
| 376 | if (!event.shiftKey && event.keyCode == 9) { |
||
| 377 | // tab closes the list |
||
| 378 | var e = jQuery.Event("keydown"); |
||
| 379 | e.which = 27; // # Some key code value |
||
| 380 | e.keyCode = 27; |
||
| 381 | $this.trigger(e); |
||
| 382 | } else { |
||
| 383 | setTimeout(function () { |
||
| 384 | $input_text.focus(); |
||
| 385 | }, 300); |
||
| 386 | } // timeout to avoid problem in suggestions display |
||
| 387 | } |
||
| 388 | event.preventDefault(); |
||
| 389 | } |
||
| 390 | |||
| 391 | if (event.shiftKey && event.keyCode == 9 && $autorise_tab_options || event.keyCode == 38) { |
||
| 392 | // top or Maj+tab (if authorised) |
||
| 393 | if ($previous_suggestion.length) { |
||
| 394 | $input_text.val($previous_suggestion.html()); |
||
| 395 | $previous_suggestion.focus(); |
||
| 396 | } else { |
||
| 397 | $input_text.val($input_text.attr('data-lastval')).focus(); |
||
| 398 | } |
||
| 399 | event.preventDefault(); |
||
| 400 | } |
||
| 401 | }) |
||
| 402 | // clear button |
||
| 403 | .on('click', '.js-clear-button', function () { |
||
| 404 | var $this = $(this), |
||
| 405 | $container = $this.parent(), |
||
| 406 | $input_text = $container.find('.js-combobox'), |
||
| 407 | $suggestions = $container.find('.js-suggest div'), |
||
| 408 | $suggestions_text = $container.find('.js-suggestion-text'); |
||
| 409 | |||
| 410 | $suggestions.empty(); |
||
| 411 | $suggestions_text.empty(); |
||
| 412 | $input_text.val(''); |
||
| 413 | $input_text.attr('data-lastval', ''); |
||
| 414 | }).on('click', '.js-suggestion', function () { |
||
| 415 | var $this = $(this), |
||
| 416 | value = $this.html(), |
||
| 417 | $container = $this.parents('.js-container'), |
||
| 418 | $input_text = $container.find('.js-combobox'), |
||
| 419 | $suggestions = $container.find('.js-suggest div'), |
||
| 420 | $suggestions_text = $container.find('.js-suggestion-text'); |
||
| 421 | |||
| 422 | if ($this.hasClass('js-seemore')) { |
||
| 423 | $suggestions.empty(); |
||
| 424 | $suggestions_text.empty(); |
||
| 425 | $input_text.focus(); |
||
| 426 | // go define the function you need when we click the see_more option |
||
| 427 | do_see_more_option(); |
||
| 428 | } else { |
||
| 429 | $input_text.val(value).focus(); |
||
| 430 | $suggestions.empty(); |
||
| 431 | $suggestions_text.empty(); |
||
| 432 | } |
||
| 433 | }); |
||
| 434 | } |
||
| 435 | }); |
||
| 436 | |||
| 439 | /******/ }); |