/**
 * Text Field {@link Ext.field.Text#triggers trigger} widget.
 */
Ext.define('Ext.field.trigger.Trigger', {
    extend: 'Ext.field.trigger.Base',
    xtype: 'trigger',
    alias: 'trigger.trigger',
 
    requires: [
        'Ext.util.ClickRepeater'
    ],
 
    config: {
        /**
         * @cfg {Function/String} handler
         * Function to run when trigger is clicked or tapped.
         * @controllable
         */
        handler: null,
 
        /**
         * @cfg iconCls
         * @inheritdoc Ext.Button#cfg-iconCls
         */
        iconCls: null,
 
        /**
         * @cfg {Boolean/Object} repeat
         * `true` to attach a {@link Ext.util.ClickRepeater tap repeater} to the trigger,
         * or a config object for a tap repeater.
         */
        repeat: null,
 
        /**
         * @cfg {Object} scope
         * Execution context for the {@link #handler} function.
         */
        scope: null,
 
        /**
         * @cfg {Boolean} focusOnTap
         * If `true`, the field will be focused upon tap of the trigger.
         *
         * To show the keyboard, tap the input field while it is focused.
         */
        focusOnTap: true
    },
 
    interactiveCls: Ext.baseCSSPrefix + 'interactive',
 
    /**
     * @property template
     * @inheritdoc
     */
    template: [{
        reference: 'iconElement',
        classList: [
            Ext.baseCSSPrefix + 'icon-el',
            Ext.baseCSSPrefix + 'font-icon'
        ]
    }],
 
    constructor: function(config) {
        var me = this,
            repeat;
 
        me.callParent([config]);
 
        repeat = me.getRepeat();
 
        if (repeat) {
            me.repeater = new Ext.util.ClickRepeater(Ext.apply({
                target: me,
                preventDefault: true,
                listeners: {
                    mousedown: 'onClickRepeaterTouchStart',
                    mouseup: 'onClickRepeaterTouchEnd',
                    click: 'onClickRepeaterClick',
                    scope: me
                }
            }, repeat));
        }
        else {
            me.element.on({
                click: 'onClick',
                mousedown: 'onMouseDown',
                scope: me
            });
        }
    },
 
    doDestroy: function() {
        Ext.destroyMembers(this, 'repeater');
        this.callParent();
    },
 
    onClickRepeaterClick: function(clickRepeater, e) {
        this.onClick(e);
    },
 
    onClick: function(e) {
        var me = this,
            handler = !me.getDisabled() && me.getHandler(),
            field = me.getField(),
            disabled = !field || me.getDisabled() || field.getDisabled(),
            focusEl;
 
        if (disabled) {
            return;
        }
 
        if (e.pointerType !== 'mouse') {
            // Do not allow the default focusing behaviour to follow on *after* the
            // hander has run and this event finishes.
            e.preventDefault();
 
            if (me.getFocusOnTap()) {
                focusEl = field.getFocusTrap ? field.getFocusTrap() : field.getFocusEl();
 
                if (focusEl.dom !== document.activeElement) {
                    if (me.isExpandTrigger) {
                        field.focusingFromExpandTrigger = true;
                    }
 
                    field.focus();
                }
            }
        }
 
        if (handler) {
            Ext.callback(handler, me.getScope(), [field, me, e], null, field);
        }
    },
 
    onMouseDown: function(e) {
        var field;
 
        if (e.pointerType === 'mouse') {
            field = this.getFocusOnTap() && this.getField();
 
            // Focus the field on mousedown unless it's disabled. Touch events do it on tap.
            if (field && !field.getDisabled()) {
                field.focus();
            }
 
            e.preventDefault();
        }
    },
 
    onClickRepeaterTouchStart: function(clickRepeater, e) {
        this.onMouseDown(e);
    },
 
    onClickRepeaterTouchEnd: function(clickRepeater, e) {
        var me = this,
            field = me.field;
 
        Ext.callback(me.endHandler, me.scope, [field, me, e], 0, field);
    },
 
    updateHandler: function(handler) {
        this.toggleCls(this.interactiveCls, !!handler);
    },
 
    updateIconCls: function(iconCls, oldIconCls) {
        this.iconElement.replaceCls(oldIconCls, iconCls);
    }
});