/**
 * Класс необходим для генерации полей (input, label, checkbox, textarea..)
 * Класс в разработке, используется частично в коде
 */
 
class Field {
    constructor(field){
        this.html = "";
        this.params = field.params;
        this.values = field.values;
        this.group = field.group;
        this.groupActive = field.groupActive;
    }

    render(){

        if(this.params["TYPE"] === "CHECKBOX")
        {
            let isToggleGroup = this.params['TOGGLE_GROUP'] === "Y";

            let checkboxAttrs = {
                type: "checkbox",
                name: this.params['NAME'],
                value: "Y",
            };

            if(this.values[this.params['NAME']] === "Y"){
                checkboxAttrs.checked = "checked";
                this.groupActive = true;
            }

            let input = BX.create("input",{
                attrs: checkboxAttrs,
            });

            let className = this.group + " ";
            className += isToggleGroup ? "toggle-group" : "";

            this.html = BX.create("label", {
                attrs: {
                    className: className,
                    "data-group-id": this.group
                },
               children: [
                   this._getHint(),
                   input
               ]
            }).outerHTML;
        }

        else if(this.params['TYPE'] === "SELECT")
        {
            let selectList = BX.create("select", {
                attrs: {
                    name: this.params['NAME']
                }
            });

            for(let item in this.params['LIST'])
            {
                BX.selectUtils.addNewOption(selectList, item, this.params['LIST'][item]);
            }

            BX.selectUtils.selectOption(selectList, this.values[this.params['NAME']]);
            if(selectList.options[selectList.options.selectedIndex]){
                selectList.options[selectList.options.selectedIndex].setAttribute("selected", true);
            }


            let className = this.group;
            className += (this.groupActive) ? "" : " _disabled";

            this.html = BX.create("label", {
                attrs: {
                    className: className
                },
                children: [
                    this._getHint(),
                    selectList
                ]
            }).outerHTML;
        }


        return this;
    }

    _getHint(){


        let htmlHint =  BX.create("span",{
            children: [
                BX.create("span", {
                    text: this.params['TITLE_BLOCK']
                }),
                BX.create("span", {
                    props: {
                        id: "hint_" + this.params['NAME'],
                        className: "skwb24-item-hint",
                    },
                    text: "?"
                })
            ],
        });

        return htmlHint;
    }

    getHtml(){
        return this.html
    }

}