/**
 * @private
 */
Ext.define('Ext.slider.Toggle', {
    extend: 'Ext.slider.Slider',
 
    config: {
        /**
         * @cfg
         * @inheritdoc
         */
        baseCls: 'x-toggle',
 
        /**
         * @cfg {String} minValueCls CSS class added to the field when toggled to its minValue
         * @accessor
         */
        minValueCls: 'x-toggle-off',
 
        /**
         * @cfg {String} maxValueCls CSS class added to the field when toggled to its maxValue
         * @accessor
         */
        maxValueCls: 'x-toggle-on'
    },
 
    initialize: function() {
        this.callParent();
 
        this.on({
            change: 'onChange'
        });
    },
 
    applyMinValue: function() {
        return 0;
    },
 
    applyMaxValue: function() {
        return 1;
    },
 
    applyIncrement: function() {
        return 1;
    },
 
    updateMinValueCls: function(newCls, oldCls) {
        var element = this.element;
 
        if (oldCls && element.hasCls(oldCls)) {
            element.replaceCls(oldCls, newCls);
        }
    },
 
    updateMaxValueCls: function(newCls, oldCls) {
        var element = this.element;
 
        if (oldCls && element.hasCls(oldCls)) {
            element.replaceCls(oldCls, newCls);
        }
    },
 
    setValue: function(newValue, oldValue) {
        this.callParent(arguments);
        this.onChange(this, this.getThumbs()[0], newValue, oldValue);
    },
 
    setIndexValue: function(index, value, animation) {
        var oldValue = this.getValue()[index];
        this.callParent(arguments);
 
        var thumb = this.getThumb(index),
            newValue = this.getValue()[index];
 
        if (oldValue !== newValue) {
            this.fireEvent('change', this, thumb, newValue, oldValue);
        }
    },
 
    onChange: function(me, thumb, newValue, oldValue) {
        var isOn = newValue > 0,
            onCls = me.getMaxValueCls(),
            offCls = me.getMinValueCls(),
            element = this.element;
 
        element.addCls(isOn ? onCls : offCls);
        element.removeCls(isOn ? offCls : onCls);
    },
 
    toggle: function() {
        var value = this.getValue();
        this.setValue((value == 1) ? 0 : 1);
 
        return this;
    },
 
    onTap: function() {
        if (this.isDisabled() || this.getReadOnly()) {
            return;
        }
 
        var oldValue = this.getValue(),
            newValue = (oldValue == 1) ? 0 : 1,
            thumb = this.getThumb(0);
 
        this.setIndexValue(0, newValue, this.getAnimation());
        this.refreshThumbConstraints(thumb);
    }
});