diff --git a/package.json b/package.json index f45cbd0..ba29e4c 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "A typeahead component for inputs", "main": "index.js", "scripts": { - "start": "budo index.js --serve=dist/suggestions.js --live -d | bistre", + "start": "budo index.js --serve=dist/suggestions.js --live -d", "build": "browserify index.js | uglifyjs -c -m > dist/suggestions.js", "lint": "eslint --no-eslintrc -c .eslintrc index.js src", "docs": "documentation --format=md > API.md", @@ -26,9 +26,8 @@ }, "homepage": "https://github.com/tristen/suggestions#readme", "devDependencies": { - "bistre": "^1.0.1", "browserify": "^12.0.1", - "budo": "^5.1.5", + "budo": "^7.0.2", "documentation": "^3.0.0", "eslint": "^1.7.3", "smokestack": "^3.4.1", @@ -37,6 +36,7 @@ "uglify-js": "^2.5.0" }, "dependencies": { + "fuzzy": "^0.1.1", "xtend": "^4.0.0" } } diff --git a/src/list.js b/src/list.js index 8313021..8fb9047 100644 --- a/src/list.js +++ b/src/list.js @@ -53,7 +53,7 @@ List.prototype.drawItem = function(item, active) { if (active) li.className += ' active'; - a.innerHTML = this.component.highlight(item); + a.innerHTML = item.string; li.appendChild(a); this.element.appendChild(li); diff --git a/src/suggestions.js b/src/suggestions.js index 6443556..f24596d 100644 --- a/src/suggestions.js +++ b/src/suggestions.js @@ -1,6 +1,7 @@ 'use strict'; var extend = require('xtend'); +var fuzzy = require('fuzzy'); var List = require('./list'); var Suggestions = function(el, data, options) { @@ -21,19 +22,19 @@ var Suggestions = function(el, data, options) { this.list.draw(); this.el.addEventListener('keyup', function(e) { - this.handleKeyUp.call(this, e.keyCode); + this.handleKeyUp(e.keyCode); }.bind(this), false); this.el.addEventListener('keydown', function(e) { - this.handleKeyDown.call(this, e); + this.handleKeyDown(e); }.bind(this)); this.el.addEventListener('focus', function() { - this.handleFocus.call(this); + this.handleFocus(); }.bind(this)); this.el.addEventListener('blur', function() { - this.handleBlur.call(this); + this.handleBlur(); }.bind(this)); return this; @@ -75,7 +76,7 @@ Suggestions.prototype.handleKeyDown = function(e) { case 13: // ENTER case 9: // TAB if (!this.list.isEmpty()) { - this.value(this.list.items[this.list.active]); + this.value(this.list.items[this.list.active].original); this.list.hide(); } break; @@ -144,15 +145,14 @@ Suggestions.prototype.value = function(value) { }; Suggestions.prototype.getCandidates = function(callback) { - var items = []; - - for (var i = 0; i < this.data.length; i++) { - var candidate = this.getItemValue(this.data[i]); - if (this.match(this.normalize(candidate), this.query)) { - items.push(this.data[i]); - } - } - callback(items); + var options = { + pre: '', + post: '', + extract: function(d) { return this.getItemValue(d); }.bind(this) + }; + + var results = fuzzy.filter(this.query, this.data, options); + callback(results); }; /** @@ -165,17 +165,4 @@ Suggestions.prototype.getItemValue = function(item) { return item; }; -/** - * Intercept an item from the results list & highlight the portion in the result - * string that matches the query - * - * @param {String} item an item that qualifies as a result from the data array - * @return {String} A formated string (HTML allowed). - */ -Suggestions.prototype.highlight = function(item) { - return this.getItemValue(item).replace(new RegExp(this.query, 'ig'), function($1) { - return '' + $1 + ''; - }); -}; - module.exports = Suggestions; diff --git a/test/test.js b/test/test.js index fdd8ece..08a9d8c 100644 --- a/test/test.js +++ b/test/test.js @@ -17,7 +17,7 @@ test('basics', function(t) { t.equal(suggestionsContainer.style.display, 'none', 'suggestions container is initially hidden'); t.equal(typeahead.data, data, 'data is set'); - input.value = 'bear'; + input.value = 'ear'; var keyUpEvent = document.createEvent('HTMLEvents'); keyUpEvent.initEvent('keyup', true, false);