Ext.namespace("Ext.ux.form");
Ext.ux.form.SearchField = Ext.extend( Ext.form.TwinTriggerField,{
	allowBlank			:true,
	trigger1Class		:'x-form-clear-trigger',
	trigger2Class		:'x-form-search-trigger',
    initComponent : function(){
        Ext.ux.form.SearchField.superclass.initComponent.apply(this,arguments);
        this.addEvents({
            keyup			:true,
            search			:true,
            clear			:true
        });
    },
	initTrigger: function(){
		Ext.ux.form.SearchField.superclass.initTrigger.call(this);
		this.getTrigger(0).hide();
		this.getEl().on('keyup', function(e){
			this.fireEvent('keyup', e);
            if( e.getKey() == e.ENTER || e.getKey() == e.RETURN ){
                this.onTrigger2Click();
            }
			this.onKeyUp();
		}, this );
	},
	onKeyUp: function(){
		if( this.getValue().length > 0 ){
			this.getTrigger(0).show();
		}else{
			//this.getTrigger(1).disable();
			this.getTrigger(0).hide();
		}
	},
	onTrigger1Click: function(){
		this.setValue('');
		this.fireEvent('clear',this);
		this.onKeyUp();
		this.focus();
	},
	onRender : function(){
		Ext.ux.form.SearchField.superclass.onRender.apply(this,arguments);
		this.onKeyUp.defer(20,this);
	},
	onTrigger2Click: function(){
		this.fireEvent('search',this);
	},
	initEvents: function(){
		Ext.ux.form.SearchField.superclass.initEvents.call(this);
		this.getEl().on('focus', function(){
			this.getEl().dom.select();
		},this);
	}
});
Ext.reg('searchfield', Ext.ux.form.SearchField  )