javascript_practice/hw10/loginForm.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;
		if(typeof this.onOpenChange === 'function') {
			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);
		}
	});
}

function LoginForm () {

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

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

	createDivider();

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

	createDivider();

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

	const isDisabled = () => {
		button.disabled = (password.getValue() !== '' && input.value !== '') ? false : true;
	}

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

	input.addEventListener('input', () => {
		isDisabled();
	});
}

LoginForm();