HomeWork/js/Module/login.js

function LoginForm(parent, open) {
    function Login(parent) {
        this.input = document.createElement("input");
        parent.append(this.input);
        this.setValue = function (value) {
            this.input.value = value;
        }
        this.getValue = function () {
            return this.input.value;
        }
        this.input.oninput = this.input.onchange = function () {
            if (this.onChange)
                this.onChange(this.getValue());
        }.bind(this);
    }
    function Password(parent, open) {
        this.input = document.createElement("input");
        parent.append(this.input);
        this.setValue = function (value) {
            this.input.value = value;
        }
        this.getValue = function () {
            return this.input.value;
        }
        this.input.oninput = this.input.onchange = function () {
            if (this.onChange)
                this.onChange(this.getValue());
        }.bind(this);


        this.setOpen = function (open) {
            this.input.type = open ? "text" : "password";
        }
        this.getOpen = function () {
            return this.input.type == "text";
        }
        let check = document.createElement("input");
        parent.append(check);
        check.onchange = function () {
            this.setOpen(check.checked);
            if (this.onOpenChange)
                this.onOpenChange(this.getOpen());
        }.bind(this);

        check.checked = open;
        check.value = "open";
        check.type = "checkbox";
        this.setOpen(open);
    }

    let form = document.createElement("form");
    parent.append(form);
    this.login = new Login(form);
    this.password = new Password(form, open);
    this.button = document.createElement("button");
    this.button.innerText = "OK";
    this.button.classList.add('btn');
    this.button.classList.add('ref-button');
    form.append(this.button);

    let setButtonStateCallback = function setButtonState() {
        this.button.disabled = !this.login.getValue() || !this.password.getValue();
    }.bind(this);
    this.login.onChange = setButtonStateCallback;
    this.password.onChange = setButtonStateCallback;
    this.button.disabled = true;
    this.button.onclick = function () {
        if (this.onLogin)
            this.onLogin(this.login.getValue(), this.password.getValue());
    }.bind(this);
}

function loginPromise(parent) {
    function executor(fulfill, reject) {
        const form = new LoginForm(parent);
        form.onLogin = (login, password) => {
            fulfill({ 'login': login, 'password': password })
        }
    }
    return new Promise(executor);
}
/*loginPromise(document.body)
   .then(({ login, password }) => console.log(`Вы ввели ${login} и ${password}`));*/