diff --git a/typeahead/typeahead-tests.ts b/typeahead/typeahead-tests.ts index 67fc8d31a3..5ce51629d0 100644 --- a/typeahead/typeahead-tests.ts +++ b/typeahead/typeahead-tests.ts @@ -8,7 +8,7 @@ declare var Hogan: string; // Countries // Prefetches data, stores it in localStorage, and searches it on the client -$('.example-countries .typeahead').typeahead({ +$('.example-countries .typeahead').typeahead(null, { name: 'countries', prefetch: '../data/countries.json', limit: 10 @@ -16,7 +16,7 @@ $('.example-countries .typeahead').typeahead({ // Open Source Projects by Twitter // Defines a custom template and template engine for rendering suggestions -$('.example-twitter-oss .typeahead').typeahead({ +$('.example-twitter-oss .typeahead').typeahead(null, { name: 'twitter-oss', prefetch: '../data/repos.json', template: [ @@ -29,7 +29,7 @@ $('.example-twitter-oss .typeahead').typeahead({ // Arabic Phrases // Hardcoded list showing Right - To - Left(RTL) support -$('.example-arabic .typeahead').typeahead({ +$('.example-arabic .typeahead').typeahead(null, { name: 'arabic', local: [ "الإنجليزية", @@ -47,7 +47,7 @@ $('.example-arabic .typeahead').typeahead({ // NBA and NHL Teams // Two datasets that are prefetched, stored, and searched on the client -$('.example-sports .typeahead').typeahead([ +$('.example-sports .typeahead').typeahead(null, [ { name: 'nba-teams', prefetch: '../data/nba.json', @@ -62,7 +62,7 @@ $('.example-sports .typeahead').typeahead([ // Best Picture Winners // Prefetches some data then relies on remote requests for suggestions when prefetched data is insufficient -$('.example-films .typeahead').typeahead([ +$('.example-films .typeahead').typeahead(null, [ { name: 'best-picture-winners', remote: '../data/films/queries/%QUERY.json', @@ -85,3 +85,50 @@ $('.example-countries .typeahead').typeahead({ prefetch: '../data/countries.json', limit: 10 }); + + +var substringMatcher = function (strs) { + return function findMatches(q, cb) { + var matches, substrRegex; + + // an array that will be populated with substring matches + matches = []; + + // regex used to determine if a string contains the substring `q` + substrRegex = new RegExp(q, 'i'); + + // iterate through the pool of strings and for any string that + // contains the substring `q`, add it to the `matches` array + $.each(strs, function (i, str) { + if (substrRegex.test(str)) { + // the typeahead jQuery plugin expects suggestions to a + // JavaScript object, refer to typeahead docs for more info + matches.push({ value: str }); + } + }); + + cb(matches); + }; +}; + +var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', + 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', + 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', + 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', + 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', + 'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota', + 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', + 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', + 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming' +]; + +$('#the-basics .typeahead').typeahead({ + hint: true, + highlight: true, + minLength: 1 +}, + { + name: 'states', + displayKey: 'value', + source: substringMatcher(states) + }); \ No newline at end of file diff --git a/typeahead/typeahead.d.ts b/typeahead/typeahead.d.ts index f6f387986b..3f4c61b1d1 100644 --- a/typeahead/typeahead.d.ts +++ b/typeahead/typeahead.d.ts @@ -6,21 +6,6 @@ /// interface JQuery { - /** - * Turns an input[type="text"] element into a typeahead. - * - * @constructor - * @param dataset Single dataset - */ - typeahead(dataset: Twitter.Typeahead.Dataset): JQuery; - - /** - * Turns an input[type="text"] element into a typeahead. - * - * @constructor - * @param dataset Array of datasets - */ - typeahead(datasets: Twitter.Typeahead.Dataset[]): JQuery; /** * Destroys previously initialized typeaheads. This entails reverting @@ -57,9 +42,19 @@ interface JQuery { * * @constructor * @param options ('hint' or 'highlight' or 'minLength' all of which are optional) - * @param dataset Array of datasets + * @param datasets Array of datasets */ - typeahead(options: Twitter.Typeahead.Options, dataset: Twitter.Typeahead.Dataset): JQuery; + typeahead(options: Twitter.Typeahead.Options, datasets: Twitter.Typeahead.Dataset[]): JQuery; + + /** + * Accomodates specifying options such as hint and highlight. + * This is in correspondence to the examples mentioned in http://twitter.github.io/typeahead.js/examples/ + * + * @constructor + * @param options ('hint' or 'highlight' or 'minLength' all of which are optional) + * @param datasets One or more datasets passed in as arguments. + */ + typeahead(options: Twitter.Typeahead.Options, ... datasets: Twitter.Typeahead.Dataset[]): JQuery; } declare module Twitter.Typeahead {