Autocomplte

As you we see in the designs, when the user starts typing, PhotoQ should show possible tags available that complete what the user typed. This autocomplete feature is useful in a situation like this, where most words are not available tags and many tags are impossible to guess.

On a big production system, autocomplete might be done on the server, using a dedicated database, possibly optimized for speed. We'll just use a file.

• Here is a module, makeTagTable.js, which goes through the database PhotoQ.db, collects all the tags, gets the first two letters of each tag, and organizes them by those first two letters. On my current database, it produces this object tagList.json. It defines a function, makeTagTable(), which takes a callback function as input. The callback function gets this tagTable object as input.
• Modify your server so that it answers a new AJAX query of the form
  http:server162.site:####/query?autocomplete=bu Given such a query, it should return the object from tagList.json with the key "bu", in this case
  {"tags":{"building":215,"Buddha of Bamyan":1,"Burgos Cathedral" :1,"butte":1,"bunker":1}} The numbers indicate how many times that tag appears in the database.
• To access the characters as the user types them into the text input box, in your Javascript code, you can give the input box an "onkeydown" function. This is like an onclick, but for each character typed ("onkeypress" is similar but does not trigger on the backspace key). On the first character, do nothing. On the second, send the AJAX request to get the possible completions from the server, and display them. Optional: On the third, remove any displayed tags that do not have that third character.
• When the user selects one of the autocomplete tags, by clickin on it, move the selected tag under the text box, as shown in Design 3. Repeat as often as the user wants.
• When the user hits the search button, construct and run a tag search AJAX query from the selected tags.
• When you add and delete tags from the database, you should also update the tagTable for autocompletions. Probably the easiest way to do this would be to run "makeTagTable()" again.