import Component from '../component';
import {createElement} from '../../utils/elementUtils';
import {FORM_TYPES} from '../../consts';

class FormControl extends Component {
    constructor (parentNode, {
        label,
        id,
        type = FORM_TYPES.TEXT,
        placeholder = '',
        initValue = '',
        className = '',
    } = {}) {
        super('#form-control', parentNode);

        this.label = this.mainNode.querySelector('.form-label');
        this.errorText = this.mainNode.querySelector('.form-text');
        this.input = createElement({
            tagName: this.getInputTagName(type),
            options: {
                className: `form-control ${className}`,
            }
        });
        this.input.placeholder = placeholder;
        this.input.setAttribute('id', id);
        this.input.value = initValue;

        this.label.insertAdjacentElement('afterend', this.input);
        this.label.textContent = label;
        this.label.setAttribute('for', id);
    }

    disabled = (value) => {
        this.input.disabled = value;
    }

    getValue = () => {
        return this.input.value;
    }

    setValue = (value) => {
        this.input.value = value;
    }

    getInputTagName (type) {
        switch (type) {
            case FORM_TYPES.TEXT:
            case FORM_TYPES.PASSWORD:
                return 'input';
            case FORM_TYPES.SELECT:
                return 'select';
            case FORM_TYPES.TEXTAREA:
                return 'textarea';
            default: {
                throw new Error(`Тип формы ${type} не поддерживается`);
            }
        }
    }
}

export default FormControl;