GennadySht
/
HomeWork


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
							<header>login_form_constructor</header>

<body>
    <script>
        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.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.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";
        }
        function LoginForm(parent, 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";
            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);
        }

        let loginForm = new LoginForm(document.body, true);
        loginForm.onLogin = function (login, password) {
            console.log(`${login}:${password}`)
        }

    </script>
</body>