/**
 * @file Manage some user interface functionality such search autocomplete
 */

UI = function () {
	UI.superclass.constructor.apply(this, arguments);
    
    var initSearch = function () {
        $("#search-form").submit(function(e){
            _field = $('input[name="field"]', this).val();
            
            if( _field == "Find a list..." || _field == "Search Listiki...") {
                return false;
            }
            return true;
        });
        
        inputToggle('#search-form input.text','Search Listiki...');
        inputToggle('#search-field input','Find a list...');
    }
    
    var inputToggle = function(inputSelect,inputText){
        if ($(inputSelect).val() == inputText) {
                $(inputSelect).css("color","#999");
        } else if ($(inputSelect).val() == "") {
                $(inputSelect).val(inputText);
                $(inputSelect).css("color","#999");
        } else if ($(inputSelect).val() != "" && $(this).val() != inputText) {
                $(inputSelect).css("color","#000");
        }
        $(inputSelect).focus( function() {
            if ($(inputSelect).val() == inputText) {
                $(inputSelect).val("");
                $(inputSelect).css("color","#000");
            }
        });
        $(inputSelect).blur( function() {
            if ($(inputSelect).val() == "") {
                $(inputSelect).css("color","#999");
                $(inputSelect).val(inputText);
            }
        });
    }
    
    var init = function () {
        initSearch();
    }

    this.addListener('ready', init);
    this.addListener('authcomplete', init);
}
extend(UI, Model);