Como funciona a comunicação entre arquivos Javascript?
Já há dois arquivos js: 'calcula_imc' e 'cria_nova_tabela'.
Nesta aula eu procurei diferentes formas de validar o paciente. Em todas elas, as funções criadas só funcionavam se todas as funções usadas estivessem no mesmo arquivo. Por fim, fiz como o professor para testar se eu estava deixando algo passar, contudo tanto a função validaPeso(peso)
quanto a função validaAltura(altura)
(ambas no arquivo 'calcula_imc') só eram executadas corretamente na função valida(paciente)
(no arquivo 'cria_nova_tabela') se eu colocasse todas em 'cria_nova_tabela'.
Quando eu não passava validaPeso(peso)
e validaAltura(altura)
para o mesmo arquivo de valida(paciente)
, dava erro.
Segue o arquivo 'calcula_imc':
var titulo = document.querySelector(".titulo");
titulo.textContent = ("Aparecida Nutricionista");
var pacientes = document.querySelectorAll(".paciente");
var paciente;
var tdPeso;
var tdAltura;
var peso;
var altura;
var tdImc;
var calculoImc;
var pesoValido;
var alturaValida;
function calculaImc(peso,altura) {
calculoImc = peso / (altura * altura);
return calculoImc.toFixed(2);
}
function armazenaImc() {
tdPeso = paciente.querySelector(".info-peso");
tdAltura = paciente.querySelector(".info-altura");
peso = tdPeso.textContent;
altura = tdAltura.textContent;
tdImc = paciente.querySelector(".info-imc");
calculaImc(peso,altura);
}
function verificaPesoAltura() {
pesoValido = validaPeso(peso);
alturaValida = validaAltura(altura);
if(!pesoValido) {
tdPeso.textContent = ("Peso inválido!"); //é necessário modificar o textContent diretamente na var do querySelector e não na var peso = tdPeso.textContent
}
if(!alturaValida) {
tdAltura.textContent = ("Altura inválida!"); //é necessário modificar o textContent diretamente na var do querySelector e não na var altura = tdPeso.textContent
}
if(pesoValido && alturaValida) {
var calculoImc = calculaImc(peso,altura);
tdImc.textContent = calculoImc;
}
}
function validaPeso(peso) {
if (peso > 0 && peso < 250) {
return true;
} else {
return false;
}
}
function validaAltura(altura) {
if(altura > 0 && altura < 3.00) {
return true;
} else {
return false;
}
}
function mostraImc() {
for(var i = 0; i < pacientes.length; i++) {
paciente = pacientes[i];
armazenaImc();
verificaPesoAltura();
}
}
mostraImc();
E o 'cria_nova_tabela' :
var botaoAdicionar = document.querySelector(".botao-bto-principal");
botaoAdicionar.addEventListener("click", function (event) {
event.preventDefault();
var form = document.querySelector(".adiciona-info");
var paciente = pegaInfosDoPaciente(form);
var pacienteTr = criaListaDePacienteNovo(paciente);
if(validaPaciente(paciente)) {
var tabela = document.querySelector("#tabela-pacientes");
tabela.appendChild(pacienteTr);
} else {
alert("Peso ou altura inválida. Insira os dados novamente.");
}
form.reset();
});
function pegaInfosDoPaciente (form) {
var paciente = {
nome:form.nome.value, //usa-se o name da tag
peso:form.peso.value,
altura:form.altura.value,
gordura:form.gordura.value,
imc: calculaImc(form.peso.value,form.altura.value)
}
return paciente;
}
function criaListaDePacienteNovo(paciente) {
var pacienteTr = document.createElement("tr");
pacienteTr.classList.add("paciente");
var dado = [paciente.nome,paciente.peso,paciente.altura,paciente.gordura,paciente.imc];
var classe = ["info-nome","info-peso","info-altura","info-gordura","info-imc"];
for (var i = 0; i< dado.length; i++) {
pacienteTr.appendChild(montaTd(dado[i],classe[i]));
}
return pacienteTr; //retorna os elementos de pacienteTr
}
function montaTd(dado,classe) {
var td = document.createElement("td");
td.classList.add(classe);
td.textContent = dado;
return td;
}
/*function validaPeso(peso) {
if (peso > 0 && peso < 250) {
return true;
} else {
return false;
}
}
function validaAltura(altura) {
if(altura > 0 && altura < 3.00) {
return true;
} else {
return false;
}
}*/
function validaPaciente(paciente) {
if(validaPeso(paciente.peso) && validaAltura(paciente.altura)) {
return true;
} else {
return false;
}
}