var citynames = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    prefetch: {
        url: 'assets/citynames.json',
        filter: function (list) {
            return $.map(list, function (cityname) {
                return {name: cityname};
            });
        }
    }
});
citynames.initialize();

var cities = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    prefetch: 'assets/cities.json'
});
cities.initialize();

/**
 * Typeahead
 */
var elt = $('.example_typeahead > > input');
elt.tagsinput({
    typeaheadjs: {
        name: 'citynames',
        displayKey: 'name',
        valueKey: 'name',
        source: citynames.ttAdapter()
    }
});

/**
 * Objects as tags
 */
elt = $('.example_objects_as_tags > > input');
elt.tagsinput({
    itemValue: 'value',
    itemText: 'text',
    typeaheadjs: {
        name: 'cities',
        displayKey: 'text',
        source: cities.ttAdapter()
    }
});

elt.tagsinput('add', {"value": 1, "text": "Amsterdam", "continent": "Europe"});
elt.tagsinput('add', {"value": 4, "text": "Washington", "continent": "America"});
elt.tagsinput('add', {"value": 7, "text": "Sydney", "continent": "Australia"});
elt.tagsinput('add', {"value": 10, "text": "Beijing", "continent": "Asia"});
elt.tagsinput('add', {"value": 13, "text": "Cairo", "continent": "Africa"});

/**
 * Categorizing tags
 */
elt = $('.example_tagclass > > input');
elt.tagsinput({
    tagClass: function (item) {
        switch (item.continent) {
            case 'Europe'   :
                return 'label label-primary';
            case 'America'  :
                return 'label label-danger label-important';
            case 'Australia':
                return 'label label-success';
            case 'Africa'   :
                return 'label label-default';
            case 'Asia'     :
                return 'label label-warning';
        }
    },
    itemValue: 'value',
    itemText: 'text',
    // typeaheadjs: {
    //   name: 'cities',
    //   displayKey: 'text',
    //   source: cities.ttAdapter()
    // }
    typeaheadjs: [
        {
            hint: true,
            highlight: true,
            minLength: 2
        },
        {
            name: 'cities',
            displayKey: 'text',
            source: cities.ttAdapter()
        }
    ]
});
elt.tagsinput('add', {"value": 1, "text": "Amsterdam", "continent": "Europe"});
elt.tagsinput('add', {"value": 4, "text": "Washington", "continent": "America"});
elt.tagsinput('add', {"value": 7, "text": "Sydney", "continent": "Australia"});
elt.tagsinput('add', {"value": 10, "text": "Beijing", "continent": "Asia"});
elt.tagsinput('add', {"value": 13, "text": "Cairo", "continent": "Africa"});

// HACK: overrule hardcoded display inline-block of typeahead.js
$(".twitter-typeahead").css('display', 'inline');