Skip to content
GitLab
Switch branch/tag
Find file BlameHistoryPermalink
bootstrap-typeahead.js 7.80 KiB
1 
/* =============================================================
2 
 * bootstrap-typeahead.js v2.2.2
3 
 * http://twitter.github.com/bootstrap/javascript.html#typeahead
4 
 * =============================================================
5 
 * Copyright 2012 Twitter, Inc.
6 
 *
7 
 * Licensed under the Apache License, Version 2.0 (the "License");
8 
 * you may not use this file except in compliance with the License.
9 
 * You may obtain a copy of the License at
10 
 *
11 
 * http://www.apache.org/licenses/LICENSE-2.0
12 
 *
13 
 * Unless required by applicable law or agreed to in writing, software
14 
 * distributed under the License is distributed on an "AS IS" BASIS,
15 
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 
 * See the License for the specific language governing permissions and
17 
 * limitations under the License.
18 
 * ============================================================ */
19
20
21 
!function($){
22
23 
  "use strict"; // jshint ;_;
24
25
26 
 /* TYPEAHEAD PUBLIC CLASS DEFINITION
27 
  * ================================= */
28
29 
  var Typeahead = function (element, options) {
30 
    this.$element = $(element)
31 
    this.options = $.extend({}, $.fn.typeahead.defaults, options)
32 
    this.matcher = this.options.matcher || this.matcher
33 
    this.sorter = this.options.sorter || this.sorter
34 
    this.highlighter = this.options.highlighter || this.highlighter
35 
    this.updater = this.options.updater || this.updater
36 
    this.source = this.options.source
37 
    this.$menu = $(this.options.menu)
38 
    this.shown = false
39 
    this.listen()
40 
  }
41
42 
  Typeahead.prototype = {
43
44 
    constructor: Typeahead
45
46 
  , select: function () {
47 
      var val = this.$menu.find('.active').attr('data-value')
48 
      this.$element
49 
        .val(this.updater(val))
50 
        .change()
51 
      return this.hide()
52 
    }
53
54 
  , updater: function (item) {
55 
      return item
56 
    }
57
58 
  , show: function () {
59 
      var pos = $.extend({}, this.$element.position(), {
60 
        height: this.$element[0].offsetHeight
61 
      })
62
63 
      this.$menu
64 
        .insertAfter(this.$element)
65 
        .css({
66 
          top: pos.top + pos.height
67 
        , left: pos.left
68 
        })
69 
        .show()
70
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
this.shown = true return this } , hide: function () { this.$menu.hide() this.shown = false return this } , lookup: function (event) { var items this.query = this.$element.val() if (!this.query || this.query.length < this.options.minLength) { return this.shown ? this.hide() : this } items = $.isFunction(this.source) ? this.source(this.query, $.proxy(this.process, this)) : this.source return items ? this.process(items) : this } , process: function (items) { var that = this items = $.grep(items, function (item) { return that.matcher(item) }) items = this.sorter(items) if (!items.length) { return this.shown ? this.hide() : this } return this.render(items.slice(0, this.options.items)).show() } , matcher: function (item) { return ~item.toLowerCase().indexOf(this.query.toLowerCase()) } , sorter: function (items) { var beginswith = [] , caseSensitive = [] , caseInsensitive = [] , item while (item = items.shift()) { if (!item.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(item) else if (~item.indexOf(this.query)) caseSensitive.push(item) else caseInsensitive.push(item) } return beginswith.concat(caseSensitive, caseInsensitive) } , highlighter: function (item) { var query = this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, '\\$&') return item.replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) { return '<strong>' + match + '</strong>' }) } , render: function (items) { var that = this items = $(items).map(function (i, item) {
141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
i = $(that.options.item).attr('data-value', item) i.find('a').html(that.highlighter(item)) return i[0] }) items.first().addClass('active') this.$menu.html(items) return this } , next: function (event) { var active = this.$menu.find('.active').removeClass('active') , next = active.next() if (!next.length) { next = $(this.$menu.find('li')[0]) } next.addClass('active') } , prev: function (event) { var active = this.$menu.find('.active').removeClass('active') , prev = active.prev() if (!prev.length) { prev = this.$menu.find('li').last() } prev.addClass('active') } , listen: function () { this.$element .on('blur', $.proxy(this.blur, this)) .on('keypress', $.proxy(this.keypress, this)) .on('keyup', $.proxy(this.keyup, this)) if (this.eventSupported('keydown')) { this.$element.on('keydown', $.proxy(this.keydown, this)) } this.$menu .on('click', $.proxy(this.click, this)) .on('mouseenter', 'li', $.proxy(this.mouseenter, this)) } , eventSupported: function(eventName) { var isSupported = eventName in this.$element if (!isSupported) { this.$element.setAttribute(eventName, 'return;') isSupported = typeof this.$element[eventName] === 'function' } return isSupported } , move: function (e) { if (!this.shown) return switch(e.keyCode) { case 9: // tab case 13: // enter case 27: // escape e.preventDefault() break case 38: // up arrow e.preventDefault() this.prev() break
211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
case 40: // down arrow e.preventDefault() this.next() break } e.stopPropagation() } , keydown: function (e) { this.suppressKeyPressRepeat = ~$.inArray(e.keyCode, [40,38,9,13,27]) this.move(e) } , keypress: function (e) { if (this.suppressKeyPressRepeat) return this.move(e) } , keyup: function (e) { switch(e.keyCode) { case 40: // down arrow case 38: // up arrow case 16: // shift case 17: // ctrl case 18: // alt break case 9: // tab case 13: // enter if (!this.shown) return this.select() break case 27: // escape if (!this.shown) return this.hide() break default: this.lookup() } e.stopPropagation() e.preventDefault() } , blur: function (e) { var that = this setTimeout(function () { that.hide() }, 150) } , click: function (e) { e.stopPropagation() e.preventDefault() this.select() } , mouseenter: function (e) { this.$menu.find('.active').removeClass('active') $(e.currentTarget).addClass('active') } } /* TYPEAHEAD PLUGIN DEFINITION * =========================== */
281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324
var old = $.fn.typeahead $.fn.typeahead = function (option) { return this.each(function () { var $this = $(this) , data = $this.data('typeahead') , options = typeof option == 'object' && option if (!data) $this.data('typeahead', (data = new Typeahead(this, options))) if (typeof option == 'string') data[option]() }) } $.fn.typeahead.defaults = { source: [] , items: 8 , menu: '<ul class="typeahead dropdown-menu"></ul>' , item: '<li><a href="#"></a></li>' , minLength: 1 } $.fn.typeahead.Constructor = Typeahead /* TYPEAHEAD NO CONFLICT * =================== */ $.fn.typeahead.noConflict = function () { $.fn.typeahead = old return this } /* TYPEAHEAD DATA-API * ================== */ $(document).on('focus.typeahead.data-api', '[data-provide="typeahead"]', function (e) { var $this = $(this) if ($this.data('typeahead')) return e.preventDefault() $this.typeahead($this.data()) }) }(window.jQuery);