homeworks_Second_modul/homework13js/script.js

function Password(parent, open){
    this.loginBox = document.createElement("input");
    this.loginBox.setAttribute("type", "text");
    parent.appendChild(this.loginBox)
    this.loginBox.oninput = () =>  {
        this.sendOnChange()
        this.onChange(this.getValue(this.loginBox));
    }

    this.passwordBox = document.createElement("span");
    parent.appendChild(this.passwordBox)

    this.textBox = document.createElement("input");
    this.textBox.setAttribute("type", "password");
    this.passwordBox.appendChild(this.textBox);
    this.textBox.oninput = () => {
        this.onChange(this.getValue(this.textBox));
        this.sendOnChange();
    }


    this.checkPassword = document.createElement("input");
    this.checkPassword.setAttribute("type", "password")
    this.passwordBox.appendChild(this.checkPassword)
    this.checkPassword.oninput = () =>  {
        this.sendOnChange();   
    }

    this.checkBox = document.createElement("input");
    this.checkBox.setAttribute("type", "checkbox");
    parent.appendChild(this.checkBox);
    this.checkBox.onchange = () =>  {
        this.isChecked(this.checkBox, this.textBox)
        this.onOpenChange(this.getOpen())
    };


    this.sendBottom = document.createElement("button");
    this.sendBottom.setAttribute("disabled", true);
    this.sendBottom.innerText = "send";
    this.sendOnChange = function() {
        if(this.textBox.value != "" && this.loginBox.value != "" 
        && this.textBox.value === this.checkPassword.value) {
            return this.sendBottom.removeAttribute("disabled");
        }  return this.sendBottom.setAttribute("disabled", true);
    }  
    parent.appendChild(this.sendBottom)


    this.isChecked = function() {

        if(open === false){
            this.textBox.setAttribute("type", "password") 
            this.checkPassword = document.createElement("input");
            this.checkPassword.setAttribute("type", "password")
            this.passwordBox.appendChild(this.checkPassword)
            this.checkPassword.oninput = () =>  {
                this.sendOnChange();   
            }
            return open = true;
        } else { 

            this.textBox.setAttribute("type", "text")           
            this.checkPassword.remove()
            this.sendBottom.setAttribute("disabled", true);
            return open = false;
        }
    }


    this.getValue = function(arg = this.textBox) {
        return arg.value
    }


    this.setValue = function(inner, box = this.textBox) {
        box.value = inner;
    }


    this.getOpen = function() {
        let str;
        open == true ? str = "closed" : str = "opened";
        return str;
    }

    this.onChange = function(arg) {
        let data = this.getValue(arg);
        return data;
        
    }



    this.setOpen = function(arg) {
        if(!arg == true){
            this.checkBox.checked = "checked"
        } else {
            this.checkBox.checked = ""
        }
        this.isChecked()
        
    }

}

let p = new Password(document.body, true)

p.onChange = data => console.log(data)

p.onOpenChange = open => console.log(open)

p.setValue('qwerty')
console.log(p.getValue())

p.setOpen(false)
console.log(p.getOpen())
p.setValue('login', p.loginBox)