From c469252e260f92b7487d33d55823e9a2f8bb843b Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Sat, 1 Feb 2020 19:37:34 -0300 Subject: [PATCH 01/17] Agrega calculadora de edades --- tareas/clase-6/funciones.js | 52 +++++++++++++++++++++++++++++++++ tareas/clase-6/index.html | 40 +++++++++++++++++++++++++ tareas/clase-6/main.css | 13 +++++++++ tareas/clase-6/tarea-clase-6.js | 47 +++++++++++++++++++++++++++-- 4 files changed, 150 insertions(+), 2 deletions(-) create mode 100644 tareas/clase-6/funciones.js create mode 100644 tareas/clase-6/main.css diff --git a/tareas/clase-6/funciones.js b/tareas/clase-6/funciones.js new file mode 100644 index 00000000..2485de30 --- /dev/null +++ b/tareas/clase-6/funciones.js @@ -0,0 +1,52 @@ +function crearUsuario(cantidadIntegrantes) { + + for (let i = 0; i < cantidadIntegrantes; i++) { + + const $integrantes = document.querySelector('#integrantes'); + + const $label = document.createElement('label'); + const textoLabel = (document.createTextNode('Edad del integrante # ' + (i + 1))); + $label.appendChild(textoLabel); + + const $input = document.createElement('input'); //Creo el tag input + $input.type = "number"; + $input.className = "Edades" + + $integrantes.appendChild($label); + $integrantes.appendChild($input); //Al elemento "$integrantes" le agrego el elemento hijo "$input" + + } + +} +function mayorEdad() { + let maxEdad = 0; + let edades = document.querySelectorAll(".Edades"); + for (let i = 0; i < edades.length; i++) { + if (edades[i].value > maxEdad) { //Mayor Edades + maxEdad = Number(edades[i].value); + } + } + return maxEdad; +} + +function menorEdad() { + let minEdad = 200; + let edades = document.querySelectorAll(".Edades"); + for (let i = 0; i < edades.length; i++) { + if (edades[i].value < minEdad) { //Menor Edades + minEdad = Number(edades[i].value); + } + } + return minEdad; +} + +function promEdad() { + let sum = 0; + + let edades = document.querySelectorAll(".Edades"); + for (let i = 0; i < edades.length; i++) { + sum += Number(edades[i].value); + } + return ((sum / edades.length)); + +} diff --git a/tareas/clase-6/index.html b/tareas/clase-6/index.html index e69de29b..49985362 100644 --- a/tareas/clase-6/index.html +++ b/tareas/clase-6/index.html @@ -0,0 +1,40 @@ + + + + + + + + + + Tarea 6 + + +
+ + + + + + +
+ +
+ + + + + +
+

La edad mayor es:

+

La edad menor es:

+

El promedio de edad es:

+
+ + + +
+ + + + diff --git a/tareas/clase-6/main.css b/tareas/clase-6/main.css new file mode 100644 index 00000000..a3e0306a --- /dev/null +++ b/tareas/clase-6/main.css @@ -0,0 +1,13 @@ +.oculto { + display: none; +} + +#calculador-edades{ + font-style: italic; + font-weight: bolder; + background-color: cadetblue; +} + +.edad{ + background-color: brown; +} diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index dc058824..c5f49755 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -1,11 +1,54 @@ /* TAREA: Empezar preguntando cuánta gente hay en el grupo familiar. -Crear tantos inputs+labels como gente haya para completar la edad de cada integrante. -Al hacer click en "calcular", mostrar en un elemento pre-existente la mayor edad, la menor edad y el promedio del grupo familiar. +Crear tantos inputs+labels como gente haya para completar la Edades de cada integrante. +Al hacer click en "calcular", mostrar en un elemento pre-existente la mayor Edades, la menor Edades y el promedio del grupo familiar. + Punto bonus: Crear un botón para "empezar de nuevo" que empiece el proceso nuevamente, borrando los inputs ya creados (investigar cómo en MDN). */ +// CREAR USUARIO +document.querySelector('#siguiente-paso').onclick = function (event) { + const cantidadIntegrantes = Number(document.querySelector('#cantidad-integrantes').value); + crearUsuario(cantidadIntegrantes); +} + +//EDADES MÁXIMA, MÍNIMA Y PROMEDIO GENERAL +document.querySelector('#calcular').onclick = function () { + + /*---SEGUIR DESDE ACÁ---*/ + + const $calculos = document.querySelectorAll('#analisis'); + const $mayor_edad = document.querySelector('#mayor-edad'); + $mayor_edad.textContent = (mayorEdad()); + $calculos.appendChild($mayor_edad); + + //textos[0].textContent + (mayorEdad()); + + //console.log(textos[1].textContent + (menorEdad())); + //console.log(textos[2].textContent + (promEdad())); + + //LA PARTE DE ARRIBA FUNCIONA PERO NO MUESTRA EL TEXTO EN EL FORMULARIO + + + //Qué elemento quiero crear? Para qué serviría? + + + + //Es crear un elemento la única forma de mostrar el texto de cada párrafo + el resultado de cada cálculo? + + + + + + event.preventDefault(); + +} + + + + + /* TAREA: From b1e6859ee58b386fdf430588b4e36a958ddf1c54 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Sun, 9 Feb 2020 19:22:22 -0300 Subject: [PATCH 02/17] Primer commit del ejercicio 1 Estoy subiendo el ejercicio 1 de la Clase 1 a Github --- tareas/clase-1/index.html | 3 ++- tareas/clase-1/tarea-clase-1.js | 36 ++++++++++++++++++++++++++++++--- 2 files changed, 35 insertions(+), 4 deletions(-) diff --git a/tareas/clase-1/index.html b/tareas/clase-1/index.html index 29a6327b..a2219d5f 100644 --- a/tareas/clase-1/index.html +++ b/tareas/clase-1/index.html @@ -7,6 +7,7 @@ - + + diff --git a/tareas/clase-1/tarea-clase-1.js b/tareas/clase-1/tarea-clase-1.js index 0ce39143..252c62fb 100644 --- a/tareas/clase-1/tarea-clase-1.js +++ b/tareas/clase-1/tarea-clase-1.js @@ -3,19 +3,47 @@ // Preguntarle estos datos al usuario y guardarlos en 2 variables // Ejecutar la función con estos datos // Impriman el resultado en la consola + function calcularEdad(anioActual, anioNacimiento) { return anioActual - anioNacimiento; } -const anioActual = Number(prompt("Cuál es el año actual?")); -const anioNacimiento = Number(prompt("En qué año naciste?")); +const $body = document.querySelector('body'); + +const $div = document.createElement('div'); +//TAG fecha actual +const $actual = document.createElement('label'); +const fechaActual = document.createTextNode('Ingrese la fecha de hoy: '); +$actual.appendChild(fechaActual); + +const $anioActual = document.createElement('input'); +$anioActual.type = "date"; + +//TAG fecha nacimiento +const $nacimiento = document.createElement('label'); +const fechaNacimiento = document.createTextNode('Ingrese su fecha de nacimiento: '); +$nacimiento.appendChild(fechaNacimiento); + +const $anioNacimiento = document.createElement('input'); +$anioNacimiento.type = "date"; + +//Agrego los hijos al padre ("body") +$div.appendChild($actual); +$div.appendChild($anioActual); +$div.appendChild($nacimiento); +$div.appendChild($anioNacimiento); +$body.appendChild($div); -console.log('Tenés ' + calcularEdad(anioActual, anioNacimiento) + ' años'); + + + +//console.log('Tenés ' + calcularEdad(anioActual, anioNacimiento) + ' años'); // Preguntar el salario anual y calcular el salario mensual // Preguntar el salario mensual y calcular el anual // diario... semanal, por hora. etc. +/* function calcularSalarioAnual(salarioMensual) { const cantidadMesesEnUnAnio = 12; return salarioMensual * cantidadMesesEnUnAnio; @@ -44,6 +72,8 @@ console.log('Tu salario mensual es ' + calcularSalarioMensual(salarioAnual)); console.log('Tu salario semanal es ' + calcularSalarioSemanal(salarioAnual)); console.log('Tu salario diario es ' + calcularSalarioDiario(salarioAnual)); +*/ + /// SCOPE // Variable hoisting -> izar From 50af68dde65ba1b8141f094661610bf99f2d2d54 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Mon, 10 Feb 2020 18:56:03 -0300 Subject: [PATCH 03/17] Ejercicio 1 - Clase 1 , terminado --- tareas/clase-1/index.html | 25 +++++++++++++++++++++++-- tareas/clase-1/tarea-clase-1.js | 30 +++++++----------------------- 2 files changed, 30 insertions(+), 25 deletions(-) diff --git a/tareas/clase-1/index.html b/tareas/clase-1/index.html index a2219d5f..e1b00603 100644 --- a/tareas/clase-1/index.html +++ b/tareas/clase-1/index.html @@ -7,7 +7,28 @@ +
+
+ + +
+ +
+ + +
+ + + +
+ + + + - - + + \ No newline at end of file diff --git a/tareas/clase-1/tarea-clase-1.js b/tareas/clase-1/tarea-clase-1.js index 252c62fb..80876e4c 100644 --- a/tareas/clase-1/tarea-clase-1.js +++ b/tareas/clase-1/tarea-clase-1.js @@ -4,40 +4,24 @@ // Ejecutar la función con estos datos // Impriman el resultado en la consola +document.querySelector('#calcular-edad').onclick = function (){ + const anioActual = Number(document.querySelector('#actual').value); + const anioNacimiento = Number(document.querySelector('#nacimiento').value); + console.log('Tenés ' + calcularEdad(anioActual, anioNacimiento) + ' años'); +}; + + function calcularEdad(anioActual, anioNacimiento) { return anioActual - anioNacimiento; } -const $body = document.querySelector('body'); - -const $div = document.createElement('div'); -//TAG fecha actual -const $actual = document.createElement('label'); -const fechaActual = document.createTextNode('Ingrese la fecha de hoy: '); -$actual.appendChild(fechaActual); - -const $anioActual = document.createElement('input'); -$anioActual.type = "date"; -//TAG fecha nacimiento -const $nacimiento = document.createElement('label'); -const fechaNacimiento = document.createTextNode('Ingrese su fecha de nacimiento: '); -$nacimiento.appendChild(fechaNacimiento); -const $anioNacimiento = document.createElement('input'); -$anioNacimiento.type = "date"; -//Agrego los hijos al padre ("body") -$div.appendChild($actual); -$div.appendChild($anioActual); -$div.appendChild($nacimiento); -$div.appendChild($anioNacimiento); -$body.appendChild($div); -//console.log('Tenés ' + calcularEdad(anioActual, anioNacimiento) + ' años'); // Preguntar el salario anual y calcular el salario mensual // Preguntar el salario mensual y calcular el anual From 90d11f053e68af242c9214c2073b64230cee29d7 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Thu, 27 Feb 2020 19:48:35 -0300 Subject: [PATCH 04/17] Ejercicio 1 - Clase 6 se sube el ejercicio para corregir --- tareas/clase-6/funciones.js | 25 +++++--- tareas/clase-6/ideas.txt | 4 ++ tareas/clase-6/index.html | 6 +- tareas/clase-6/tarea-clase-6.js | 104 +++++++++++++++++++++++++------- 4 files changed, 104 insertions(+), 35 deletions(-) create mode 100644 tareas/clase-6/ideas.txt diff --git a/tareas/clase-6/funciones.js b/tareas/clase-6/funciones.js index 2485de30..c2e77aff 100644 --- a/tareas/clase-6/funciones.js +++ b/tareas/clase-6/funciones.js @@ -1,5 +1,5 @@ function crearUsuario(cantidadIntegrantes) { - + for (let i = 0; i < cantidadIntegrantes; i++) { const $integrantes = document.querySelector('#integrantes'); @@ -10,17 +10,21 @@ function crearUsuario(cantidadIntegrantes) { const $input = document.createElement('input'); //Creo el tag input $input.type = "number"; - $input.className = "Edades" + $input.min = "0"; + $input.max = "100"; + $input.className = "edades"; $integrantes.appendChild($label); - $integrantes.appendChild($input); //Al elemento "$integrantes" le agrego el elemento hijo "$input" + $integrantes.appendChild($input); //Al elemento "$integrantes" le agrego el elemento hijo "$input" + } } -function mayorEdad() { + + +function calcularMayorEdad(edades) { let maxEdad = 0; - let edades = document.querySelectorAll(".Edades"); for (let i = 0; i < edades.length; i++) { if (edades[i].value > maxEdad) { //Mayor Edades maxEdad = Number(edades[i].value); @@ -29,9 +33,9 @@ function mayorEdad() { return maxEdad; } -function menorEdad() { +function calcularMenorEdad(edades) { let minEdad = 200; - let edades = document.querySelectorAll(".Edades"); + for (let i = 0; i < edades.length; i++) { if (edades[i].value < minEdad) { //Menor Edades minEdad = Number(edades[i].value); @@ -40,13 +44,14 @@ function menorEdad() { return minEdad; } -function promEdad() { +function calcularPromEdad(edades) { let sum = 0; - let edades = document.querySelectorAll(".Edades"); for (let i = 0; i < edades.length; i++) { sum += Number(edades[i].value); } - return ((sum / edades.length)); + + return (sum / edades.length); } + diff --git a/tareas/clase-6/ideas.txt b/tareas/clase-6/ideas.txt new file mode 100644 index 00000000..69b8c8f1 --- /dev/null +++ b/tareas/clase-6/ideas.txt @@ -0,0 +1,4 @@ +la puta madre que los re mil parió +por qué MIERDA no me sale el ejercicio? +Hace MIL AÑOS que estoy con esta huevada y sigo igual +ya no se que mas hacer y para colmo los pelotudos estos del foro no me entienden o no quieren/saben ayudarme diff --git a/tareas/clase-6/index.html b/tareas/clase-6/index.html index 49985362..b792bddd 100644 --- a/tareas/clase-6/index.html +++ b/tareas/clase-6/index.html @@ -21,7 +21,7 @@ - + @@ -31,7 +31,9 @@

El promedio de edad es:

- + diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index c5f49755..36015a86 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -1,7 +1,8 @@ /* TAREA: Empezar preguntando cuánta gente hay en el grupo familiar. Crear tantos inputs+labels como gente haya para completar la Edades de cada integrante. -Al hacer click en "calcular", mostrar en un elemento pre-existente la mayor Edades, la menor Edades y el promedio del grupo familiar. +Al hacer click en "calcular", mostrar en un elemento pre-existente la mayor edad, la menor edad y +el promedio del grupo familiar. Punto bonus: Crear un botón para "empezar de nuevo" que empiece el proceso nuevamente, borrando los inputs ya creados (investigar cómo en MDN). @@ -9,47 +10,104 @@ Punto bonus: Crear un botón para "empezar de nuevo" que empiece el proceso nuev // CREAR USUARIO document.querySelector('#siguiente-paso').onclick = function (event) { + const cantidadIntegrantes = Number(document.querySelector('#cantidad-integrantes').value); - crearUsuario(cantidadIntegrantes); + + if (cantidadIntegrantes > 0){ + mostrarBotonCalcular() + crearUsuario(cantidadIntegrantes); + } + } //EDADES MÁXIMA, MÍNIMA Y PROMEDIO GENERAL -document.querySelector('#calcular').onclick = function () { +document.querySelector('#calcular').onclick = function (event) { - /*---SEGUIR DESDE ACÁ---*/ - - const $calculos = document.querySelectorAll('#analisis'); - const $mayor_edad = document.querySelector('#mayor-edad'); - $mayor_edad.textContent = (mayorEdad()); - $calculos.appendChild($mayor_edad); + const calculos = document.querySelectorAll('#analisis > p');//Trae todo el 'div' análisis. + const edades = document.querySelectorAll(".edades");//Trae las edades de los ingresantes - //textos[0].textContent + (mayorEdad()); - - //console.log(textos[1].textContent + (menorEdad())); - //console.log(textos[2].textContent + (promEdad())); - //LA PARTE DE ARRIBA FUNCIONA PERO NO MUESTRA EL TEXTO EN EL FORMULARIO - - - //Qué elemento quiero crear? Para qué serviría? - + document.querySelector('#menor-edad').value = mostrarMenor(calculos,calcularMenorEdad); + + //mostrarMayor(calculos,calcularMayorEdad); + //mostrarMenor(calculos,calcularMenorEdad); + //mostrarPromedio(calculos,calcularPromEdad); - //Es crear un elemento la única forma de mostrar el texto de cada párrafo + el resultado de cada cálculo? - + + function mostrarMayor(calculos, calcularMayorEdad) {//calculos es un NodeList con los párrafos + + for(let i = 0; i < calculos.length; i++){ + console.log(crearTag("p",calculos[i].innerText,"#mayor-edad")); - + } + + + //const textoMayor = document.createTextNode(`${calculos[0].innerText}` + `${calcularMayorEdad(edades)}`) + + } + function mostrarMenor(calculos,calcularMenorEdad){ + console.log(calculos[1].innerText + calcularMenorEdad(edades)); + } + function mostrarPromedio(calculos,calcularPromEdad){ + console.log(calculos[2].innerText+calcularPromEdad(edades)); + } + event.preventDefault(); } +document.querySelector('#resetear').onclick = resetear; + +function resetear(){ + limpiarLabels(); + limpiarInputs(); + ocultarBotonCalcular(); +} + +function limpiarLabels(){ + const labels = document.querySelectorAll('#integrantes > label'); + for(let i = 0; i < labels.length; i++){ + labels[i].remove(); + } - - +} + +function limpiarInputs(){ + const inputs = document.querySelectorAll('#integrantes > input'); + for(let i = 0; i < inputs.length; i++){ + inputs[i].remove(); + } +} + +function mostrarBotonCalcular(){ + document.querySelector('#calcular').className = ""; +} + +function ocultarBotonCalcular(){ + document.querySelector('#calcular').className = "oculto"; +} +/* +function mostrarBotonLimpiar(){ + document.querySelector('#resetear').className = ""; +} +*/ + +function crearTag(tag,texto,nodoPadre){ + + const $nodoPadre = document.querySelector(nodoPadre) + const $elemento = document.createElement(tag); + const nodoTexto = document.createTextNode(texto); + + $elemento.appendChild(nodoTexto); + $nodoPadre.appendChild($elemento); + + return $nodoPadre; +} /* TAREA: Crear una interfaz que permita agregar ó quitar (botones agregar y quitar) inputs+labels para completar el salario anual de cada integrante de la familia que trabaje. From ed67ad619c1eb4a17413318cbd5a736917d42d07 Mon Sep 17 00:00:00 2001 From: Marcos Jinno <54718325+MarcosJinno@users.noreply.github.com> Date: Thu, 27 Feb 2020 20:09:57 -0300 Subject: [PATCH 05/17] Delete ideas.txt --- tareas/clase-6/ideas.txt | 4 ---- 1 file changed, 4 deletions(-) delete mode 100644 tareas/clase-6/ideas.txt diff --git a/tareas/clase-6/ideas.txt b/tareas/clase-6/ideas.txt deleted file mode 100644 index 69b8c8f1..00000000 --- a/tareas/clase-6/ideas.txt +++ /dev/null @@ -1,4 +0,0 @@ -la puta madre que los re mil parió -por qué MIERDA no me sale el ejercicio? -Hace MIL AÑOS que estoy con esta huevada y sigo igual -ya no se que mas hacer y para colmo los pelotudos estos del foro no me entienden o no quieren/saben ayudarme From 8511169c8d4db2f61638cd41274ba93e7baffd33 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Tue, 3 Mar 2020 18:19:42 -0300 Subject: [PATCH 06/17] Ejercicio 1 - clase 6 - terminado MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Ejercicio terminado. Falta corregir si está bien. --- tareas/clase-6/tarea-clase-6.js | 48 +++++++++++++++------------------ 1 file changed, 22 insertions(+), 26 deletions(-) diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 36015a86..7279ed8a 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -10,7 +10,7 @@ Punto bonus: Crear un botón para "empezar de nuevo" que empiece el proceso nuev // CREAR USUARIO document.querySelector('#siguiente-paso').onclick = function (event) { - + const cantidadIntegrantes = Number(document.querySelector('#cantidad-integrantes').value); if (cantidadIntegrantes > 0){ @@ -20,51 +20,45 @@ document.querySelector('#siguiente-paso').onclick = function (event) { } + //EDADES MÁXIMA, MÍNIMA Y PROMEDIO GENERAL -document.querySelector('#calcular').onclick = function (event) { +document.querySelector('#calcular').onclick = function () { const calculos = document.querySelectorAll('#analisis > p');//Trae todo el 'div' análisis. const edades = document.querySelectorAll(".edades");//Trae las edades de los ingresantes - - - document.querySelector('#menor-edad').value = mostrarMenor(calculos,calcularMenorEdad); - - //mostrarMayor(calculos,calcularMayorEdad); - //mostrarMenor(calculos,calcularMenorEdad); - //mostrarPromedio(calculos,calcularPromEdad); + mostrarMayor(calculos,calcularMayorEdad); + mostrarMenor(calculos,calcularMenorEdad); + mostrarPromedio(calculos,calcularPromEdad); + mostrarResultados() + - function mostrarMayor(calculos, calcularMayorEdad) {//calculos es un NodeList con los párrafos - - for(let i = 0; i < calculos.length; i++){ - console.log(crearTag("p",calculos[i].innerText,"#mayor-edad")); - - } - - - //const textoMayor = document.createTextNode(`${calculos[0].innerText}` + `${calcularMayorEdad(edades)}`) - + //calculos es un NodeList con los párrafos + function mostrarMayor(calculos,calcularMayorEdad) { + calculos[0].innerText += calcularMayorEdad(edades); } function mostrarMenor(calculos,calcularMenorEdad){ - console.log(calculos[1].innerText + calcularMenorEdad(edades)); + calculos[1].innerText += calcularMenorEdad(edades); } function mostrarPromedio(calculos,calcularPromEdad){ - console.log(calculos[2].innerText+calcularPromEdad(edades)); + calculos[2].innerText += calcularPromEdad(edades); } - + event.preventDefault(); } + document.querySelector('#resetear').onclick = resetear; function resetear(){ limpiarLabels(); limpiarInputs(); ocultarBotonCalcular(); + limpiarResultados(); } function limpiarLabels(){ @@ -90,11 +84,13 @@ function ocultarBotonCalcular(){ document.querySelector('#calcular').className = "oculto"; } -/* -function mostrarBotonLimpiar(){ - document.querySelector('#resetear').className = ""; +function mostrarResultados() { + document.querySelector('#analisis').className = ''; +} + +function limpiarResultados(){ + document.querySelector('#analisis').className = 'oculto'; } -*/ function crearTag(tag,texto,nodoPadre){ From 47ebc3783ddb09758a2d1f6c22434ed34714cc1b Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Sun, 8 Mar 2020 17:09:39 -0300 Subject: [PATCH 07/17] Tarea 1 - Clase 6 a revisar MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Se sube el ejercicio 1 incompleto para revisar por qué no funciona la función "resetearResultados" que tendría que restablecer los valores de los inputs a su estado inicial. --- tareas/clase-6/funciones.js | 1 + tareas/clase-6/tarea-clase-6.js | 41 +++++++++++++++++++++++++-------- 2 files changed, 32 insertions(+), 10 deletions(-) diff --git a/tareas/clase-6/funciones.js b/tareas/clase-6/funciones.js index c2e77aff..b4a791f6 100644 --- a/tareas/clase-6/funciones.js +++ b/tareas/clase-6/funciones.js @@ -3,6 +3,7 @@ function crearUsuario(cantidadIntegrantes) { for (let i = 0; i < cantidadIntegrantes; i++) { const $integrantes = document.querySelector('#integrantes'); + $integrantes.className = ".integrante"; const $label = document.createElement('label'); const textoLabel = (document.createTextNode('Edad del integrante # ' + (i + 1))); diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 7279ed8a..eb2cf7bf 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -14,7 +14,8 @@ document.querySelector('#siguiente-paso').onclick = function (event) { const cantidadIntegrantes = Number(document.querySelector('#cantidad-integrantes').value); if (cantidadIntegrantes > 0){ - mostrarBotonCalcular() + resetearResultados(); + mostrarBotonCalcular(); crearUsuario(cantidadIntegrantes); } @@ -30,21 +31,21 @@ document.querySelector('#calcular').onclick = function () { mostrarMayor(calculos,calcularMayorEdad); mostrarMenor(calculos,calcularMenorEdad); mostrarPromedio(calculos,calcularPromEdad); - mostrarResultados() - + mostrarResultados(); + //calculos es un NodeList con los párrafos function mostrarMayor(calculos,calcularMayorEdad) { - calculos[0].innerText += calcularMayorEdad(edades); + calculos[0].textContent += calcularMayorEdad(edades); } function mostrarMenor(calculos,calcularMenorEdad){ - calculos[1].innerText += calcularMenorEdad(edades); + calculos[1].textContent += calcularMenorEdad(edades); } function mostrarPromedio(calculos,calcularPromEdad){ - calculos[2].innerText += calcularPromEdad(edades); + calculos[2].textContent += calcularPromEdad(edades); } event.preventDefault(); @@ -52,8 +53,11 @@ document.querySelector('#calcular').onclick = function () { } + document.querySelector('#resetear').onclick = resetear; + + function resetear(){ limpiarLabels(); limpiarInputs(); @@ -90,8 +94,17 @@ function mostrarResultados() { function limpiarResultados(){ document.querySelector('#analisis').className = 'oculto'; + } +function resetearResultados(){ + const integrantes = document.querySelectorAll('.integrante'); + for(let i = 0; i < integrantes.length; i++){ + integrantes.remove(); + } +} + + function crearTag(tag,texto,nodoPadre){ const $nodoPadre = document.querySelector(nodoPadre) @@ -106,8 +119,16 @@ function crearTag(tag,texto,nodoPadre){ } /* TAREA: -Crear una interfaz que permita agregar ó quitar (botones agregar y quitar) inputs+labels para completar el salario anual de cada integrante de la familia que trabaje. -Al hacer click en "calcular", mostrar en un elemento pre-existente el mayor salario anual, menor salario anual, salario anual promedio y salario mensual promedio. - -Punto bonus: si hay inputs vacíos, ignorarlos en el cálculo (no contarlos como 0). +Crear una interfaz que permita: +- agregar ó quitar (botones agregar y quitar) inputs + labels + para completar el salario anual de cada integrante de la familia que trabaje. + +- Al hacer click en "calcular", mostrar en un elemento pre-existente + * el mayor salario anual, + * menor salario anual, + * salario anual promedio y + * salario mensual promedio. + +Punto bonus: +- si hay inputs vacíos, ignorarlos en el cálculo (no contarlos como 0). */ From 4765dcf9ceb0ac0fbb6686ad23309f7af45bd90d Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Sun, 8 Mar 2020 18:40:56 -0300 Subject: [PATCH 08/17] Update tarea-1-clase-6 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit A revisar la función resetearResultados cuyo fin es restablecer los inputs a su estado original. --- tareas/clase-6/tarea-clase-6.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index eb2cf7bf..694f3ea1 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -105,6 +105,7 @@ function resetearResultados(){ } + function crearTag(tag,texto,nodoPadre){ const $nodoPadre = document.querySelector(nodoPadre) @@ -114,7 +115,6 @@ function crearTag(tag,texto,nodoPadre){ $elemento.appendChild(nodoTexto); $nodoPadre.appendChild($elemento); - return $nodoPadre; } /* From 28944079f1abd8842fbbf692da8fe456517f5c59 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Fri, 13 Mar 2020 16:26:25 -0300 Subject: [PATCH 09/17] Cambios sugeridos MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Se agregó el índice i en la función resetearResultados en el método .remove. * Se colocó la función resetearResultados dentro de la función resetear habiendola probado antes al hacer click en el botón Siguiente sin el resultado esperado. --- tareas/clase-6/tarea-clase-6.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 694f3ea1..648f4be7 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -14,7 +14,7 @@ document.querySelector('#siguiente-paso').onclick = function (event) { const cantidadIntegrantes = Number(document.querySelector('#cantidad-integrantes').value); if (cantidadIntegrantes > 0){ - resetearResultados(); + //resetearResultados(); mostrarBotonCalcular(); crearUsuario(cantidadIntegrantes); } @@ -63,6 +63,8 @@ function resetear(){ limpiarInputs(); ocultarBotonCalcular(); limpiarResultados(); + resetearResultados(); + } function limpiarLabels(){ @@ -100,7 +102,7 @@ function limpiarResultados(){ function resetearResultados(){ const integrantes = document.querySelectorAll('.integrante'); for(let i = 0; i < integrantes.length; i++){ - integrantes.remove(); + integrantes[i].remove(); } } From 1e925fb8071397da4e7d4538824a98b9075906c1 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Tue, 17 Mar 2020 18:17:13 -0300 Subject: [PATCH 10/17] tarea 1-clase 6-v3 --- tareas/clase-6/funciones.js | 2 +- tareas/clase-6/tarea-clase-6.js | 20 +++++++++++++------- 2 files changed, 14 insertions(+), 8 deletions(-) diff --git a/tareas/clase-6/funciones.js b/tareas/clase-6/funciones.js index b4a791f6..44937f01 100644 --- a/tareas/clase-6/funciones.js +++ b/tareas/clase-6/funciones.js @@ -3,7 +3,7 @@ function crearUsuario(cantidadIntegrantes) { for (let i = 0; i < cantidadIntegrantes; i++) { const $integrantes = document.querySelector('#integrantes'); - $integrantes.className = ".integrante"; + $integrantes.className = "integrante"; const $label = document.createElement('label'); const textoLabel = (document.createTextNode('Edad del integrante # ' + (i + 1))); diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 648f4be7..734a0671 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -59,14 +59,25 @@ document.querySelector('#resetear').onclick = resetear; function resetear(){ + resetearResultados(); limpiarLabels(); limpiarInputs(); ocultarBotonCalcular(); limpiarResultados(); - resetearResultados(); + } +function resetearResultados(){ + const integrantes = document.querySelectorAll('.integrante'); + //console.log(integrantes); + + for(let i = 0; i < integrantes.length; i++){ + integrantes[i].remove(); + } + +} + function limpiarLabels(){ const labels = document.querySelectorAll('#integrantes > label'); for(let i = 0; i < labels.length; i++){ @@ -99,12 +110,7 @@ function limpiarResultados(){ } -function resetearResultados(){ - const integrantes = document.querySelectorAll('.integrante'); - for(let i = 0; i < integrantes.length; i++){ - integrantes[i].remove(); - } -} + From 57e127461efd3122d51b40a8b15b467055f3597c Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Tue, 17 Mar 2020 18:27:30 -0300 Subject: [PATCH 11/17] v4 --- tareas/clase-6/tarea-clase-6.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 734a0671..30bd92fd 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -74,8 +74,7 @@ function resetearResultados(){ for(let i = 0; i < integrantes.length; i++){ integrantes[i].remove(); - } - + } } function limpiarLabels(){ From d4d2fc8868ef5e8f0af398fcd7af77e555a4f51b Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Tue, 17 Mar 2020 18:35:14 -0300 Subject: [PATCH 12/17] v5 --- tareas/clase-6/funciones.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tareas/clase-6/funciones.js b/tareas/clase-6/funciones.js index 44937f01..b4a791f6 100644 --- a/tareas/clase-6/funciones.js +++ b/tareas/clase-6/funciones.js @@ -3,7 +3,7 @@ function crearUsuario(cantidadIntegrantes) { for (let i = 0; i < cantidadIntegrantes; i++) { const $integrantes = document.querySelector('#integrantes'); - $integrantes.className = "integrante"; + $integrantes.className = ".integrante"; const $label = document.createElement('label'); const textoLabel = (document.createTextNode('Edad del integrante # ' + (i + 1))); From 8ceb654490a41d84e85eb70347227a9282492ec1 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Thu, 19 Mar 2020 18:06:02 -0300 Subject: [PATCH 13/17] v6 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Se corrigieron las funciones mostrarMayor, mostrarMenor y mostrarPromedio para que al clickear sobre el botón "Limpiar", borre los valores ingresados antes --- tareas/clase-6/tarea-clase-6.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/tareas/clase-6/tarea-clase-6.js b/tareas/clase-6/tarea-clase-6.js index 30bd92fd..4e482e2d 100644 --- a/tareas/clase-6/tarea-clase-6.js +++ b/tareas/clase-6/tarea-clase-6.js @@ -31,21 +31,24 @@ document.querySelector('#calcular').onclick = function () { mostrarMayor(calculos,calcularMayorEdad); mostrarMenor(calculos,calcularMenorEdad); mostrarPromedio(calculos,calcularPromEdad); + mostrarMayor("mayor",calcularMayorEdad(edades)); + mostrarMenor("menor",calcularMenorEdad(edades)); + mostrarPromedio("promedio",calcularPromEdad(edades)); mostrarResultados(); //calculos es un NodeList con los párrafos - function mostrarMayor(calculos,calcularMayorEdad) { - calculos[0].textContent += calcularMayorEdad(edades); + function mostrarMayor(texto,valor) { + document.querySelector(`#${texto}-edad`).textContent = valor; } - function mostrarMenor(calculos,calcularMenorEdad){ - calculos[1].textContent += calcularMenorEdad(edades); + function mostrarMenor(texto,valor){ + document.querySelector(`#${texto}-edad`).textContent = valor; } - function mostrarPromedio(calculos,calcularPromEdad){ - calculos[2].textContent += calcularPromEdad(edades); + function mostrarPromedio(texto,valor){ + document.querySelector(`#${texto}-edad`).textContent = valor; } event.preventDefault(); From ed700196383d97ed42711419d8f19c72b11bd87d Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Wed, 25 Mar 2020 19:13:29 -0300 Subject: [PATCH 14/17] tarea-2-clase-6 v1 Creados los botones para: -Agregar y quitar miembros -Calcular -Limpiar formulario --- tareas/clase-6/tarea 2/index-tarea2.html | 72 ++++++++++++++++++ tareas/clase-6/tarea 2/main-tarea2.css | 3 + tareas/clase-6/tarea 2/tarea-2-clase-6.js | 91 +++++++++++++++++++++++ 3 files changed, 166 insertions(+) create mode 100644 tareas/clase-6/tarea 2/index-tarea2.html create mode 100644 tareas/clase-6/tarea 2/main-tarea2.css create mode 100644 tareas/clase-6/tarea 2/tarea-2-clase-6.js diff --git a/tareas/clase-6/tarea 2/index-tarea2.html b/tareas/clase-6/tarea 2/index-tarea2.html new file mode 100644 index 00000000..5b5ec8ca --- /dev/null +++ b/tareas/clase-6/tarea 2/index-tarea2.html @@ -0,0 +1,72 @@ + + + + + + + + Tarea 2 - Clase 6 + + + + + +
Salario Familiar
+ +
+ + +
+ + + + + +
+ +
+ +

El mayor salario anual es: + + +

+

El menor salario anual es: + + +

+

El salario anual promedio es: + + +

+

El salario mensual promedio es: + + +

+ + +
+ +
+
+ +
+
+ +
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/tareas/clase-6/tarea 2/main-tarea2.css b/tareas/clase-6/tarea 2/main-tarea2.css new file mode 100644 index 00000000..66cf32d5 --- /dev/null +++ b/tareas/clase-6/tarea 2/main-tarea2.css @@ -0,0 +1,3 @@ +.oculto { + display: none; +} \ No newline at end of file diff --git a/tareas/clase-6/tarea 2/tarea-2-clase-6.js b/tareas/clase-6/tarea 2/tarea-2-clase-6.js new file mode 100644 index 00000000..d82ae2bd --- /dev/null +++ b/tareas/clase-6/tarea 2/tarea-2-clase-6.js @@ -0,0 +1,91 @@ +/* +TAREA: +Crear una interfaz que permita: +- agregar ó quitar (botones agregar y quitar) inputs + labels + para completar el salario anual de cada integrante de la familia que trabaje. + +- Al hacer click en "calcular", mostrar en un elemento pre-existente + * el mayor salario anual, + * menor salario anual, + * salario anual promedio y + * salario mensual promedio. + +Punto bonus: +- si hay inputs vacíos, ignorarlos en el cálculo (no contarlos como 0). +*/ + +let cantidadMiembros = 0; +document.querySelector('#agregar').onclick = function(){ + agregarMiembro(); + cantidadMiembros += 1; +} + +document.querySelector('#calcular').onclick = function(){ + mostrarResultados(); + + event.preventDefault(); +} + + +document.querySelector('#quitar').onclick = function(){ + quitarMiembro(); +} + +document.querySelector('#reset').onclick = function(){ + resetear(cantidadMiembros); +} + +function agregarMiembro(){ + crearEtiqueta('label','Ingrese su salario anual: ',""); + crearEtiqueta('input',"",'number') +} + +function crearEtiqueta(tag,texto,tipo){ + const $div = document.createElement('div'); + const $nuevoMiembro = document.querySelector('#agrega-miembros'); + + //Crea etiqueta y texto o tipo de la misma + const $etiqueta = document.createElement(tag); + + if (tipo === "number") { + $etiqueta.type = "number"; + $etiqueta.className = ".miembros"; + } else { + const $texto = document.createTextNode(texto); + $etiqueta.appendChild($texto); + } + + + + //Agrega la etiqueta nueva al nodoPadre + $div.appendChild($etiqueta); + $nuevoMiembro.appendChild($div); + +} + +function quitarMiembro(){ + borrarEtiqueta('label'); + borrarEtiqueta('input'); +} + +function borrarEtiqueta(tag){ + const etiqueta = document.querySelector(tag); + + etiqueta.remove(); + +} + +function mostrarResultados(){ + document.querySelector('#calculos').className = ""; +} + +function ocultarResultados(){ + document.querySelector('#calculos').className = "oculto"; +} + +function resetear(valor){ + for(let i = 0; i < valor; i++){ + quitarMiembro(); + } + ocultarResultados(); +} \ No newline at end of file From a7f78722766520c7104c4232f293e4293092c805 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Wed, 1 Apr 2020 17:36:48 -0300 Subject: [PATCH 15/17] tarea-2-clase-6 v2 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Se agregaron funciones para calcular: * mayor y menor salario anual, * salario anual y mensual promedio Se cambió el elemento $nuevoMiembro por el elemento $contenedorMiembros. Se agregaron las funciones para mostrar los salarios. --- tareas/clase-6/tarea 2/calculos-tarea-2.js | 56 ++++++++++++++++++++++ tareas/clase-6/tarea 2/index-tarea2.html | 1 + tareas/clase-6/tarea 2/tarea-2-clase-6.js | 29 +++++++++-- 3 files changed, 83 insertions(+), 3 deletions(-) create mode 100644 tareas/clase-6/tarea 2/calculos-tarea-2.js diff --git a/tareas/clase-6/tarea 2/calculos-tarea-2.js b/tareas/clase-6/tarea 2/calculos-tarea-2.js new file mode 100644 index 00000000..54ba7d2e --- /dev/null +++ b/tareas/clase-6/tarea 2/calculos-tarea-2.js @@ -0,0 +1,56 @@ +function mayorSalarioAnual(){ + const sueldos = document.querySelectorAll('.miembros'); + let maxSalario = 0; + + for(let i = 0; i < sueldos.length; i++){ + if (Number(sueldos[i].value) != 0 && Number(sueldos[i].value) > maxSalario ){ + maxSalario = Number(sueldos[i].value); + } + } + + return maxSalario; + } + +function menorSalarioAnual(){ + const sueldos = document.querySelectorAll('.miembros'); + let minSalario = 1000000; + + for(let i = 0; i < sueldos.length; i++){ + if (Number(sueldos[i].value) != 0 && Number(sueldos[i].value) < minSalario ){ + minSalario = Number(sueldos[i].value); + } + } + + return minSalario; + } + +function salarioAnualPromedio(cantidadMiembros){ + const sueldos = document.querySelectorAll('.miembros'); + let salarioPromedio = 0; + let sumatoriaSalarios = 0; + + for (let i = 0; i < sueldos.length; i++) { + sumatoriaSalarios += Number(sueldos[i].value); + + } + + salarioPromedio = (sumatoriaSalarios / cantidadMiembros); + + return salarioPromedio; +} + +function salarioMensualPromedio(){ + + //const sueldos = document.querySelector('.miembros'); + const mesesDelAnio = 12; + let salarioPromedioMensual = 0; + //let sumatoriaSalarios = 0; + + /*for (let i = 0; i < sueldos.length; i++) { + = sueldos[i]; + + }*/ + salarioPromedioMensual = (salarioAnualPromedio(cantidadMiembros) / mesesDelAnio); + + return salarioPromedioMensual; +} \ No newline at end of file diff --git a/tareas/clase-6/tarea 2/index-tarea2.html b/tareas/clase-6/tarea 2/index-tarea2.html index 5b5ec8ca..8f4ba24a 100644 --- a/tareas/clase-6/tarea 2/index-tarea2.html +++ b/tareas/clase-6/tarea 2/index-tarea2.html @@ -66,6 +66,7 @@
+ diff --git a/tareas/clase-6/tarea 2/tarea-2-clase-6.js b/tareas/clase-6/tarea 2/tarea-2-clase-6.js index d82ae2bd..07c9a29f 100644 --- a/tareas/clase-6/tarea 2/tarea-2-clase-6.js +++ b/tareas/clase-6/tarea 2/tarea-2-clase-6.js @@ -21,7 +21,12 @@ document.querySelector('#agregar').onclick = function(){ } document.querySelector('#calcular').onclick = function(){ + mostrarResultados(); + mostrarMayorSalario(); + mostrarMenorSalario(); + mostrarSalarioAnualPromedio(); + mostrarSalarioMensualPromedio(); event.preventDefault(); } @@ -42,14 +47,15 @@ function agregarMiembro(){ function crearEtiqueta(tag,texto,tipo){ const $div = document.createElement('div'); - const $nuevoMiembro = document.querySelector('#agrega-miembros'); + const $contenedorMiembros = document.querySelector('#agrega-miembros'); //Crea etiqueta y texto o tipo de la misma const $etiqueta = document.createElement(tag); if (tipo === "number") { $etiqueta.type = "number"; - $etiqueta.className = ".miembros"; + $etiqueta.className = "miembros"; + $etiqueta.placeholder = "Ejemplo $250000"; } else { const $texto = document.createTextNode(texto); $etiqueta.appendChild($texto); @@ -59,7 +65,7 @@ function crearEtiqueta(tag,texto,tipo){ //Agrega la etiqueta nueva al nodoPadre $div.appendChild($etiqueta); - $nuevoMiembro.appendChild($div); + $contenedorMiembros.appendChild($div); } @@ -88,4 +94,21 @@ function resetear(valor){ quitarMiembro(); } ocultarResultados(); +} + + +function mostrarMayorSalario(){ + document.querySelector('#mayor-salario').textContent = mayorSalarioAnual(); +} + +function mostrarMenorSalario(){ + document.querySelector('#menor-salario').textContent = menorSalarioAnual(); +} + +function mostrarSalarioAnualPromedio(){ + document.querySelector('#salario-anual-promedio').textContent = salarioAnualPromedio(cantidadMiembros); +} + +function mostrarSalarioMensualPromedio(){ + document.querySelector('#salario-mensual-promedio').textContent = salarioMensualPromedio(); } \ No newline at end of file From 7ccdc6dededca3632cac94614ea379a24040c0c2 Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Fri, 3 Apr 2020 21:35:50 -0300 Subject: [PATCH 16/17] tarea-2-clase-6 v3 --- .gitignore | 2 ++ tareas/clase-6/tarea 2/calculos-tarea-2.js | 11 ++---- tareas/clase-6/tarea 2/index-tarea2.html | 8 ++--- tareas/clase-6/tarea 2/tarea-2-clase-6.js | 39 ++++++++++++++++------ 4 files changed, 36 insertions(+), 24 deletions(-) diff --git a/.gitignore b/.gitignore index e69de29b..688d285c 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1,2 @@ + +tareas/clase-6/tarea 2/pseudocódigo.txt diff --git a/tareas/clase-6/tarea 2/calculos-tarea-2.js b/tareas/clase-6/tarea 2/calculos-tarea-2.js index 54ba7d2e..ecb8e705 100644 --- a/tareas/clase-6/tarea 2/calculos-tarea-2.js +++ b/tareas/clase-6/tarea 2/calculos-tarea-2.js @@ -40,17 +40,10 @@ function salarioAnualPromedio(cantidadMiembros){ } function salarioMensualPromedio(){ - - //const sueldos = document.querySelector('.miembros'); const mesesDelAnio = 12; let salarioPromedioMensual = 0; - //let sumatoriaSalarios = 0; - - /*for (let i = 0; i < sueldos.length; i++) { - = sueldos[i]; - - }*/ + salarioPromedioMensual = (salarioAnualPromedio(cantidadMiembros) / mesesDelAnio); return salarioPromedioMensual; -} \ No newline at end of file +} diff --git a/tareas/clase-6/tarea 2/index-tarea2.html b/tareas/clase-6/tarea 2/index-tarea2.html index 8f4ba24a..9632d74e 100644 --- a/tareas/clase-6/tarea 2/index-tarea2.html +++ b/tareas/clase-6/tarea 2/index-tarea2.html @@ -22,7 +22,7 @@ Agregar miembro - @@ -39,7 +39,7 @@

El salario anual promedio es: - +

El salario mensual promedio es: @@ -60,7 +60,7 @@


-
@@ -70,4 +70,4 @@ - \ No newline at end of file + diff --git a/tareas/clase-6/tarea 2/tarea-2-clase-6.js b/tareas/clase-6/tarea 2/tarea-2-clase-6.js index 07c9a29f..70b4f8d6 100644 --- a/tareas/clase-6/tarea 2/tarea-2-clase-6.js +++ b/tareas/clase-6/tarea 2/tarea-2-clase-6.js @@ -19,15 +19,18 @@ document.querySelector('#agregar').onclick = function(){ agregarMiembro(); cantidadMiembros += 1; } - + document.querySelector('#calcular').onclick = function(){ - mostrarResultados(); - mostrarMayorSalario(); - mostrarMenorSalario(); - mostrarSalarioAnualPromedio(); - mostrarSalarioMensualPromedio(); + mostrarSalario("mayor",mayorSalarioAnual()); + mostrarSalario("menor",menorSalarioAnual()); + mostrarSalario("anual-promedio",salarioAnualPromedio()); + /*mostrarMenorSalario(); + mostrarSalarioAnualPromedio(); + mostrarSalarioMensualPromedio();*/ + mostrarResultados(); + event.preventDefault(); } @@ -43,6 +46,7 @@ document.querySelector('#reset').onclick = function(){ function agregarMiembro(){ crearEtiqueta('label','Ingrese su salario anual: ',""); crearEtiqueta('input',"",'number') + mostrarBotonCalculo(); } function crearEtiqueta(tag,texto,tipo){ @@ -94,21 +98,34 @@ function resetear(valor){ quitarMiembro(); } ocultarResultados(); + ocultarBotonCalculo(); } -function mostrarMayorSalario(){ - document.querySelector('#mayor-salario').textContent = mayorSalarioAnual(); +function mostrarSalario(tipo,valor){ + document.querySelector(`#${tipo}-salario`).textContent = valor; } -function mostrarMenorSalario(){ - document.querySelector('#menor-salario').textContent = menorSalarioAnual(); +function mostrarSalarioPromedio(tipo1,tipo2,valor){ + document.querySelector(`#${tipo1-tipo2}-salario`).textContent = valor; } +function mostrarBotonCalculo() { + document.querySelector('#calcular').className = ''; +} + +function ocultarBotonCalculo() { + document.querySelector('#calcular').className = 'oculto'; +} + +/* + + function mostrarSalarioAnualPromedio(){ document.querySelector('#salario-anual-promedio').textContent = salarioAnualPromedio(cantidadMiembros); } function mostrarSalarioMensualPromedio(){ document.querySelector('#salario-mensual-promedio').textContent = salarioMensualPromedio(); -} \ No newline at end of file +} +*/ \ No newline at end of file From 113738c2d778664b800cd59de61c4cf69e3c689f Mon Sep 17 00:00:00 2001 From: MarcosJinno Date: Sat, 4 Apr 2020 18:05:17 -0300 Subject: [PATCH 17/17] tarea-2-clase-6 v4 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Se optimizó el código para que muestre el botón Calcular sólo después de haber ingresado un miembro. - Se muestran los resultados del análisis solamente con una sola función pasandole los parámetros que sean necesarios según el caso. --- tareas/clase-6/tarea 2/index-tarea2.html | 2 +- tareas/clase-6/tarea 2/tarea-2-clase-6.js | 10 ++++------ 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/tareas/clase-6/tarea 2/index-tarea2.html b/tareas/clase-6/tarea 2/index-tarea2.html index 9632d74e..b414f6d0 100644 --- a/tareas/clase-6/tarea 2/index-tarea2.html +++ b/tareas/clase-6/tarea 2/index-tarea2.html @@ -43,7 +43,7 @@

El salario mensual promedio es: - +

diff --git a/tareas/clase-6/tarea 2/tarea-2-clase-6.js b/tareas/clase-6/tarea 2/tarea-2-clase-6.js index 70b4f8d6..ec33450a 100644 --- a/tareas/clase-6/tarea 2/tarea-2-clase-6.js +++ b/tareas/clase-6/tarea 2/tarea-2-clase-6.js @@ -21,17 +21,15 @@ document.querySelector('#agregar').onclick = function(){ } document.querySelector('#calcular').onclick = function(){ + event.preventDefault(); mostrarSalario("mayor",mayorSalarioAnual()); mostrarSalario("menor",menorSalarioAnual()); - mostrarSalario("anual-promedio",salarioAnualPromedio()); - - /*mostrarMenorSalario(); - mostrarSalarioAnualPromedio(); - mostrarSalarioMensualPromedio();*/ + mostrarSalario("anual-promedio",salarioAnualPromedio(cantidadMiembros)); + mostrarSalario("mensual-promedio",salarioMensualPromedio()); mostrarResultados(); - event.preventDefault(); + }