javascript_practice/hw10/loginFormConstructor.js

function Password(parent, open) {

	const input = document.createElement('input');
	input.type = 'password';
	parent.appendChild(input);

	const button = document.createElement('button');
	button.type = 'button';
	button.textContent = 'показать';
	parent.appendChild(button);

	button.addEventListener('click', () => {
		this.setOpen(open !== true);
	});

	this.setValue = newValue => input.value = newValue;

	this.getValue = () => input.value;

	this.setOpen = openUpdate => {
		open = openUpdate;
		this.onOpenChange(openUpdate);
		button.textContent = (openUpdate) ? 'показать' : 'скрыть';
		input.type = (openUpdate) ? 'password' : 'text';
	}

	this.getOpen = () => open;

	input.addEventListener('input', event => {
		if (typeof this.onChange === 'function'){
			this.onChange(event.target.value);
		}
	});

	this.onOpenChange = isOpen => isOpen;
}

function LoginForm (parent) {

	this.createDivider = () => document.body.appendChild(document.createElement('br'));

	const input = document.createElement('input');
	input.type = 'text';
	input.classList.add('form-text');
	parent.appendChild(input);

	const button = document.createElement('button');
	button.type = 'button';
	button.classList.add('login-button');
	button.textContent = 'Логин';
	button.disabled = true;

	input.addEventListener('input', event => {
		if (typeof this.onChange === 'function'){
			this.onChange(event.target.value);
		}
	});

	this.getValue = () => input.value;

	this.addButton = () => parent.appendChild(button);
}

const loginForm = new LoginForm(document.body);

loginForm.createDivider();

const password = new Password(document.body, true);

loginForm.createDivider();

loginForm.addButton();

const isDisabled = () => {
	document.querySelector('.login-button').disabled = (password.getValue() !== '' && loginForm.getValue() !== '') ? false : true;
}

password.onChange = () => {
	isDisabled();
}

loginForm.onChange = () => {
	isDisabled();
}