vendor: 9,999 bytes, lines 1-403
1/** 2 * Simple, lightweight, usable local autocomplete library for modern browsers 3 * Because there werenât enough autocomplete scripts in the world? Because Iâm completely insane and have NIH syndrome? Probably both. :P 4 * @author Lea Verou http://leaverou.github.io/awesomplete 5 * MIT license 6 */ 7 8(function () { 9 10var _ = function (input, o) { 11 var me = this; 12 13 // Keep track of number of instances for unique IDs 14 _.count = (_.count || 0) + 1; 15 this.count = _.count; 16 17 // Setup 18 19 this.isOpened = false; 20 21 this.input = $(input); 22 this.input.setAttribute("autocomplete", "off"); 23 this.input.setAttribute("aria-owns", "awesomplete_list_" + this.count); 24 this.input.setAttribute("role", "combobox"); 25 26 // store constructor options in case we need to distinguish 27 // between default and customized behavior later on 28 this.options = o = o || {}; 29 30 configure(this, { 31 minChars: 2, 32 maxItems: 10, 33 autoFirst: false, 34 data: _.DATA, 35 filter: _.FILTER_CONTAINS, 36 sort: o.sort === false ? false : _.SORT_BYLENGTH, 37 container: _.CONTAINER, 38 item: _.ITEM, 39 replace: _.REPLACE, 40 tabSelect: false 41 }, o); 42 43 this.index = -1; 44 45 // Create necessary elements 46 47 this.container = this.container(input); 48 49 this.ul = $.create("ul", { 50 hidden: "hidden", 51 role: "listbox", 52 id: "awesomplete_list_" + this.count, 53 inside: this.container 54 }); 55 56 this.status = $.create("span", { 57 className: "visually-hidden", 58 role: "status", 59 "aria-live": "assertive", 60 "aria-atomic": true, 61 inside: this.container, 62 textContent: this.minChars != 0 ? ("Type " + this.minChars + " or more characters for results.") : "Begin typing for results." 63 }); 64 65 // Bind events 66 67 this._events = { 68 input: { 69 "input": this.evaluate.bind(this), 70 "blur": this.close.bind(this, { reason: "blur" }), 71 "keydown": function(evt) { 72 var c = evt.keyCode; 73 74 // If the dropdown `ul` is in view, then act on keydown for the following keys: 75 // Enter / Esc / Up / Down 76 if(me.opened) { 77 if (c === 13 && me.selected) { // Enter 78 evt.preventDefault(); 79 me.select(); 80 } 81 else if (c === 9 && me.selected && me.tabSelect) { 82 me.select(); 83 } 84 else if (c === 27) { // Esc 85 me.close({ reason: "esc" }); 86 } 87 else if (c === 38 || c === 40) { // Down/Up arrow 88 evt.preventDefault(); 89 me[c === 38? "previous" : "next"](); 90 } 91 } 92 } 93 }, 94 form: { 95 "submit": this.close.bind(this, { reason: "submit" }) 96 }, 97 ul: { 98 // Prevent the default mousedowm, which ensures the input is not blurred. 99 // The actual selection will happen on click. This also ensures dragging the 100 // cursor away from the list item will cancel the selection 101 "mousedown": function(evt) { 102 evt.preventDefault(); 103 }, 104 // The click event is fired even if the corresponding mousedown event has called preventDefault 105 "click": function(evt) { 106 var li = evt.target; 107 108 if (li !== this) { 109 110 while (li && !/li/i.test(li.nodeName)) { 111 li = li.parentNode; 112 } 113 114 if (li && evt.button === 0) { // Only select on left click 115 evt.preventDefault(); 116 me.select(li, evt.target); 117 } 118 } 119 } 120 } 121 }; 122 123 $.bind(this.input, this._events.input); 124 $.bind(this.input.form, this._events.form); 125 $.bind(this.ul, this._events.ul); 126 127 if (this.input.hasAttribute("list")) { 128 this.list = "#" + this.input.getAttribute("list"); 129 this.input.removeAttribute("list"); 130 } 131 else { 132 this.list = this.input.getAttribute("data-list") || o.list || []; 133 } 134 135 _.all.push(this); 136}; 137 138_.prototype = { 139 set list(list) { 140 if (Array.isArray(list)) { 141 this._list = list; 142 } 143 else if (typeof list === "string" && list.indexOf(",") > -1) { 144 this._list = list.split(/\s*,\s*/); 145 } 146 else { // Element or CSS selector 147 list = $(list); 148 149 if (list && list.children) { 150 var items = []; 151 slice.apply(list.children).forEach(function (el) { 152 if (!el.disabled) { 153 var text = el.textContent.trim(); 154 var value = el.value || text; 155 var label = el.label || text; 156 if (value !== "") { 157 items.push({ label: label, value: value }); 158 } 159 } 160 }); 161 this._list = items; 162 } 163 } 164 165 if (document.activeElement === this.input) { 166 this.evaluate(); 167 } 168 }, 169 170 get selected() { 171 return this.index > -1; 172 }, 173 174 get opened() { 175 return this.isOpened; 176 }, 177 178 close: function (o) { 179 if (!this.opened) { 180 return; 181 } 182 183 this.ul.setAttribute("hidden", ""); 184 this.isOpened = false; 185 this.index = -1; 186 187 this.status.setAttribute("hidden", ""); 188 189 $.fire(this.input, "awesomplete-close", o || {}); 190 }, 191 192 open: function () { 193 this.ul.removeAttribute("hidden"); 194 this.isOpened = true; 195 196 this.status.removeAttribute("hidden"); 197 198 if (this.autoFirst && this.index === -1) { 199 this.goto(0); 200 } 201 202 $.fire(this.input, "awesomplete-open"); 203 }, 204 205 destroy: function() { 206 //remove events from the input and its form 207 $.unbind(this.input, this._events.input); 208 $.unbind(this.input.form, this._events.form); 209 210 // cleanup container if it was created by Awesomplete but leave it alone otherwise 211 if (!this.options.container) { 212 //move the input out of the awesomplete container and remove the container and its children 213 var parentNode = this.container.parentNode; 214 215 parentNode.insertBefore(this.input, this.container); 216 parentNode.removeChild(this.container); 217 } 218 219 //remove autocomplete and aria-autocomplete attributes 220 this.input.removeAttribute("autocomplete"); 221 this.input.removeAttribute("aria-autocomplete"); 222 223 //remove this awesomeplete instance from the global array of instances 224 var indexOfAwesomplete = _.all.indexOf(this); 225 226 if (indexOfAwesomplete !== -1) { 227 _.all.splice(indexOfAwesomplete, 1); 228 } 229 }, 230 231 next: function () { 232 var count = this.ul.children.length; 233 this.goto(this.index < count - 1 ? this.index + 1 : (count ? 0 : -1) ); 234 }, 235 236 previous: function () { 237 var count = this.ul.children.length; 238 var pos = this.index - 1; 239 240 this.goto(this.selected && pos !== -1 ? pos : count - 1); 241 }, 242 243 // Should not be used, highlights specific item without any checks! 244 goto: function (i) { 245 var lis = this.ul.children; 246 247 if (this.selected) { 248 lis[this.index].setAttribute("aria-selected", "false"); 249 } 250 251 this.index = i; 252 253 if (i > -1 && lis.length > 0) { 254 lis[i].setAttribute("aria-selected", "true"); 255 256 this.status.textContent = lis[i].textContent + ", list item " + (i + 1) + " of " + lis.length; 257 258 this.input.setAttribute("aria-activedescendant", this.ul.id + "_item_" + this.index); 259 260 // scroll to highlighted element in case parent's height is fixed 261 this.ul.scrollTop = lis[i].offsetTop - this.ul.clientHeight + lis[i].clientHeight; 262 263 $.fire(this.input, "awesomplete-highlight", { 264 text: this.suggestions[this.index] 265 }); 266 } 267 }, 268 269 select: function (selected, origin) { 270 if (selected) { 271 this.index = $.siblingIndex(selected); 272 } else { 273 selected = this.ul.children[this.index]; 274 } 275 276 if (selected) { 277 var suggestion = this.suggestions[this.index]; 278 279 var allowed = $.fire(this.input, "awesomplete-select", { 280 text: suggestion, 281 origin: origin || selected 282 }); 283 284 if (allowed) { 285 this.replace(suggestion); 286 this.close({ reason: "select" }); 287 $.fire(this.input, "awesomplete-selectcomplete", { 288 text: suggestion 289 }); 290 } 291 } 292 }, 293 294 evaluate: function() { 295 var me = this; 296 var value = this.input.value; 297 298 if (value.length >= this.minChars && this._list && this._list.length > 0) { 299 this.index = -1; 300 // Populate list with options that match 301 this.ul.innerHTML = ""; 302 303 this.suggestions = this._list 304 .map(function(item) { 305 return new Suggestion(me.data(item, value)); 306 }) 307 .filter(function(item) { 308 return me.filter(item, value); 309 }); 310 311 if (this.sort !== false) { 312 this.suggestions = this.suggestions.sort(this.sort); 313 } 314 315 this.suggestions = this.suggestions.slice(0, this.maxItems); 316 317 this.suggestions.forEach(function(text, index) { 318 me.ul.appendChild(me.item(text, value, index)); 319 }); 320 321 if (this.ul.children.length === 0) { 322 323 this.status.textContent = "No results found"; 324 325 this.close({ reason: "nomatches" }); 326 327 } else { 328 this.open(); 329 330 this.status.textContent = this.ul.children.length + " results found"; 331 } 332 } 333 else { 334 this.close({ reason: "nomatches" }); 335 336 this.status.textContent = "No results found"; 337 } 338 } 339}; 340 341// Static methods/properties 342 343_.all = []; 344 345_.FILTER_CONTAINS = function (text, input) { 346 return RegExp($.regExpEscape(input.trim()), "i").test(text); 347}; 348 349_.FILTER_STARTSWITH = function (text, input) { 350 return RegExp("^" + $.regExpEscape(input.trim()), "i").test(text); 351}; 352 353_.SORT_BYLENGTH = function (a, b) { 354 if (a.length !== b.length) { 355 return a.length - b.length; 356 } 357 358 return a < b? -1 : 1; 359}; 360 361_.CONTAINER = function (input) { 362 return $.create("div", { 363 className: "awesomplete", 364 around: input 365 }); 366} 367 368_.ITEM = function (text, input, item_id) { 369 var html = input.trim() === "" ? text : text.replace(RegExp($.regExpEscape(input.trim()), "gi"), "<mark>$&</mark>"); 370 return $.create("li", { 371 innerHTML: html, 372 "aria-selected": "false", 373 "id": "awesomplete_list_" + this.count + "_item_" + item_id 374 }); 375}; 376 377_.REPLACE = function (text) { 378 this.input.value = text.value; 379}; 380 381_.DATA = function (item/*, input*/) { return item; }; 382 383// Private functions 384 385function Suggestion(data) { 386 var o = Array.isArray(data) 387 ? { label: data[0], value: data[1] } 388 : typeof data === "object" && "label" in data && "value" in data ? data : { label: data, value: data }; 389 390 this.label = o.label || o.value; 391 this.value = o.value; 392} 393Object.defineProperty(Suggestion.prototype = Object.create(String.prototype), "length", { 394 get: function() { return this.label.length; } 395}); 396Suggestion.prototype.toString = Suggestion.prototype.valueOf = function () { 397 return "" + this.label; 398}; 399 400function configure(instance, properties, o) { 401 for (var i in properties) { 402 var initial = properties[i], 403
vendor: 2,766 bytes, lines 403-546
403attrValue = instance.input.getAttribute("data-" + i.toLowerCase()); 404 405 if (typeof initial === "number") { 406 instance[i] = parseInt(attrValue); 407 } 408 else if (initial === false) { // Boolean options must be false by default anyway 409 instance[i] = attrValue !== null; 410 } 411 else if (initial instanceof Function) { 412 instance[i] = null; 413 } 414 else { 415 instance[i] = attrValue; 416 } 417 418 if (!instance[i] && instance[i] !== 0) { 419 instance[i] = (i in o)? o[i] : initial; 420 } 421 } 422} 423 424// Helpers 425 426var slice = Array.prototype.slice; 427 428function $(expr, con) { 429 return typeof expr === "string"? (con || document).querySelector(expr) : expr || null; 430} 431 432function $$(expr, con) { 433 return slice.call((con || document).querySelectorAll(expr)); 434} 435 436$.create = function(tag, o) { 437 var element = document.createElement(tag); 438 439 for (var i in o) { 440 var val = o[i]; 441 442 if (i === "inside") { 443 $(val).appendChild(element); 444 } 445 else if (i === "around") { 446 var ref = $(val); 447 ref.parentNode.insertBefore(element, ref); 448 element.appendChild(ref); 449 450 if (ref.getAttribute("autofocus") != null) { 451 ref.focus(); 452 } 453 } 454 else if (i in element) { 455 element[i] = val; 456 } 457 else { 458 element.setAttribute(i, val); 459 } 460 } 461 462 return element; 463}; 464 465$.bind = function(element, o) { 466 if (element) { 467 for (var event in o) { 468 var callback = o[event]; 469 470 event.split(/\s+/).forEach(function (event) { 471 element.addEventListener(event, callback); 472 }); 473 } 474 } 475}; 476 477$.unbind = function(element, o) { 478 if (element) { 479 for (var event in o) { 480 var callback = o[event]; 481 482 event.split(/\s+/).forEach(function(event) { 483 element.removeEventListener(event, callback); 484 }); 485 } 486 } 487}; 488 489$.fire = function(target, type, properties) { 490 var evt = document.createEvent("HTMLEvents"); 491 492 evt.initEvent(type, true, true ); 493 494 for (var j in properties) { 495 evt[j] = properties[j]; 496 } 497 498 return target.dispatchEvent(evt); 499}; 500 501$.regExpEscape = function (s) { 502 return s.replace(/[-\\^$*+?.()|[\]{}]/g, "\\$&"); 503}; 504 505$.siblingIndex = function (el) { 506 /* eslint-disable no-cond-assign */ 507 for (var i = 0; el = el.previousElementSibling; i++); 508 return i; 509}; 510 511// Initialization 512 513function init() { 514 $$("input.awesomplete").forEach(function (input) { 515 new _(input); 516 }); 517} 518 519// Make sure to export Awesomplete on self when in a browser 520if (typeof self !== "undefined") { 521 self.Awesomplete = _; 522} 523 524// Are we in a browser? Check for Document constructor 525if (typeof Document !== "undefined") { 526 // DOM already loaded? 527 if (document.readyState !== "loading") { 528 init(); 529 } 530 else { 531 // Wait for it 532 document.addEventListener("DOMContentLoaded", init); 533 } 534} 535 536_.$ = $; 537_.$$ = $$; 538 539// Expose Awesomplete as a CJS module 540if (typeof module === "object" && module.exports) { 541 module.exports = _; 542} 543 544return _; 545 546}());
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.