This commit is contained in:
Mahdi Dibaiee 2015-07-26 14:27:33 +04:30
parent 10fd1038fc
commit c459136de8
11 changed files with 28 additions and 6 deletions

1
1.html
View File

@ -8,5 +8,6 @@
<div id='results'> <div id='results'>
</div> </div>
<script src='./build/libs/browser-polyfill.min.js'></script>
<script src='./build/trie.js'></script> <script src='./build/trie.js'></script>
<script src='./build/1.js'></script> <script src='./build/1.js'></script>

1
2.html
View File

@ -8,5 +8,6 @@
<div id='results'> <div id='results'>
</div> </div>
<script src='./build/libs/browser-polyfill.min.js'></script>
<script src='./build/trie.js'></script> <script src='./build/trie.js'></script>
<script src='./build/2.js'></script> <script src='./build/2.js'></script>

6
README.md Normal file
View File

@ -0,0 +1,6 @@
Autocomplete using Tries
========================
See blog post: [Autocomplete using Tries](http://dibaiee.ir/autocomplete-predict-trie)
Please note that I'm using the property `name` instead of `value` in this code, because of [D3's Tree Layout](https://github.com/mbostock/d3/wiki/Tree-Layout) format.

View File

@ -39,22 +39,24 @@ for (var category in data) {
var input = document.querySelector('input'); var input = document.querySelector('input');
var results = document.querySelector('#results'); var results = document.querySelector('#results');
input.addEventListener('keyup', function (e) { input.addEventListener('keydown', function (e) {
// Tab Key // Tab Key
if (e.keyCode === 9) { if (e.keyCode === 9) {
e.preventDefault(); e.preventDefault();
var current = trie.find(input.value); var current = trie.find(input.value);
if (!current) return; if (!current.children.length) return;
input.value = current.children[0].name; input.value = current.children[0].name;
} }
});
input.addEventListener('keyup', function () {
results.innerHTML = ''; results.innerHTML = '';
var nodes = trie.findWords(input.value); var nodes = trie.findWords(input.value);
if (!nodes) return; if (!nodes.length) return;
var _iteratorNormalCompletion2 = true; var _iteratorNormalCompletion2 = true;
var _didIteratorError2 = false; var _didIteratorError2 = false;

3
build/libs/browser-polyfill.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -75,6 +75,7 @@ var Trie = (function () {
var parent = arguments.length <= 1 || arguments[1] === undefined ? this.root : arguments[1]; var parent = arguments.length <= 1 || arguments[1] === undefined ? this.root : arguments[1];
var top = this.find(value, parent); var top = this.find(value, parent);
if (!top) return [];
var words = []; var words = [];

View File

@ -103,6 +103,7 @@
<p id='explain-word'></p> <p id='explain-word'></p>
<p id='explain-index'></p> <p id='explain-index'></p>
<script src='../build/libs/browser-polyfill.min.js'></script>
<script src='../build/libs/d3.js'></script> <script src='../build/libs/d3.js'></script>
<script src='../build/trie.js'></script> <script src='../build/trie.js'></script>
<script src='../build/demo/draw.js'></script> <script src='../build/demo/draw.js'></script>

View File

@ -4,6 +4,7 @@
<body> <body>
<script src='../build/libs/browser-polyfill.min.js'></script>
<script src='../build/libs/d3.js'></script> <script src='../build/libs/d3.js'></script>
<script src='../build/trie.js'></script> <script src='../build/trie.js'></script>
<script src='../build/demo/draw.js'></script> <script src='../build/demo/draw.js'></script>

View File

@ -20,22 +20,24 @@ for (let category in data) {
const input = document.querySelector('input'); const input = document.querySelector('input');
const results = document.querySelector('#results'); const results = document.querySelector('#results');
input.addEventListener('keyup', e => { input.addEventListener('keydown', e => {
// Tab Key // Tab Key
if (e.keyCode === 9) { if (e.keyCode === 9) {
e.preventDefault(); e.preventDefault();
const current = trie.find(input.value); const current = trie.find(input.value);
if (!current) return; if (!current.children.length) return;
input.value = current.children[0].name; input.value = current.children[0].name;
} }
});
input.addEventListener('keyup', () => {
results.innerHTML = ''; results.innerHTML = '';
const nodes = trie.findWords(input.value); const nodes = trie.findWords(input.value);
if (!nodes) return; if (!nodes.length) return;
for (let node of nodes) { for (let node of nodes) {
const category = node.category ? `- ${node.category}` : ''; const category = node.category ? `- ${node.category}` : '';

3
src/libs/browser-polyfill.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -39,6 +39,7 @@ class Trie {
findWords(value, parent = this.root) { findWords(value, parent = this.root) {
let top = this.find(value, parent); let top = this.find(value, parent);
if (!top) return [];
let words = []; let words = [];