import {module} from '../module';
import Input from '../lib/input';
import './style.scss';

export default class Textfield extends Input {
    constructor($element, $scope, $attrs, $timeout, normalizer) {
        super($element);

        normalizer.normalize($attrs);

        this.$scope = $scope;
        this.$attrs = $attrs;
        this.$element = $element;
        this.$timeout = $timeout;

        this._value = null;
        this.type = $attrs.type || 'text';
        this.showActions = false;
        this.input = $element[0].querySelector('input');
        this.hasInfo = Boolean($attrs.info);
        this.info = $attrs.info || null;
        this.hasFocus = false;
        this.hasMouseIn = false;
        componentHandler.upgradeElement($element[0].firstChild);
    }
    get value() {
        return this._value;
    }
    set value(value) {
        this._value = (value === undefined || value === '') ? null : value;
        this.input.value = this._value;
        this.hasValue = Boolean(this._value);
        this.mdlUpdate();
    }
    set tabIndex(value) {
        this.input.tabIndex = value;
    }
    mdlUpdate() {
        let mdlField = this.$element[0].firstChild.MaterialTextfield;
        if (mdlField)
            mdlField.updateClasses_();
    }
    clear() {
        this.value = null;
        this.input.focus();
    }
}
Textfield.$inject = ['$element', '$scope', '$attrs', '$timeout', 'vnInputAttrsNormalizer'];

module.component('vnTextfield', {
    template: require('./textfield.html'),
    controller: Textfield,
    bindings: {
        value: '=model',
        label: '@?',
        name: '@?',
        disabled: '<?',
        readonly: '<?',
        rule: '@?',
        type: '@?',
        tabIndex: '@?'
    }
});